ionic modals in coinbase and glidera and delete confirmation

This commit is contained in:
Gabriel Bazán 2016-06-10 15:16:02 -03:00
commit d2bdca00f4
28 changed files with 566 additions and 717 deletions

View file

@ -24,7 +24,7 @@
</div>
</div>
<div class="row m20t"
<div class="row m20ti"
ng-show="index.coinbaseAccount && !buy.buyInfo && !buy.receiveInfo">
<div class="columns">
@ -105,7 +105,7 @@
</div>
</div>
<div class="m20t row" ng-show="buy.receiveInfo && !buy.sellInfo && !buy.success">
<div class="m20ti row" ng-show="buy.receiveInfo && !buy.sellInfo && !buy.success">
<div class="columns">
<h1>Funds sent to Copay Wallet</h1>
<p class="size-12 text-gray">

View file

@ -10,7 +10,7 @@
</a>
</section>
<section class="right-small">
<section class="right-small" ng-show="index.coinbaseAccount">
<a class="p10" ng-click="$root.go('preferencesCoinbase')">
<i class="fi-widget size-24"></i>
</a>

View file

@ -1,16 +1,18 @@
<div class="m20tp text-center">
<div class="row">
<h1 class="text-center m20b p20h">Are you sure you would like to log out of your Coinbase account?</h1>
<p class="text-gray p20h">You will need to log back in to buy or sell bitcoin in Copay.</p>
<div class="large-6 medium-6 small-6 columns">
<button class="button light-gray expand outline round" ng-click="cancel()">
<i class="fi-arrow-left"></i> <span class="tu">Back</span>
</button>
<ion-modal-view ng-controller="coinbaseConfirmationController">
<div class="m20tp text-center">
<div class="row">
<h1 class="text-center m20b p20h">Are you sure you would like to log out of your Coinbase account?</h1>
<p class="text-gray p20h">You will need to log back in to buy or sell bitcoin in Copay.</p>
<div class="large-6 medium-6 small-6 columns">
<button class="button light-gray expand outline round" ng-click="cancel()">
<i class="fi-arrow-left"></i> <span class="tu">Back</span>
</button>
</div>
<div class="large-6 medium-6 small-6 columns">
<button class="button warning expand round" ng-click="ok()">
<span>Log out</span>
</button>
</div>
</div>
</div>
<div class="large-6 medium-6 small-6 columns">
<button class="button warning expand round" ng-click="ok()">
<span>Log out</span>
</button>
</div>
</div>
</div>
</ion-modal-view>

View file

