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

Add/create/import/join. Main sass file

Browse source
This commit is contained in:
Gustavo Maximiliano Cortez 2016-08-16 17:45:20 -03:00
commit df0f77b383
No known key found for this signature in database
GPG key ID: 15EDAD8D9F2EB1AF
7 changed files with 923 additions and 474 deletions
Download patch file Download diff file Expand all files Collapse all files

52
public/views/add.html
View file

@ -1,34 +1,26 @@
<div
class="topbar-container"
ng-include="'views/includes/topbar.html'"
ng-init="titleSection='Add wallet'; closeToHome = true; noColor = true">
</div>
<ion-view view-title="Add wallet">
<ion-nav-buttons side="primary">
<a href ui-sref="tabs.home" class="button button-clear button-dark">Close</a>
</ion-nav-buttons>
<ion-content>
<ion-list>
<ion-item class="item-remove-animate item-icon-right" type="item-text-wrap" ui-sref="create">
<h2 translate>Create new wallet</h2>
<i class="icon ion-chevron-right icon-accessory"></i>
</ion-item>
<ion-item class="item-remove-animate item-icon-right" type="item-text-wrap" ui-sref="join">
<h2 translate>Join shared wallet</h2>
<i class="icon ion-chevron-right icon-accessory"></i>
</ion-item>
<div class="content">
<ul class="no-bullet manage size-12">
<li>
<a title="Create new wallet" href ui-sref="create">
<i class="fi-plus circle plus-fixed"></i>
<i class="icon-arrow-right3 size-18 right m20t"></i>
<span translate>Create new wallet</span>
</a>
</li>
<li>
<a title="Join shared wallet" href ui-sref="join">
<i class="icon-people circle"></i>
<i class="icon-arrow-right3 size-18 right m20t"></i>
<span translate>Join shared wallet</span>
</a>
</li>
<li>
<a title="Import wallet" href ui-sref="import">
<i class="icon-download circle"></i>
<i class="icon-arrow-right3 size-18 right m20t"></i>
<span translate>Import wallet </span>
</a>
</li>
<ion-item class="item-remove-animate item-icon-right" type="item-text-wrap" ui-sref="import">
<h2 translate>Import wallet</h2>
<i class="icon ion-chevron-right icon-accessory"></i>
</ion-item>
</ion-list>
</ion-content>
</ion-view>
</ul>
</div>

292
public/views/create.html
View file

