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

Autofocus and show the second PIN input automatically. Hide submit button. Allow only numbers

Browse source
This commit is contained in:
Gustavo Maximiliano Cortez 2014-12-03 03:03:16 -03:00
commit 51028178ed
3 changed files with 96 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

73
views/home.html
View file

@ -47,62 +47,81 @@
<a class="text-white" href="#!/createProfile">creating your profile</a>
</div>
<div class="box-setup" ng-if='setPin'>
<div class="box-setup" ng-if="setPin" ng-init="secondPin = false">
<h1><span translate>Set your </span> <b> PIN number</b></h1>
<div class="box-notification" ng-show="error">
<div class="box-icon error">
<i class="fi-x size-24"></i>
</div>
<span class="text-warning size-14">
{{error|translate}}
</span>
</div>
<form name="setPinForm" ng-submit="createPin(setPinForm)" novalidate>
<div class="input">
<input id="setpin" type="tel" ng-model="setpin" class="form-control"
<div class="input" ng-show="!secondPin">
<input id="newpin" type="tel" ng-model="newpin" class="form-control"
ng-maxlength="4" ng-minlength="4" maxlength="4"
placeholder="Pin number" name="setpin" required auto-focus>
ng-pattern="/^[0-9]{1,4}$/"
placeholder="Pin number" name="newpin" required show-focus="!secondPin">
<i class="icon-locked"></i>
</div>
<div class="input">
<div class="input" ng-show="secondPin">
<input id="repeatpin" type="tel" ng-model="repeatpin" class="form-control"
ng-maxlength="4" ng-minlength="4" maxlength="4"
placeholder="Repeat pin number" name="repeatpin"
match="setpin" required>
ng-pattern="/^[0-9]{1,4}$/"
placeholder="Repeat pin number" name="repeatpin" required show-focus="secondPin">
<i class="icon-locked"></i>
</div>
<p class="text-warning size-12" ng-show="setPinForm.repeatpin.$dirty && setPinForm.repeatpin.$invalid">
<i class="fi-x"></i>
{{'Pin must match'|translate}}
</p>
<button translate type="submit" class="button primary radius expand m0"
ng-disabled="setPinForm.$invalid || loading">
<button translate type="submit" class="dn button primary radius expand m0"
ng-disabled="setPinForm.$invalid || error">
Set pin
</button>
</form>
<div class="box-setup-footer text-right">
<a class="text-gray" ng-click="createPin()">
<span translate>Skip</span>
<i class="icon-arrow-right3"></i>
</a>
<div class="box-setup-footer row collapse">
<div class="large-6 medium-6 small-6 columns">
<a class="button warning radius m0" ng-click="pinLogout()">
<span translate>Cancel</span>
<i class="icon-x"></i>
</a>
</div>
<div class="large-6 medium-6 small-6 columns text-right">
<a class="button secondary radius m0" ng-click="open(email, password)">
<span translate>Skip</span>
<i class="icon-arrow-right3"></i>
</a>
</div>
</div>
</div>
<div class="box-setup" ng-if='hasPin'>
<h1><span translate>Enter your </span> <b> PIN number</b></h1>
<form name="pinForm" ng-submit="openWithPin(pinForm)" novalidate>
<p class="text-warning size-12" ng-show="error">
<i class="fi-x"></i>
{{error|translate}}
</p>
<div class="box-notification" ng-show="error">
<div class="box-icon error">
<i class="fi-x size-24"></i>
</div>
<span class="text-warning size-14">
{{error|translate}}
</span>
</div>
<div class="input">
<input id="pin" type="tel" ng-model="pin" class="form-control"
ng-maxlength="4" ng-minlength="4" maxlength="4"
ng-pattern="/^[0-9]{1,4}$/"
placeholder="Pin number" name="pin" required auto-focus>
<i class="icon-locked"></i>
</div>
<button translate type="submit" class="button primary radius expand m0"
ng-disabled="pinForm.$invalid || loading">
<button translate type="submit" class="dn button primary radius expand m0"
ng-disabled="pinForm.$invalid || error">
Sign in
</button>
</form>
<div class="box-setup-footer text-right">
<a class="text-gray" ng-click="pinLogout()">
<div class="box-setup-footer">
<a class="button warning radius m0" ng-click="pinLogout()">
<i class="icon-power"></i>
<span translate>Logout</span>
</a>