WIP passphrase confirm - add passphrase view and separate controllers

This commit is contained in:
Javier 2015-11-18 18:37:42 -03:00
commit 4d94121ec6
11 changed files with 234 additions and 134 deletions

View file

@ -4,18 +4,14 @@
ng-init="titleSection='Backup'; goBackToState = 'preferences'">
</div>
<div class="content preferences" ng-controller="wordsController as wordsC">
<div class="content preferences" ng-controller="backupController as wordsC">
<h4></h4>
<div class="box-notification" ng-show="wordsC.error">
<span class="text-warning">
{{wordsC.error|translate}}
</span>
</div>
<div ng-show="wordsC.mnemonicWords || (wordsC.credentialsEncrypted && !wordsC.deleted)">
<div class="row" ng-show="index.n==1">
<div class="m10t columns size-14 text-gray">
@ -75,23 +71,23 @@
<!-- <div class="row m10t m10b" ng-show="wordsC.show"> -->
<div class="row m10t m10b">
<div class="row m10t m10b" ng-show="!wordsC.credentialsEncrypted">
<div class="small-centered text-gray columns size-14 text-center" translate>
Your Wallet Seed
</div>
</div>
<!-- <div class="row" ng-show="wordsC.show"> -->
<div class="row">
<div class="row" ng-show="!wordsC.credentialsEncrypted">
<div class="columns">
<div class="p10" style="background:white" ng-class="{'enable_text_select': index.network == 'testnet'}">
<span ng-repeat="word in wordsC.mnemonicWords track by $index"><span style="white-space:nowrap">{{word}}</span><span ng-show="wordsC.useIdeograms">&#x3000;</span> </span>
</div>
<div class="p10" style="background:white" ng-class="{'enable_text_select': index.network == 'testnet'}">
<span ng-repeat="word in wordsC.mnemonicWords track by $index"><span style="white-space:nowrap">{{word}}</span><span ng-show="wordsC.useIdeograms">&#x3000;</span> </span>
</div>
</div>
</div>
<!-- <div class="row m10t m20b" ng-show="wordsC.show"> -->
<div class="row m10t m20b">
<div class="row m10t m20b" ng-show="!wordsC.credentialsEncrypted">
<div class="columns" ng-show="wordsC.mnemonicHasPassphrase">
<span class="size-12">
<i class="fi-alert"></i>
@ -120,8 +116,12 @@
</div> -->
<div class="columns text-center">
<button class="black round small expand" ng-style="{'background-color':index.backgroundColor}" ng-click="$root.go('backupWords');" translate>
Continue
<button
ng-disabled="wordsC.credentialsEncrypted"
class="black round small expand"
ng-style="{'background-color':index.backgroundColor}"
ng-click="$root.go('backupWords');"
translate>Continue
</button>
</div>
@ -136,8 +136,6 @@
</div>
</div>
</div>
</div>
</div>
<div class="extra-margin-bottom"></div>

View file

@ -4,10 +4,9 @@
ng-init="titleSection='Backup'; goBackToState = 'backupWords'">
</div>
<div class="content preferences" ng-controller="wordsController as wordsC">
<div class="content preferences" ng-controller="backupConfirmController as backupConfirmC">
<h4></h4>
<div ng-show="wordsC.mnemonicWords || (wordsC.credentialsEncrypted && !wordsC.deleted)">
<div ng-show="backupConfirmC.mnemonicWords || (backupConfirmC.credentialsEncrypted && !backupConfirmC.deleted)">
<div class="row m10t m10b">
<div class="small-centered text-gray columns size-14 text-center" translate>
@ -19,7 +18,7 @@
<button
ng-style="{'background-color':index.backgroundColor}"
class="button black round expand"
ng-click="$root.go('walletHome');"
ng-click="backupConfirmC.confirm(); $root.go('walletHome');"
translate>Finish
</button>
</div>

View file

