mirror of https://github.com/BTCPrivate/copay.git
ref styling
This commit is contained in:
JDonadio
parent
dccd14310f
commit
47729129c9
|
|
@ -1,13 +1,19 @@
|
|||
'use strict';
|
||||
|
||||
angular.module('copayApp.controllers').controller('pincodeController', function($state, $stateParams, $ionicHistory, $timeout, $scope, $log, configService) {
|
||||
angular.module('copayApp.controllers').controller('pincodeController', function($state, $stateParams, $ionicHistory, $timeout, $scope, $log, configService, appConfigService) {
|
||||
|
||||
$scope.$on("$ionicView.beforeEnter", function(event) {
|
||||
$scope.currentPincode = $scope.newPincode = '';
|
||||
$scope.fromSettings = $stateParams.fromSettings == 'true' ? true : false;
|
||||
$scope.locking = $stateParams.locking == 'true' ? true : false;
|
||||
$scope.match = false;
|
||||
$scope.appName = appConfigService.name;
|
||||
});
|
||||
|
||||
$scope.getFilledClass = function(limit) {
|
||||
return $scope.currentPincode.length >= limit ? 'filled-' + $scope.appName : null;
|
||||
};
|
||||
|
||||
$scope.delete = function() {
|
||||
if ($scope.currentPincode.length > 0) {
|
||||
$scope.currentPincode = $scope.currentPincode.substring(0, $scope.currentPincode.length - 1);
|
||||
|
|
@ -15,30 +21,32 @@ angular.module('copayApp.controllers').controller('pincodeController', function(
|
|||
}
|
||||
};
|
||||
|
||||
function isComplete() {
|
||||
$scope.isComplete = function() {
|
||||
if ($scope.currentPincode.length < 4) return false;
|
||||
else return true;
|
||||
};
|
||||
|
||||
$scope.updatePinCode = function(value) {
|
||||
if (value && !isComplete()) {
|
||||
if (value && !$scope.isComplete()) {
|
||||
$scope.currentPincode = $scope.currentPincode + value;
|
||||
}
|
||||
$timeout(function() {
|
||||
$scope.$apply();
|
||||
});
|
||||
if (!$scope.locking && isComplete()) {
|
||||
if (!$scope.locking && $scope.isComplete()) {
|
||||
$scope.save();
|
||||
}
|
||||
};
|
||||
|
||||
$scope.save = function() {
|
||||
if (!isComplete()) return;
|
||||
if (!$scope.isComplete()) return;
|
||||
var config = configService.getSync();
|
||||
var match = config.lockapp.pincode.value == $scope.currentPincode ? true : false;
|
||||
|
||||
$scope.match = config.lockapp.pincode.value == $scope.currentPincode ? true : false;
|
||||
$timeout(function() {
|
||||
$scope.$apply();
|
||||
});
|
||||
if (!$scope.locking) {
|
||||
if (match) {
|
||||
if ($scope.match) {
|
||||
$scope.fromSettings ? saveSettings($scope.locking, '') : $scope.close(150);
|
||||
}
|
||||
} else {
|
||||
|
|
|
|||
|
|
@ -34,11 +34,8 @@
|
|||
}
|
||||
}
|
||||
.block-code {
|
||||
width: 120px;
|
||||
width: 50%;
|
||||
margin: auto;
|
||||
.row {
|
||||
height: 35px;
|
||||
}
|
||||
}
|
||||
.block-buttons {
|
||||
.col {
|
||||
|
|
@ -47,19 +44,32 @@
|
|||
cursor: pointer;
|
||||
position: absolute;
|
||||
bottom: 3%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
left: 5%;
|
||||
width: 90%;
|
||||
}
|
||||
}
|
||||
.circle {
|
||||
border: 1px solid #666666;
|
||||
border-radius: 50%;
|
||||
opacity: 0.6;
|
||||
box-shadow: 0 0 1px 0px rgb( 255, 255, 255);
|
||||
margin: 2px;
|
||||
transition: background-color .2s ease-in-out;
|
||||
@mixin circle {
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 1px 0px rgb( 255, 255, 255);
|
||||
transition: background-color .2s ease-in-out;
|
||||
padding: 7%;
|
||||
margin: 5%;
|
||||
}
|
||||
.filled {
|
||||
background-color: #666666;
|
||||
.circle-copay {
|
||||
@include circle;
|
||||
border: 1px solid $v-accent-color;
|
||||
}
|
||||
.circle-bitpay {
|
||||
@include circle;
|
||||
border: 1px solid $v-primary-color;
|
||||
}
|
||||
.filled-copay {
|
||||
background-color: $v-accent-color;
|
||||
}
|
||||
.filled-bitpay {
|
||||
background-color: $v-primary-color;
|
||||
}
|
||||
.error {
|
||||
color: #f13333;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,8 +4,11 @@
|
|||
</ion-nav-back-button>
|
||||
</ion-nav-bar>
|
||||
<div class="content">
|
||||
<div class="block-text row" translate ng-if="!newPincode">Please enter your mobile unlock code</div>
|
||||
<div class="block-text row" translate ng-if="newPincode">Confirm your mobile unlock code</div>
|
||||
<div class="block-text row">
|
||||
<span translate ng-if="!newPincode && !isComplete()">Please enter your mobile unlock code</span>
|
||||
<span translate ng-if="newPincode && !isComplete()">Confirm your mobile unlock code</span>
|
||||
<span translate ng-if="isComplete() && !locking && !match" class="error">Incorrect code, try again.</span>
|
||||
</div>
|
||||
<div class="app-icon">
|
||||
<i class="icon big-icon-svg">
|
||||
<div class="bg"></div>
|
||||
|
|
@ -13,10 +16,10 @@
|
|||
</div>
|
||||
<div class="block-code">
|
||||
<div class="row">
|
||||
<div class="col circle" ng-class="{'filled': currentPincode.length >= 1}"></div>
|
||||
<div class="col circle" ng-class="{'filled': currentPincode.length >= 2}"></div>
|
||||
<div class="col circle" ng-class="{'filled': currentPincode.length >= 3}"></div>
|
||||
<div class="col circle" ng-class="{'filled': currentPincode.length >= 4}"></div>
|
||||
<div class="col circle-{{appName}}" ng-class="getFilledClass(1)"></div>
|
||||
<div class="col circle-{{appName}}" ng-class="getFilledClass(2)"></div>
|
||||
<div class="col circle-{{appName}}" ng-class="getFilledClass(3)"></div>
|
||||
<div class="col circle-{{appName}}" ng-class="getFilledClass(4)"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block-buttons">
|
||||
|
|
@ -60,8 +63,8 @@
|
|||
<div class="col" ng-click="updatePinCode('0')">
|
||||
<div class="">0</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="keyboard icon ion-arrow-left-a" ng-click="delete()"></div>
|
||||
<div class="col" ng-click="delete()">
|
||||
<div class="keyboard icon ion-arrow-left-a"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue