coinbase page html

src/pages/integrations/coinbase/coinbase.html

@@ -0,0 +1,89 @@
+<ion-header>
+  <ion-navbar>
+  </ion-navbar>
+</ion-header>
+
+<ion-content>
+  <div *ngIf="!accessToken">
+    <div class="heading">
+      <img src="img/coinbase-logo.png">
+      <div class="integration-onboarding-description" *ngIf="!showOauthForm">Coinbase's exchange service is available in 33 countries, and can take 3-5 days to buy or sell bitcoin.</div>
+      <div class="integration-onboarding-description" *ngIf="showOauthForm">If you have trouble, contact Coinbase support for direct assistance.</div>
+    </div>
+    <div *ngIf="!showOauthForm">
+      <button ion-button block (click)="openAuthenticateWindow()">Connect Coinbase Account</button>
+      <button ion-button block outline (click)="openSupportWindow()">Sign Up for Coinbase</button>
+    </div>
+    <div *ngIf="showOauthForm" class="integration-onboarding-oauthform">
+      <form [formGroup]="oauthCodeForm" (ngSubmit)="submitOauthCode(oauthCodeForm.value.code)">
+        <ion-item>
+          <ion-label stacked translate>OAuth Code</ion-label>
+          <ion-input type="text" formControlName="code" [value]="oauthCodeForm.value.code" placeholder="{{'Enter OAuth Code'}}" required></ion-input>
+        </ion-item>
+        <button ion-button block type="submit" [disabled]="!oauthCodeForm.valid">Connect Coinbase Account</button>
+      </form>
+      <button ion-button block outline (click)="openSupportWindow()">Coinbase Support</button>
+    </div>
+  </div>
+  <div *ngIf="accessToken">
+    <div class="heading" (click)="updateTransactions()">
+      <img src="assets/img/coinbase-logo.png">
+    </div>
+    <ion-card>
+      <ion-list>
+        <button ion-item (click)="goToBuyCoinbasePage()">
+            <ion-icon item-start>
+              <img src="assets/img/buy-bitcoin.svg" alt="buy bitcoin" class="item-img-buy">                
+            </ion-icon>
+            <ion-label>Buy Bitcoin</ion-label>
+            <ion-note *ngIf="buyPrice" item-end>
+              {{buyPrice.amount|currency:'$':2}} {{buyPrice.currency}}/BTC
+            </ion-note>
+          </button>
+        <button ion-item (click)="goToSellCoinbasePage()">
+            <ion-icon item-start>
+              <img src="assets/img/sell-bitcoin.svg" alt="sell bitcoin" class="item-img-sell">                
+            </ion-icon>
+            <ion-label>Sell Bitcoin</ion-label>
+            <ion-note *ngIf="sellPrice"  item-end>
+              {{sellPrice.amount|currency:'$':2}} {{sellPrice.currency}}/BTC 
+            </ion-note>
+          </button>
+      </ion-list>
+    </ion-card>
+    <ion-card>
+      <ion-card-header (click)="updateTransactions()">Activity</ion-card-header>
+      <div *ngIf="pendingTransactions.data && !error">
+        <ion-list *ngFor="let tx in pendingTransactions.data | keys">
+          <button ion-item (click)="openTxModal(tx)">
+            <ion-icon item-start>
+                <img src="img/assets/bought-pending.svg" alt="bought" *ngIf="(tx.type == 'buy' || (tx.to && tx.type == 'send')) && tx.status != 'completed'">
+                <img src="img/assets/bought.svg" alt="bought" *ngIf="(tx.type == 'buy' || (tx.to && tx.type == 'send')) && tx.status == 'completed'">
+                <img src="img/assets/sold-pending.svg" alt="sold" *ngIf="tx.from && tx.type == 'send'">
+                <img src="img/assets/sold.svg" alt="sold" *ngIf="!tx.from && tx.type == 'sell' && tx.status == 'completed'">          
+            </ion-icon>
+            <div class="action">
+              <div class="assertive" *ngIf="tx.error || tx.status == 'error'">
+                Error
+              </div>
+              <div *ngIf="!tx.error">
+                <div *ngIf="tx.status == 'completed'">
+                  <time *ngIf="tx.created_at">{{tx.created_at | amTimeAgo}}</time>
+                </div>
+                <div *ngIf="tx.status == 'pending'">
+                  <span *ngIf="tx.status == 'pending'">Pending</span>
+                </div>
+              </div>
+            </div>
+            <div class="details">
+              <span *ngIf="tx.type == 'sell' && tx.status == 'completed'">Sold</span>
+              <span *ngIf="tx.type == 'send' && tx.to && tx.status == 'completed'">Bought</span>
+              <span *ngIf="tx.type == 'sell' || (tx.type == 'send' && tx.from)">-</span>{{tx.amount.amount.replace('-','')}}
+              {{tx.amount.currency}}
+            </div>
+          </button>
+        </ion-list>
+      </div>
+    </ion-card>
+  </div>
+</ion-content>