@ -1,107 +1,109 @@
<nav class="tab-bar">
<section class="left-small">
<a ng-click="cancel()">
<i class="icon-arrow-left3 icon-back"></i>
<span class="text-back">Back</span>
</a>
</section>
<section class="middle tab-bar-section">
<h1 class="title ellipsis">
Details
</h1>
</section>
</nav>
<ion-modal-view ng-controller="coinbaseTxDetailsController">
<nav class="tab-bar" ng-style="{'background-color': '#2b71b1'}">
<section class="left-small">
<a ng-click="cancel()">
<i class="icon-arrow-left3 icon-back"></i>
<span class="text-back">Back</span>
</a>
</section>
<section class="middle tab-bar-section">
<h1 class="title ellipsis">
Details
</h1>
</section>
</nav>
<div class="modal-content fix-modals-touch"
ng-swipe-disable-mouse
ng-swipe-right="cancel()">
<div class="header-modal bg-gray text-center">
<div class="p20">
<img src="img/bought.svg" alt="bought" width="65" ng-show="(tx.type == 'buy' || (tx.type == 'send' && tx.to)) && tx.status == 'completed'">
<img src="img/bought-pending.svg" alt="bought" width="65"
ng-show="(tx.type == 'buy' || (tx.type == 'send' && tx.to)) && tx.status != 'completed'">
<img src="img/sold.svg" alt="bought" width="65" ng-show="tx.type == 'sell' && tx.status == 'completed'">
<img src="img/sold-pending.svg" alt="bought" width="65"
ng-show="(tx.type == 'sell' || (tx.type == 'send' && tx.from)) && tx.status != 'completed'">
<ion-content overflow-scroll="true">
<div class="modal-content fix-modals-touch">
<div class="header-modal bg-gray text-center">
<div class="p20">
<img src="img/bought.svg" alt="bought" width="65" ng-show="(tx.type == 'buy' || (tx.type == 'send' && tx.to)) && tx.status == 'completed'">
<img src="img/bought-pending.svg" alt="bought" width="65"
ng-show="(tx.type == 'buy' || (tx.type == 'send' && tx.to)) && tx.status != 'completed'">
<img src="img/sold.svg" alt="bought" width="65" ng-show="tx.type == 'sell' && tx.status == 'completed'">
<img src="img/sold-pending.svg" alt="bought" width="65"
ng-show="(tx.type == 'sell' || (tx.type == 'send' && tx.from)) && tx.status != 'completed'">
</div>
<div ng-show="tx.status == 'completed'">
<span ng-show="tx.type == 'buy' || tx.type == 'send'">Bought</span>
<span ng-show="tx.type == 'sell'">Sold</span>
</div>
<div ng-show="tx.type == 'send' && (tx.to || tx.from) && tx.status != 'completed'">
<span ng-show="tx.to">Receiving purchased bitcoin</span>
<span ng-show="tx.from">Sending bitcoin to sell</span>
</div>
<div ng-show="(tx.type == 'sell' || tx.type == 'buy') && tx.status != 'completed'">
<span ng-show="tx.type == 'buy'">Buying bitcoin</span>
<span ng-show="tx.type == 'sell'">Selling bitcoin</span>
</div>
<div class="size-24 text-bold">
<span ng-if="tx.type == 'sell' || (tx.type == 'send' && tx.from)">-</span>{{tx.amount.amount.replace('-','')}}
{{tx.amount.currency}}
</div>
<div class="label gray radius m10b">
<span ng-if="tx.type == 'sell' || (tx.type == 'send' && tx.from)">-</span>{{tx.native_amount.amount.replace('-','')}}
{{tx.native_amount.currency}}
</div>
</div>
<div class="m20b box-notification" ng-show="tx.error">
<ul class="no-bullet m0 text-warning size-12">
<li ng-repeat="err in tx.error.errors" ng-bind-html="err.message"></li>
</ul>
</div>
<ul class="no-bullet size-14">
<li ng-show="tx.details && tx.status != 'pending'" class="line-b p10 oh">
<span class="text-gray">{{tx.details.title}}</span>
<span class="right">{{tx.details.subtitle}}</span>
</li>
<li class="line-b p10 oh">
<span class="text-gray">Status</span>
<span class="text-success right" ng-if="tx.status == 'completed'">Completed</span>
<span class="text-info right" ng-if="tx.status == 'pending'">Pending</span>
<span class="text-warning right" ng-if="tx.status == 'error'">Error</span>
</li>
<li ng-show="tx.created_at" class="line-b p10 oh">
<span class="text-gray">Date</span>
<span class="right">{{tx.created_at | amCalendar}}</span>
</li>
<li ng-show="tx.price_sensitivity" class="line-b p10 oh">
<span class="text-gray">Price Sensitivity</span>
<span class="right">{{tx.price_sensitivity.name}}</span>
</li>
<li ng-show="tx.sell_price_amount" class="line-b p10 oh">
<span class="text-gray">Sell Price</span>
<span class="right">{{tx.sell_price_amount}} {{tx.sell_price_currency}}</span>
</li>
<li ng-show="tx.description" class="line-b p10 oh">
<span class="text-gray" ng-show="tx.from && tx.type == 'send'">Sent bitcoin from</span>
<span class="text-gray" ng-show="tx.to && tx.type == 'send'">Receive bitcoin in</span>
<span class="right text-bold">{{tx.description}}</span>
</li>
</ul>
<div class="row m20t p20t line-t" ng-show="tx.status == 'error'">
<div class="columns">
<p class="text-center size-12 text-gray">
This action will remove the transaction.
</p>
<button class="button outline round dark-gray expand tiny"
ng-click="remove();"
ng-disabled="loading">
<i class="fi-x"></i>
Remove
</button>
</div>
</div>
<div class="extra-margin-bottom"></div>
</div>
<div ng-show="tx.status == 'completed'">
<span ng-show="tx.type == 'buy' || tx.type == 'send'">Bought</span>
<span ng-show="tx.type == 'sell'">Sold</span>
</div>
<div ng-show="tx.type == 'send' && (tx.to || tx.from) && tx.status != 'completed'">
<span ng-show="tx.to">Receiving purchased bitcoin</span>
<span ng-show="tx.from">Sending bitcoin to sell</span>
</div>
<div ng-show="(tx.type == 'sell' || tx.type == 'buy') && tx.status != 'completed'">
<span ng-show="tx.type == 'buy'">Buying bitcoin</span>
<span ng-show="tx.type == 'sell'">Selling bitcoin</span>
</div>
<div class="size-24 text-bold">
<span ng-if="tx.type == 'sell' || (tx.type == 'send' && tx.from)">-</span>{{tx.amount.amount.replace('-','')}}
{{tx.amount.currency}}
</div>
<div class="label gray radius m10b">
<span ng-if="tx.type == 'sell' || (tx.type == 'send' && tx.from)">-</span>{{tx.native_amount.amount.replace('-','')}}
{{tx.native_amount.currency}}
</div>
</div>
<div class="m20b box-notification" ng-show="tx.error">
<ul class="no-bullet m0 text-warning size-12">
<li ng-repeat="err in tx.error.errors" ng-bind-html="err.message"></li>
</ul>
</div>
<ul class="no-bullet size-14">
<li ng-show="tx.details && tx.status != 'pending'" class="line-b p10 oh">
<span class="text-gray">{{tx.details.title}}</span>
<span class="right">{{tx.details.subtitle}}</span>
</li>
<li class="line-b p10 oh">
<span class="text-gray">Status</span>
<span class="text-success right" ng-if="tx.status == 'completed'">Completed</span>
<span class="text-info right" ng-if="tx.status == 'pending'">Pending</span>
<span class="text-warning right" ng-if="tx.status == 'error'">Error</span>
</li>
<li ng-show="tx.created_at" class="line-b p10 oh">
<span class="text-gray">Date</span>
<span class="right">{{tx.created_at | amCalendar}}</span>
</li>
<li ng-show="tx.price_sensitivity" class="line-b p10 oh">
<span class="text-gray">Price Sensitivity</span>
<span class="right">{{tx.price_sensitivity.name}}</span>
</li>
<li ng-show="tx.sell_price_amount" class="line-b p10 oh">
<span class="text-gray">Sell Price</span>
<span class="right">{{tx.sell_price_amount}} {{tx.sell_price_currency}}</span>
</li>
<li ng-show="tx.description" class="line-b p10 oh">
<span class="text-gray" ng-show="tx.from && tx.type == 'send'">Sent bitcoin from</span>
<span class="text-gray" ng-show="tx.to && tx.type == 'send'">Receive bitcoin in</span>
<span class="right text-bold">{{tx.description}}</span>
</li>
</ul>
<div class="row m20t p20t line-t" ng-show="tx.status == 'error'">
<div class="columns">
<p class="text-center size-12 text-gray">
This action will remove the transaction.
</p>
<button class="button outline round dark-gray expand tiny"
ng-click="remove(tx);"
ng-disabled="loading">
<i class="fi-x"></i>
Remove
</button>
</div>
</div>
<div class="extra-margin-bottom"></div>
</div>
</ion-content>
</ion-modal-view>

