anders/Wallet
1
0
Fork 0
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #4597 from JDonadio/feat/send-view-01

Browse source 
New amount view on send tab and request specific amounts - Mobile
This commit is contained in:
Gustavo Maximiliano Cortez 2016-08-09 18:10:58 -03:00 • committed by GitHub
commit 8de466e49d
8 changed files with 452 additions and 50 deletions
Download patch file Download diff file Expand all files Collapse all files

0
public/views/modals/customized-amount.html → public/views/modals/customAmount.html
View file

114
public/views/modals/inputAmount.html Normal file
View file

@ -0,0 +1,114 @@
<ion-modal-view ng-controller="inputAmountController" ng-style="{'background-color':'#F6F7F9'}" ng-init=init()>
<ion-header-bar align-title="center" class="tab-bar" ng-style="{'background-color':color}">
<div class="left-small">
<a ng-click="cancel()" class="p10">
<span class="text-close" translate>Close</span>
</a>
</div>
<h1 class="title ellipsis" translate>Enter amount</h1>
<div class="buttons m5r m3t" ng-if="!specificAmount" ng-click="toggleAlternative()">
<button class="button black" ng-show="showAlternativeAmount">{{alternativeIsoCode}}</button>
<button class="button" ng-style="{'background-color':color}" ng-show="!showAlternativeAmount">{{unitName}}</button>
</div>
<div class="right-small m10r" ng-if="specificAmount">
<a ng-click="init()">
<span class="text-close" translate>Cancel</span>
</a>
</div>
</ion-header-bar>
<ion-pane>
<ion-content class="calculator" scroll="false" ng-show="!specificAmount">
<div class="header-calc">
<div class="text-light text-black" ng-class="{'size-28': smallFont, 'size-36': !smallFont}">{{amount || '-'}}</div>
<div class="text-light text-black" ng-class="{'size-16': smallFont, 'size-17': !smallFont}" ng-show="!showAlternativeAmount">
{{globalResult}} <span class="label gray radius">{{amountResult || '0.00'}} {{alternativeIsoCode}}</span>
</div>
<div class="text-light text-black size-17" ng-show="showAlternativeAmount">
{{globalResult}} <span class="label gray radius">{{alternativeResult || '0.00'}} {{unitName}}</span>
</div>
</div>
<div class="button-calc">
<div class="oh">
<div class="left large-3 medium-3 small-3">
<button class="button expand text-center m0 operator"
ng-click="resetAmount()">
AC
</button>
</div>
<div class="left large-9 medium-9 small-9">
<button class="button expand text-center m0"
ng-style="{'background-color':index.backgroundColor}"
ng-disabled="alternativeResult <= 0 && amountResult <= 0" ng-click="finish()" ng-show="!specificAmount">
OK
</button>
</div>
</div>
<div class="row collapse">
<div class="columns large-3 medium-3 small-3" ng-click="pushDigit('7')">7</div>
<div class="columns large-3 medium-3 small-3" ng-click="pushDigit('8')">8</div>
<div class="columns large-3 medium-3 small-3" ng-click="pushDigit('9')">9</div>
<div class="columns large-3 medium-3 small-3 operator" ng-click="pushOperator('/')">/</div>
</div>
<div class="row collapse">
<div class="columns large-3 medium-3 small-3" ng-click="pushDigit('4')">4</div>
<div class="columns large-3 medium-3 small-3" ng-click="pushDigit('5')">5</div>
<div class="columns large-3 medium-3 small-3" ng-click="pushDigit('6')">6</div>
<div class="columns large-3 medium-3 small-3 operator" ng-click="pushOperator('x')">x</div>
</div>
<div class="row collapse">
<div class="columns large-3 medium-3 small-3" ng-click="pushDigit('1')">1</div>
<div class="columns large-3 medium-3 small-3" ng-click="pushDigit('2')">2</div>
<div class="columns large-3 medium-3 small-3" ng-click="pushDigit('3')">3</div>
<div class="columns large-3 medium-3 small-3 operator" ng-click="pushOperator('+')">+</div>
</div>
<div class="row collapse">
<div class="columns large-3 medium-3 small-3 operator" ng-click="pushDigit('.')">.</div>
<div class="columns large-3 medium-3 small-3" ng-click="pushDigit('0')">0</div>
<div class="columns large-3 medium-3 small-3 operator icon ion-arrow-left-a" ng-click="removeDigit()"></div>
<div class="columns large-3 medium-3 small-3 operator" ng-click="pushOperator('-')">-</div>
</div>
</div>
</ion-content>
<ion-content ng-show="specificAmount" ng-style="{'background-color':'#f6f7f9'}">
<section class="modal-content m20b">
<h4 class="title m10l" translate>QR Code</h4>
<ul class="no-bullet size-14 m0">
<li class="line-b p10 oh text-center">
<qrcode size="220" data="bitcoin:{{addr + '?amount=' + customizedAmountBtc}}"></qrcode>
<div class="m10t text-center" ng-show="isCordova">
<span class="button outline dark-gray tiny round"
ng-click="shareAddress('bitcoin:' + addr + '?amount=' + customizedAmountBtc)">
<i class="fi-share"></i>
<span translate>Share address</span>
</span>
</div>
</li>
</ul>
<h4 class="title m10l" translate>Details</h4>
<ul class="no-bullet size-14 m0">
<li class="line-b p10 oh">
<span class="text-gray" translate>Address</span>:
<span class="right">
<span class="text-gray enable_text_select">{{addr}}</span>
</span>
</li>
<li class="line-b p10 oh">
<span class="text-gray" translate>Amount</span>:
<span class="right">
{{specificAmount}} {{unitName}}
<span class="label gray radius">{{specificAlternativeAmount}} {{alternativeIsoCode}}</span>
</span>
</li>
</ul>
<div class="extra-margin-bottom"></div>
</section>
</ion-content>
</ion-pane>
</ion-modal-view>