src/pages/integrations/coinbase/coinbase.ts

@@ -11,6 +11,7 @@ import { OnGoingProcessProvider } from '../../../providers/on-going-process/on-g
 
 //pages
 import { CoinbaseTxDetailsPage } from './coinbase-tx-details/coinbase-tx-details';
+import { AmountPage } from '../../send/amount/amount';
 
 import * as _ from 'lodash';
 
@@ -180,4 +181,12 @@ export class CoinbasePage {
     })
   }
 
+  public goToBuyGlideraPage(): void {
+    this.navCtrl.push(AmountPage, { nextPage: 'BuyCoinbasePage', currency: this.currency, coin: 'btc', fixedUnit: true });
+  }
+
+  public goToSellGlideraPage(): void {
+    this.navCtrl.push(AmountPage, { nextPage: 'SellCoinbasePage', currency: this.currency, coin: 'btc', fixedUnit: true })
+  }
+
 }

src/pages/integrations/glidera/glidera.html

@@ -42,7 +42,7 @@
       <ion-list>
         <button ion-item *ngIf="account.status.userCanBuy" (click)="goToBuyGlideraPage()">
           <ion-icon item-start>
-            <img src="assets/img/glidera/buy-bitcoin.svg" alt="buy bitcoin" class="item-img-buy">                
+            <img src="assets/img/buy-bitcoin.svg" alt="buy bitcoin" class="item-img-buy">                
           </ion-icon>
           <ion-label>Buy Bitcoin</ion-label>
           <ion-note *ngIf="account.price && account.price.buy" item-end>
@@ -51,7 +51,7 @@
         </button>
         <button ion-item *ngIf="account.status.userCanSell" (click)="goToSellGlideraPage()">
           <ion-icon item-start>
-            <img src="assets/img/glidera/sell-bitcoin.svg" alt="buy bitcoin" class="item-img-sell">                
+            <img src="assets/img/sell-bitcoin.svg" alt="sell bitcoin" class="item-img-sell">                
           </ion-icon>
           <ion-label>Sell Bitcoin</ion-label>
           <ion-note *ngIf="account.price && account.price.sell" item-end>
@@ -65,10 +65,10 @@
       <ion-list *ngFor="let tx of account.txs">
         <button ion-item (click)="openTxModal(tx)" *ngIf="account.txs && account.txs.length > 0">
               <ion-icon item-start>
-                <img src="assets/img/glidera/bought.svg" alt="bought" width="39" *ngIf="tx.type == 'BUY' && tx.status == 'COMPLETE'">
+                <img src="assets/img/bought.svg" alt="bought" width="39" *ngIf="tx.type == 'BUY' && tx.status == 'COMPLETE'">
-                <img src="assets/img/glidera/bought-pending.svg" alt="bought" width="33" *ngIf="tx.type == 'BUY' && tx.status == 'PROCESSING'">
+                <img src="assets/img/bought-pending.svg" alt="bought" width="33" *ngIf="tx.type == 'BUY' && tx.status == 'PROCESSING'">
-                <img src="assets/img/glidera/sold.svg" alt="bought" width="39" *ngIf="tx.type == 'SELL' && tx.status == 'COMPLETE'">
+                <img src="assets/img/sold.svg" alt="bought" width="39" *ngIf="tx.type == 'SELL' && tx.status == 'COMPLETE'">
-                <img src="assets/img/glidera/sold-pending.svg" alt="bought" width="33" *ngIf="tx.type == 'SELL' && tx.status == 'PROCESSING'">              
+                <img src="assets/img/sold-pending.svg" alt="bought" width="33" *ngIf="tx.type == 'SELL' && tx.status == 'PROCESSING'">              
               </ion-icon>
               <div class="action">
                 <div *ngIf="tx.status == 'COMPLETE'">