New design for modals. Fix notification errors

This commit is contained in:
Gustavo Maximiliano Cortez 2015-12-03 13:43:59 -03:00
commit 93b935ee0a
No known key found for this signature in database
GPG key ID: 15EDAD8D9F2EB1AF
11 changed files with 185 additions and 158 deletions

View file

@ -15,29 +15,86 @@
ng-swipe-disable-mouse
ng-swipe-right="cancel()"
ng-init="updateCopayerList()">
<div class="payment-proposal-head"
ng-style="{'background-color':color}">
<div class="size-36">{{tx.amountStr}}</div>
<div class="size-14 text-light" ng-show="tx.alternativeAmountStr">{{tx.alternativeAmountStr}}</div>
<i class="db fi-arrow-down size-24 m10v"></i>
<span class="payment-proposal-to"
ng-click="copyAddress(tx.toAddress)">
<i class="fi-bitcoin"></i>
<contact ng-if="!tx.hasMultiplesOutputs" class="dib enable_text_select" address="{{tx.toAddress}}"></contact>
<span ng-if="tx.hasMultiplesOutputs" translate>
Multiple recipients
</span>
</span>
</div>
<div class="oh">
<div class="box-notification m20t" ng-show="error">
<span class="text-warning size-14">
{{error|translate}}
</span>
</div>
<div class="row column m20t text-center text-warning size-12" ng-if="tx.removed" translate>
The payment was removed by creator
</div>
<div class="row p20t white" ng-if="tx.pendingForUs">
<div class="large-5 medium-5 small-6 columns">
<button class="button outline round dark-gray expand" ng-click="reject(tx);"
ng-disabled="loading">
<i class="fi-x"></i>
<span translate>Reject</span>
</button>
</div>
<div class="large-5 medium-5 small-6 columns text-right" ng-show="canSign">
<button class="button primary round expand" ng-click="sign(tx)"
ng-style="{'background-color':color}"
ng-disabled="loading">
<i class="fi-check"></i>
<span translate>Accept</span>
</button>
</div>
</div>
<div class="text-center text-gray size-12 m20t" ng-show="tx.status != 'pending'">
<div ng-show="tx.status=='accepted' && !tx.isGlidera">
<div class="m10b" translate>Payment accepted, but not yet broadcasted</div>
<button class="primary round m0"
ng-style="{'background-color':color}"
ng-click="broadcast(tx)"
ng-disabled="loading"
> <i class="fi-upload-cloud"></i>
<span translate>Broadcast Payment</span>
</button>
</div>
<div ng-show="tx.status=='accepted' && tx.isGlidera" >
<div class="m10h" translate>Payment accepted. It will be broadcasted by Glidera. In case there is a problem, it can be deleted 6 hours after it was created.</div>
</div>
<div class="text-success"
ng-show="tx.status=='broadcasted'" translate>
Payment Sent
</div>
<div class="text-warning"
ng-show="tx.status=='rejected'" translate>
Payment Rejected
</div>
</div>
</div>
<h4 class="title m0" translate>Details</h4>
<ul class="no-bullet size-14 m0">
<li ng-if="!tx.hasMultiplesOutputs"
class="line-b p10 oh"
ng-click="copyAddress(tx.toAddress)">
<span class="text-gray" translate>To</span>:
<contact class="right enable_text_select" address="{{tx.toAddress}}"></contact>
</li>
<li class="line-b p10">
<span ng-show="tx.hasMultiplesOutputs" class="text-gray" translate>Total</span>
<span ng-show="!tx.hasMultiplesOutputs" class="text-gray" translate>Amount</span>:
<span class="right">{{tx.amountStr}}
<span ng-show="tx.alternativeAmountStr" class="label gray radius">{{tx.alternativeAmountStr}}</span>
</span>
</li>
<li class="line-b p10 oh">
<span class="text-gray" translate>Note</span>:
<span class="text-gray" translate>Note</span>
<span class="right">{{tx.message}}</span>
</li>
<li ng-show="tx.hasMultiplesOutputs" class="line-b p10 oh"
ng-click="showMultiplesOutputs = !showMultiplesOutputs">
<span class="text-gray" translate>Recipients</span>:
<span class="text-gray" translate>Recipients</span>
<span class="right">{{tx.recipientCount}}
<i ng-show="showMultiplesOutputs" class="icon-arrow-up3 size-24"></i>
<i ng-show="!showMultiplesOutputs" class="icon-arrow-down3 size-24"></i>
@ -50,28 +107,29 @@
</div>
<li class="line-b p10">
<span class="text-gray" translate>Fee</span>:
<span class="text-gray" translate>Fee</span>
<span class="right">{{tx.feeStr}}</span>
</li>
<li class="line-b p10">
<span class="text-gray" translate>Time</span>:
<span class="text-gray" translate>Time</span>
<span class="right">
<time>{{ (tx.ts || tx.createdOn ) * 1000 | amTimeAgo}}</time>
</span>
</li>
<li class="line-b p10 oh">
<span class="text-gray" translate>Created by</span>:
<span class="text-gray" translate>Created by</span>
<span class="right">{{tx.creatorName}}</span>
</li>
</ul>
<div class="p10 text-center size-12" ng-show="!currentSpendUnconfirmed && tx.hasUnconfirmedInputs">
<span class="text-warning" translate>Warning: this transaction has unconfirmed inputs</span>
</div>
<div ng-if="tx.paypro">
<h4 class="title m0" translate>Payment details</h4>
<ul class="no-bullet size-14 m0">
<li class="line-b p10">
<span class="text-gray" translate>To</span>:
<span class="text-gray" translate>To</span>
<span class="right">
<span>
<span ng-show="tx.merchant.pr.ca"><i class="fi-lock"></i> {{tx.paypro.domain}}</span>
@ -81,83 +139,36 @@
</span>
</li>
<li class="line-b p10">
<span class="text-gray" translate>Expires</span>:
<span class="text-gray" translate>Expires</span>
<span class="right">
<time>{{tx.paypro.expirationDate | amTimeAgo }}</time>
</span>
</li>
<li class="line-b p10">
<span class="text-gray">Merchant Message:</span>
<span class="text-gray">Merchant Message</span>
<span class="db">{{tx.paypro.pr.pd.memo}}</span>
</li>
</ul>
</div>
<div ng-if="tx.actions[0] && !txRejected && !txBroadcasted">
<h4 class="title m0" translate>Participants</h4>
<h4 class="title m0" translate>
<div class="right size-12 text-gray m10r">
{{tx.requiredSignatures}}/{{tx.walletN}}
</div>
<span translate>Participants</span>
</h4>
<ul class="no-bullet size-14 m0">
<li class="line-b p10 text-gray" ng-repeat="ac in tx.actions">
<i class="icon-contact size-24"></i>
{{ac.copayerName}} <span ng-if="ac.copayerId == copayerId">({{'Me'|translate}})</span>
<span class="right">
<i ng-if="ac.type == 'reject'" class="fi-x icon-sign x db"></i>
<i ng-if="ac.type == 'accept'" class="fi-check icon-sign check db"></i>
<i ng-if="!ac.type" class="fi-loop"></i>
<span class="right tu">
<span ng-if="ac.type == 'reject'" class="text-warning"><i class="fi-x icon-sign x"></i>Rejected</span>
<span ng-if="ac.type == 'accept'" class="text-success"><i class="fi-check icon-sign check"></i>Signed</span>
</span>
</li>
</ul>
</div>
<div class="box-notification m20t" ng-show="error">
<span class="text-warning size-14">
{{error|translate}}
</span>
</div>
<div class="row column m20t text-center text-warning" ng-if="tx.removed" translate>
The payment was removed by creator
</div>
<div class="row m20t" ng-if="tx.pendingForUs">
<div class="large-5 medium-5 small-6 columns">
<button class="button outline round dark-gray expand" ng-click="reject(tx);"
ng-disabled="loading">
<i class="fi-x"></i>
<span translate>Reject</span>
</button>
</div>
<div class="large-5 medium-5 small-6 columns text-right" ng-show="canSign">
<button class="button primary round expand" ng-click="sign(tx)"
ng-style="{'background-color':color}"
ng-disabled="loading">
<i class="fi-check"></i>
<span translate>Accept</span>
</button>
</div>
</div>
<div class="text-center text-gray m20t" ng-show="tx.status != 'pending'">
<div ng-show="tx.status=='accepted' && !tx.isGlidera" >
<div class="m10b size-12" translate>Payment accepted, but not yet broadcasted</div>
<button class="primary round"
ng-click="broadcast(tx)"
ng-disabled="loading"
> <i class="fi-upload-cloud"></i>
<span translate>Broadcast Payment</span>
</button>
</div>
<div ng-show="tx.status=='accepted' && tx.isGlidera" >
<div class="m10 size-12" translate>Payment accepted. It will be broadcasted by Glidera. In case there is a problem, it can be deleted 6 hours after it was created.</div>
</div>
<div class="text-success m10t"
ng-show="tx.status=='broadcasted'" translate>
Payment Sent
</div>
<div class="text-center text-warning m10t"
ng-show="tx.status=='rejected'" translate>
Payment Rejected
</div>
</div>
</div>
<div class="columns text-center m20t" ng-if="tx.canBeRemoved && isShared">
<div class="text-gray size-12 m20b" ng-if="!tx.isGlidera" translate>