separate create tab views

This commit is contained in:
Javier 2016-09-08 11:28:41 -03:00
parent d6d54a4e35
commit 967fdff063
6 changed files with 229 additions and 214 deletions

View File

@ -10,8 +10,13 @@
<ion-content>
<ion-list>
<a class="item item-remove-animate item-icon-right" type="item-text-wrap" ui-sref="tabs.create">
<h2 translate>Create new wallet</h2>
<a class="item item-remove-animate item-icon-right" type="item-text-wrap" ui-sref="tabs.create-personal">
<h2 translate>New Personal Wallet</h2>
<i class="icon nav-item-arrow-right"></i>
</a>
<a class="item item-remove-animate item-icon-right" type="item-text-wrap" ui-sref="tabs.create-shared">
<h2 translate>Create Shared Wallet</h2>
<i class="icon nav-item-arrow-right"></i>
</a>

View File

@ -1,22 +0,0 @@
<ion-view>
<ion-nav-bar class="bar-royal">
<ion-nav-title>{{'Create new wallet' | translate}}</ion-nav-title>
<ion-nav-back-button>
<i class="icon ion-ios-arrow-thin-left"></i>
</ion-nav-back-button>
</ion-nav-bar>
<ion-content ng-controller="createController" ng-init="personal = true; init()">
<div class="row text-center">
<div class="col" ng-click="personal = true; setTotalCopayers(1)" ng-style="personal && {'border-bottom': '2px solid'}">
<span class="" translate>Personal Wallet</span>
</div>
<div class="col" ng-click="personal = false; setTotalCopayers(3)" ng-style="!personal && {'border-bottom': '2px solid'}">
<span class="" translate>Shared Wallet</span>
</div>
</div>
<div ng-include="'views/tab-create-personal.html'" ng-if="personal"></div>
<div ng-include="'views/tab-create-shared.html'" ng-if="!personal"></div>
</ion-content>
</ion-view>

View File