View file

@ -1,16 +1,18 @@
<div class="m20tp text-center">
<div class="row">
<h1 class="text-center m20b p20">{{title|translate}}</h1>
<div class="large-6 medium-6 small-6 columns">
<button class="button warning expand round" ng-disabled="loading" ng-click="ok()">
<i class="fi-trash"></i> <span translate>Yes</span>
</button>
<ion-modal-view ng-controller="confirmationController">
<div class="m20tp text-center">
<div class="row">
<h1 class="text-center m20b p20">{{title|translate}}</h1>
<div class="large-6 medium-6 small-6 columns">
<button class="button warning expand round" ng-disabled="loading" ng-click="ok()">
<i class="fi-trash"></i> <span translate>Yes</span>
</button>
</div>
<div class="large-6 medium-6 small-6 columns">
<button class="button light-gray expand outline round" ng-disabled="loading"
ng-click="cancel()">
<i class="fi-x"></i> <span class="tu" translate>Cancel</span>
</button>
</div>
</div>
<div class="large-6 medium-6 small-6 columns">
<button class="button light-gray expand outline round" ng-disabled="loading"
ng-click="cancel()">
<i class="fi-x"></i> <span class="tu" translate>Cancel</span>
</button>
</div>
</div>
</div>
</ion-modal-view>