38
public/views/walletHome.html
View file

@ -302,9 +302,9 @@
</button>
</div>
<div class="small-12 columns" ng-show="home.addr">
<button class="button expand small round m10b" ng-click="home.openCustomizedAmountModal(home.addr)"
ng-style="{'background-color':index.backgroundColor}"
ng-disabled="home.generatingAddress">
<button class="button expand small round m10b" ng-click="openAmountModal(home.addr)"
ng-style="{'background-color':index.backgroundColor}"
ng-disabled="home.generatingAddress">
<span translate>Request a specific amount</span>
</button>
</div>
@ -403,34 +403,32 @@
</div>
</div>
<div class="row" ng-init="home.hideAlternative()">
<div class="row">
<div class="large-12 medium-12 columns">
<div class="right" ng-hide="sendForm.amount.$pristine && !sendForm.amount.$modelValue ">
<span class="has-error right size-12" ng-if="sendForm.amount.$invalid">
<span class="has-error right size-12" ng-show="sendForm.amount.$invalid">
<i class="icon-close-circle size-14"></i>
<span clas="vm" translate>Not valid</span>
</span>
<small class="text-primary right" ng-if="!sendForm.amount.$invalid && !sendForm.alternative.$invalid">
<small class="text-primary right" ng-show="!sendForm.amount.$invalid && !sendForm.alternative.$invalid">
<i class="icon-checkmark-circle size-14"></i>
</small>
</div>
<div ng-show="!home.canShowAlternative()">
<div>
<label for="amount">
<span translate>Amount</span>
<span translate>Amount</span><span ng-show="showAlternative"> [{{home.alternativeIsoCode}}]</span>
</label>
<div class="input">
<input type="number" id="amount" ng-disabled=" home.lockAmount" name="amount" ng-attr-placeholder="{{'Amount in'|translate}} {{home.unitName}}" ng-model="_amount" valid-amount required autocomplete="off" ng-focus="home.formFocus('amount')" ng-blur="home.formFocus(false)" ignore-mouse-wheel>
<input type="number" id="alternative" name="alternative" ng-model="_alternative" style="display:none">
<a class="postfix button" ng-style="{'background-color':index.backgroundColor}" ng-click="home.showAlternative()">{{home.unitName}}</a>
</div>
</div>
<div ng-show="home.canShowAlternative()">
<label for="alternative"><span translate>Amount</span> [{{ home.alternativeIsoCode }}]
</label>
<div class="input">
<input type="number" id="alternative" ng-disabled="!home.isRateAvailable || home.lockAmount" name="alternative" ng-attr-placeholder="{{'Amount in'|translate}} {{ home.alternativeName }}" ng-model="_alternative" required autocomplete="off" ng-focus="home.formFocus('amount')" ng-blur="home.formFocus(false)" ignore-mouse-wheel>
<input type="number" id="amount" name="amount" ng-model="_amount" style="display:none">
<a class="postfix button black" ng-click="home.hideAlternative()"> {{ home.alternativeIsoCode }}</a>
<div ng-if="index.isCordova">
<input type="amount" readonly="true" ng-show="!showAlternative" id="amount" ng-disabled="home.lockAmount" name="amount" ng-attr-placeholder="{{'Amount in'|translate}} {{home.unitName}}" ng-model="_amount" valid-amount required autocomplete="off" ng-focus="openInputAmountModal()" ignore-mouse-wheel>
<input type="amount" readonly="true" ng-show="showAlternative" id="alternative" ng-disabled="!home.isRateAvailable || home.lockAmount" name="alternative" ng-attr-placeholder="{{'Amount in'|translate}} {{ home.alternativeName }}" ng-model="_alternative" required autocomplete="off" ng-focus="openInputAmountModal()" ignore-mouse-wheel>
</div>
<div ng-if="!index.isCordova">
<input type="number" ng-show="!showAlternative" id="amount" ng-disabled="home.lockAmount" name="amount" ng-attr-placeholder="{{'Amount in'|translate}} {{home.unitName}}" ng-model="_amount" valid-amount required autocomplete="off" ignore-mouse-wheel>
<input type="number" ng-show="showAlternative" id="alternative" ng-disabled="!home.isRateAvailable || home.lockAmount" name="alternative" ng-attr-placeholder="{{'Amount in'|translate}} {{ home.alternativeName }}" ng-model="_alternative" required autocomplete="off" ignore-mouse-wheel>
</div>
<a class="postfix button" ng-show="!showAlternative" ng-style="{'background-color':index.backgroundColor}" ng-click="showAlternative = !showAlternative">{{home.unitName}}</a>
<a class="postfix button black" ng-show="showAlternative" ng-click="showAlternative = !showAlternative">{{home.alternativeIsoCode}}</a>
</div>
</div>
</div>