copay-crown/src/pages/integrations/shapeshift/shapeshift-shift/shapeshift-shift.html

A Secure Crown Wallet

<ion-header>
  <ion-navbar>
    <ion-title>Shift</ion-title>
  </ion-navbar>
</ion-header>


<ion-content>
  <ion-list *ngIf="fromWallets.length > 0 && toWallets.length > 0">
    <div *ngIf="fromWallets.length > 0">
      <ion-item>
        <span translate>From</span>
        <img item-end *ngIf="fromWallet.coin == 'btc'" src="assets/img/icon-bitcoin.svg" width="18">
        <img item-end *ngIf="fromWallet.coin == 'bch'" src="assets/img/bitcoin-cash-logo.svg" width="22">
      </ion-item>
      <button ion-item class="wallet-selector" (click)="showWallets('from')">
        <img *ngIf="fromWallet.network != 'testnet'" src="assets/img/icon-wallet.svg" [ngStyle]="{'background-color': fromWallet.color}"
          class="icon-wallet" />
        <div class="wallet-balance">
          <span>
            {{fromWallet.name || fromWallet.id}}
          </span>
          <p>
            <span *ngIf="!fromWallet.isComplete()" class="assertive" translate>
              Incomplete
            </span>
            <span *ngIf="fromWallet.isComplete()">
              <span *ngIf="!fromWallet.balanceHidden  && !fromWallet.scanning"> {{fromWallet.status.totalBalanceStr ? fromWallet.status.totalBalanceStr : ( fromWallet.cachedBalance ? fromWallet.cachedBalance
                + (fromWallet.cachedBalanceUpdatedOn ? ' &middot; ' + ( fromWallet.cachedBalanceUpdatedOn * 1000 | amTimeAgo)
                : '') : '' ) }} </span>
              <span *ngIf="fromWallet.scanning" translate> Scanning funds... </span>

              <span *ngIf="fromWallet.balanceHidden && !fromWallet.scanning" translate>[Balance Hidden]</span>
              <span *ngIf="fromWallet.n > 1">
                {{fromWallet.m}}-of-{{fromWallet.n}}
              </span>
              <ion-icon *ngIf="!fromWallet.balanceHidden && (fromWallet.status.totalBalanceSat != fromWallet.status.spendableAmount)" name="ios-timer-outline"></ion-icon>
              <span class="assertive" *ngIf="fromWallet.error">{{fromWallet.error}}</span>
            </span>
            &nbsp;
          </p>
        </div>
      </button>
    </div>
    <div *ngIf="toWallets.length > 0">
      <ion-item>
        <span translate>To</span>
        <img item-end *ngIf="toWallet.coin == 'btc'" src="assets/img/icon-bitcoin.svg" width="18">
        <img item-end *ngIf="toWallet.coin == 'bch'" src="assets/img/bitcoin-cash-logo.svg" width="22">
      </ion-item>
      <button ion-item class="wallet-selector" (click)="showWallets('to')">
        <img *ngIf="toWallet.network != 'testnet'" src="assets/img/icon-wallet.svg" class="icon-wallet" [ngStyle]="{'background-color': toWallet.color}"
        />
        <div class="wallet-balance">
          <span>
            {{toWallet.name || toWallet.id}}
          </span>
          <p>
            <span *ngIf="!toWallet.isComplete()" class="assertive" translate>
              Incomplete
            </span>
            <span *ngIf="toWallet.isComplete()">
              <span *ngIf="!toWallet.balanceHidden  && !toWallet.scanning"> {{toWallet.status.totalBalanceStr ? toWallet.status.totalBalanceStr : ( toWallet.cachedBalance ? toWallet.cachedBalance
                + (toWallet.cachedBalanceUpdatedOn ? ' &middot; ' + ( toWallet.cachedBalanceUpdatedOn * 1000 | amTimeAgo)
                : '') : '' ) }} </span>
              <span *ngIf="toWallet.scanning" translate> Scanning funds... </span>

              <span *ngIf="toWallet.balanceHidden && !toWallet.scanning" translate>[Balance Hidden]</span>
              <span class="tab-home__wallet__multisig-number" *ngIf="toWallet.n > 1">
                {{toWallet.m}}-of-{{toWallet.n}}
              </span>
              <ion-icon *ngIf="!fromWallet.balanceHidden && (fromWallet.status.totalBalanceSat != fromWallet.status.spendableAmount)" name="ios-timer-outline"></ion-icon>
              <span class="assertive" *ngIf="toWallet.error">{{toWallet.error}}</span>
            </span>
            &nbsp;
          </p>
        </div>
      </button>
    </div>

    <ion-item-divider></ion-item-divider>

    <ion-item>
      Rate
      <ion-note item-end>
        <span *ngIf="!rate">...</span>
        <span *ngIf="rate">
          {{rate.rate}} {{toWallet.coin | uppercase}} per {{fromWallet.coin | uppercase}}
        </span>
      </ion-note>
    </ion-item>

    <ion-item>
      Deposit Min
      <ion-note item-end>
        <span *ngIf="!limit">...</span>
        <span *ngIf="limit">
          {{limit.minimum}} {{fromWallet.coin | uppercase}}
        </span>
      </ion-note>
    </ion-item>

    <ion-item>
      Deposit Max
      <ion-note item-end>
        <span *ngIf="!limit">...</span>
        <span *ngIf="limit">
          {{limit.limit}} {{fromWallet.coin | uppercase}}
        </span>
      </ion-note>
    </ion-item>

    <ion-item>
      Miner fee
      <ion-note item-end>
        <span *ngIf="!limit">...</span>
        <span *ngIf="limit">
          {{limit.minerFee}} {{toWallet.coin | uppercase}}
        </span>
      </ion-note>
    </ion-item>
  </ion-list>

  <div *ngIf="fromWallets.length > 0 && toWallets.length > 0" class="agree-to-terms">
    <ion-item text-wrap>
      <ion-checkbox class="check" [(ngModel)]="termsAccepted"></ion-checkbox>
    </ion-item>
    <div class="terms">
      <p translate>
        I agree to the
        <a (click)="openTerms()"> Terms </a>
        and certify that I am the beneficial owner of the input assets and the destination address.
      </p>
    </div>
  </div>

</ion-content>

<ion-footer>
  <button ion-button full class="button-footer" no-low-fee type="button" *ngIf="fromWallets.length > 0 && toWallets.length > 0"
    [disabled]="!fromWallet || !toWallet || !termsAccepted" (click)="setAmount()">
    Continue
  </button>
</ion-footer>