copay-crown/src/pages/integrations/glidera/glidera.html

A Secure Crown Wallet

<ion-header>
  <ion-navbar>
    <ion-title>Glidera</ion-title>
    <ion-buttons end>
      <button ion-button *ngIf="!account.token" (click)="toggleOauthForm()">
        <span *ngIf="!showOauthForm">Enter Code</span>
        <span *ngIf="showOauthForm">Restart</span>
      </button>
    </ion-buttons>
  </ion-navbar>
</ion-header>

<ion-content>
  <div *ngIf="!account.token" class="center-header">
    <img src="assets/img/glidera/glidera-logo.png" width="200">
    <div padding margin *ngIf="!showOauthForm" text-wrap>Glidera's exchange service is available in the United States, and can take 1-2 weeks to buy or sell bitcoin.
      <a (click)="openSupportWindow()">Glidera Support</a>
    </div>
    <div padding margin *ngIf="showOauthForm" text-wrap>If you have trouble, contact
      <a (click)="openSupportWindow()">Glidera support</a> for direct assistance.
    </div>
    <button *ngIf="!showOauthForm" ion-button outline (click)="openAuthenticateWindow()">Connect to Glidera</button>
    <ion-list *ngIf="showOauthForm">
      <form [formGroup]="oauthCodeForm" (ngSubmit)="submitOauthCode(oauthCodeForm.value.code)">
        <ion-item>
          <ion-label stacked>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 type="submit" [disabled]="!oauthCodeForm.valid">Connect Glidera Account</button>
      </form>
    </ion-list>
  </div>
  <div *ngIf="account.token && account.status && !account.status.userCanTransact" class="center-header">
    <img src="assets/img/glidera/glidera-logo.png">
    <div>Please complete your account verification on Glidera's website. If you have trouble, contact
      <a (click)="openSupportWindow()">Glidera support</a> for direct assistance.
    </div>
    <button ion-button outline (click)="openLoginWindow()">Complete Glidera Setup</button>
  </div>
  <div *ngIf="account.token && account.status && account.status.userCanTransact">
    <div class="main-header">
      <img src="assets/img/glidera/glidera-logo.png" width="200" (click)="update()">
    </div>
    <ion-list>
      <button ion-item *ngIf="account.status.userCanBuy" (click)="goToBuyGlideraPage()">
        <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="account.price && account.price.buy" item-end>
          ${{account.price.buy}}/BTC
        </ion-note>
      </button>
      <button ion-item *ngIf="account.status.userCanSell" (click)="goToSellGlideraPage()">
        <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="account.price && account.price.sell" item-end>
          ${{account.price.sell}}/BTC
        </ion-note>
      </button>
      <ion-item-divider>Activity</ion-item-divider>
      <div *ngIf="account.txs && account.txs.length > 0">
        <button ion-item *ngFor="let tx of account.txs" (click)="openTxModal(tx)">
          <ion-icon item-start>
            <img src="assets/img/bought.svg" alt="bought" width="39" *ngIf="tx.type == 'BUY' && tx.status == 'COMPLETE'">
            <img src="assets/img/bought-pending.svg" alt="bought" width="33" *ngIf="tx.type == 'BUY' && tx.status == 'PROCESSING'">
            <img src="assets/img/sold.svg" alt="bought" width="39" *ngIf="tx.type == 'SELL' && tx.status == 'COMPLETE'">
            <img src="assets/img/sold-pending.svg" alt="bought" width="33" *ngIf="tx.type == 'SELL' && tx.status == 'PROCESSING'">
          </ion-icon>
          <span *ngIf="tx.type == 'BUY'">Bought</span>
          <span *ngIf="tx.type == 'SELL'">Sold</span>
          <b>{{tx.qty}}</b> BTC
          <div class="amount">{{tx.subtotal|currency:'':2}} {{tx.currency}}</div>
          <ion-note class="details" item-end text-end>
            <div *ngIf="tx.status == 'COMPLETE' && tx.transactionDate">
              <time>{{tx.transactionDate | amTimeAgo}}</time>
            </div>
            <div *ngIf="tx.status == 'PROCESSING'">
              Processing
            </div>
          </ion-note>
        </button>
      </div>
    </ion-list>
  </div>
</ion-content>