Merge pull request #74 from cmgustavo/ref/design-23

Fix modals tx, txp and search
This commit is contained in:
Gustavo Maximiliano Cortez 2016-09-07 15:07:20 -03:00 committed by GitHub
commit 0adc79b85e
8 changed files with 295 additions and 332 deletions

View file

@ -1,11 +1,11 @@
<ion-modal-view> <ion-modal-view>
<ion-header-bar align-title="center" class="tab-bar" ng-style="{'background-color':color}"> <ion-header-bar align-title="center" class="bar-royal" ng-style="{'background-color':color}">
<div class="left-small"> <button class="button button-clear" ng-click="close()">
<a ng-click="close()" class="p10"> Close
<span class="text-close" translate>Close</span> </button>
</a> <div class="title" translate>
Search Transactions
</div> </div>
<h1 class="title ellipsis" translate>Search Transactions</h1>
</ion-header-bar> </ion-header-bar>
<ion-content ng-controller="searchController" ng-init="search = ''"> <ion-content ng-controller="searchController" ng-init="search = ''">
@ -18,14 +18,33 @@
</div> </div>
<div class="list"> <div class="list">
<div class="row item" ng-repeat="btx in txHistorySearchResults track by btx.txid" ng-click="openTxModal(btx)"> <div class="item" ng-repeat="btx in txHistorySearchResults track by btx.txid" ng-click="openTxModal(btx)">
<div class="col col-10">
<img src="img/icon-receive-history.svg" alt="sync" width="40" ng-if="btx.action == 'received'">
<img src="img/icon-sent-history.svg" alt="sync" width="40" ng-if="btx.action == 'sent'">
<img src="img/icon-moved.svg" alt="sync" width="40" ng-if="btx.action == 'moved'">
</div>
<div class="col col-50"> <span class="item-note text-right">
<span class="size-16" ng-class="{'text-bold': btx.recent}">
<span ng-if="btx.action == 'received'">+</span>
<span ng-if="btx.action == 'sent'">-</span>
<span class="size-12" ng-if="btx.action == 'invalid'" translate>
(possible double spend)
</span>
<span ng-if="btx.action != 'invalid'">
{{btx.amountStr}}
</span>
</span>
<p>
<time ng-if="btx.time">{{btx.time * 1000 | amTimeAgo}}</time>
<span translate class="text-warning"
ng-show="!btx.time && (!btx.confirmations || btx.confirmations == 0)" translate>
Unconfirmed
</span>
</p>
</span>
<img class="left m10r" src="img/icon-receive-history.svg" alt="sync" width="40" ng-if="btx.action == 'received'">
<img class="left m10r" src="img/icon-sent-history.svg" alt="sync" width="40" ng-if="btx.action == 'sent'">
<img class="left m10r" src="img/icon-moved.svg" alt="sync" width="40" ng-if="btx.action == 'moved'">
<h2>
<div class="padding" ng-if="btx.action == 'received'"> <div class="padding" ng-if="btx.action == 'received'">
<span class="ellipsis"> <span class="ellipsis">
<h2 ng-if="btx.note.body">{{btx.note.body}}</h2> <h2 ng-if="btx.note.body">{{btx.note.body}}</h2>
@ -49,31 +68,8 @@
</span> </span>
</div> </div>
<span class="label tu warning radius" ng-if="btx.action == 'invalid'" translate>Invalid</span> <span class="label tu warning radius" ng-if="btx.action == 'invalid'" translate>Invalid</span>
</div> </h2>
<div class="col col-30 padding">
<span class="size-16" ng-class="{'text-bold': btx.recent}">
<span ng-if="btx.action == 'received'">+</span>
<span ng-if="btx.action == 'sent'">-</span>
<span class="size-12" ng-if="btx.action == 'invalid'" translate>
(possible double spend)
</span>
<span ng-if="btx.action != 'invalid'">
{{btx.amountStr}}
</span>
</span>
<p>
<time ng-if="btx.time">{{btx.time * 1000 | amTimeAgo}}</time>
<span translate class="text-warning"
ng-show="!btx.time && (!btx.confirmations || btx.confirmations == 0)" translate>
Unconfirmed
</span>
</p>
</div>
<div class="col col-10 text-center">
<i class="icon ion-chevron-right"></i>
</div>
</div> </div>
<div class="text-gray text-center size-12 p10t" ng-if="txHistoryShowMore"> <div class="text-gray text-center size-12 p10t" ng-if="txHistoryShowMore">
<span class="size-12" translate>{{filteredTxHistory.length - txHistorySearchResults.length}} more</span> <span class="size-12" translate>{{filteredTxHistory.length - txHistorySearchResults.length}} more</span>

View file

