<div
  class="topbar-container"
  ng-include="'views/includes/topbar.html'"
  ng-init="titleSection='Choose wallet'; closeToHome = true">
</div>

<div class="content p20v row payment-uri" ng-controller="paymentUriController as payment">
  <div class="large-12 columns" ng-init="payment.init()">
    <div class="panel text-center" ng-if="!payment.uri">
      <h1 translate>Bitcoin URI is NOT valid!</h1>
    </div>
    <div ng-if="payment.uri"  ng-init="payment.getWallets(payment.uri.network)">
      <h1 translate>Make a payment to</h1>
      <div class="panel size-14">
        <div class="ellipsis"><b translate>Address</b>: {{payment.uri.address.toString()}}</div>
        <div ng-show="payment.uri.amount"><b translate>Amount</b>: {{payment.uri.amount}}</div>
        <div ng-show="payment.uri.message"><b translate>Message</b>: {{payment.uri.message}}</div>
        <div ng-show="payment.uri.network == 'testnet'"><b translate>Network</b>: {{payment.uri.network}}</div>
      </div>
      <div ng-if="!wallets || !wallets.length">
        <div class="box-notification">
          <span class="text-warning">
            <b translate>There are no wallets to make this payment</b>
            <span ng-show="payment.uri.network == 'testnet'">[testnet]</span>
          </span>
        </div>
      </div>

      <div ng-if="wallets.length">
        <h2 translate>Select a wallet</h2>
        <ul class="no-bullet">
          <li class="panel" ng-repeat="w in wallets">
          <a ng-click="payment.selectWallet(w.id)">
            <div class="avatar-wallet"
              ng-style="{'background-color':w.color}">
              <i class="icon-wallet size-21"></i>
            </div>
            <div class="ellipsis">{{w.name || w.id}}</div>
            <div class="size-12">{{w.m}} of {{w.n}}
              <span ng-show="w.network=='testnet'">[Testnet]</span>
            </div>
          </a>
          </li>
        </ul>
      </div>
    </div>
  </div>
</div>
