copay/views/send.html

<div class="send" data-ng-controller="SendController">
  <div ng-show='$root.wallet.isReady()'>
    <form name="sendForm" ng-submit="submitForm(sendForm)" novalidate>
      <h3>{{title}}</h3>
      <div class="large-7 columns">
        <div class="row">
          <h4 class="large-2 medium-3 columns text-right">To address <small class="text-gray">(*)</small> </h4>
          <div class="large-8 medium-7 small-10 columns pr m15b" for="address">
            <input style="margin:0;" type="text" id="address" name="address" ng-disabled="loading"
            placeholder="Send to" ng-model="address" valid-address required>
            <small class="icon-input" ng-show="!sendForm.address.$invalid && address"><i class="fi-check"></i></small>
            <small class="icon-input" ng-show="sendForm.address.$invalid && address"><i class="fi-x"></i></small>
            <div>
              <small class="is-valid" ng-show="!sendForm.address.$invalid && address"> Valid</small>
              <small class="has-error" ng-show="sendForm.address.$invalid && address"> Not valid </small>
            </div>
          </div>
          <div class="large-2 small-2 columns" ng-hide="showScanner || !isHttp">
            <a class="postfix button secondary" ng-click="openScanner()"><i class="fi-camera"></i></a>
          </div>
          <div class="small-2 columns" ng-show="showScanner && isHttp">
            <a class="postfix button warning" ng-click="cancelScanner()">Cancel</a>
          </div>
        </div> <!-- end of to address -->
        <div id="scanner" class="row" ng-if="showScanner">
          <div class="text-centered">
            <canvas id="qr-canvas" width="200" height="150"></canvas>
            <div ng-show="isMobile">
              <div id="file-input-wrapper" class="btn btn-primary">
                <span class="pull-left text-centered">
                  <i class="glyphicon glyphicon-refresh icon-rotate"></i>
                  Get QR code
                </span>
                <input id="qrcode-camera" type="file" capture="camera" accept="image/*">
              </div>
            </div>
            <div ng-hide="isMobile">
              <video id="qrcode-scanner-video" width="300" height="225" ng-hide="isMobile"></video>
            </div>
          </div>
        </div> 

        <div class="row">
          <h4 class="large-2 medium-3 text-right columns">Amount <small class="text-gray">(*)</small></h4>
          <div class="large-8 medium-7 columns m15b">
            <input style="margin:0;" type="number" id="amount" ng-disabled="loading"
            name="amount" placeholder="Amount" ng-model="amount"
            min="0.0001" max="10000000000" enough-amount required
            autocomplete="off"
            >
            <a class="small input-note" title="Send all funds"
              ng-show="$root.availableBalance > 0" 
              ng-click="topAmount(sendForm)">
              Use all funds ({{getAvailableAmount()}} {{$root.unitName}})
            </a>
            <div for="amount">
              <small class="is-valid" ng-show="!sendForm.amount.$invalid">Valid</small>
              <small class="has-error" ng-show="sendForm.amount.$invalid && !sendForm.amount.$pristine && !notEnoughAmount">Not valid</small>
              <small ng-show="notEnoughAmount" class="has-error">Insufficient funds</small>
              <small class="icon-input" ng-show="!sendForm.amount.$invalid && amount"><i class="fi-check"></i></small>
              <small class="icon-input" ng-show="sendForm.amount.$invalid && amount"><i class="fi-x"></i></small>
            </div>                      
          </div>
          <div class="large-2 small-3 columns">
            <span class="postfix">{{$root.unitName}}</span>
          </div>
        </div> <!-- end of amount -->

        <div class="row" ng-show="wallet.totalCopayers > 1">
          <h4 class="large-2 medium-3 columns text-right" for="comment">Note
          </h4>
          <div class="large-10 medium-9 columns m15b">
            <textarea style="margin:0; height: 100px;" id="comment" ng-disabled="loading" name="comment" placeholder="Leave a private message to your copayers" ng-model="commentText" ng-maxlength="100"></textarea>
            <small class="has-error" ng-show="sendForm.comment.$invalid && !sendForm.comment.$pristine">too long!</small>
          </div>
        </div> <!-- end of note -->
      </div> <!-- end of col left -->

      <div class="send-bar large-4 columns left">
        <h6>Send to</h6>
        <p class="text-gray" ng-class="{'hidden': sendForm.address.$invalid || !address}">
          {{address}}&nbsp;
        </p>
        <h6>Total amount for this transaction:</h6>
        <p class="text-gray" ng-class="{'hidden': sendForm.amount.$invalid || !amount > 0}">
          <b>{{amount + defaultFee |noFractionNumber}}</b> {{$root.unitName}}
          <small>
            {{ ((amount + defaultFee) * unitToBtc)|noFractionNumber:8}} BTC <br/>
            Including fee of {{defaultFee|noFractionNumber}} {{$root.unitName}}
          </small>
        </p>
        <h6>Note</h6>
        <p ng-class="{'hidden': !commentText}">{{commentText}}&nbsp;</p>
        <div>
          <button type="submit" class="button secondary expand text-center m0" ng-disabled="sendForm.$invalid || loading" loading="Sending">
            Send
          </button>
        </div>
      </div>
    </form>

    <div class="large-12 columns line-dashed">
      <h3>Address Book</h3>
      <p class="text-gray" ng-hide="showAddressBook()">Empty. Create an alias for your addresses</p>
      <table ng-show="showAddressBook()">
        <thead>
          <tr>
            <th>Label</th>
            <th>Address</th>
            <th>Creator</th>
            <th>Date</th>
            <th>&nbsp;</th>
          </tr>
        </thead>
        <tbody>
        <tr 
          ng-repeat="(addr, info) in $root.wallet.addressBook" 
          ng-class="{'addressbook-disabled': info.hidden}">
          <td><a ng-click="copyAddress(addr)" title="Copy address">{{info.label}}</a></td>
          <td width="100" class="ellipsis">{{addr}}</td>
          <td>{{$root.wallet.publicKeyRing.nicknameForCopayer(info.copayerId)}}</td>
          <td><time>{{info.createdTs | amCalendar}}</time></td>
          <td><a ng-click="toggleAddressBookEntry(addr)">{{info.hidden ?
              'Enable' : 'Disable'}}</a></td>
        </tr>
        </tbody>
      </table>
      <button class="m10t button tiny secondary radius text-center" ng-click="openAddressBookModal()">Add New Entry</button>
    </div>
  </div>
</div>