View file

@ -1,16 +1,18 @@
<div class="m20tp text-center">
<div class="row">
<h1 class="text-center m20b p20h">Are you sure you would like to log out of your Glidera account?</h1>
<p class="text-gray p20h">You will need to log back in to buy or sell bitcoin in Copay.</p>
<div class="large-6 medium-6 small-6 columns">
<button class="button light-gray expand outline round" ng-click="cancel()">
<i class="fi-arrow-left"></i> <span class="tu">Back</span>
</button>
<ion-modal-view ng-controller="glideraConfirmationController">
<div class="m20tp text-center">
<div class="row">
<h1 class="text-center m20b p20h">Are you sure you would like to log out of your Glidera account?</h1>
<p class="text-gray p20h">You will need to log back in to buy or sell bitcoin in Copay.</p>
<div class="large-6 medium-6 small-6 columns">
<button class="button light-gray expand outline round" ng-click="cancel()">
<i class="fi-arrow-left"></i> <span class="tu">Back</span>
</button>
</div>
<div class="large-6 medium-6 small-6 columns">
<button class="button warning expand round" ng-click="ok()">
<span>Log out</span>
</button>
</div>
</div>
</div>
<div class="large-6 medium-6 small-6 columns">
<button class="button warning expand round" ng-click="ok()">
<span>Log out</span>
</button>
</div>
</div>
</div>
</ion-modal-view>

View file