@ -1,164 +1,178 @@
<div
class="topbar-container"
ng-include="'views/includes/topbar.html'"
ng-init="titleSection='Create new wallet'; goBackToState = 'add'; noColor = true">
</div>
<ion-view view-title="Create new wallet" ng-controller="createController as create" ng-init="create.setTotalCopayers(1)">
<ion-nav-buttons side="primary">
<a href ui-sref="add" class="button icon-left ion-chevron-left button-clear button-dark">Add</a>
</ion-nav-buttons>
<div class="content p20b" ng-controller="createController as create" ng-init="create.setTotalCopayers(1)">
<ion-content>
<div class="create-tab small-only-text-center" ng-hide="create.hideTabs">
<div class="row">
<div class="tab-container small-6 medium-6 large-6 columns" ng-class="{'selected': totalCopayers == 1}">
<a href ng-click="create.setTotalCopayers(1)" translate>Personal Wallet</a>
<div class="row" ng-hide="create.hideTabs">
<div class="col">
<button
ng-class="{'button-dark': totalCopayers == 1, 'button-stable': totalCopayers != 1}"
class="button button-full button-clear"
ng-click="create.setTotalCopayers(1)" translate>
Personal Wallet
</button>
</div>
<div class="tab-container small-6 medium-6 large-6 columns" ng-class="{'selected': totalCopayers != 1}">
<a href ng-click="create.setTotalCopayers(3)" translate>Shared Wallet</a>
<div class="col">
<button
ng-class="{'button-stable': totalCopayers == 1, 'button-dark': totalCopayers != 1}"
class="button button-full button-clear"
ng-click="create.setTotalCopayers(3)" translate>
Shared Wallet
</button>
</div>
</div>
</div>
<form name="setupForm" ng-submit="create.create(setupForm)" novalidate>
<div class="box-notification m20b" id="notification" ng-show="create.error">
<span class="text-warning">
{{create.error|translate}}
</span>
<div class="padding assertive" ng-show="create.error">
{{create.error|translate}}
</div>
<div class="row">
<div class="large-12 columns">
<div ng-hide="create.hideWalletName">
<label><span translate>Wallet name</span>
<div class="input">
<input type="text" placeholder="{{'Family vacation funds'|translate}}" class="form-control" name="walletName" ng-model="walletName" ng-required="true" ng-focus="create.formFocus('wallet-name')" ng-blur="create.formFocus(false)">
</div>
</label>
</div>
<div ng-show="totalCopayers != 1">
<label><span translate>Your nickname</span>
<div class="input">
<input type="text" placeholder="{{'John'|translate}}" class="form-control" name="myName" ng-model="myName" ng-required="totalCopayers != 1" ng-disabled="totalCopayers == 1" ng-focus="create.formFocus('my-name')" ng-blur="create.formFocus(false)">
</div>
</label>
</div>
<div class="row" ng-show="totalCopayers != 1">
<div class="large-6 medium-6 columns">
<label><span translate>Total number of copayers</span>
<select class="m10t" ng-model="totalCopayers"
ng-options="totalCopayers as totalCopayers for totalCopayers in create.TCValues"
ng-change="create.setTotalCopayers(totalCopayers)">
</select>
</label>
<form name="setupForm" ng-submit="create.create(setupForm)" novalidate>
<div class="list">
<label ng-hide="create.hideWalletName" class="item item-input item-stacked-label">
<span class="input-label" translate>Wallet name</span>
<input type="text"
placeholder="{{'Family vacation funds'|translate}}"
name="walletName"
ng-model="walletName"
ng-required="true"
ng-focus="create.formFocus('wallet-name')"
ng-blur="create.formFocus(false)">
</label>
<label ng-show="totalCopayers != 1" class="item item-input item-stacked-label">
<span class="input-label" translate>Your nickname</span>
<input type="text"
placeholder="{{'John'|translate}}"
name="myName"
ng-model="myName"
ng-required="totalCopayers != 1"
ng-disabled="totalCopayers == 1"
ng-focus="create.formFocus('my-name')"
ng-blur="create.formFocus(false)">
</label>
<label ng-show="totalCopayers != 1" class="item item-input item-select">
<div class="input-label" translate>
Total number of copayers
</div>
<div class="large-6 medium-6 columns">
<label><span translate>Required number of signatures</span>
<select class="m10t" ng-model="requiredCopayers" ng-options="requiredCopayers as requiredCopayers for requiredCopayers in create.RCValues" ng-disabled="totalCopayers == 1">
</select>
</label>
<select class="m10t"
ng-model="totalCopayers"
ng-options="totalCopayers as totalCopayers for totalCopayers in create.TCValues"
ng-change="create.setTotalCopayers(totalCopayers)">
</select>
</label>
<label ng-show="totalCopayers != 1" class="item item-input item-select">
<div class="input-label" translate>
Required number of signatures
</div>
</div>
<select class="m10t"
ng-model="requiredCopayers"
ng-options="requiredCopayers as requiredCopayers for requiredCopayers in create.RCValues"
ng-disabled="totalCopayers == 1">
</select>
</label>
<div class="m10t oh" ng-init="hideAdv=true">
<a class="button outline light-gray expand tiny p10i" ng-click="hideAdv=!hideAdv">
<i class="fi-widget m3r"></i>
<span translate ng-hide="!hideAdv">Show advanced options</span>
<span translate ng-hide="hideAdv">Hide advanced options</span>
<i ng-if="hideAdv" class="icon-arrow-down4"></i>
<i ng-if="!hideAdv" class="icon-arrow-up4"></i>
</a>
</div>
<ion-toggle ng-model="showAdv" toggle-class="toggle-stable">
<span translate ng-show="!showAdv">Show advanced options</span>
<span translate ng-show="showAdv">Hide advanced options</span>
</ion-toggle>
<div ng-hide="hideAdv" class="row">
<div class="large-12 columns m20b">
<div>
<label for="bws" class="oh">
<span>Wallet Service URL</span>
<input type="text" id="bwsurl" name="bwsurl" ng-model="bwsurl">
</label>
</div>
<div ng-show="showAdv">
<div>
<label><span translate>Wallet Key</span>
<select class="m10t" ng-model="seedSource"
ng-options="seed as seed.label for seed in create.seedOptions"
ng-change="create.setSeedSource()">
</select>
</label>
</div>
<label class="item item-input item-stacked-label">
<span class="input-label">Wallet Service URL</span>
<input type="text" id="bwsurl" name="bwsurl" ng-model="bwsurl">
</label>
<div ng-show="create.seedSourceId == 'trezor' || create.seedSourceId == 'ledger'">
<label class="oh"><span translate>Account Number</span>
<input type="number" id="account" ng-model="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 create.seedOptions"
ng-change="create.setSeedSource()">
</select>
</label>
<div class="box-notification" ng-show="create.seedSourceId=='new' && createPassphrase">
<span class="text-warning size-14">
<i class="fi-alert"></i>
<span translate>
WARNING: The password cannot be recovered. <b>Be sure to write it down</b>. The wallet can not be restored without the password.
</span>
</span>
</div>
<label class="item item-input item-stacked-label"
ng-show="create.seedSourceId == 'trezor' || create.seedSourceId == 'ledger'">
<span class="input-label" translate>Account Number</span>
<input type="number" id="account" ng-model="account" ignore-mouse-wheel>
</label>
<div ng-show="create.seedSourceId=='new' ">
<label for="createPassphrase" ><span translate>Add a Password</span> <small translate>Add an optional password to secure the recovery phrase</small>
<div class="input">
<input type="text" class="form-control" autocapitalize="off"
name="createPassphrase" ng-model="createPassphrase">
</div>
</label>
<div class="card" ng-show="create.seedSourceId=='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>
<div ng-show="create.seedSourceId=='set'">
<label for="ext-master">
<span translate>Wallet Recovery Phrase</span>
<small translate>Enter the recovery phrase (BIP39)</small>
<input id="ext-master"
autocapitalize="off"
type="text"
name="privateKey" ng-model="privateKey">
</label>
</div>
<label class="item item-input item-stacked-label" ng-show="create.seedSourceId=='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"
name="createPassphrase"
ng-model="createPassphrase">
</label>
<div ng-show="create.seedSourceId=='set'">
<label for="passphrase"> <span translate>Password</span> <small translate>The recovery phrase could require a password to be imported</small>
<div class="input">
<input type="text" autocapitalize="off" class="form-control" name="passphrase" ng-model="passphrase">
</div>
</label>
</div>
<div ng-show="create.seedSourceId == 'set'">
<label class="oh"><span translate>Derivation Path</span> <small translate>BIP32 path for address derivation</small>
<input type="text" class="form-control" name="derivationPath" ng-model="derivationPath">
</label>
</div>
<div class="oh" ng-show="create.seedSourceId == 'new'">
<ion-toggle ng-model="testnetEnabled" toggle-class="toggle-balanced" class="bct">
<span class="toggle-label">Testnet</span>
</ion-toggle>
</div>
<div class="oh">
<ion-toggle ng-model="singleAddressEnabled" toggle-class="toggle-balanced" class="bct">
<div class="toggle-label">
<span class="db" translate>Single Address Wallet</span>
<small translate>For audit purposes</small>
</div>
</ion-toggle>
</div>
</div> <!-- columns -->
<label class="item item-input item-stacked-label" ng-show="create.seedSourceId=='set'">
<span class="input-label" translate>Wallet Recovery Phrase</span>
<input id="ext-master"
placeholder="{{'Enter the recovery phrase (BIP39)'|translate}}"
autocapitalize="off"
type="text"
name="privateKey"
ng-model="privateKey">
</label>
<label class="item item-input item-stacked-label" ng-show="create.seedSourceId=='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"
name="passphrase"
ng-model="passphrase">
</label>
<label class="item item-input item-stacked-label" ng-show="create.seedSourceId == 'set'">
<span class="input-label" translate>Derivation Path</span>
<input type="text"
placeholder="{{'BIP32 path for address derivation'|translate}}"
name="derivationPath"
ng-model="derivationPath">
</label>
<ion-toggle ng-show="create.seedSourceId == 'new'" ng-model="testnetEnabled" toggle-class="toggle-positive">
Testnet
</ion-toggle>
<ion-toggle ng-model="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 round black expand" ng-show="totalCopayers != 1" ng-disabled="setupForm.$invalid">
<span translate>Create {{requiredCopayers}}-of-{{totalCopayers}} wallet</span>
</button>
<button type="submit"
class="button button-block button-positive"
ng-show="totalCopayers != 1" ng-disabled="setupForm.$invalid">
<span translate>Create {{requiredCopayers}}-of-{{totalCopayers}} wallet</span>
</button>
<button type="submit" class="button round black expand" ng-show="totalCopayers == 1" ng-disabled="setupForm.$invalid">
<span translate>Create new wallet</span>
</button>
<button type="submit"
class="button button-block button-positive"
ng-show="totalCopayers == 1" ng-disabled="setupForm.$invalid">
<span translate>Create new wallet</span>
</button>
</form>
</ion-content>
</ion-view>
</div> <!-- large-12 columns -->
</div> <!-- row -->
</form>
<div class="extra-margin-bottom"></div>
</div>

