Highly Bitcoin/Ethereum paying Android app 2017-05-07(yyyy/MM/dd)

BitMaker - Playstore link

Original Description ( on playstore)

Earn free Bitcoin or Ethereum simply by trying new games, apps, products, services, or watching a short video!

Bitcoin has increased over 700% in the last four years!!! 

Have you read about Bitcoin or Ethereum and wanted a piece but didn’t know how to get it? Until now risking your money to buy bitcoin or understanding complex technology to mine bitcoin were the only solutions to attaining free bitcoins. 

With BitMaker (Bitcoin Maker) earn free Bitcoin or Ethereum, not by mining, but by engaging with cool new apps, games, and products. 

Therefore, you can earn Bitcoin effortlessly without all the hassle! For Free!

You can earn free bitcoins on BitMaker every 30 minutes, simply open the app, engage, then collect your free Bitcoin!

And while waiting for your Bitcoins, you can do whatever you want, e.g. play games, study, work, watch sports, anything!!

AND, you'll get your hard-work paid back every Saturday night!

Minimum withdrawal limit is super low so you can receive your free bitcoin to your wallet and keep it to invest, save, or use however you want.

Follow us on Facebook for future updates and information: https://www.facebook.com/BitMakerApp

Note: This app uses the unit Satoshi, the smallest unit of Bitcoin, instead of Bitcoins.

If you have any questions or concerns, please check the FAQ. If your questions isn't there, please contact us at support@cakecodes.com

Download link

Proof that the app is paying ( These Images are from my phone )

Images from the Coinbase ETH Wallet

Angular2-cli and Bootstrap-3/4 setup

I am going to use the bootstrap's Collapse component for this tutorial. Finally it will something like this

Creating a angular-cli project

original source

prerequisites

Both the CLI and generated project have dependencies that require Node 6.9.0 or higher, together with NPM 3 or higher. You can use visual studio code as the editor

Installation angular cli

Run this code in the cmd/terminal

1	npm install -g @angular/cli

Creating a new angular project

Run this code in the cmd/terminal

1 2 3

ng new PROJECT-NAME cd PROJECT-NAME ng serve

Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Setup Native Angular directives for Bootstrap

original source

Run this code in the cmd/terminal

1	npm install ngx-bootstrap --save

Add below code to your index.html file which is locate in you project's src directory.

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

Implementation

Creating body component

ng g component body

Creating a component for the bootstrap collapse component

ng g component zippy

you can find API reference for the other bootstrap components in here

Add this code to the app.module.ts file.

import { CollapseModule } from 'ngx-bootstrap';

@NgModule({
  imports: [CollapseModule.forRoot(),...]
})

You can find the repository for this project in here

Add below code to the app.component.html

<app-body style="padding: 10px;">
</app-body>

We going to take the title of Collapse as a Input field so You have to import the Input  from @angular/core. Import Input  to the zippy component. Add or modify below line to the zippy.component.ts

import { Component, OnInit,Input } from '@angular/core';

Add isCollapsed boolean to track whether it's collapsed or not and add title string filed to store the title.
zippy.component.ts

public isCollapsed:boolean = true;
@Input() title:string = "";

Finally zippy.component.ts will be like this

import { Component, OnInit,Input } from '@angular/core';
@Component({
  selector: 'app-zippy',
  templateUrl: './zippy.component.html',
  styleUrls: ['./zippy.component.css'],
  
})
export class ZippyComponent implements OnInit {
 public isCollapsed:boolean = true;
  @Input() title:string = "";
  ngOnInit() {     
  }
}

lets add the collapse component to the zippy.component.html, please note that [collapse] in the line 6 this is coming from the ngx-bootstrap that we installed earlier.

1 2 3 4 5 6 7 8 9

<div class="panel panel-default" > <div class="panel-heading" (click)="isCollapsed = !isCollapsed"><b>{{title}}</b> <span style="float: right" class="glyphicon" [class.glyphicon-menu-down]="isCollapsed" [class.glyphicon-menu-up]="!isCollapsed" aria-hidden="true"></span> </div> <div [collapse]="isCollapsed" class="panel-body"> <ng-content></ng-content> </div> </div>

I am going to add some styling to to this code and finally zippy.component.html will be like this

<div class="row">
  <div class="col-sm-1"></div>
  <div class="col-sm-10">
    <div class="panel panel-default" style="margin-bottom: 0px;">
      <div class="panel-heading" (click)="isCollapsed = !isCollapsed"><b>{{title}}</b>
        <span style="float: right" class="glyphicon" [class.glyphicon-menu-down]="isCollapsed" [class.glyphicon-menu-up]="!isCollapsed"
          aria-hidden="true"></span>
      </div>
      <div [collapse]="isCollapsed" class="panel-body">
        <ng-content></ng-content>
      </div>
    </div>
  </div>
  <div class="col-sm-1"></div>
</div>

Put this code to the body.component.html. This code will give us two collapse components.

<app-zippy [title]="'Who can see my stuff?'">
    Content of who can see my stuff
</app-zippy>
<app-zippy [title]="'Who can contact me?'">
    Content of who can contact me
</app-zippy>

Now just type below command to run the Angular development server, and you can see the output from the http://localhost:4200/

ng serve