copay/views/includes/transaction.html

<div class="last-transactions-header" ng-init="txIndex = $index">
  <div class="row collapse">
    <div class="hide-for-small-only large-1 medium-1 columns">
      <a class="text-black" ng-show="tx.comment">
        <i class="fi-comment-quotes size-24" popover-animation="true" popover="{{$root.wallet.publicKeyRing.nicknameForCopayer(tx.creator)}}" popover-title="{{tx.comment}}" popover-placement="right" popover-trigger="mouseenter"></i>
      </a>
      <a class="disable" ng-show="!tx.comment">
        <i class="fi-comment-quotes size-24 text-gray"></i>
      </a>
    </div>
    <div class="show-for-small-only small-12 columns m10b" ng-show="tx.comment">
      <p class="size-14 label ">
        {{tx.comment}} Created by <strong>{{$root.wallet.publicKeyRing.nicknameForCopayer(tx.creator)}}</strong>
      </p>
    </div>
    <div class="large-8 medium-8 small-9 columns">
      <div class="row collapse" ng-repeat="out in tx.outs">
        <div class="large-3 medium-3 small-4 columns">
          <div class="size-14 hide-for-small-only">
            <span 
              ng-class="{'has-tip': alternativeCurrency[txIndex]}"
              ng-init="amountAlternative(out.value, txIndex)"
              data-options="disable_for_touch:true"
              tooltip-popup-delay='500'
              tooltip="{{alternativeCurrency[txIndex]|noFractionNumber}} {{alternativeIsoCode}}"
              tooltip-trigger="mouseenter"
              tooltip-placement="right"
              >{{out.value |noFractionNumber}}
              {{$root.wallet.settings.unitName}}</span>
          </div>
          <div class="size-12 show-for-small-only">
            <span>{{out.value |noFractionNumber}} {{$root.wallet.settings.unitName}}</span>
          </div>
        </div>
        <div class="large-1 medium-1 small-1 columns fi-arrow-right"></div>
        <div class="large-8 medium-8 small-7 columns ellipsis">
          <contact address="{{out.address}}" tooltip-popup-delay="500" tooltip tooltip-placement="right" />
        </div>
      </div>
    </div>

    <div class="large-3 medium-3 small-3 columns text-right">
      <p class="size-12">{{tx.createdTs | amCalendar}}</p>
    </div>
  </div>
</div>

<div class="last-transactions-content">
  <div class="box-copayer" ng-repeat="c in tx.actionList">
    <a class="has-tip">
      <img class="copayer-ico br100" src="./img/satoshi.gif" alt="{{c.cId}}">
    </a>
    <div class="box-status">
      <a ng-if="c.actions.create" tooltip-popup-delay="1000" tooltip="Created {{c.actions.create | amTimeAgo}}">
        <i class="fi-crown icon-status icon-active"></i>
      </a>
      <a ng-if="!c.actions.create"><i class="fi-crown icon-status"></i></a>

      <a ng-if="c.actions.seen" tooltip-popup-delay="1000" tooltip="Seen {{c.actions.seen | amTimeAgo}}">
        <i class="fi-eye icon-status icon-active"></i>
      </a>
      <a ng-if="!c.actions.seen"><i class="fi-eye icon-status"></i></a>

      <a ng-if="c.actions.rejected" tooltip-popup-delay="1000" tooltip="Rejected {{c.actions.rejected | amTimeAgo}}">
        <i class="fi-x icon-status icon-active-x"></i>
      </a>

      <a ng-if="c.actions.sign" tooltip-popup-delay="1000" tooltip="Signed {{c.actions.sign | amTimeAgo}}">
        <i class="fi-check icon-status icon-active-check"></i>
      </a>

      <a ng-if="!c.actions.sign && !c.actions.rejected && tx.missingSignatures" class="icon-status">
        <i class="fi-loop icon-rotate"></i>
      </a>
    </div>

    <div class="text-center">
      <p class="size-12 text-gray ellipsis">
        {{c.cId === $root.wallet.getMyCopayerId() ? 'Me' : $root.wallet.publicKeyRing.nicknameForCopayer(c.cId)}}
      </p>
    </div>
  </div>
</div>

<div class="last-transactions-footer">
  <div class="large-5 medium-7 small-12 columns" ng-show="!tx.sentTs">
    <div ng-show="!tx.signedByUs && !tx.rejectedByUs  && !tx.finallyRejected && tx.missingSignatures">
      <div class="hide-for-small-only">
        <button class="primary m15r"  ng-click="sign(tx.ntxid)" ng-disabled="loading">
          <i class="fi-check"></i> <span translate>Sign</span>
        </button>
        <button class="warning" ng-click="reject(tx.ntxid)" ng-disabled="loading">
          <i class="fi-x" ></i> <span translate>Reject</span>
        </button>
      </div>
      <div class="show-for-small-only row m10b">
        <button class="primary small-5 columns"  ng-click="sign(tx.ntxid)" ng-disabled="loading">
          <i class="fi-check"></i> <span translate>Sign</span>
        </button>
        <button class="warning small-5 columns" ng-click="reject(tx.ntxid)" ng-disabled="loading">
          <i class="fi-x" ></i> <span translate>Reject</span>
        </button>
      </div>
    </div>
    <div ng-show="!tx.missingSignatures && !tx.sentTs">
      <button class="primary"  ng-click="send(tx.ntxid)" ng-disabled="loading"> <i class=".fi-upload-cloud"></i>
        <span translate>Broadcast Transaction</span>
      </button>
    </div>
  </div>

  <div class="large-7 medium-5 small-12 columns text-right">
    <div translate ng-show="tx.finallyRejected" class="has-error m10b">
      Transaction finally rejected
    </div>
    <div ng-show="!tx.missingSignatures && tx.sentTs">
      <div class="is-valid m10b">
        <strong translate>Sent</strong>  <span class="text-gray" am-time-ago="tx.sentTs"></span>
      </div>
      <div class="ellipsis small">
        <span translate>Transaction ID</span>:
        <a href="http://{{getShortNetworkName()}}.insight.is/tx/{{tx.sentTxid}}" target="_blank">
          {{tx.sentTxid}}
        </a>
      </div>
    </div>
    <p translate class="text-gray m5b" ng-show="!tx.finallyRejected && tx.missingSignatures==1">
      One signature missing
    </p>
    <p translate class="text-gray m5b" ng-show="!tx.finallyRejected && tx.missingSignatures>1">
      {{tx.missingSignatures}} signatures missing</p>
    <div class="ellipsis small text-gray">
      <strong translate>Fee</strong>: {{tx.fee|noFractionNumber}} {{$root.wallet.settings.unitName}}
      <strong translate>Proposal ID</strong>: {{tx.ntxid}}
    </div>
  </div>
</div>