Integrate wo-input-code directive

This commit is contained in:
Tankred Hase 2014-12-01 11:53:45 +01:00
parent d15d45a16c
commit 876a0b0302
6 changed files with 14 additions and 91 deletions

View File

@ -63,7 +63,6 @@ var app = angular.module('mail', [
'read',
'contacts',
'login-new-device',
'privatekey-upload',
'infinite-scroll'
]);

View File

@ -33,26 +33,6 @@ var PrivateKeyUploadCtrl = function($scope, keychain, pgp, dialog, auth) {
}
};
$scope.handlePaste = function(event) {
var evt = event;
if (evt.originalEvent) {
evt = evt.originalEvent;
}
var value = evt.clipboardData.getData('text/plain');
if (!value) {
return;
}
value = value.replace(/-/g, '');
$scope.code0 = value.slice(0, 4);
$scope.code1 = value.slice(4, 8);
$scope.code2 = value.slice(8, 12);
$scope.code3 = value.slice(12, 16);
$scope.code4 = value.slice(16, 20);
$scope.code5 = value.slice(20, 24);
};
$scope.checkServerForKey = function(callback) {
var keyParams = pgp.getKeyParams();
keychain.hasPrivateKey({
@ -80,14 +60,12 @@ var PrivateKeyUploadCtrl = function($scope, keychain, pgp, dialog, auth) {
$scope.code = util.randomString(24);
$scope.displayedCode = $scope.code.slice(0, 4) + '-' + $scope.code.slice(4, 8) + '-' + $scope.code.slice(8, 12) + '-' + $scope.code.slice(12, 16) + '-' + $scope.code.slice(16, 20) + '-' + $scope.code.slice(20, 24);
// clear input fields of any previous artifacts
$scope.code0 = $scope.code1 = $scope.code2 = $scope.code3 = $scope.code4 = $scope.code5 = '';
// clear input field of any previous artifacts
$scope.inputCode = '';
};
$scope.verifyCode = function() {
var inputCode = '' + $scope.code0 + $scope.code1 + $scope.code2 + $scope.code3 + $scope.code4 + $scope.code5;
if (inputCode.toUpperCase() !== $scope.code) {
if ($scope.inputCode.toUpperCase() !== $scope.code) {
var err = new Error('The code does not match. Please go back and check the generated code.');
dialog.error(err);
return false;
@ -171,26 +149,4 @@ var PrivateKeyUploadCtrl = function($scope, keychain, pgp, dialog, auth) {
};
//
// Directives
//
var ngModule = angular.module('privatekey-upload', []);
ngModule.directive('focusNext', function() {
return {
link: function(scope, element, attr) {
var maxLen = element[0].maxLength;
scope.$watch(attr.ngModel, function(val) {
if (val && val.length === maxLen) {
var nextinput = element.next('input');
if (nextinput.length) {
nextinput[0].focus();
}
}
});
}
};
});
module.exports = PrivateKeyUploadCtrl;

View File

@ -70,10 +70,8 @@ var LoginPrivateKeyDownloadCtrl = function($scope, $location, $routeParams, auth
};
$scope.decryptAndStorePrivateKeyLocally = function() {
var inputCode = '' + $scope.code0 + $scope.code1 + $scope.code2 + $scope.code3 + $scope.code4 + $scope.code5;
var options = $scope.encryptedPrivateKey;
options.code = inputCode.toUpperCase();
options.code = $scope.code.toUpperCase();
keychain.decryptAndStorePrivateKeyLocally(options, function(err, privateKey) {
if (err) {
@ -108,26 +106,6 @@ var LoginPrivateKeyDownloadCtrl = function($scope, $location, $routeParams, auth
});
};
$scope.handlePaste = function(event) {
var evt = event;
if (evt.originalEvent) {
evt = evt.originalEvent;
}
var value = evt.clipboardData.getData('text/plain');
if (!value) {
return;
}
value = value.replace(/-/g, '');
$scope.code0 = value.slice(0, 4);
$scope.code1 = value.slice(4, 8);
$scope.code2 = value.slice(8, 12);
$scope.code3 = value.slice(12, 16);
$scope.code4 = value.slice(16, 20);
$scope.code5 = value.slice(20, 24);
};
//
// helper functions
//

View File

@ -222,6 +222,12 @@ ngModule.directive('woInputCode', function() {
link: function(scope, elm, attrs, ngModelCtrl) {
function format(val) {
var str = '';
// check if value exists
if (!val) {
return str;
}
for(var i = 0; i < val.length; i++) {
if(i > 0 && i % BLOCK_SIZE === 0) {
str += BLOCK_DIVIDER;

View File

@ -43,16 +43,8 @@
<p class="form__error-message" ng-show="errMsg">{{errMsg}}</p>
<div class="form__row">
<!-- TODO utilize woInputCode -->
<div class="input-code">
<input type="text" class="input-text" size="4" maxlength="4" ng-model="code0" wo-focus-me="step === 2" focus-next required ng-paste="handlePaste($event)"> -
<input type="text" class="input-text" size="4" maxlength="4" ng-model="code1" focus-next required> -
<input type="text" class="input-text" size="4" maxlength="4" ng-model="code2" focus-next required> -
<input type="text" class="input-text" size="4" maxlength="4" ng-model="code3" focus-next required> -
<input type="text" class="input-text" size="4" maxlength="4" ng-model="code4" focus-next required> -
<input type="text" class="input-text" size="4" maxlength="4" ng-model="code5" required>
</div>
<input type="text" class="input-text" ng-model="code" wo-focus-me="step === 2" wo-input-code required>
<input type="text" class="input-text" ng-model="code" wo-input-code wo-focus-me="step === 2"
required pattern="([a-zA-Z0-9\-]*)" placeholder="0000-0000-0000-0000-0000-0000">
</div>
<div class="spinner-block" ng-show="busy">
<span class="spinner spinner--big"></span>

View File

@ -25,16 +25,8 @@
<div ng-show="step === 2">
<p class="typo-paragraph">Please confirm the keychain code you have written down.</p>
<form class="form">
<!-- TODO utilize woInputCode -->
<div class="input-code">
<input type="text" class="input-text" size="4" maxlength="4" ng-model="code0" wo-focus-me="step === 2" focus-next ng-paste="handlePaste($event)"> -
<input type="text" class="input-text" size="4" maxlength="4" ng-model="code1" focus-next> -
<input type="text" class="input-text" size="4" maxlength="4" ng-model="code2" focus-next> -
<input type="text" class="input-text" size="4" maxlength="4" ng-model="code3" focus-next> -
<input type="text" class="input-text" size="4" maxlength="4" ng-model="code4" focus-next> -
<input type="text" class="input-text" size="4" maxlength="4" ng-model="code5">
</div>
<input type="text" class="input-text" ng-model="code" wo-focus-me="step === 2" wo-input-code required>
<input type="text" class="input-text" ng-model="inputCode" wo-input-code wo-focus-me="step === 2"
required pattern="([a-zA-Z0-9\-]*)" placeholder="0000-0000-0000-0000-0000-0000">
</form>
</div>