@ -1,68 +1,70 @@
<nav class="tab-bar">
<section class="left-small">
<a ng-click="cancel()">
<i class="icon-arrow-left3 icon-back"></i>
<span class="text-back">Back</span>
</a>
</section>
<section class="middle tab-bar-section">
<h1 class="title ellipsis">
Details
</h1>
</section>
</nav>
<ion-modal-view ng-controller="glideraTxDetailsController">
<nav class="tab-bar">
<section class="left-small">
<a ng-click="cancel()">
<i class="icon-arrow-left3 icon-back"></i>
<span class="text-back">Back</span>
</a>
</section>
<section class="middle tab-bar-section">
<h1 class="title ellipsis">
Details
</h1>
</section>
</nav>
<div class="modal-content fix-modals-touch"
ng-swipe-disable-mouse
ng-swipe-right="cancel()">
<div class="header-modal bg-gray text-center">
<div class="p20">
<img src="img/bought.svg" alt="bought" width="80" ng-show="tx.type == 'BUY' && tx.status == 'COMPLETE'">
<img src="img/bought-pending.svg" alt="bought" width="65" ng-show="tx.type == 'BUY' && tx.status == 'PROCESSING'">
<img src="img/sold.svg" alt="bought" width="80" ng-show="tx.type == 'SELL' && tx.status == 'COMPLETE'">
<img src="img/sold-pending.svg" alt="bought" width="65" ng-show="tx.type == 'SELL' && tx.status == 'PROCESSING'">
<ion-content overflow-scroll="true">
<div class="modal-content fix-modals-touch">
<div class="header-modal bg-gray text-center">
<div class="p20">
<img src="img/bought.svg" alt="bought" width="80" ng-show="tx.type == 'BUY' && tx.status == 'COMPLETE'">
<img src="img/bought-pending.svg" alt="bought" width="65" ng-show="tx.type == 'BUY' && tx.status == 'PROCESSING'">
<img src="img/sold.svg" alt="bought" width="80" ng-show="tx.type == 'SELL' && tx.status == 'COMPLETE'">
<img src="img/sold-pending.svg" alt="bought" width="65" ng-show="tx.type == 'SELL' && tx.status == 'PROCESSING'">
</div>
<span ng-show="tx.type == 'BUY'">Bought</span>
<span ng-show="tx.type == 'SELL'">Sold</span>
<b>{{tx.qty}}</b> BTC
<div class="size-36 m20b">
{{tx.subtotal|currency:'':2}} {{tx.currency}}
</div>
</div>
<ul class="no-bullet size-14">
<li class="line-b p10 oh">
<span class="text-gray">Status</span>
<span class="text-success right" ng-if="tx.status == 'COMPLETE'">Completed</span>
<span class="text-info right" ng-if="tx.status == 'PROCESSING'">Processing</span>
<span class="text-warning right" ng-if="tx.status == 'ERROR'">Error</span>
</li>
<li ng-show="tx.transactionDate" class="line-b p10 oh">
<span class="text-gray">Date</span>
<span class="right">{{tx.transactionDate | amCalendar}}</span>
</li>
<li ng-show="tx.price" class="line-b p10 oh">
<span class="text-gray">Exchange rate</span>
<span class="right">{{tx.price|currency:'':2}} {{tx.currency}}/BTC</span>
</li>
<li ng-show="tx.subtotal" class="line-b p10 oh">
<span class="text-gray">Subtotal</span>
<span class="right">{{tx.subtotal|currency:'':2}} {{tx.currency}}</span>
</li>
<li ng-show="tx.fees" class="line-b p10 oh">
<span class="text-gray">Fees</span>
<span class="right">{{tx.fees|currency:'':2}} {{tx.currency}}</span>
</li>
<li ng-show="tx.total" class="line-b p10 oh text-bold">
<span class="text-gray">Total</span>
<span class="right">{{tx.total|currency:'':2}} {{tx.currency}}</span>
</li>
</ul>
<div class="extra-margin-bottom"></div>
</div>
<span ng-show="tx.type == 'BUY'">Bought</span>
<span ng-show="tx.type == 'SELL'">Sold</span>
<b>{{tx.qty}}</b> BTC
<div class="size-36 m20b">
{{tx.subtotal|currency:'':2}} {{tx.currency}}
</div>
</div>
<ul class="no-bullet size-14">
<li class="line-b p10 oh">
<span class="text-gray">Status</span>
<span class="text-success right" ng-if="tx.status == 'COMPLETE'">Completed</span>
<span class="text-info right" ng-if="tx.status == 'PROCESSING'">Processing</span>
<span class="text-warning right" ng-if="tx.status == 'ERROR'">Error</span>
</li>
<li ng-show="tx.transactionDate" class="line-b p10 oh">
<span class="text-gray">Date</span>
<span class="right">{{tx.transactionDate | amCalendar}}</span>
</li>
<li ng-show="tx.price" class="line-b p10 oh">
<span class="text-gray">Exchange rate</span>
<span class="right">{{tx.price|currency:'':2}} {{tx.currency}}/BTC</span>
</li>
<li ng-show="tx.subtotal" class="line-b p10 oh">
<span class="text-gray">Subtotal</span>
<span class="right">{{tx.subtotal|currency:'':2}} {{tx.currency}}</span>
</li>
<li ng-show="tx.fees" class="line-b p10 oh">
<span class="text-gray">Fees</span>
<span class="right">{{tx.fees|currency:'':2}} {{tx.currency}}</span>
</li>
<li ng-show="tx.total" class="line-b p10 oh text-bold">
<span class="text-gray">Total</span>
<span class="right">{{tx.total|currency:'':2}} {{tx.currency}}</span>
</li>
</ul>
<div class="extra-margin-bottom"></div>
</div>
</ion-content>
</ion-modal-view>