@ -0,0 +1,57 @@
<div
class="topbar-container"
ng-include="'views/includes/topbar.html'"
ng-init="titleSection='Backup'; goBackToState = 'backupWords'">
</div>
<div class="content preferences" ng-controller="backupPassphraseController as backupPassphraseC">
<h4></h4>
<div class="box-notification" ng-show="backupPassphraseC.error">
<span class="text-warning">
{{backupPassphraseC.error|translate}}
</span>
</div>
<div ng-show="backupPassphraseC.mnemonicWords || (backupPassphraseC.credentialsEncrypted && !backupPassphraseC.deleted)">
<div class="row m10t m10b panel">
<div class="small-centered text-gray columns size-14 text-center" translate>
Passphrase needed
</div>
<div class="columns size-14 m20t">
<input type="text" id="passphrase" ng-model="passphrase" autofocus/>
</div>
</div>
<div class="columns text-center m20t">
<button
ng-show="!backupPassphraseC.passphraseSuccess"
ng-disabled="!passphrase || backupPassphraseC.error"
ng-style="{'background-color':index.backgroundColor}"
class="button black round expand"
ng-click="backupPassphraseC.confirm()"
translate>Confirm passphrase
</button>
<button
ng-show="backupPassphraseC.passphraseSuccess"
ng-disabled="!passphrase || backupPassphraseC.error"
ng-style="{'background-color':index.backgroundColor}"
class="button black round expand"
ng-click="$root.go('backupConfirm');"
translate>Continue
</button>
</div>
<div class="row m20t" ng-show="index.n==1">
<div class="columns size-12 text-gray">
<div class="p10t" style="border-top:1px solid #ccc">
<span translate>You can safely install your wallet on another device and use it from multiple devices at the same time.</span>
<a href="#" ng-click="$root.openExternalLink('https://github.com/bitpay/copay/blob/master/README.md#copay-backups-and-recovery')" translate>
Learn more about Copay backups
</a>
</div>
</div>
</div>
</div>
</div>
<div class="extra-margin-bottom"></div>

View file

@ -4,17 +4,10 @@
ng-init="titleSection='Backup'; goBackToState = 'backup'">
</div>
<div class="content preferences" ng-controller="wordsController as wordsC">
<div class="content preferences" ng-controller="backupWordsController as backupWordsC">
<h4></h4>
<div class="box-notification" ng-show="wordsC.error">
<span class="text-warning">
{{wordsC.error|translate}}
</span>
</div>
<div ng-show="wordsC.mnemonicWords || (wordsC.credentialsEncrypted && !wordsC.deleted)">
<div ng-show="backupWordsC.mnemonicWords || (backupWordsC.credentialsEncrypted && !backupWordsC.deleted)">
<div class="row m10t m10b">
<div class="small-centered text-gray columns size-14 text-center" translate>
@ -28,8 +21,8 @@
<div id="addWord"></div>
</div>
<div class="p10" style="background:white" ng-class="{'enable_text_select': index.network == 'testnet'}">
<span ng-repeat="word in wordsC.mnemonicWords track by $index">
<button class="button radius tiny" style="white-space:nowrap" ng-click="wordsC.disableButton(word)" id="{{word}}">{{word}}</button>
<span ng-repeat="word in backupWordsC.mnemonicWords track by $index">
<button class="button radius tiny" style="white-space:nowrap" ng-click="backupWordsC.disableButton(word)" id="{{word}}">{{word}}</button>
</span>
</div>
</div>
@ -37,12 +30,21 @@
<div class="columns text-center m20t">
<button
ng-disabled="!wordsC.sorted"
ng-show="!backupWordsC.mnemonicHasPassphrase"
ng-disabled="!backupWordsC.sorted"
ng-style="{'background-color':index.backgroundColor}"
class="button black round expand"
ng-click="$root.go('backupConfirm');"
translate>Continue
</button>
<button
ng-show="backupWordsC.mnemonicHasPassphrase"
ng-disabled="!backupWordsC.sorted"
ng-style="{'background-color':index.backgroundColor}"
class="button black round expand"
ng-click="$root.go('backupPassphrase');"
translate>Continue
</button>
</div>
<div class="row m20t" ng-show="index.n==1">