388
public/views/import.html
View file

@ -1,228 +1,226 @@
<div
class="topbar-container"
ng-include="'views/includes/topbar.html'"
ng-init="titleSection='Import wallet'; goBackToState = 'add'; noColor = true">
</div>
<ion-view view-title="Import wallet" ng-controller="importController" ng-init="type='12'">
<ion-nav-buttons side="primary">
<a href ui-sref="add" class="button icon-left ion-chevron-left button-clear button-dark">Add</a>
</ion-nav-buttons>
<ion-nav-buttons side="secondary">
<qr-scanner class="button button-clear button-positive" on-scan="processWalletInfo(data)"></qr-scanner>
</ion-nav-buttons>
<ion-content>
<div class="content p20b" ng-controller="importController" ng-init="type='12'">
<div class="create-tab pr small-only-text-center" ng-hide="create.hideTabs">
<div class="row">
<div class="tab-container small-4 medium-4 large-4" ng-class="{'selected': type =='12'}">
<a href ng-click="setType('12')" translate>Recovery Phrase</a>
<div class="col">
<button
ng-class="{'button-dark': type == '12', 'button-stable': type != '12'}"
class="button button-full button-clear"
ng-click="setType('12')" translate>
Recovery Phrase
</button>
</div>
<div class="tab-container small-4 medium-4 large-4" ng-class="{'selected': type=='file'}">
<a href ng-click="setType('file')" translate>File/Text</a>
<div class="col">
<button
ng-class="{'button-dark': type == 'file', 'button-stable': type != 'file'}"
class="button button-full button-clear"
ng-click="setType('file')" translate>
File/Text
</button>
</div>
<div class="tab-container small-4 medium-4 large-4" ng-class="{'selected': type=='hwWallet'}">
<a href ng-click="setType('hwWallet')" translate>Hardware Wallet</a>
<div class="col">
<button
ng-class="{'button-dark': type == 'hwWallet', 'button-stable': type != 'hwWallet'}"
class="button button-full button-clear"
ng-click="setType('hwWallet')" translate>
Hardware Wallet
</button>
</div>
</div>
</div>
<div ng-show="type == '12' ">
<div ng-show="type == '12'">
<div class="row" ng-click="importErr = error = null">
<div class="large-12 columns">
<div class="box-notification m20b" ng-show="importErr">
<div class="text-warning">
<div class="m10 text-bold" translate>Could not access the wallet at the server. Please check:</div>
<ul class="size-12">
<li translate>The password of the recovery phrase (if set)</li>
<li translate>The derivation path</li>
<li translate>The wallet service URL</li>
</ul>
<div class="m15l">
<span translate>NOTE: To import a wallet from a 3rd party software, please go to Add Wallet &gt; Create Wallet, and specify the Recovery Phrase there.</span><br>
</div>
<div ng-show="importErr || error" class="padding assertive" ng-click="importErr = error = null">
<div ng-show="importErr">
<div translate>Could not access the wallet at the server. Please check:</div>
<ul>
<li translate>The password of the recovery phrase (if set)</li>
<li translate>The derivation path</li>
<li translate>The wallet service URL</li>
</ul>
<div translate>
NOTE: To import a wallet from a 3rd party software, please go to Add Wallet &gt; Create Wallet, and specify the Recovery Phrase there.
</div>
</div>
<div class="box-notification m20b" ng-show="error">
<div class="text-warning">{{error|translate}}</div>
<div ng-show="error">
{{error|translate}}
</div>
</div>
</div>
<div class="row">
<div class="large-12 columns">
<form name="importForm12" ng-submit="importMnemonic(importForm12)" novalidate>
<label for="words" class="m25r">
<span translate>Type the Recovery Phrase (usually 12 words)</span>:
<form name="importForm12" ng-submit="importMnemonic(importForm12)" novalidate>
<div class="list">
<label class="item item-input item-stacked-label">
<span class="input-label" translate>Type the Recovery Phrase (usually 12 words)</span>
<textarea name="words"
ng-model="words"
rows="3"
autocapitalize="off"
spellcheck="false"></textarea>
</label>
<div class="qr-scanner-input-import">
<qr-scanner on-scan="processWalletInfo(data)"></qr-scanner>
<ion-toggle ng-model="showAdv" toggle-class="toggle-stable">
<span translate ng-show="!showAdv">Show advanced options</span>
<span translate ng-show="showAdv">Hide advanced options</span>
</ion-toggle>
<div ng-show="showAdv">
<label class="item item-input item-stacked-label">
<span class="input-label">Wallet Service URL</span>
<input type="text" id="bwsurl" name="bwsurl" ng-model="bwsurl">
</label>
<label class="item item-input item-stacked-label">
<span class="input-label" translate>Password</span>
<input type="text"
placeholder="{{'The recovery phrase could require a password to be imported'|translate}}"
autocapitalize="off"
name="passphrase"
ng-model="passphrase">
</label>
<label class="item item-input item-stacked-label">
<span class="input-label" translate>Derivation Path</span>
<input type="text"
placeholder="{{'BIP32 path for address derivation'|translate}}"
name="derivationPath"
ng-model="derivationPath">
</label>
<ion-toggle ng-model="testnetEnabled" ng-change="setDerivationPath(testnetEnabled)" toggle-class="toggle-positive">
Testnet
</ion-toggle>
</div>
<textarea class="form-control m10t" name="words" ng-model="words" rows="3" autocapitalize="off" spellcheck="false"></textarea>
<div class="m10t oh" ng-init="hideAdv=true">
<a class="button outline light-gray expand tiny p10i" ng-click="hideAdv=!hideAdv">
<i class="fi-widget m3r"></i>
<span translate ng-hide="!hideAdv">Show advanced options</span>
<span translate ng-hide="hideAdv">Hide advanced options</span>
<i ng-if="hideAdv" class="icon-arrow-down4"></i>
<i ng-if="!hideAdv" class="icon-arrow-up4"></i>
</a>
</div>
<div ng-hide="hideAdv" class="row">
<div class="large-12 columns">
<label for="passphrase" class="oh"><span translate>Password</span> <small translate>The Wallet Recovery Phrase could require a password to be imported</small>
<div class="input">
<input type="password" class="form-control" placeholder="{{'Password'|translate}}"
name="passphrase" ng-model="passphrase">
</div>
</label>
<div>
<label class="oh"><span translate>Derivation Path</span> <small translate>BIP32 path for address derivation</small>
<input type="text" class="form-control" name="derivationPath" ng-model="derivationPath">
</label>
</div>
<label for="bws" class="oh">
<span>Wallet Service URL</span>
<input type="text" id="bwsurl" name="bwsurl" ng-model="bwsurl">
</label>
<div class="oh">
<ion-toggle ng-model="testnetEnabled" ng-change="setDerivationPath()" toggle-class="toggle-balanced" class="bct">
<span class="toggle-label">Testnet</span>
</ion-toggle>
</div>
</div>
</div>
<button translate type="submit" class="button round expand black m10t" ng-disabled="importForm12.$invalid">Import</button>
</form>
</div>
</div>
</div>
<div ng-show="type == 'file' ">
<div class="row">
<div class="large-12 columns">
<div class="box-notification m20b" ng-show="error">
<span class="text-warning size-14">
{{error|translate}}
</span>
</div>
<form name="importForm" ng-submit="importBlob(importForm)" novalidate>
<div ng-show="!index.isSafari && !index.isCordova" class="line-b m10b">
<label for="backupFile">
<span translate>Choose a backup file from your computer</span> <i class="fi-laptop"></i>
</label>
<input type="file" class="form-control" placeholder="{{'Select a backup file'|translate}}"
name="backupFile" ng-model="backupFile" ng-file-select>
</div>
<button type="submit"
class="button button-block button-positive"
ng-disabled="importForm12.$invalid" translate>Import</button>
</form>
</div>
<div ng-show="index.isSafari || index.isCordova">
<label for="backupText">
<span translate>Paste the backup plain text code</span> <i class="fi-clipboard"></i>
</label>
<textarea class="form-control" name="backupText" ng-model="backupText" rows="5"></textarea>
</div>
<div ng-show="type == 'file'">
<label for="password"><span translate>Password</span>
<div class="padding assertive" ng-show="error">
{{error|translate}}
</div>
<form name="importForm" ng-submit="importBlob(importForm)" novalidate>
<div class="list">
<label class="item item-input item-stacked-label" ng-show="!index.isSafari && !index.isCordova">
<span class="input-label" translate>Choose a backup file from your computer</span>
<input type="file"
placeholder="{{'Select a backup file'|translate}}"
name="backupFile"
ng-model="backupFile" ng-file-select>
</label>
<div class="input">
<input type="password" class="form-control" placeholder="{{'Your password'|translate}}"
name="password" ng-model="password">
<label class="item item-input item-stacked-label" ng-show="index.isSafari || index.isCordova">
<span class="input-label" translate>Paste the backup plain text code</span>
<textarea name="backupText" ng-model="backupText" rows="5"></textarea>
</label>
<label class="item item-input item-stacked-label">
<span class="input-label" translate>Password</span>
<input type="password"
placeholder="{{'Your password'|translate}}"
name="password"
ng-model="password">
</label>
<ion-toggle ng-model="showAdv" toggle-class="toggle-stable">
<span translate ng-show="!showAdv">Show advanced options</span>
<span translate ng-show="showAdv">Hide advanced options</span>
</ion-toggle>
<div ng-show="showAdv">
<label class="item item-input item-stacked-label">
<span class="input-label">Wallet Service URL</span>
<input type="text" id="bwsurl" name="bwsurl" ng-model="bwsurl">
</label>
</div>
<div class="m10t oh" ng-init="hideAdv=true">
<a class="button outline light-gray expand tiny p10i" ng-click="hideAdv=!hideAdv">
<i class="fi-widget m3r"></i>
<span translate ng-hide="!hideAdv">Show advanced options</span>
<span translate ng-hide="hideAdv">Hide advanced options</span>
<i ng-if="hideAdv" class="icon-arrow-down4"></i>
<i ng-if="!hideAdv" class="icon-arrow-up4"></i>
</a>
</div>
<div ng-hide="hideAdv" class="row">
<div class="large-12 columns">
<label for="bws" class="oh">
<span>Wallet Service URL</span>
<input type="text" id="bwsurl" name="bwsurl" ng-model="bwsurl">
</label>
</div>
</div>
<button translate type="submit" class="button round expand black"
ng-disabled="importForm.$invalid || !password ">
Import backup
</button>
</form>
</div>
</div>
</div>
<div ng-show="type == 'hwWallet'">
<div class="row">
<div class="large-12 columns">
<div class="box-notification m20b" ng-show="error">
<span class="text-warning size-14">
{{error|translate}}
</span>
</div>
<form name="importForm3" ng-submit="importHW(importForm3)" novalidate>
<div ng-show="!seedOptions[0]">
<span translate>No hardware wallets supported on this device</span>
<button type="submit"
class="button round expand black"
ng-disabled="importForm.$invalid || !password " translate>
Import backup
</button>
</form>
</div>
<div ng-show="type == 'hwWallet'">
<div class="padding assertive" ng-show="error">
{{error|translate}}
</div>
<form name="importForm3" ng-submit="importHW(importForm3)" novalidate>
<div class="card" ng-show="!seedOptions[0]">
<div class="item item-text-wrap" translate>
No hardware wallets supported on this device
</div>
<div ng-show="seedOptions[0]">
<div>
<label><span translate>Wallet Type</span>
<select class="m10t" ng-model="seedSource"
ng-options="seed as seed.label for seed in seedOptions"
ng-change="setSeedSource()">
</div>
<div ng-show="seedOptions[0]">
<div class="list">
<label class="item item-input item-select">
<div class="input-label" translate>
Wallet Type
</div>
<select ng-model="seedSource"
ng-options="seed as seed.label for seed in seedOptions"
ng-change="setSeedSource()">
</select>
</label>
<label class="item item-input item-stacked-label"
ng-show="seedSourceId == 'trezor' || seedSourceId == 'ledger'">
<span class="input-label" translate>Account Number</span>
<input type="number" id="account" ng-model="account" ignore-mouse-wheel>
</label>
<ion-toggle ng-show="seedSourceId == 'trezor'"
ng-model="isMultisig"
toggle-class="toggle-positive">
<span translate>Shared Wallet</span>
</ion-toggle>
<ion-toggle ng-model="showAdv" toggle-class="toggle-stable">
<span translate ng-show="!showAdv">Show advanced options</span>
<span translate ng-show="showAdv">Hide advanced options</span>
</ion-toggle>
<div ng-show="showAdv">
<label class="item item-input item-stacked-label">
<span class="input-label">Wallet Service URL</span>
<input type="text" id="bwsurl" name="bwsurl" ng-model="bwsurl">
</label>
</div>
</div>
<div ng-show="seedSourceId == 'trezor' || seedSourceId == 'ledger'">
<button translate type="submit" class="button button-block button-positive">
Import
</button>
</div> <!-- seedoptions show -->
<label class="oh"><span translate>Account Number</span>
<input type="number" id="account" ng-model="account" ignore-mouse-wheel>
</label>
</div>
<div class="oh" ng-show="seedSourceId == 'trezor'">
<ion-toggle ng-model="isMultisig" toggle-class="toggle-balanced" class="bct">
<span class="toggle-label" translate>Shared Wallet</span>
</ion-toggle>
</div>
<div class="m10t oh" ng-init="hideAdv=true">
<a class="button outline light-gray expand tiny p10i" ng-click="hideAdv=!hideAdv">
<i class="fi-widget m3r"></i>
<span translate ng-hide="!hideAdv">Show advanced options</span>
<span translate ng-hide="hideAdv">Hide advanced options</span>
<i ng-if="hideAdv" class="icon-arrow-down4"></i>
<i ng-if="!hideAdv" class="icon-arrow-up4"></i>
</a>
</div>
<div ng-hide="hideAdv" class="row">
<div class="large-12 columns">
<label for="bws" class="oh">
<span>Wallet Service URL</span>
<input type="text" id="bwsurl" name="bwsurl" ng-model="bwsurl">
</label>
</div>
</div>
<button translate type="submit" class="button round expand black">
Import
</button>
</div> <!-- seedoptions show -->
</form>
</div>
</form>
</div>
</div>
</div>
<div class="extra-margin-bottom"></div>
</ion-content>
</ion-view>

