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

Merge pull request #1978 from bechi/feature/funnel

Browse source 
Funnel
This commit is contained in:
Matias Alejo Garcia 2014-12-05 17:37:08 -03:00
commit 5bba50b18d
21 changed files with 547 additions and 226 deletions
Download patch file Download diff file Expand all files Collapse all files

210
views/createProfile.html
View file

@ -20,13 +20,12 @@
</div>
</div>
<div class="large-4 large-centered medium-6 medium-centered columns" ng-show="!loading && !askForPin">
<div class="large-4 large-centered medium-6 medium-centered columns m20b" ng-show="!loading && !askForPin">
<div class="logo-setup">
<img src="img/logo-negative-beta.svg" alt="Copay" width="146" height="59">
<img src="img/logo-negative-beta.svg" alt="Copay" width="100">
<div ng-include="'views/includes/version.html'"></div>
</div>
<div class="box-setup">
<h1>Create Profile</h1>
<div>
<div class="box-notification" ng-show="error">
<div class="box-icon error">
<i class="fi-x size-24"></i>
@ -35,66 +34,174 @@
{{error|translate}}
</span>
</div>
<form name="profileForm" ng-submit="createProfile(profileForm)" novalidate>
<div class="m5b text-right">
<span translate class="has-error size-12" ng-show="profileForm.email.$invalid &&
!profileForm.email.$pristine">
<span class="icon-input"><i class="fi-x"></i></span>
Not valid
</span>
<span class="icon-input" ng-show="!profileForm.email.$invalid &&
!profileForm.email.$pristine"><i class="fi-check"></i></span>
<form ng-show="createStep == 'storage' " novalidate>
<div class="clipo">
<img src="img/clipo-signup1.png" alt="clipo" width="311">
</div>
<div class="input">
<input type="email" ng-model="email" class="form-control fi-email" name="email" placeholder="Email"
show-focus="!isMobile" required>
<i class="icon-email"></i>
<tabset>
<tab style="width: 50%;" select="selectStorage('remote')">
<tab-heading>
<span class="text-bold">In the Cloud </span><br>
<span class="size-10 text-gray">( Recommended )</span>
</tab-heading>
<div class="content-item">
<div class="bg-circle"><i class="icon-wallet"></i>
</div>
<span class="text-gray">Access your wallets anywhere</span>
</div>
<div class="content-item">
<div class="bg-circle"><i class="icon-download"></i>
</div>
<span class="text-gray">Backups managed by the server</span>
</div>
<div class="content-item line-none">
<div class="bg-circle"><i class="icon-email"></i>
</div>
<span class="text-gray">Email address confirmation needed</span>
</div>
</tab>
<tab style="width: 50%;" select="selectStorage('local')">
<tab-heading>
<div class="m5t text-bold">In this Device </div>
</tab-heading>
<div class="content-item">
<div class="bg-circle"><i class="icon-locked"></i>
</div>
<span class="text-gray">Your private keys never leave this device</span>
</div>
<div class="content-item">
<div class="bg-circle"><i class="icon-person"></i>
</div>
<span class="text-gray">No email required</span>
</div>
<div class="content-item line-none">
<div class="bg-circle"><i class="icon-download"></i>
</div>
<span class="text-gray">Need to be careful with backups</span>
</div>
</tab>
</tabset>
<button translate class="button primary radius expand m0" ng-click="goToEmail()">
<span ng-if="!useLocalstorage"> Create in the cloud</span>
<span ng-if="useLocalstorage"> Create in this device</span>
</button>
<div class="box-setup-footer">
<div class="left">
<a class="text-gray" href="#!/">
<i class="icon-arrow-left4"></i>
<span translate>Back</span>
</a>
</div>
<div class="right">
<a class="text-gray" href="https://copay.io/profile-storage"
<span translate>Learn more about this option</span>
</a>
</div>
</div>
</form>
<form ng-show="createStep == 'email'" name="emailForm" ng-submit="setEmailOrUsername(emailForm)" novalidate>
<div class="clipo" ng-if="useLocalstorage">
<img src="img/clipo-signup2-1.png" alt="clipo" width="373">
</div>
<div class="clipo" ng-if="!useLocalstorage">
<img src="img/clipo-signup2.png" alt="clipo" width="373">
</div>
<div class="input">
<input id="password" type="password" ng-model="$parent.password"
class="form-control" name="password" placeholder="{{'Choose a password'|translate}}" check-strength="passwordStrength"
tooltip-html-unsafe="Password strength: <b>{{passwordStrength}}</b><br/><span class='size-12'>Tip: Use lower and uppercase, numbers and symbols</span>" tooltip-trigger="focus" required tooltip-placement="top">
<i class="icon-locked"></i>
<h2 ng-if="useLocalstorage"> Creating in this device </h2>
<h2 ng-if="!useLocalstorage"> Creating in the cloud </h2>
<div class="input" ng-if="useEmail">
<input type="email" ng-model="email" class="form-control fi-email" name="email" placeholder="Email" required auto-focus="!isMobile">
<i class="icon-email"></i>
<div class="icon-input m5b text-right" ng-if="useEmail">
<span translate class="has-error size-12" ng-show="emailForm.email.$invalid &&
!emailForm.email.$pristine">
<div class="">
<i class="fi-x"></i>
Not valid
</div>
</span>
<div class="" ng-show="!emailForm.email.$invalid &&
!emailForm.email.$pristine"><i class="fi-check"></i></div>
</div>
</div>
<div class="input" ng-if="!useEmail">
<input type="text" ng-model="username" class="form-control fi-user" name="username" placeholder="Username" required auto-focus>
<i class="icon-person"></i>
</div>
<button translate type="submit" class="button primary radius expand m0" ng-disabled="(useEmail && emailForm.email.$invalid) || (!useEmail && emailForm.username.$invalid)">
Next
</button
>
<div class="box-setup-footer">
<div class="left">
<a class="text-gray" ng-click="setStep('storage')">
<i class="icon-arrow-left4"></i>
<span translate>Back</span>
</a>
</div>
</div>
<div class="m5b text-right">
<span translate class="has-error size-12" ng-show="profileForm.repeatpassword.$dirty &&
profileForm.repeatpassword.$invalid">
<span class="icon-input"><i class="fi-x"></i></span>
{{'Passwords must match'|translate}}
</span>
<span class="icon-input" ng-show="profileForm.repeatpassword.$dirty &&
!profileForm.repeatpassword.$invalid"><i class="fi-check"></i></span>
</form>
<form ng-show="createStep == 'pass'" name="passForm" ng-submit="createProfile(passForm)" novalidate>
<div class="clipo">
<img src="img/clipo-signup3.png" alt="clipo" width="380">
</div>
<h2 ng-if="useLocalstorage"> Creating in this device </h2>
<h2 ng-if="!useLocalstorage"> Creating in the cloud </h2>
<div class="text-gray text-center m20b"> {{userOrEmail}} </div>
<div class="input">
<input id="password" type="password" ng-model="$parent.password" class="form-control" name="password" placeholder="{{'Choose a password'|translate}}" check-strength="passwordStrength" tooltip-html-unsafe="Password strength: <b>{{passwordStrength}}</b><br/><span class='size-12'>Tip: Use lower and uppercase, numbers and symbols</span>" tooltip-trigger="focus" required tooltip-placement="top">
<i class="icon-locked"></i>
</div>
<div class="input">
<input type="password" ng-model="repeatpassword" class="input form-control" name="repeatpassword" placeholder="{{'Repeat password'|translate}}" match="password" required>
<i class="icon-locked"></i>
</div>
<div class="icon-input m5b text-right">
<span translate class="has-error size-12" ng-show="passForm.repeatpassword.$dirty &&
passForm.repeatpassword.$invalid">
<div>
<i class="fi-x"></i>
{{'Passwords must match'|translate}}
</div>
</span>
<div class="" ng-show="passForm.repeatpassword.$dirty &&
!passForm.repeatpassword.$invalid"><i class="fi-check"></i></div>
</div>
</div>
<button translate type="submit" class="button primary radius expand m0" ng-disabled="profileForm.$invalid || loading">
Create
<button translate type="submit" class="button primary radius expand m0" ng-disabled="passForm.$invalid || loading">
Create Profile
</button>
<div class="box-setup-footer">
<div class="left">
<a class="text-gray" ng-click="setStep('email')">
<i class="icon-arrow-left4"></i>
<span translate>Back</span>
</a>
</div>
</div>
</form>
<div class="box-setup-footer">
<div class="left">
<a class="text-gray" href="#!/">
<i class="icon-arrow-left4"></i>
<span translate>Back</span>
</a>
</div>
<div class="right">
<a class="right size-12 text-gray" href="#!/settings">
<i class="icon-wrench"></i>
<span translate>Settings</span>
</a>
</div>
</div>
</div>
</div>
<div class="large-4 large-centered medium-6 medium-centered columns" ng-show="!loading && askForPin">
<div class="large-4 large-centered medium-6 medium-centered columns m20b" ng-show="!loading && askForPin">
<div class="box-setup">
<h1><span translate>Set up a </span> <b> PIN </b>?</h1>
<p class="size-14">Enter a 4-digit number for easier access from this device</p>
@ -125,15 +232,14 @@
</a>
</div>
<div class="large-6 medium-6 small-6 columns text-right">
<button translate type="submit" class="button primary radius expand m0"
ng-disabled="setPinForm.$invalid || error">
OK
<button translate type="submit" class="button primary radius expand m0" ng-disabled="setPinForm.$invalid || error">
OK
</button>
</div>
</div>
</form>
</form>
</div>
</div>
</div>