View file

@ -6,17 +6,17 @@
<div class="content preferences" ng-controller="backupController as backup">
<div class="content preferences" ng-controller="exportController as exportC">
<h4></h4>
<div ng-show="!backup.backupWalletPlainText">
<div class="text-warning size-14 m20b" ng-show="backup.error">
<div ng-show="!exportC.backupWalletPlainText">
<div class="text-warning size-14 m20b" ng-show="exportC.error">
<i class="fi-alert size-12"></i>
<span translate> Failed to export </span>
</div>
<div class="row">
<div class="columns">
<div class="text-warning size-14 m20b" ng-show="backup.isEncrypted">
<div class="text-warning size-14 m20b" ng-show="exportC.isEncrypted">
<i class="fi-alert size-12"></i>
<span translate> The private key for this wallet is encrypted. Exporting keep the private key encrypted in the export archive.</span>
@ -31,14 +31,14 @@
<div class="input">
<input type="password" class="form-control"
placeholder="{{'Your export password'|translate}}"
name="password" ng-model="backup.password">
name="password" ng-model="exportC.password">
</div>
<label for="password" translate>Repeat password</label>
<div class="input">
<input type="password" class="form-control"
placeholder="{{'Repeat password'|translate}}"
name="password" ng-model="backup.repeatpassword">
name="password" ng-model="exportC.repeatpassword">
</div>
</div>
</div>
@ -83,25 +83,25 @@
<div class="row">
<div class="columns">
<button class="black round expand m20t" ng-click="backup.downloadWalletBackup()"
ng-disabled="(!backup.password || backup.password != backup.repeatpassword)"
<button class="black round expand m20t" ng-click="exportC.downloadWalletBackup()"
ng-disabled="(!exportC.password || exportC.password != exportC.repeatpassword)"
ng-style="{'background-color':index.backgroundColor}"
ng-show="!index.isSafari && !index.isCordova"><i class="fi-download"></i>
<span translate>Download</span></button>
<button class="black round expand m20t" ng-click="backup.viewWalletBackup()"
ng-disabled="(!backup.password || backup.password != backup.repeatpassword)"
<button class="black round expand m20t" ng-click="exportC.viewWalletBackup()"
ng-disabled="(!exportC.password || exportC.password != exportC.repeatpassword)"
ng-style="{'background-color':index.backgroundColor}"
ng-show="index.isSafari && !index.isCordova"><i class="fi-eye"></i>
<span translate>View</span></button>
<div ng-show="index.isCordova">
<h4 translate>Export options</h4>
<button class="black round expand" ng-disabled="(!backup.password || backup.password != backup.repeatpassword)"
<button class="black round expand" ng-disabled="(!exportC.password || exportC.password != exportC.repeatpassword)"
ng-style="{'background-color':index.backgroundColor}"
ng-click="backup.copyWalletBackup()"><i class="fi-clipboard-pencil"></i>
ng-click="exportC.copyWalletBackup()"><i class="fi-clipboard-pencil"></i>
<span translate>Copy to clipboard</span></button>
<button class="black round expand" ng-disabled="(!backup.password || backup.password != backup.repeatpassword)"
<button class="black round expand" ng-disabled="(!exportC.password || exportC.password != exportC.repeatpassword)"
ng-style="{'background-color':index.backgroundColor}"
ng-click="backup.sendWalletBackup()"><i class="fi-mail"></i>
ng-click="exportC.sendWalletBackup()"><i class="fi-mail"></i>
<span translate>Send by email</span></button>
</div>
</div>
@ -109,11 +109,11 @@
</div>
<div class="row" ng-show="backup.backupWalletPlainText">
<div class="row" ng-show="exportC.backupWalletPlainText">
<div class="large-12 columns">
<h3 translate>Wallet Export</h3>
<div class="input">
<textarea rows="12">{{backup.backupWalletPlainText}}</textarea>
<textarea rows="12">{{exportC.backupWalletPlainText}}</textarea>
</div>
<div class="size-12 text-gray text-right">
<i class="icon-compose"></i>

