|
|
|
@ -1,8 +1,10 @@ |
|
|
|
|
import EventEmitter from 'events' |
|
|
|
|
import React, {Component, PropTypes} from 'react' |
|
|
|
|
import {connect} from 'react-redux'; |
|
|
|
|
import {createNewVaultAndKeychain} from '../../../../ui/app/actions' |
|
|
|
|
import LoadingScreen from './loading-screen' |
|
|
|
|
import Breadcrumbs from './breadcrumbs' |
|
|
|
|
import Mascot from '../../../../ui/app/components/mascot' |
|
|
|
|
|
|
|
|
|
class CreatePasswordScreen extends Component { |
|
|
|
|
static propTypes = { |
|
|
|
@ -18,6 +20,11 @@ class CreatePasswordScreen extends Component { |
|
|
|
|
confirmPassword: '' |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
constructor () { |
|
|
|
|
super() |
|
|
|
|
this.animationEventEmitter = new EventEmitter() |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
isValid() { |
|
|
|
|
const {password, confirmPassword} = this.state; |
|
|
|
|
|
|
|
|
@ -50,52 +57,70 @@ class CreatePasswordScreen extends Component { |
|
|
|
|
return isLoading |
|
|
|
|
? <LoadingScreen loadingMessage="Creating your new account" /> |
|
|
|
|
: ( |
|
|
|
|
<div className="create-password"> |
|
|
|
|
<div className="create-password__title"> |
|
|
|
|
Create Password |
|
|
|
|
<div> |
|
|
|
|
<h2 className="alpha-warning">Warning This is Experemental software and is a Developer BETA </h2> |
|
|
|
|
<div className="first-view-main"> |
|
|
|
|
<div className="mascara-info"> |
|
|
|
|
<Mascot |
|
|
|
|
animationEventEmitter={this.animationEventEmitter} |
|
|
|
|
width="225" |
|
|
|
|
height="225" |
|
|
|
|
/> |
|
|
|
|
<div className="info"> |
|
|
|
|
MetaMask is a secure identity vault for Ethereum. |
|
|
|
|
</div> |
|
|
|
|
<div className="info"> |
|
|
|
|
It allows you to hold ether & tokens, and interact with decentralized applications. |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div className="create-password"> |
|
|
|
|
<div className="create-password__title"> |
|
|
|
|
Create Password |
|
|
|
|
</div> |
|
|
|
|
<input |
|
|
|
|
className="first-time-flow__input" |
|
|
|
|
type="password" |
|
|
|
|
placeholder="New Password (min 8 characters)" |
|
|
|
|
onChange={e => this.setState({password: e.target.value})} |
|
|
|
|
/> |
|
|
|
|
<input |
|
|
|
|
className="first-time-flow__input create-password__confirm-input" |
|
|
|
|
type="password" |
|
|
|
|
placeholder="Confirm Password" |
|
|
|
|
onChange={e => this.setState({confirmPassword: e.target.value})} |
|
|
|
|
/> |
|
|
|
|
<button |
|
|
|
|
className="first-time-flow__button" |
|
|
|
|
disabled={!this.isValid()} |
|
|
|
|
onClick={this.createAccount} |
|
|
|
|
> |
|
|
|
|
Create |
|
|
|
|
</button> |
|
|
|
|
<a |
|
|
|
|
href="" |
|
|
|
|
className="first-time-flow__link create-password__import-link" |
|
|
|
|
onClick={e => { |
|
|
|
|
e.preventDefault() |
|
|
|
|
goToImportWithSeedPhrase() |
|
|
|
|
}} |
|
|
|
|
> |
|
|
|
|
Import with seed phrase |
|
|
|
|
</a> |
|
|
|
|
{ /* } |
|
|
|
|
<a |
|
|
|
|
href="" |
|
|
|
|
className="first-time-flow__link create-password__import-link" |
|
|
|
|
onClick={e => { |
|
|
|
|
e.preventDefault() |
|
|
|
|
goToImportAccount() |
|
|
|
|
}} |
|
|
|
|
> |
|
|
|
|
Import an account |
|
|
|
|
</a> |
|
|
|
|
{ */ } |
|
|
|
|
<Breadcrumbs total={3} currentIndex={0} /> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<input |
|
|
|
|
className="first-time-flow__input" |
|
|
|
|
type="password" |
|
|
|
|
placeholder="New Password (min 8 characters)" |
|
|
|
|
onChange={e => this.setState({password: e.target.value})} |
|
|
|
|
/> |
|
|
|
|
<input |
|
|
|
|
className="first-time-flow__input create-password__confirm-input" |
|
|
|
|
type="password" |
|
|
|
|
placeholder="Confirm Password" |
|
|
|
|
onChange={e => this.setState({confirmPassword: e.target.value})} |
|
|
|
|
/> |
|
|
|
|
<button |
|
|
|
|
className="first-time-flow__button" |
|
|
|
|
disabled={!this.isValid()} |
|
|
|
|
onClick={this.createAccount} |
|
|
|
|
> |
|
|
|
|
Create |
|
|
|
|
</button> |
|
|
|
|
<a |
|
|
|
|
href="" |
|
|
|
|
className="first-time-flow__link create-password__import-link" |
|
|
|
|
onClick={e => { |
|
|
|
|
e.preventDefault() |
|
|
|
|
goToImportWithSeedPhrase() |
|
|
|
|
}} |
|
|
|
|
> |
|
|
|
|
Import with seed phrase |
|
|
|
|
</a> |
|
|
|
|
{ /* } |
|
|
|
|
<a |
|
|
|
|
href="" |
|
|
|
|
className="first-time-flow__link create-password__import-link" |
|
|
|
|
onClick={e => { |
|
|
|
|
e.preventDefault() |
|
|
|
|
goToImportAccount() |
|
|
|
|
}} |
|
|
|
|
> |
|
|
|
|
Import an account |
|
|
|
|
</a> |
|
|
|
|
{ */ } |
|
|
|
|
<Breadcrumbs total={3} currentIndex={0} /> |
|
|
|
|
</div> |
|
|
|
|
) |
|
|
|
|
} |
|
|
|
|