@ -1,88 +1,100 @@
<form name="setupForm" ng-submit="create(setupForm)" novalidate>
<div class="card list">
<label class="item item-input item-stacked-label">
<span class="input-label" translate>Wallet name</span>
<input type="text"
placeholder="{{'Family vacation funds'|translate}}"
ng-model="formData.walletName"
ng-required="true"
ng-focus="formFocus('wallet-name')"
ng-blur="formFocus(false)">
</label>
<ion-view>
<ion-nav-bar class="bar-royal">
<ion-nav-title>{{'Create Personal Wallet' | translate}}</ion-nav-title>
<ion-nav-back-button>
<i class="icon ion-ios-arrow-thin-left"></i>
</ion-nav-back-button>
</ion-nav-bar>
<ion-toggle ng-model="showAdv" toggle-class="toggle-stable" ng-change="showAdvChange()">
<span translate ng-show="!showAdv">Show advanced options</span>
<span translate ng-show="showAdv">Hide advanced options</span>
</ion-toggle>
<ion-content ng-controller="createController" ng-init="init(1);">
<form name="setupForm" ng-submit="create(setupForm)" novalidate>
<div class="card list">
<label class="item item-input item-stacked-label">
<span class="input-label" translate>Wallet name</span>
<input type="text"
placeholder="{{'Family vacation funds'|translate}}"
ng-model="formData.walletName"
ng-required="true"
ng-focus="formFocus('wallet-name')"
ng-blur="formFocus(false)">
</label>
<div ng-show="showAdv">
<label class="item item-input item-stacked-label">
<span class="input-label">Wallet Service URL</span>
<input type="text" ng-model="formData.bwsurl" placeholder="https://bws.bitpay.com/bws/api">
</label>
<ion-toggle ng-model="showAdv" toggle-class="toggle-stable" ng-change="showAdvChange()">
<span translate ng-show="!showAdv">Show advanced options</span>
<span translate ng-show="showAdv">Hide advanced options</span>
</ion-toggle>
<label class="item item-input item-select">
<div class="input-label" translate>
Wallet Key
</div>
<select class="m10t" ng-model="seedSource" ng-options="seed as seed.label for seed in seedOptions"></select>
</label>
<div ng-show="showAdv">
<label class="item item-input item-stacked-label">
<span class="input-label">Wallet Service URL</span>
<input type="text" ng-model="formData.bwsurl" placeholder="https://bws.bitpay.com/bws/api">
</label>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'trezor' || seedSource.id == 'ledger'">
<span class="input-label" translate>Account Number</span>
<input type="number" ng-model="formData.account" ignore-mouse-wheel>
</label>
<label class="item item-input item-select">
<div class="input-label" translate>
Wallet Key
</div>
<select class="m10t" ng-model="seedSource" ng-options="seed as seed.label for seed in seedOptions"></select>
</label>
<div class="card" ng-show="seedSource.id == 'new' && createPassphrase">
<div class="item item-text-wrap" translate>
WARNING: The password cannot be recovered. <b>Be sure to write it down</b>. The wallet can not be restored without the password.
</div>
</div>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'trezor' || seedSource.id == 'ledger'">
<span class="input-label" translate>Account Number</span>
<input type="number" ng-model="formData.account" ignore-mouse-wheel>
</label>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'new'">
<span class="input-label" translate>Add a Password</span>
<input type="text"
placeholder="{{'Add an optional password to secure the recovery phrase'|translate}}"
autocapitalize="off"
ng-model="formData.createPassphrase">
</label>
<div class="card" ng-show="seedSource.id == 'new' && createPassphrase">
<div class="item item-text-wrap" translate>
WARNING: The password cannot be recovered. <b>Be sure to write it down</b>. The wallet can not be restored without the password.
</div>
</div>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'set'">
<span class="input-label" translate>Wallet Recovery Phrase</span>
<input placeholder="{{'Enter the recovery phrase (BIP39)'|translate}}"
autocapitalize="off"
type="text"
ng-model="formData.privateKey">
</label>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'new'">
<span class="input-label" translate>Add a Password</span>
<input type="text"
placeholder="{{'Add an optional password to secure the recovery phrase'|translate}}"
autocapitalize="off"
ng-model="formData.createPassphrase">
</label>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'set'">
<span class="input-label" translate>Password</span>
<input type="text"
placeholder="{{'The recovery phrase could require a password to be imported'|translate}}"
autocapitalize="off"
ng-model="formData.passphrase">
</label>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'set'">
<span class="input-label" translate>Wallet Recovery Phrase</span>
<input placeholder="{{'Enter the recovery phrase (BIP39)'|translate}}"
autocapitalize="off"
type="text"
ng-model="formData.privateKey">
</label>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'set'">
<span class="input-label" translate>Derivation Path</span>
<input type="text"
placeholder="{{'BIP32 path for address derivation'|translate}}"
ng-model="formData.derivationPath">
</label>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'set'">
<span class="input-label" translate>Password</span>
<input type="text"
placeholder="{{'The recovery phrase could require a password to be imported'|translate}}"
autocapitalize="off"
ng-model="formData.passphrase">
</label>
<ion-toggle ng-show="seedSource.id == 'new'" ng-model="formData.testnetEnabled" toggle-class="toggle-positive">
<span translate>Testnet</span>
</ion-toggle>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'set'">
<span class="input-label" translate>Derivation Path</span>
<input type="text"
placeholder="{{'BIP32 path for address derivation'|translate}}"
ng-model="formData.derivationPath">
</label>
<ion-toggle ng-model="formData.singleAddressEnabled" toggle-class="toggle-positive">
<span translate>Single Address Wallet</span>
<small translate>For audit purposes</small>
</ion-toggle>
<ion-toggle ng-show="seedSource.id == 'new'" ng-model="formData.testnetEnabled" toggle-class="toggle-positive">
<span translate>Testnet</span>
</ion-toggle>
</div> <!-- advanced -->
</div> <!-- list -->
<ion-toggle ng-model="formData.singleAddressEnabled" toggle-class="toggle-positive">
<span translate>Single Address Wallet</span>
<small translate>For audit purposes</small>
</ion-toggle>
</div> <!-- advanced -->
</div> <!-- list -->
<button type="submit" class="button button-block button-positive" ng-disabled="setupForm.$invalid">
<span translate>Create new wallet</span>
</button>
</form>
</ion-content>
</ion-view>
<button type="submit" class="button button-block button-positive" ng-disabled="setupForm.$invalid">
<span translate>Create new wallet</span>
</button>
</form>

View File