216
public/views/join.html
View file

@ -1,130 +1,126 @@
<div
class="topbar-container"
ng-include="'views/includes/topbar.html'"
ng-init="titleSection='Join shared wallet'; goBackToState = 'add'; noColor = true">
</div>
<ion-view view-title="Join shared wallet" ng-controller="joinController as join">
<ion-nav-buttons side="primary">
<a href ui-sref="add" class="button icon-left ion-chevron-left button-clear button-dark">Add</a>
</ion-nav-buttons>
<ion-nav-buttons side="secondary">
<qr-scanner class="button button-clear button-positive" on-scan="join.onQrCodeScanned(data)"></qr-scanner>
</ion-nav-buttons>
<ion-content>
<div class="content p20v" ng-controller="joinController as join">
<form name="joinForm" ng-submit="join.join(joinForm)" novalidate>
<div class="box-notification m20b" ng-show="join.error">
<span class="text-warning">
{{join.error|translate}}
</span>
<div class="padding assertive" ng-show="join.error">
{{join.error|translate}}
</div>
<div class="row">
<div class="large-12 columns">
<div>
<label><span translate>Your nickname</span>
<div class="input">
<input type="text" placeholder="{{'John'|translate}}" class="form-control" name="myName" ng-model="myName" ng-required="true">
</div>
</label>
</div>
<form name="joinForm" ng-submit="join.join(joinForm)" novalidate>
<div class="row collapse">
<label for="secret" class="left"><span translate>Wallet Invitation</span>
<small translate ng-show="joinForm.secret.$pristine">Required</small>
</label>
<span class="has-error right size-12" ng-show="joinForm.secret.$invalid
&& !joinForm.secret.$pristine">
<span class="icon-input"><i class="fi-x"></i></span>
<span translate>Wallet Invitation is not valid!</span>
<div class="list">
<label class="item item-input item-stacked-label">
<span class="input-label" translate>Your nickname</span>
<input type="text"
placeholder="{{'John'|translate}}"
name="myName"
ng-model="myName"
ng-required="true">
</label>
<label class="item item-input item-stacked-label">
<span class="input-label">
Wallet Invitation
</span>
<small class="icon-input right" ng-show="joinForm.secret.$valid
&& !joinForm.secret.$pristine"><i class="fi-check"></i></small>
</div>
<i class="icon ion-checkmark-circled balanced" ng-show="joinForm.secret.$valid &&
!joinForm.secret.$pristine && secret"></i>
<i class="icon ion-close-circled assertive" ng-show="joinForm.secret.$invalid &&
!joinForm.secret.$pristine && secret"></i>
<input id="secret"
type="text"
placeholder="{{'Paste invitation here'|translate}}"
name="secret"
ng-model="secret"
wallet-secret required>
</label>
<div class="input">
<input id="secret" type="text" placeholder="{{'Paste invitation here'|translate}}" name="secret" ng-model="secret" wallet-secret required>
<div class="qr-scanner-input">
<qr-scanner on-scan="join.onQrCodeScanned(data)"></qr-scanner>
</div>
</div>
<ion-toggle ng-model="showAdv" toggle-class="toggle-stable">
<span translate ng-show="!showAdv">Show advanced options</span>
<span translate ng-show="showAdv">Hide advanced options</span>
</ion-toggle>
<div class="m10t oh" ng-init="hideAdv=true">
<a class="button outline light-gray expand tiny p10i" ng-click="hideAdv=!hideAdv">
<i class="fi-widget m3r"></i>
<span translate ng-hide="!hideAdv">Show advanced options</span>
<span translate ng-hide="hideAdv">Hide advanced options</span>
<i ng-if="hideAdv" class="icon-arrow-down4"></i>
<i ng-if="!hideAdv" class="icon-arrow-up4"></i>
</a>
</div>
<div ng-show="showAdv">
<div ng-hide="hideAdv" class="row">
<div class="large-12 columns">
<div>
<label for="bws" class="oh">
<span>Wallet Service URL</span>
<input type="text" id="bwsurl" name="bwsurl" ng-model="bwsurl">
</label>
<label class="item item-input item-stacked-label">
<span class="input-label">Wallet Service URL</span>
<input type="text" id="bwsurl" name="bwsurl" ng-model="bwsurl">
</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 join.seedOptions"
ng-change="join.setSeedSource()">
</select>
</label>
<div>
<label><span translate>Wallet Key </span>
<select class="m10t" ng-model="seedSource"
ng-options="seed as seed.label for seed in join.seedOptions"
ng-change="join.setSeedSource()">
</select>
</label>
</div>
<label class="item item-input item-stacked-label"
ng-show="join.seedSourceId == 'trezor' || join.seedSourceId == 'ledger'">
<span class="input-label" translate>Account Number</span>
<input type="number" id="account" ng-model="account" ignore-mouse-wheel>
</label>
<div ng-show="join.seedSourceId == 'trezor' || join.seedSourceId == 'ledger'">
<label class="oh"><span translate>Account Number</span>
<input type="number" id="account" ng-model="account" ignore-mouse-wheel>
</label>
</div>
<div class="box-notification" ng-show="join.seedSourceId=='new' && createPassphrase">
<span class="text-warning size-14">
<i class="fi-alert"></i>
<span translate>
<div class="card" ng-show="join.seedSourceId=='new' && createPassphrase">
<div class="item item-text-wrap">
<span translate>
WARNING: The password cannot be recovered. <b>Be sure to write it down</b>. The wallet can not be restored without the password.
</span>
</span>
</div>
</div>
<div ng-show="join.seedSourceId=='new' ">
<label for="createPassphrase" ><span translate>Add a Password</span> <small translate>Add an optional password to secure the recovery phrase</small>
<div class="input">
<input type="text" class="form-control" autocapitalize="off"
name="createPassphrase" ng-model="createPassphrase">
</div>
</label>
</div>
<label class="item item-input item-stacked-label" ng-show="join.seedSourceId=='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"
name="createPassphrase"
ng-model="createPassphrase">
</label>
<div ng-show="join.seedSourceId=='set'">
<label for="ext-master">
<span translate>Wallet Recovery Phrase</span>
<small translate>Enter the recovery phrase (BIP39)</small>
<input id="ext-master"
autocapitalize="off"
type="text"
name="privateKey" ng-model="privateKey">
</label>
</div>
<label class="item item-input item-stacked-label" ng-show="join.seedSourceId=='set'">
<span class="input-label" translate>Wallet Recovery Phrase</span>
<input id="ext-master"
placeholder="{{'Enter the recovery phrase (BIP39)'|translate}}"
autocapitalize="off"
type="text"
name="privateKey"
ng-model="privateKey">
</label>
<label class="item item-input item-stacked-label" ng-show="join.seedSourceId=='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"
name="passphrase"
ng-model="passphrase">
</label>
<label class="item item-input item-stacked-label" ng-show="join.seedSourceId == 'set'">
<span class="input-label" translate>Derivation Path</span>
<input type="text"
placeholder="{{'BIP32 path for address derivation'|translate}}"
name="derivationPath"
ng-model="derivationPath">
</label>
<div ng-show="join.seedSourceId=='set'">
<label for="passphrase"> <span translate>Password</span> <small translate>The recovery phrase could require a password to be imported</small>
<div class="input">
<input type="text" autocapitalize="off" class="form-control" name="passphrase" ng-model="passphrase">
</div>
</label>
</div>
<div ng-show="join.seedSourceId == 'set'">
<label class="oh"><span translate>Derivation Path</span> <small translate>BIP32 path for address derivation</small>
<input type="text" class="form-control" name="derivationPath" ng-model="derivationPath">
</label>
</div>
</div> <!-- columns -->
</div> <!-- advanced -->
</div> <!-- list -->
<button type="submit" class="button button-block button-positive" ng-disabled="joinForm.$invalid" translate>
Join
</button>
</form>
</ion-content>
</ion-view>
<button translate type="submit" class="button expand black m0 round"
ng-disabled="joinForm.$invalid">Join</button>
</div> <!-- large-12 columns -->
</div> <!-- row -->
</form>
</div>
<div class="extra-margin-bottom"></div>