@ -1,163 +1,159 @@
<ion-modal-view ng-controller="txDetailsController"> <ion-modal-view ng-controller="txDetailsController">
<ion-header-bar align-title="center" class="tab-bar" ng-style="{'background-color':color}"> <ion-header-bar align-title="center" class="bar-royal" ng-style="{'background-color':color}">
<div class="left-small"> <button class="button button-clear" ng-click="cancel()">
<a ng-click="cancel()" class="p10"> Close
<span class="text-close" translate>Close</span> </button>
</a> <div class="title" translate>
Transaction
</div> </div>
<h1 class="title ellipsis" translate>Transaction</h1>
</ion-header-bar> </ion-header-bar>
<ion-content ng-style="{'background-color': '#F6F7F9'}"> <ion-content>
<div class="modal-content"> <div class="header-modal text-center" ng-init="getAlternativeAmount(btx)">
<div class="header-modal text-center" ng-init="getAlternativeAmount(btx)"> <div ng-show="btx.action != 'invalid'">
<div ng-show="btx.action != 'invalid'"> <div ng-show="btx.action == 'received'">
<div ng-show="btx.action == 'received'"> <img src="img/icon-receive-history.svg" alt="sync" width="50">
<img src="img/icon-receive-history.svg" alt="sync" width="50"> <p class="m0 text-gray size-14" translate>Received</p>
<p class="m0 text-gray size-14" translate>Received</p>
</div>
<div ng-show="btx.action == 'sent'">
<img src="img/icon-sent-history.svg" alt="sync" width="50">
<p class="m0 text-gray size-14" translate>Sent</p>
</div>
<div ng-show="btx.action == 'moved'">
<img src="img/icon-moved.svg" alt="sync" width="50">
<p class="m0 text-gray size-14" translate>Moved</p>
</div>
<div class="size-36" copy-to-clipboard="btx.amountStr">
<span class="enable_text_select">{{btx.amountStr}}</span>
</div>
<div class="alternative-amount" ng-click="showRate=!showRate" ng-init="showRate = false">
<span class="label gray radius" ng-show="!showRate && alternativeAmountStr">
{{alternativeAmountStr}}
</span>
<span class="size-12" ng-show="showRate && alternativeAmountStr">
{{rateStr}} ({{rateDate | amDateFormat:'MM/DD/YYYY HH:mm a'}})
</span>
</div>
</div> </div>
<div ng-show="btx.action == 'invalid'"> <div ng-show="btx.action == 'sent'">
- <img src="img/icon-sent-history.svg" alt="sync" width="50">
<p class="m0 text-gray size-14" translate>Sent</p>
</div>
<div ng-show="btx.action == 'moved'">
<img src="img/icon-moved.svg" alt="sync" width="50">
<p class="m0 text-gray size-14" translate>Moved</p>
</div>
<div class="size-36" copy-to-clipboard="btx.amountStr">
<span class="enable_text_select">{{btx.amountStr}}</span>
</div>
<div class="alternative-amount" ng-click="showRate=!showRate" ng-init="showRate = false">
<span class="label gray radius" ng-show="!showRate && alternativeAmountStr">
{{alternativeAmountStr}}
</span>
<span class="size-12" ng-show="showRate && alternativeAmountStr">
{{rateStr}} ({{rateDate | amDateFormat:'MM/DD/YYYY HH:mm a'}})
</span>
</div> </div>
</div> </div>
<div ng-show="btx.action == 'invalid'">
-
</div>
</div>
<h4 class="title m0" translate>Details</h4> <ul class="list">
<div class="item item-divider" translate>Details</div>
<ul class="no-bullet size-14 m0"> <li ng-if="!btx.hasMultiplesOutputs && btx.addressTo && btx.addressTo != 'N/A'" class="item"
<li ng-if="!btx.hasMultiplesOutputs && btx.addressTo && btx.addressTo != 'N/A'" class="line-b p10 oh" copy-to-clipboard="btx.addressTo">
copy-to-clipboard="btx.addressTo"> <span class="text-gray" translate>To</span>
<span class="text-gray" translate>To</span> <span class="right">
<span class="right"> <span ng-if="btx.merchant">
<span ng-if="btx.merchant"> <span ng-show="btx.merchant.pr.ca"><i class="fi-lock color-greeni"></i> {{btx.merchant.domain}}</span>
<span ng-show="btx.merchant.pr.ca"><i class="fi-lock color-greeni"></i> {{btx.merchant.domain}}</span> <span ng-show="!btx.merchant.pr.ca"><i class="fi-unlock color-yellowi"></i> {{btx.merchant.domain}}</span>
<span ng-show="!btx.merchant.pr.ca"><i class="fi-unlock color-yellowi"></i> {{btx.merchant.domain}}</span>
</span>
<span ng-if="!btx.merchant">
<span ng-show="btx.labelTo">{{btx.labelTo}}</span>
<contact ng-show="!btx.labelTo" class="enable_text_select" address="{{btx.addressTo}}"></contact>
</span>
</span> </span>
</li> <span ng-if="!btx.merchant">
<span ng-show="btx.labelTo">{{btx.labelTo}}</span>
<li ng-show="btx.hasMultiplesOutputs" class="line-b p10 oh" <contact ng-show="!btx.labelTo" class="enable_text_select" address="{{btx.addressTo}}"></contact>
ng-click="showMultiplesOutputs = !showMultiplesOutputs">
<span class="text-gray" translate>Recipients</span>
<span class="right">{{btx.recipientCount}}
<i ng-show="showMultiplesOutputs" class="icon-arrow-up3 size-24"></i>
<i ng-show="!showMultiplesOutputs" class="icon-arrow-down3 size-24"></i>
</span> </span>
</li> </span>
</li>
<div class="line-b" ng-show="btx.hasMultiplesOutputs && showMultiplesOutputs" <li ng-show="btx.hasMultiplesOutputs" class="item"
ng-repeat="output in btx.outputs" ng-click="showMultiplesOutputs = !showMultiplesOutputs">
ng-include="'views/includes/output.html'"> <span class="text-gray" translate>Recipients</span>
</div> <span class="right">{{btx.recipientCount}}
<i ng-show="showMultiplesOutputs" class="icon-arrow-up3 size-24"></i>
<i ng-show="!showMultiplesOutputs" class="icon-arrow-down3 size-24"></i>
</span>
</li>
<li ng-if="btx.action == 'invalid'" class="line-b p10 oh"> <div class="item" ng-show="btx.hasMultiplesOutputs && showMultiplesOutputs"
<span class="right" translate> ng-repeat="output in btx.outputs"
This transaction has become invalid; possibly due to a double spend attempt. ng-include="'views/includes/output.html'">
</span>
</li>
<li ng-if="btx.time" class="line-b p10 oh">
<span class="text-gray" translate>Date</span>
<span class="right enable_text_select">
<time>{{ btx.time * 1000 | amDateFormat:'MM/DD/YYYY HH:mm a'}}</time>
<time>({{ btx.time * 1000 | amTimeAgo}})</time>
</span>
</li>
<li class="line-b p10" ng-show="btx.action != 'received'"
copy-to-clipboard="btx.feeStr">
<span class="text-gray" translate>Fee</span>
<span class="right enable_text_select">{{btx.feeStr}}</span>
</li>
<li class="line-b p10 oh" ng-if="btx.message && btx.action != 'received'"
copy-to-clipboard="btx.message">
<span class="text-gray" translate>Description</span>
<span class="right enable_text_select">{{btx.message}}</span>
</li>
<li ng-if="btx.merchant" class="line-b p10 oh"
copy-to-clipboard="btx.merchant.pr.pd.memo">
<span class="text-gray" translate>Merchant message</span>
<span class="right enable_text_select">
{{btx.merchant.pr.pd.memo}}
</span>
</li>
<li ng-if="btx.time" class="line-b p10 oh">
<span class="text-gray" translate>Confirmations</span>
<span class="right" >
<span class="text-warning" ng-show="!btx.confirmations || btx.confirmations == 0" translate>
Unconfirmed
</span>
<span class="label gray radius" ng-show="btx.confirmations>0 && !btx.safeConfirmed">
{{btx.confirmations}}
</span>
<span class="label gray radius" ng-show="btx.safeConfirmed">
{{btx.safeConfirmed}}
</span>
</span>
</li>
<li class="p10 oh" ng-show="btx.note && btx.note.body">
<span class="text-gray" translate>Comment</span>
<span class="right enable_text_select">{{btx.note.body}}</span><br>
<span class="right text-italic text-gray size-12">
<span translate>Edited by</span> <span>{{btx.note.editedByName}}</span>,
<time>{{btx.note.editedOn * 1000 | amTimeAgo}}</time></span>
</span>
</li>
</ul>
<div ng-if="btx.actions[0] && isShared">
<h4 class="title m0" translate>Participants</h4>
<ul class="no-bullet size-14 m0">
<li class="line-b p10 text-gray" ng-repeat="c in btx.actions">
<i class="icon-contact size-24"></i>
<span class="right">
<i ng-if="c.type == 'reject'" class="fi-x icon-sign x db"></i>
<i ng-if="c.type == 'accept'" class="fi-check icon-sign check db"></i>
</span>
{{c.copayerName}} <span ng-if="c.copayerId == copayerId">({{'Me'|translate}})</span>
</li>
</ul>
</div> </div>
<div ng-show="btx.txid" class="tx-details-blockchain"> <li ng-if="btx.action == 'invalid'" class="item">
<div class="text-center m20t"> <span class="right" translate>
<button class="button button-positive" ng-click="openExternalLink('https://' + This transaction has become invalid; possibly due to a double spend attempt.
(getShortNetworkName() == 'test' ? 'test-' : '') + 'insight.bitpay.com/tx/' + btx.txid)"> </span>
<span class="text-gray" translate>See it on the blockchain</span> </li>
</button>
<button class="button button-positive" ng-click="showCommentPopup()"> <li ng-if="btx.time" class="item">
<span class="text-gray" translate ng-show="!btx.note">Add comment</i></span> <span class="text-gray" translate>Date</span>
<span class="text-gray" translate ng-show="btx.note">Edit comment</span> <span class="right enable_text_select">
</button> <time>{{ btx.time * 1000 | amDateFormat:'MM/DD/YYYY HH:mm a'}}</time>
</div> <time>({{ btx.time * 1000 | amTimeAgo}})</time>
</span>
</li>
<li class="item" ng-show="btx.action != 'received'"
copy-to-clipboard="btx.feeStr">
<span class="text-gray" translate>Fee</span>
<span class="right enable_text_select">{{btx.feeStr}}</span>
</li>
<li class="item" ng-if="btx.message && btx.action != 'received'"
copy-to-clipboard="btx.message">
<span class="text-gray" translate>Description</span>
<span class="right enable_text_select">{{btx.message}}</span>
</li>
<li ng-if="btx.merchant" class="item"
copy-to-clipboard="btx.merchant.pr.pd.memo">
<span class="text-gray" translate>Merchant message</span>
<span class="right enable_text_select">
{{btx.merchant.pr.pd.memo}}
</span>
</li>
<li ng-if="btx.time" class="item">
<span class="text-gray" translate>Confirmations</span>
<span class="right" >
<span class="text-warning" ng-show="!btx.confirmations || btx.confirmations == 0" translate>
Unconfirmed
</span>
<span class="label gray radius" ng-show="btx.confirmations>0 && !btx.safeConfirmed">
{{btx.confirmations}}
</span>
<span class="label gray radius" ng-show="btx.safeConfirmed">
{{btx.safeConfirmed}}
</span>
</span>
</li>
<li class="item" ng-show="btx.note && btx.note.body">
<span class="text-gray" translate>Comment</span>
<span class="right enable_text_select">{{btx.note.body}}</span><br>
<span class="right text-italic text-gray size-12">
<span translate>Edited by</span> <span>{{btx.note.editedByName}}</span>,
<time>{{btx.note.editedOn * 1000 | amTimeAgo}}</time></span>
</span>
</li>
</ul>
<div class="list" ng-if="btx.actions[0] && isShared">
<div class="item item-divider" translate>Participants</div>
<div class="item" ng-repeat="c in btx.actions">
<span class="item-note">
<i ng-if="c.type == 'reject'" class="fi-x icon-sign x db"></i>
<i ng-if="c.type == 'accept'" class="fi-check icon-sign check db"></i>
</span>
{{c.copayerName}} <span ng-if="c.copayerId == copayerId">({{'Me'|translate}})</span>
</div>
</div>
<div ng-show="btx.txid" class="row">
<div class="col">
<button class="button button-block button-positive" ng-click="openExternalLink('https://' +
(getShortNetworkName() == 'test' ? 'test-' : '') + 'insight.bitpay.com/tx/' + btx.txid)">
<span class="text-gray" translate>See it on the blockchain</span>
</button>
</div>
<div class="col">
<button class="button button-block button-positive" ng-click="showCommentPopup()">
<span class="text-gray" translate ng-show="!btx.note">Add comment</i></span>
<span class="text-gray" translate ng-show="btx.note">Edit comment</span>
</button>
</div> </div>
</div> </div>
</ion-content> </ion-content>