@ -1,119 +1,131 @@
<form name="setupForm" ng-submit="create(setupForm)" novalidate>
<div class="card list">
<label class="item item-input item-stacked-label">
<span class="input-label" translate>Wallet name</span>
<input type="text"
placeholder="{{'Family vacation funds'|translate}}"
ng-model="formData.walletName"
ng-required="true"
ng-focus="formFocus('wallet-name')"
ng-blur="formFocus(false)">
</label>
<ion-view>
<ion-nav-bar class="bar-royal">
<ion-nav-title>{{'Create Shared Wallet' | translate}}</ion-nav-title>
<ion-nav-back-button>
<i class="icon ion-ios-arrow-thin-left"></i>
</ion-nav-back-button>
</ion-nav-bar>
<label class="item item-input item-stacked-label">
<span class="input-label" translate>Your nickname</span>
<input type="text"
placeholder="{{'John'|translate}}"
ng-model="formData.myName"
ng-required="formData.totalCopayers != 1"
ng-disabled="formData.totalCopayers == 1"
ng-focus="formFocus('my-name')"
ng-blur="formFocus(false)">
</label>
<ion-content ng-controller="createController" ng-init="init(3);">
<form name="setupForm" ng-submit="create(setupForm)" novalidate>
<div class="card list">
<label class="item item-input item-stacked-label">
<span class="input-label" translate>Wallet name</span>
<input type="text"
placeholder="{{'Family vacation funds'|translate}}"
ng-model="formData.walletName"
ng-required="true"
ng-focus="formFocus('wallet-name')"
ng-blur="formFocus(false)">
</label>
<label class="item item-input item-select">
<div class="input-label" translate>
Total number of copayers
</div>
<select class="m10t" ng-model="formData.totalCopayers" ng-options="totalCopayers as totalCopayers for totalCopayers in TCValues"
ng-change="setTotalCopayers(formData.totalCopayers)">
</select>
</label>
<label class="item item-input item-stacked-label">
<span class="input-label" translate>Your nickname</span>
<input type="text"
placeholder="{{'John'|translate}}"
ng-model="formData.myName"
ng-required="formData.totalCopayers != 1"
ng-disabled="formData.totalCopayers == 1"
ng-focus="formFocus('my-name')"
ng-blur="formFocus(false)">
</label>
<label class="item item-input item-select">
<div class="input-label" translate>
Required number of signatures
</div>
<select class="m10t"
ng-model="formData.requiredCopayers" ng-options="requiredCopayers as requiredCopayers for requiredCopayers in RCValues"
ng-disabled="formData.totalCopayers == 1">
</select>
</label>
<label class="item item-input item-select">
<div class="input-label" translate>
Total number of copayers
</div>
<select class="m10t" ng-model="formData.totalCopayers" ng-options="totalCopayers as totalCopayers for totalCopayers in TCValues"
ng-change="setTotalCopayers(formData.totalCopayers)">
</select>
</label>
<ion-toggle ng-model="showAdv" toggle-class="toggle-stable" ng-change="showAdvChange()">
<span translate ng-show="!showAdv">Show advanced options</span>
<span translate ng-show="showAdv">Hide advanced options</span>
</ion-toggle>
<label class="item item-input item-select">
<div class="input-label" translate>
Required number of signatures
</div>
<select class="m10t"
ng-model="formData.requiredCopayers" ng-options="requiredCopayers as requiredCopayers for requiredCopayers in RCValues"
ng-disabled="formData.totalCopayers == 1">
</select>
</label>
<div ng-show="showAdv">
<label class="item item-input item-stacked-label">
<span class="input-label">Wallet Service URL</span>
<input type="text" ng-model="formData.bwsurl">
</label>
<ion-toggle ng-model="showAdv" toggle-class="toggle-stable" ng-change="showAdvChange()">
<span translate ng-show="!showAdv">Show advanced options</span>
<span translate ng-show="showAdv">Hide advanced options</span>
</ion-toggle>
<label class="item item-input item-select">
<div class="input-label" translate>
Wallet Key
</div>
<select class="m10t" ng-model="seedSource" ng-options="seed as seed.label for seed in seedOptions"></select>
</label>
<div ng-show="showAdv">
<label class="item item-input item-stacked-label">
<span class="input-label">Wallet Service URL</span>
<input type="text" ng-model="formData.bwsurl">
</label>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'trezor' || seedSource.id == 'ledger'">
<span class="input-label" translate>Account Number</span>
<input type="number" ng-model="formData.account" ignore-mouse-wheel>
</label>
<label class="item item-input item-select">
<div class="input-label" translate>
Wallet Key
</div>
<select class="m10t" ng-model="seedSource" ng-options="seed as seed.label for seed in seedOptions"></select>
</label>
<div class="card" ng-show="seedSource.id =='new' && formData.createPassphrase">
<div class="item item-text-wrap" translate>
WARNING: The password cannot be recovered. <b>Be sure to write it down</b>. The wallet can not be restored without the password.
</div>
</div>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'trezor' || seedSource.id == 'ledger'">
<span class="input-label" translate>Account Number</span>
<input type="number" ng-model="formData.account" ignore-mouse-wheel>
</label>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'new'">
<span class="input-label" translate>Add a Password</span>
<input type="text"
placeholder="{{'Add an optional password to secure the recovery phrase'|translate}}"
autocapitalize="off"
ng-model="formData.createPassphrase">
</label>
<div class="card" ng-show="seedSource.id =='new' && formData.createPassphrase">
<div class="item item-text-wrap" translate>
WARNING: The password cannot be recovered. <b>Be sure to write it down</b>. The wallet can not be restored without the password.
</div>
</div>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'new'">
<span class="input-label" translate>Add a Password</span>
<input type="text"
placeholder="{{'Add an optional password to secure the recovery phrase'|translate}}"
autocapitalize="off"
ng-model="formData.createPassphrase">
</label>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'set'">
<span class="input-label" translate>Wallet Recovery Phrase</span>
<input placeholder="{{'Enter the recovery phrase (BIP39)'|translate}}"
autocapitalize="off"
type="text"
ng-model="formData.privateKey">
</label>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'set'">
<span class="input-label" translate>Password</span>
<input type="text"
placeholder="{{'The recovery phrase could require a password to be imported'|translate}}"
autocapitalize="off"
ng-model="formData.passphrase">
</label>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'set'">
<span class="input-label" translate>Derivation Path</span>
<input type="text"
placeholder="{{'BIP32 path for address derivation'|translate}}"
ng-model="formData.derivationPath">
</label>
<ion-toggle ng-show="seedSource.id == 'new'" ng-model="formData.testnetEnabled" toggle-class="toggle-positive">
Testnet
</ion-toggle>
<ion-toggle ng-model="formData.singleAddressEnabled" toggle-class="toggle-positive">
<span translate>Single Address Wallet</span>
<small translate>For audit purposes</small>
</ion-toggle>
</div> <!-- advanced -->
</div> <!-- list -->
<button type="submit" class="button button-block button-positive" ng-disabled="setupForm.$invalid">
<span translate>Create {{formData.requiredCopayers}}-of-{{formData.totalCopayers}} wallet</span>
</button>
</form>
</ion-content>
</ion-view>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'set'">
<span class="input-label" translate>Wallet Recovery Phrase</span>
<input placeholder="{{'Enter the recovery phrase (BIP39)'|translate}}"
autocapitalize="off"
type="text"
ng-model="formData.privateKey">
</label>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'set'">
<span class="input-label" translate>Password</span>
<input type="text"
placeholder="{{'The recovery phrase could require a password to be imported'|translate}}"
autocapitalize="off"
ng-model="formData.passphrase">
</label>
<label class="item item-input item-stacked-label" ng-show="seedSource.id == 'set'">
<span class="input-label" translate>Derivation Path</span>
<input type="text"
placeholder="{{'BIP32 path for address derivation'|translate}}"
ng-model="formData.derivationPath">
</label>
<ion-toggle ng-show="seedSource.id == 'new'" ng-model="formData.testnetEnabled" toggle-class="toggle-positive">
Testnet
</ion-toggle>
<ion-toggle ng-model="formData.singleAddressEnabled" toggle-class="toggle-positive">
<span translate>Single Address Wallet</span>
<small translate>For audit purposes</small>
</ion-toggle>
</div> <!-- advanced -->
</div> <!-- list -->
<button type="submit" class="button button-block button-positive" ng-disabled="setupForm.$invalid">
<span translate>Create {{formData.requiredCopayers}}-of-{{formData.totalCopayers}} wallet</span>
</button>
</form>