136
views/home.html
View file

@ -3,10 +3,18 @@
<div class="loading-screen" ng-show="$root.starting">
<div class="spinner">
<div class="contener_general">
<div class="contener_mixte"><div class="ballcolor ball_1">&nbsp;</div></div>
<div class="contener_mixte"><div class="ballcolor ball_2">&nbsp;</div></div>
<div class="contener_mixte"><div class="ballcolor ball_3">&nbsp;</div></div>
<div class="contener_mixte"><div class="ballcolor ball_4">&nbsp;</div></div>
<div class="contener_mixte">
<div class="ballcolor ball_1">&nbsp;</div>
</div>
<div class="contener_mixte">
<div class="ballcolor ball_2">&nbsp;</div>
</div>
<div class="contener_mixte">
<div class="ballcolor ball_3">&nbsp;</div>
</div>
<div class="contener_mixte">
<div class="ballcolor ball_4">&nbsp;</div>
</div>
</div>
<span class="text-gray size-12" translate>Accessing your profile...</span>
</div>
@ -14,18 +22,10 @@
<div class="large-4 large-centered medium-7 medium-centered columns" ng-show="!$root.starting">
<div class="logo-setup" ng-show="!$root.iden">
<img src="img/logo-negative-beta.svg" alt="Copay" width="146" height="59">
<img src="img/logo-negative-beta.svg" alt="Copay" width="100">
<div ng-include="'views/includes/version.html'"></div>
</div>
<div class="p10 box-setup bg-success m10b text-white" ng-show="pendingPayment">
<div class="left">
<i class="size-36 m10r"></i>
</div>
<div class="size-14">
Please sign in to make the payment
</div>
</div>
<div class="p10 box-setup bg-success m10b text-white" ng-show="confirmedEmail">
<div class="left">
<i class="size-36 fi-check m10r"></i>
@ -34,45 +34,30 @@
<h3>
Your email was confimed!
</h3>
Please sign in to access your wallets
</div>
</div>
<div class="p10 box-setup bg-success m10b text-white" ng-show="anyWallet && !confirmedEmail && !error">
<div class="left">
<i class="size-36 fi-alert m10r"></i>
</div>
<b>Copay now needs a profile to access wallets.</b>
You can import your current wallets after
<a class="text-white" href="#!/createProfile">creating your profile</a>
</div>
<div class="box-setup" ng-if="askForPin">
<h1><span translate>Set up a </span> <b> PIN </b>?</h1>
<p class="size-14"> Enter a 4-digit number for easier access from this device</p>
<p class="size-14">Enter a 4-digit number for easier access from this device</p>
<div class="box-notification" ng-show="error">
<div class="box-icon error">
<i class="fi-x size-24"></i>
</div>
</div>
<span class="text-warning size-14">
{{error|translate}}
</span>
</div>
<form name="setPinForm" ng-model="setPinForm" ng-submit="createPin(setPinForm)" novalidate>
<form name="setPinForm" ng-model="setPinForm" ng-submit="createPin(setPinForm)" novalidate>
<div class="input" ng-show="askForPin == 1">
<input id="newpin" type="tel" ng-model="newpin" class="form-control"
ng-maxlength="4" ng-minlength="4" maxlength="4"
ng-pattern="/^[0-9]{1,4}$/"
placeholder="PIN" name="newpin" required show-focus="askForPin == 1">
<input id="newpin" type="tel" ng-model="newpin" class="form-control" ng-maxlength="4" ng-minlength="4" maxlength="4" ng-pattern="/^[0-9]{1,4}$/" placeholder="PIN" name="newpin" required show-focus="askForPin == 1">
<i class="icon-locked"></i>
</div>
<div class="input" ng-show="askForPin == 2">
<input id="repeatpin" type="tel" ng-model="repeatpin" class="form-control"
ng-maxlength="4" ng-minlength="4" maxlength="4"
ng-pattern="/^[0-9]{1,4}$/"
placeholder="Confirm your PIN" name="repeatpin" required show-focus="askForPin == 2">
<input id="repeatpin" type="tel" ng-model="repeatpin" class="form-control" ng-maxlength="4" ng-minlength="4" maxlength="4" ng-pattern="/^[0-9]{1,4}$/" placeholder="Confirm your PIN" name="repeatpin" required show-focus="askForPin == 2">
<i class="icon-locked"></i>
</div>
@ -83,15 +68,14 @@
</a>
</div>
<div class="large-6 medium-6 small-6 columns text-right">
<button translate type="submit" class="button primary radius expand m0"
ng-disabled="setPinForm.$invalid || error">
OK
<button translate type="submit" class="button primary radius expand m0" ng-disabled="setPinForm.$invalid || error">
OK
</button>
</div>
</div>
</form>
</form>
</div>
<div class="box-setup" ng-if='$root.hasPin'>
@ -100,17 +84,14 @@
<div class="box-notification" ng-show="error">
<div class="box-icon error">
<i class="fi-x size-24"></i>
</div>
</div>
<span class="text-warning size-14">
{{error|translate}}
</span>
</div>
<div class="input">
<input id="pin" type="tel" ng-model="pin" class="form-control"
ng-maxlength="4" ng-minlength="4" maxlength="4"
ng-pattern="/^[0-9]{1,4}$/"
placeholder="Pin number" name="pin" required>
<input id="pin" type="tel" ng-model="pin" class="form-control" ng-maxlength="4" ng-minlength="4" maxlength="4" ng-pattern="/^[0-9]{1,4}$/" placeholder="Pin number" name="pin" required>
<i class="icon-locked"></i>
</div>
@ -122,41 +103,64 @@
</a>
</div>
<div class="large-6 medium-6 small-6 columns text-right">
<button translate type="submit" class="button primary radius expand m0"
ng-disabled="pinForm.$invalid || error">
Sign in
<button translate type="submit" class="button primary radius expand m0" ng-disabled="pinForm.$invalid || error">
Sign in
</button>
</div>
</div>
</form>
</div>
</form>
</div>
<div class="box-setup" ng-if='!$root.hasPin && !askForPin'>
<h1><span translate>Sign in to</span> <b>Copay</b></h1>
<div ng-if='!$root.hasPin && !askForPin'>
<div class="clipo">
<img src="img/clipo-signin.png" alt="clipo" width="310">
</div>
<h2 translate>Sign in to Copay</h2>
<div class="p10 m20b size-14 box-setup bg-success text-white" ng-show="anyWallet && !confirmedEmail && !error">
<div class="left">
<i class="size-36 fi-alert m10r"></i>
</div>
<b>Copay now needs a profile to access wallets.</b>
You can import your current wallets after
<a class="text-white" href="#!/createProfile">creating your profile</a>
</div>
<div class="p10 box-setup bg-success m20b text-white" ng-show="pendingPayment">
<div class="left">
<i class="size-36 m10r"></i>
</div>
<div class="size-14">
Please sign in to make the payment
</div>
</div>
<form name="loginForm" ng-submit="openWithCredentials(loginForm)" novalidate>
<p class="text-warning size-12"
ng-show="error">
<i class="fi-x"></i>
{{error|translate}}
</p>
<div class="input">
<input type="email" ng-model="email" class="form-control"
name="email" placeholder="Email" required show-focus="!isMobile">
<p class="text-warning size-12" ng-show="error">
<i class="fi-x"></i> {{error|translate}}
</p>
<div class="input" ng-if="!usingLocalStorage">
<input type="email" ng-model="email" class="form-control" name="email" placeholder="Email" required show-focus="!isMobile">
<i class="icon-email"></i>
</div>
<div class="input" ng-if="usingLocalStorage">
<input type="text" ng-model="email" class="form-control" name="email" placeholder="Username" required show-focus="!isMobile">
<i class="icon-person"></i>
</div>
<div class="input">
<input type="password" ng-model="password" class="form-control"
name="password" placeholder="Password" required>
<input type="password" ng-model="password" class="form-control" name="password" placeholder="Password" required>
<i class="icon-locked"></i>
</div>
<button translate type="submit" class="button primary radius expand m0"
ng-disabled="loginForm.$invalid || loading">
Sign in
<button translate type="submit" class="button primary radius expand m0" ng-disabled="loginForm.$invalid || loading">
Sign in
</button>
</form>
<div ng-if="usingLocalStorage" class="text-gray size-12">
* Using this device storage. Change to cloud storage on 'settings'.
</div>
<div class="box-setup-footer">
<div class="left m10r">
<a class="button-setup text-gray" href="#!/createProfile">