View file

@ -1,118 +1,102 @@
<ion-modal-view ng-controller="txpDetailsController"> <ion-modal-view ng-controller="txpDetailsController">
<ion-header-bar align-title="center" class="tab-bar"> <ion-header-bar align-title="center" class="bar-royal" ng-style="{'background-color':color}">
<div class="left-small"> <button class="button button-clear" ng-click="close()">
<a ng-click="close()" class="p10"> Close
<span class="text-close" translate>Close</span> </button>
</a> <div class="title" translate>
Payment Proposal
</div> </div>
<h1 class="title ellipsis" translate>Payment Proposal</h1>
</ion-header-bar> </ion-header-bar>
<ion-content ng-style="{'background-color': '#F6F7F9'}" ng-init="updateCopayerList()"> <ion-content ng-init="updateCopayerList()">
<div class="list card">
<ul>
<li class="item" >
<div class="payment-proposal-head" ng-style="{'background-color':color}"> <div class="payment-proposal-head" ng-style="{'background-color':color}">
<div class="size-36">{{tx.amountStr}}</div> <div class="size-36">{{tx.amountStr}}</div>
<div class="size-14 text-light" ng-show="tx.alternativeAmountStr">{{tx.alternativeAmountStr}}</div> <div class="size-14 text-light" ng-show="tx.alternativeAmountStr">{{tx.alternativeAmountStr}}</div>
<i class="db fi-arrow-down size-24 m10v"></i> <i class="icon ion-ios-arrow-thin-down"></i>
<span class="payment-proposal-to" copy-to-clipboard="tx.toAddress"> <span class="payment-proposal-to" copy-to-clipboard="tx.toAddress">
<i class="fi-bitcoin left"></i>
<contact ng-if="!tx.hasMultiplesOutputs" class="dib enable_text_select ellipsis m5t m5b size-14" address="{{tx.toAddress}}"></contact> <contact ng-if="!tx.hasMultiplesOutputs" class="dib enable_text_select ellipsis m5t m5b size-14" address="{{tx.toAddress}}"></contact>
<span ng-if="tx.hasMultiplesOutputs" translate>Multiple recipients</span> <span ng-if="tx.hasMultiplesOutputs" translate>Multiple recipients</span>
</span> </span>
</div> </div>
</li>
<li class="item">
<div class="row" ng-if="tx.removed"> <div class="row" ng-if="tx.removed">
<div class="column m20t text-center text-warning size-12" translate> <div class="column m20t text-center text-warning size-12" translate>
The payment was removed by creator The payment was removed by creator
</div>
</div> </div>
</li> </div>
<li class="item">
<div class="button-bar" ng-if="tx.pendingForUs"> <div class="button-bar" ng-if="tx.pendingForUs">
<button class="button button-assertive button-block" ng-click="reject()" ng-disabled="loading" ng-show="isShared"> <button class="button button-assertive button-block" ng-click="reject()" ng-disabled="loading" ng-show="isShared">
<i class="fi-x"></i> <i class="fi-x"></i>
<span translate>Reject</span> <span translate>Reject</span>
</button> </button>
<button class="button button-balanced button-block" ng-click="sign()" ng-style="{'background-color':color}" ng-disabled="loading || paymentExpired" ng-show="canSign"> <button class="button button-balanced button-block" ng-click="sign()" ng-style="{'background-color':color}" ng-disabled="loading || paymentExpired" ng-show="canSign">
<i class="fi-check"></i> <i class="fi-check"></i>
<span translate>Accept</span> <span translate>Accept</span>
</button>
</div>
<div 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="button button-balanced button-block" ng-style="{'background-color':color}" ng-click="broadcast(tx)" ng-disabled="loading">
<i class="fi-upload-cloud"></i>
<span translate>Broadcast Payment</span>
</button> </button>
</div> </div>
<div ng-show="tx.status=='accepted' && tx.isGlidera" >
</li> <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>
<li class="item">
<div 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="button button-balanced button-block" 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="balanced" ng-show="tx.status == 'broadcasted'" translate>Payment Sent</div>
<div class="assertive" ng-show="tx.status=='rejected'" translate>Payment Rejected</div>
</div> </div>
</li> <div class="balanced" ng-show="tx.status == 'broadcasted'" translate>Payment Sent</div>
<li class="item"> <div class="assertive" ng-show="tx.status=='rejected'" translate>Payment Rejected</div>
<h4 class="title m0" translate>Details</h4> </div>
<ul class="no-bullet size-14 m0"> <ul class="list">
<li class="line-b p10 oh" ng-show="tx.message"> <div class="item item-divider" translate>Details</div>
<li class="item" ng-show="tx.message">
<span class="text-gray" translate>Description</span> <span class="text-gray" translate>Description</span>
<span class="right">{{tx.message}}</span> <span class="right">{{tx.message}}</span>
</li> </li>
<li ng-show="tx.hasMultiplesOutputs" class="line-b p10 oh" ng-click="showMultiplesOutputs = !showMultiplesOutputs"> <li ng-show="tx.hasMultiplesOutputs" class="item" ng-click="showMultiplesOutputs = !showMultiplesOutputs">
<span class="text-gray" translate>Recipients</span> <span class="text-gray" translate>Recipients</span>
<span class="right">{{tx.recipientCount}} <span class="right">{{tx.recipientCount}}
<i ng-show="showMultiplesOutputs" class="icon-arrow-up3 size-24"></i> <i ng-show="showMultiplesOutputs" class="icon ion-ios-arrow-up"></i>
<i ng-show="!showMultiplesOutputs" class="icon-arrow-down3 size-24"></i> <i ng-show="!showMultiplesOutputs" class="icon ion-ios-arrow-up"></i>
</span> </span>
</li> </li>
<div class="line-b" ng-show="tx.hasMultiplesOutputs && showMultiplesOutputs" <div class="item" ng-show="tx.hasMultiplesOutputs && showMultiplesOutputs"
ng-repeat="output in tx.outputs" ng-include="'views/includes/output.html'"> ng-repeat="output in tx.outputs" ng-include="'views/includes/output.html'">
</div> </div>
<li class="line-b p10"> <li class="item">
<span class="text-gray" translate>Fee</span> <span class="text-gray" translate>Fee</span>
<span class="right">{{tx.feeStr}}</span> <span class="right">{{tx.feeStr}}</span>
</li> </li>
<li class="line-b p10"> <li class="item">
<span class="text-gray" translate>Time</span> <span class="text-gray" translate>Time</span>
<span class="right"> <span class="right">
<time>{{ (tx.ts || tx.createdOn ) * 1000 | amTimeAgo}}</time> <time>{{ (tx.ts || tx.createdOn ) * 1000 | amTimeAgo}}</time>
</span> </span>
</li> </li>
<li class="line-b p10 oh"> <li class="item">
<span class="text-gray" translate>Created by</span> <span class="text-gray" translate>Created by</span>
<span class="right">{{tx.creatorName}}</span> <span class="right">{{tx.creatorName}}</span>
</li> </li>
</ul>
<div class="p10 text-center size-12" ng-show="!currentSpendUnconfirmed && tx.hasUnconfirmedInputs"> <div class="item" ng-show="!currentSpendUnconfirmed && tx.hasUnconfirmedInputs">
<span class="text-warning" translate>Warning: this transaction has unconfirmed inputs</span> <span class="text-warning" translate>Warning: this transaction has unconfirmed inputs</span>
</div> </div>
</li>
<li class="item">
<div ng-if="tx.paypro"> <div ng-if="tx.paypro">
<h4 class="title m0" translate>Payment details</h4> <div class="item item-divider" translate>Payment details</div>
<ul class="no-bullet size-14 m0"> <li class="item">
<li class="line-b p10">
<span class="text-gray" translate>To</span> <span class="text-gray" translate>To</span>
<span class="right"> <span class="right">
<span> <span>
@ -122,56 +106,48 @@
<contact address="{{tx.toAddress}}" ng-hide="tx.merchant"></contact> <contact address="{{tx.toAddress}}" ng-hide="tx.merchant"></contact>
</span> </span>
</li> </li>
<li class="line-b p10" ng-if="paymentExpired"> <li class="item" ng-if="paymentExpired">
<span class="text-gray" translate>Expired</span> <span class="text-gray" translate>Expired</span>
<span class="right text-alert"> <span class="right text-alert">
<time>{{tx.paypro.expires * 1000 | amTimeAgo }}</time> <time>{{tx.paypro.expires * 1000 | amTimeAgo }}</time>
</span> </span>
</li> </li>
<li class="line-b p10" ng-if="!paymentExpired"> <li class="item" ng-if="!paymentExpired">
<span class="text-gray" translate>Expires</span> <span class="text-gray" translate>Expires</span>
<span class="right"> <span class="right">
<time>{{expires}}</time> <time>{{expires}}</time>
</span> </span>
</li> </li>
<li class="line-b p10"> <li class="item">
<span class="text-gray" translate>Merchant Message</span> <span class="text-gray" translate>Merchant Message</span>
<span class="db">{{tx.paypro.pr.pd.memo}}</span> <span class="db">{{tx.paypro.pr.pd.memo}}</span>
</li> </li>
</ul> </div>
</div>
</li> <div ng-if="tx.actions[0] && !txRejected && !txBroadcasted">
<li class="item" ng-if="tx.actions[0] && !txRejected && !txBroadcasted"> <div class="item item-divider">
<h4 class="title m0"> <div class="right size-12 text-gray m10r">
<div class="right size-12 text-gray m10r"> {{tx.requiredSignatures}}/{{tx.walletN}}
{{tx.requiredSignatures}}/{{tx.walletN}} </div>
<span translate>Participants</span>
</div> </div>
<span translate>Participants</span> <li class="item" ng-repeat="ac in tx.actions">
</h4> <span class="item-note">
<ul class="no-bullet size-14 m0"> <i ng-if="ac.type == 'reject'" class="icon ion-ios-close-empty"></i>
<li class="line-b p10 text-gray" ng-repeat="ac in tx.actions"> <i ng-if="ac.type == 'accept'" class="icon ion-ios-checkmark-empty"></i>
<i class="icon-contact size-24"></i>
<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>
</span> </span>
{{ac.copayerName}} <span ng-if="ac.copayerId == copayerId">({{'Me'|translate}})</span> {{ac.copayerName}} <span ng-if="ac.copayerId == copayerId">({{'Me'|translate}})</span>
</li> </li>
</ul>
</div>
</li>
<li class="item" ng-if="tx.canBeRemoved || (tx.status == 'accepted' && !tx.broadcastedOn)">
<div class="text-gray size-12 m20b" ng-show="!tx.isGlidera && isShared" translate>
* A payment proposal can be deleted if 1) you are the creator, and no other copayer has signed, or 2) 24 hours have passed since the proposal was created.
</div> </div>
<button class="button button-assertive button-block" ng-click="remove()" ng-disabled="loading"> </ul>
<i class="fi-trash size-14 m5r"></i> <div class="m20t" ng-if="tx.canBeRemoved || (tx.status == 'accepted' && !tx.broadcastedOn)">
<span translate>Delete Payment Proposal</span> <div class="size-12 padding" ng-show="!tx.isGlidera && isShared" translate>
</button> * A payment proposal can be deleted if 1) you are the creator, and no other copayer has signed, or 2) 24 hours have passed since the proposal was created.
</li> </div>
</ul> <button class="button button-assertive button-block" ng-click="remove()" ng-disabled="loading">
<i class="fi-trash size-14 m5r"></i>
<span translate>Delete Payment Proposal</span>
</button>
</div> </div>
</ion-content> </ion-content>
</ion-modal-view> </ion-modal-view>