View file

@ -1,42 +1,50 @@
<nav class="tab-bar">
<section class="left-small">
<a ng-click="cancel()" class="p10">
<span class="text-close">Close</span>
</a>
</section>
<ion-modal-view ng-controller="walletsController">
<nav class="tab-bar">
<section class="left-small">
<a ng-click="cancel()" class="p10">
<span class="text-close">Close</span>
</a>
</section>
<section class="middle tab-bar-section">
<h1 class="title ellipsis">
<span ng-show="type == 'BUY' || type == 'RECEIVE'">Choose your destination wallet</span>
<span ng-show="type == 'SELL' || type == 'SEND'">Choose your source wallet</span>
</h1>
</section>
</nav>
<section class="middle tab-bar-section">
<h1 class="title ellipsis">
<span ng-show="type == 'BUY' || type == 'RECEIVE'">Choose your destination wallet</span>
<span ng-show="type == 'SELL' || type == 'SEND'">Choose your source wallet</span>
</h1>
</section>
</nav>
<div class="modal-content">
<div ng-show="type == 'SELL'">
<h4 class="title m0 oh">
<div class="left">
<i class="fi-info size-18 m10r"></i>
<ion-content class="m20t" overflow-scroll="true">
<div class="modal-content m20t">
<div ng-show="type == 'SELL'">
<h4 class="title m0 oh">
<div class="left">
<i class="fi-info size-18 m10r"></i>
</div>
<div class="size-10 m5t">
Notice: only 1-1 (single signature) wallets can be used for sell bitcoin
</div>
</h4>
</div>
<div class="size-10 m5t">
Notice: only 1-1 (single signature) wallets can be used for sell bitcoin
<div ng-show="type != 'SELL'">
<h4 class="title m0 oh">
</h4>
</div>
</h4>
</div>
<ul class="no-bullet">
<li class="line-b" ng-repeat="w in wallets">
<a ng-click="selectWallet(w.id, w.name)" class="db oh">
<div class="avatar-wallet"
ng-style="{'background-color':w.color}">
<i class="icon-wallet size-21"></i>
</div>
<div class="ellipsis name-wallet text-bold">{{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 class="extra-margin-bottom"></div>
</div>
<ul class="no-bullet">
<li class="line-b" ng-repeat="w in wallets">
<a ng-click="selectWallet(w.id, w.name)" class="db oh">
<div class="avatar-wallet"
ng-style="{'background-color':w.color}">
<i class="icon-wallet size-21"></i>
</div>
<div class="ellipsis name-wallet text-bold">{{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 class="extra-margin-bottom"></div>
</div>
</ion-content>
</ion-modal-view>

View file

@ -24,7 +24,7 @@
</div>
</div>
<div class="row m20t"
<div class="row m20ti"
ng-show="index.coinbaseAccount && !sell.sellInfo && !sell.sendInfo">
<div class="columns">
<form
@ -141,7 +141,7 @@
</div>
</div>
<div class="m20t row" ng-show="sell.sendInfo && !sell.sellInfo && !sell.success">
<div class="m20ti row" ng-show="sell.sendInfo && !sell.sellInfo && !sell.success">
<div class="columns">
<h1>Funds sent to Coinbase Account</h1>
<p class="size-12 text-gray">