10
views/importProfile.html
View file

@ -18,8 +18,8 @@
<img src="img/logo-negative-beta.svg" alt="Copay" width="146" height="59">
<div ng-include="'views/includes/version.html'"></div>
</div>
<div class="box-setup">
<h1 translate>Import Profile</h1>
<div>
<h2 translate>Import Profile</h2>
<form name="importProfileForm" ng-submit="import(importProfileForm)" novalidate>
<div class="box-notification" ng-show="error">
<div class="box-icon error">
@ -32,10 +32,12 @@
<div ng-show="!is_iOS">
<legend for="backupFile" class="m10b">
<span translate>Choose backup file</span>
<span class="text-gray size-12" translate>Choose backup file</span>
</legend>
<input type="file" class="form-control"
<div class="input">
<input type="file" class="db form-control"
placeholder="{{'Select a backup file'|translate}}" name="backupFile" ng-model="backupFile" ng-file-select>
</div>
</div>
<div ng-show="is_iOS">

6
views/settings.html
View file

@ -51,12 +51,12 @@
</div>
</fieldset>
<fieldset>
<legend translate>Wallet and profile storage</legend>
<label for="insightTestnet">Store wallet and profiles on</label>
<legend translate>Storage</legend>
<label for="insightTestnet">Read and Store Profiles:</label>
<select class="form-control" ng-model="selectedStorage" ng-options="o.name for o in availableStorages" required>
</select>
<div translate class="small text-gray">
Wallets and profiles are stored encrypted using your password as a key. You can store the encrypted data locally, on your platform, or remotely on the Insight Server. <a target="_blank" href="https://github.com/bitpay/copay/tree/master/js/plugins">More pluggins are welcomed!</a>
Wallets and profiles are stored encrypted using your password as a key. You can store the encrypted data locally, on this device, or remotely on the cloud (Insight Server). <a target="_blank" href="https://github.com/bitpay/copay/tree/master/js/plugins">More pluggins are welcomed!</a>
</div>
</fieldset>
<fieldset>