4
src/js/controllers/import.js
View file

@ -178,8 +178,8 @@ angular.module('copayApp.controllers').controller('importController',
}, 100);
};
$scope.setDerivationPath = function() {
if ($scope.testnetEnabled)
$scope.setDerivationPath = function(testnetEnabled) {
if (testnetEnabled)
$scope.derivationPath = derivationPathHelper.defaultTestnet;
else
$scope.derivationPath = derivationPathHelper.default;

2
src/js/directives/qrScanner.js
View file

@ -70,6 +70,6 @@ angular.module('copayApp.directives')
},
controller: controller,
replace: true,
template: '<a id="camera-icon" class="p10" ng-click="openScanner()"><i class="icon-scan size-21"></i></a>'
template: '<a ng-click="openScanner()"><i class="icon ion-qr-scanner"></i></a>'
}
});

449
src/sass/main.scss Normal file
View file

@ -0,0 +1,449 @@
/*
*
* Copay main CSS
*
*/
// QR Code
#qr-canvas {
display: none;
}
#qrcode-scanner-video {
display: block;
margin: 0 auto;
}
// General purpose
.dn {
display: none;
}
.dni {
display: none !important;
}
.pr {
position: relative;
}
.pa {
position: absolute;
}
.m0 {
margin: 0;
}
.p0i {
padding: 0 !important;
}
.db {
display: block;
}
.dib {
display: inline-block;
}
.size-10 {
font-size: 10px;
}
.size-12 {
font-size: 12px;
}
.size-14 {
font-size: 14px;
}
.size-16 {
font-size: 16px;
}
.size-18 {
font-size: 18px;
}
.size-21 {
font-size: 21px;
}
.size-24 {
font-size: 24px;
}
.size-28 {
font-size: 28px;
}
.size-36 {
font-size: 36px;
}
.size-42 {
font-size: 42px;
}
.size-48 {
font-size: 48px;
}
.size-60 {
font-size: 60px;
}
.size-72 {
font-size: 72px;
}
.m5 {
margin: 5px;
}
.m5t {
margin-top: 5px;
}
.m8t {
margin-top: 8px;
}
.m5b {
margin-bottom: 5px;
}
.m5r {
margin-right: 5px;
}
.m10 {
margin: 10px;
}
.m10b {
margin-bottom: 10px;
}
.m3t {
margin-top: 3px;
}
.m10t {
margin-top: 10px;
}
.m15b {
margin-bottom: 15px;
}
.m15r {
margin-right: 15px;
}
.m20b {
margin-bottom: 20px;
}
.m30b {
margin-bottom: 30px;
}
.m40b {
margin-bottom: 40px;
}
.m50b {
margin-bottom: 50px;
}
.m10r {
margin-right: 10px;
}
.m40r {
margin-right: 40px;
}
.m25r {
margin-right: 25px;
}
.m10l {
margin-left: 10px;
}
.m5l {
margin-left: 5px;
}
.m15l {
margin-left: 15px;
}
.m15t {
margin-top: 15px;
}
.m20r {
margin-right: 20px;
}
.m20t {
margin-top: 20px;
}
.m20ti {
margin-top: 20px !important;
}
.m20tp {
margin-top: 20%;
}
.m30tp {
margin-top: 30%;
}
.m15 {
margin: 15px;
}
.m15h {
margin: 0 15px;
}
.p10t {
padding-top: 10px;
}
.p10h {
padding-right: 10px;
padding-left: 10px;
}
.p15h {
padding: 0 15px;
}
.p0r {
padding-right: 0;
}
.p70r {
padding-right: 70px;
}
.p70l {
padding-left: 70px;
}
.p5h {
padding: 0 5px;
}
.p20h {
padding: 0 20px;
}
.p20v {
padding: 20px 0;
}
.p20b {
padding-bottom: 20px;
}
.p25b {
padding-bottom: 25px;
}
.p25l {
padding-left: 25px;
}
.p15l {
padding-left: 15px;
}
.p15 {
padding: 15px;
}
.p20 {
padding: 20px;
}
.p15t {
padding-top: 15px;
}
.p20t {
padding-top: 20px;
}
.p50t {
padding-top: 50px;
}
.p10 {
padding: 10px;
}
.p10i {
padding: 10px !important;
}
.p10b {
padding-bottom: 10px;
}
.p45t {
padding-top: 45px;
}
.p60t {
padding-top: 60px;
}
.p60b {
padding-bottom: 60px;
}
.m60t {
margin-top: 60px;
}
.p45li {
padding-left: 45px !important;
}
.m30v {
margin: 30px 0;
}
.m10h {
margin: 0 10px;
}
.m10v {
margin: 10px 0;
}
.m20v {
margin: 20px 0;
}
.m30v {
margin: 30px 0;
}
.m30a {
margin: 30px auto;
}
.m-negative-l {
margin-left: -0.9375rem;
}
.br100 {
border-radius: 100% !important;
}
.lh {
line-height: 0;
}
.lh140 {
line-height: 140%;
}
.oh {
overflow: hidden;
}
.vm {
vertical-align: middle;
}
.vt {
vertical-align: top;
}
.ma {
margin: 0 auto;
}
.tu {
text-transform: uppercase;
}
.tl {
text-transform: lowercase;
}
/*
* Calculator
*/
.calculator .header-calc {
position: absolute;
width: 100%;
text-align: center;
}
.calculator .button-calc {
position: absolute;
width: 100%;
bottom: 0;
}
.calculator .button-calc .row {
padding: 0 !important;
}
.calculator .button-calc .columns {
cursor: pointer;
text-align: center;
}
.calculator .button-calc .operator {
color: #2C3E50;
background-color: #eee;
}
.calculator .button-calc .columns:active {
background-color: #eee;
}
.calculator .button-calc .operator:active {
background-color: #f8f8f8;
}
// No looks likes locked
input[type="number"] {
&[readonly] {
background-color: #F6F7F9;
padding-left: 0;
}
}
@media all and (max-height: 480px) {
.calculator .button-calc .columns { padding: 10px; }
.calculator .header-calc { top: 11%; }
}
@media (min-height: 481px) and (max-height: 670px) {
.calculator .button-calc .columns { padding: 15px; }
.calculator .header-calc { top: 15%; }
}
@media all and (min-height: 671px) {
.calculator .button-calc .columns { padding: 20px; }
.calculator .header-calc { top: 18%; }
}