View file

@ -0,0 +1,56 @@
'use strict';
angular.module('copayApp.controllers').controller('backupWordsController',
function($rootScope, $scope, $timeout, $log, $compile, lodash, profileService, go, gettext, confirmDialog, notification, bwsError) {
var self = this;
var fc = profileService.focusedClient;
var customSortWords = [];
self.sorted = false;
setWords(fc.getMnemonic());
function setWords(words) {
if (words) {
self.mnemonicWords = words.split(/[\u3000\s]+/);
self.mnemonicHasPassphrase = fc.mnemonicHasPassphrase();
self.useIdeograms = words.indexOf("\u3000") >= 0;
}
};
self.enableButton = function(word) {
document.getElementById(word).disabled = false;
lodash.remove(customSortWords, function(v) {
return v == word;
});
}
self.disableButton = function(word) {
document.getElementById(word).disabled = true;
customSortWords.push(word);
self.addButton(word);
}
self.addButton = function(word) {
var btnhtml = '<button class="button radius tiny" style="white-space:nowrap" ' +
'data-ng-click="backupWordsC.removeButton($event)" id="_' + word + '" > ' + word + ' </button>';
var temp = $compile(btnhtml)($scope);
angular.element(document.getElementById('addWord')).append(temp);
self.shouldContinue(customSortWords);
}
self.removeButton = function(event) {
var id = (event.target.id);
var element = document.getElementById(id);
element.remove();
self.enableButton(id.substring(1));
self.shouldContinue(customSortWords);
}
self.shouldContinue = function(customSortWords) {
if (lodash.isEqual(self.mnemonicWords, customSortWords))
self.sorted = true;
else
self.sorted = false;
}
});

View file