View file

@ -6,10 +6,9 @@
<ion-content ng-controller="tabSettingsController" ng-init="init()"> <ion-content ng-controller="tabSettingsController" ng-init="init()">
<div class="list"> <div class="list">
<div class="item item-divider"></div> <div class="item item-divider"></div>
<a class="item item-icon-left item-icon-right" ng-click="openAddressbookModal()"> <a class="item item-icon-left" ng-click="openAddressbookModal()">
<i class="icon ion-ios-book-outline"></i> <i class="icon ion-ios-book-outline"></i>
<span translate>Address Book</span> <span translate>Address Book</span>
<i class="icon nav-item-arrow-right"></i>
</a> </a>
<div class="item item-divider" translate>Preferences</div> <div class="item item-divider" translate>Preferences</div>

View file

@ -84,29 +84,23 @@
</div> </div>
<div ng-if="txps[0]"> <div class="card list" ng-if="txps[0]">
<h4 ng-show="requiresMultipleSignatures" class="title m0" translate>Payment Proposals</h4> <div class="item item-heading" translate>
<h4 ng-show="!requiresMultipleSignatures" class="title m0" translate>Unsent transactions</h4> <span ng-show="requiresMultipleSignatures" translate>Payment Proposals</span>
<div class="list card"> <span ng-show="!requiresMultipleSignatures" translate>Unsent transactions</span>
<ul> </div>
<li ng-repeat="tx in txps" class="item item-icon-left" ng-click="openTxpModal(tx)"> <div ng-repeat="tx in txps" class="item item-icon-left" ng-click="openTxpModal(tx)">
<span ng-include="'views/includes/txp.html'"></span> <span ng-include="'views/includes/txp.html'"></span>
</li> </div>
</ul> <div class="item item-footer" ng-show="status.lockedBalanceSat">
<span translate>Total Locked Balance</span>:
<div ng-show="lockedBalanceSat"> <b>{{status.lockedBalanceStr}} </b>
<span translate>Total Locked Balance</span>: <span> {{status.lockedBalanceAlternative}} {{status.alternativeIsoCode}} </span>
<b>{{lockedBalanceStr}} </b>
<span> {{lockedBalanceAlternative}} {{alternativeIsoCode}} </span>
</div>
</div> </div>
</div> </div>
<!-- Transactions --> <!-- Transactions -->
<h4 class="title" ng-show="!notAuthorized">
<span translate>Activity</span>
</h4>
<div class="oh pr m20t text-gray size-12 text-center" <div class="oh pr m20t text-gray size-12 text-center"
ng-show="!txHistory[0] && !updatingTxHistory && !txHistoryError && !updateStatusError && !notAuthorized" ng-show="!txHistory[0] && !updatingTxHistory && !txHistoryError && !updateStatusError && !notAuthorized"
@ -139,41 +133,9 @@
</div> </div>
</div> </div>
<div class="list"> <div class="card list" ng-show="txHistory[0]">
<div class="row item" ng-repeat="btx in txHistory track by btx.txid" ng-click="openTxModal(btx)"> <div class="item" ng-repeat="btx in txHistory track by btx.txid" ng-click="openTxModal(btx)">
<div class="col col-10"> <span class="item-note text-right">
<img src="img/icon-receive-history.svg" alt="sync" width="40" ng-if="btx.action == 'received'">
<img src="img/icon-sent-history.svg" alt="sync" width="40" ng-if="btx.action == 'sent'">
<img src="img/icon-moved.svg" alt="sync" width="40" ng-if="btx.action == 'moved'">
</div>
<div class="col col-50">
<div class="padding" ng-if="btx.action == 'received'">
<span class="ellipsis">
<h2 ng-if="btx.note.body">{{btx.note.body}}</h2>
<h2 ng-if="!btx.note.body" translate> Received</h2>
</span>
</div>
<div class="padding" ng-if="btx.action == 'sent'">
<span class="ellipsis">
<h2 ng-if="btx.message">{{btx.message}}</h2>
<h2 ng-if="!btx.message && btx.note.body">{{btx.note.body}}</h2>
<h2 ng-if="!btx.message && !btx.note.body && wallet.addressbook[btx.addressTo]">{{wallet.addressbook[btx.addressTo]}}</h2>
<h2 ng-if="!btx.message && !btx.note.body && !wallet.addressbook[btx.addressTo]" translate> Sent</h2>
</span>
</div>
<div class="padding" ng-if="btx.action == 'moved'">
<span class="ellipsis">
<h2 ng-if="btx.note.body">{{btx.note.body}}</h2>
<h2 ng-if="!btx.note.body" translate>Moved</h2>
</span>
</div>
<span class="label tu warning radius" ng-if="btx.action == 'invalid'" translate>Invalid</span>
</div>
<div class="col col-30 padding">
<span class="size-16" ng-class="{'text-bold': btx.recent}"> <span class="size-16" ng-class="{'text-bold': btx.recent}">
<span ng-if="btx.action == 'received'">+</span> <span ng-if="btx.action == 'received'">+</span>
<span ng-if="btx.action == 'sent'">-</span> <span ng-if="btx.action == 'sent'">-</span>
@ -191,11 +153,37 @@
Unconfirmed Unconfirmed
</span> </span>
</p> </p>
</div> </span>
<img class="left m10r" src="img/icon-receive-history.svg" alt="sync" width="40" ng-if="btx.action == 'received'">
<img class="left m10r" src="img/icon-sent-history.svg" alt="sync" width="40" ng-if="btx.action == 'sent'">
<img class="left m10r" src="img/icon-moved.svg" alt="sync" width="40" ng-if="btx.action == 'moved'">
<h2 class="p10t">
<div ng-if="btx.action == 'received'">
<span class="ellipsis">
<h2 ng-if="btx.note.body">{{btx.note.body}}</h2>
<h2 ng-if="!btx.note.body" translate> Received</h2>
</span>
</div>
<div ng-if="btx.action == 'sent'">
<span class="ellipsis">
<h2 ng-if="btx.message">{{btx.message}}</h2>
<h2 ng-if="!btx.message && btx.note.body">{{btx.note.body}}</h2>
<h2 ng-if="!btx.message && !btx.note.body && wallet.addressbook[btx.addressTo]">{{wallet.addressbook[btx.addressTo]}}</h2>
<h2 ng-if="!btx.message && !btx.note.body && !wallet.addressbook[btx.addressTo]" translate> Sent</h2>
</span>
</div>
<div ng-if="btx.action == 'moved'">
<span class="ellipsis">
<h2 ng-if="btx.note.body">{{btx.note.body}}</h2>
<h2 ng-if="!btx.note.body" translate>Moved</h2>
</span>
</div>
<span class="label tu warning radius" ng-if="btx.action == 'invalid'" translate>Invalid</span>
</h2>
<div class="col col-10 text-center">
<i class="icon ion-chevron-right"></i>
</div>
</div> </div>
<ion-infinite-scroll <ion-infinite-scroll

View file

@ -8,6 +8,10 @@
font-weight: bold; font-weight: bold;
} }
.item.item-footer {
font-weight: lighter;
}
.icon.list-add-button { .icon.list-add-button {
color: #666; color: #666;
font-size: 38px; font-size: 38px;

View file

@ -343,7 +343,7 @@ ul.wallet-selection.wallets {
position: absolute; position: absolute;
top: inherit; top: inherit;
left: 10px; left: 10px;
bottom: 26px; bottom: 15px;
font-size: 20px; font-size: 20px;
color: #fff; color: #fff;
} }

View file

@ -13,13 +13,17 @@
.amount { .amount {
width: 100%; width: 100%;
text-align: center; text-align: center;
padding: 2.5rem 1rem 1.5rem 1rem; padding: 2rem 1rem 1.5rem 1rem;
color: #fff; color: #fff;
height: 150px; min-height: 115px;
margin-bottom: 25px; margin-bottom: 10px;
&-alternative { &-alternative {
line-height: 48px; line-height: 36px;
}
strong {
line-height: 100%;
} }
} }
} }