View File

@ -23,7 +23,7 @@ angular.module('copayApp.controllers').controller('createController',
12: 1,
};
$scope.init = function() {
$scope.init = function(tc) {
$scope.formData = {};
var defaults = configService.getDefaults();
$scope.formData.account = 1;
@ -31,9 +31,9 @@ angular.module('copayApp.controllers').controller('createController',
$scope.TCValues = lodash.range(2, defaults.limits.totalCopayers + 1);
$scope.formData.totalCopayers = defaults.wallet.totalCopayers;
$scope.formData.derivationPath = derivationPathHelper.default;
$scope.setTotalCopayers(1);
updateRCSelect(1);
updateSeedSourceSelect(1);
$scope.setTotalCopayers(tc);
updateRCSelect(tc);
updateSeedSourceSelect(tc);
};
$scope.showAdvChange = function() {

View File

@ -282,11 +282,19 @@ angular.module('copayApp').config(function(historicLogProvider, $provide, $logPr
},
},
})
.state('tabs.create', {
url: '/create',
.state('tabs.create-personal', {
url: '/create-personal',
views: {
'tab-home': {
templateUrl: 'views/create.html'
templateUrl: 'views/tab-create-personal.html'
},
}
})
.state('tabs.create-shared', {
url: '/create-shared',
views: {
'tab-home': {
templateUrl: 'views/tab-create-shared.html'
},
}
})