@ -1,57 +1,17 @@
'use strict';
angular.module('copayApp.controllers').controller('wordsController',
angular.module('copayApp.controllers').controller('backupController',
function($rootScope, $scope, $timeout, $log, $compile, lodash, profileService, go, gettext, confirmDialog, notification, bwsError) {
var msg = gettext('Are you sure you want to delete the backup words?');
var successMsg = gettext('Backup words deleted');
var self = this;
var customSortWords = [];
var fc = profileService.focusedClient;
self.show = false;
self.sorted = false;
if (fc.isPrivKeyEncrypted())
if (fc.isPrivKeyEncrypted()) {
self.credentialsEncrypted = true;
else
passwordRequest();
} else
setWords(fc.getMnemonic());
if (fc.credentials && !fc.credentials.mnemonicEncrypted && !fc.credentials.mnemonic)
self.deleted = true;
self.toggle = function() {
self.error = "";
if (!self.credentialsEncrypted) {
if (!self.show)
$rootScope.$emit('Local/BackupDone');
self.show = !self.show;
}
if (self.credentialsEncrypted)
self.passwordRequest();
$timeout(function() {
$scope.$apply();
}, 1);
};
self.delete = function() {
confirmDialog.show(msg, function(ok) {
if (ok) {
fc.clearMnemonic();
profileService.updateCredentialsFC(function() {
self.deleted = true;
notification.success(successMsg);
go.walletHome();
});
}
});
};
$scope.$on('$destroy', function() {
profileService.lockFC();
});
function setWords(words) {
if (words) {
self.mnemonicWords = words.split(/[\u3000\s]+/);
@ -60,12 +20,11 @@ angular.module('copayApp.controllers').controller('wordsController',
}
};
self.passwordRequest = function() {
function passwordRequest() {
try {
setWords(fc.getMnemonic());
} catch (e) {
if (e.message && e.message.match(/encrypted/) && fc.isPrivKeyEncrypted()) {
self.credentialsEncrypted = true;
$timeout(function() {
$scope.$apply();
@ -77,50 +36,12 @@ angular.module('copayApp.controllers').controller('wordsController',
$log.warn('Error decrypting credentials:', self.error); //TODO
return;
}
if (!self.show && self.credentialsEncrypted)
self.show = !self.show;
self.credentialsEncrypted = false;
setWords(fc.getMnemonic());
$rootScope.$emit('Local/BackupDone');
// $rootScope.$emit('Local/BackupDone');
});
}
}
}
self.enableButton = function(word) {
document.getElementById(word).disabled = false;
lodash.remove(customSortWords, function(v) {
return v == word;
});
}
self.disableButton = function(word) {
document.getElementById(word).disabled = true;
customSortWords.push(word);
self.addButton(word);
}
self.addButton = function(word) {
var asd = 'apospodk';
var btnhtml = '<button class="button radius tiny" style="white-space:nowrap" ' +
'data-ng-click="wordsC.removeButton($event)" id="_' + word + '" > ' + word + ' </button>';
var temp = $compile(btnhtml)($scope);
angular.element(document.getElementById('addWord')).append(temp);
self.shouldContinue(customSortWords);
}
self.removeButton = function(event) {
var id = (event.target.id);
var element = document.getElementById(id);
element.remove();
self.enableButton(id.substring(1));
self.shouldContinue(customSortWords);
}
self.shouldContinue = function(customSortWords) {
if (lodash.isEqual(self.mnemonicWords, customSortWords))
self.sorted = true;
else
self.sorted = false;
}
});

View file

@ -0,0 +1,22 @@
'use strict';
angular.module('copayApp.controllers').controller('backupConfirmController',
function($rootScope, $scope, $timeout, $log, $compile, lodash, profileService, go, gettext, confirmDialog, notification, bwsError) {
var self = this;
var fc = profileService.focusedClient;
setWords(fc.getMnemonic());
function setWords(words) {
if (words) {
self.mnemonicWords = words.split(/[\u3000\s]+/);
self.mnemonicHasPassphrase = fc.mnemonicHasPassphrase();
self.useIdeograms = words.indexOf("\u3000") >= 0;
}
};
self.confirm = function() {
$rootScope.$emit('Local/BackupDone');
}
});

View file

@ -0,0 +1,34 @@
'use strict';
angular.module('copayApp.controllers').controller('backupPassphraseController',
function($rootScope, $scope, $timeout, $log, $compile, bwcService, lodash, profileService, go, gettext, confirmDialog, notification, bwsError) {
var self = this;
var fc = profileService.focusedClient;
self.passphraseSuccess = false;
self.error = "";
setWords(fc.getMnemonic());
var words = fc.getMnemonic();
function setWords(words) {
if (words) {
self.mnemonicWords = words.split(/[\u3000\s]+/);
self.mnemonicHasPassphrase = fc.mnemonicHasPassphrase();
self.useIdeograms = words.indexOf("\u3000") >= 0;
}
};
self.confirm = function() {
var walletClient = bwcService.getClient();
walletClient.importFromMnemonic(words, {
network: 'livenet',
passphrase: $scope.passphrase,
account: 0,
}, function(err) {
if (err)
self.error = err.message;
});
}
});

View file

@ -1,6 +1,6 @@
'use strict';
angular.module('copayApp.controllers').controller('backupController',
angular.module('copayApp.controllers').controller('exportController',
function($rootScope, $scope, $timeout, $log, backupService, storageService, profileService, isMobile, notification, go, gettext, gettextCatalog) {
var self = this;

View file

@ -456,6 +456,17 @@ angular
},
}
})
.state('backupPassphrase', {
url: '/backupPassphrase',
templateUrl: 'views/backupPassphrase.html',
walletShouldBeComplete: true,
needProfile: true,
views: {
'main': {
templateUrl: 'views/backupPassphrase.html'
},
}
})
.state('preferencesGlobal', {
url: '/preferencesGlobal',
needProfile: true,