aboutsummaryrefslogtreecommitdiffstats
path: root/ui
diff options
context:
space:
mode:
Diffstat (limited to 'ui')
-rw-r--r--ui/app/account-detail.js1
-rw-r--r--ui/app/accounts/index.js14
-rw-r--r--ui/app/actions.js208
-rw-r--r--ui/app/app.js87
-rw-r--r--ui/app/components/identicon.js30
-rw-r--r--ui/app/components/network.js3
-rw-r--r--ui/app/eth-store-warning.js89
-rw-r--r--ui/app/first-time/create-vault.js129
-rw-r--r--ui/app/first-time/init-menu.js131
-rw-r--r--ui/app/keychains/hd/create-vault-complete.js (renamed from ui/app/first-time/create-vault-complete.js)3
-rw-r--r--ui/app/keychains/hd/recover-seed/confirmation.js (renamed from ui/app/recover-seed/confirmation.js)4
-rw-r--r--ui/app/keychains/hd/restore-vault.js (renamed from ui/app/first-time/restore-vault.js)16
-rw-r--r--ui/app/new-keychain.js29
-rw-r--r--ui/app/reducers/app.js17
-rw-r--r--ui/app/reducers/metamask.js6
-rw-r--r--ui/app/unlock.js16
-rw-r--r--ui/index.js2
17 files changed, 329 insertions, 456 deletions
diff --git a/ui/app/account-detail.js b/ui/app/account-detail.js
index 01c7e8781..c41ba61fd 100644
--- a/ui/app/account-detail.js
+++ b/ui/app/account-detail.js
@@ -30,7 +30,6 @@ function mapStateToProps (state) {
network: state.metamask.network,
unconfTxs: valuesFor(state.metamask.unconfTxs),
unconfMsgs: valuesFor(state.metamask.unconfMsgs),
- isEthWarningConfirmed: state.metamask.isEthConfirmed,
shapeShiftTxList: state.metamask.shapeShiftTxList,
}
}
diff --git a/ui/app/accounts/index.js b/ui/app/accounts/index.js
index 7551c498e..2e8321a77 100644
--- a/ui/app/accounts/index.js
+++ b/ui/app/accounts/index.js
@@ -34,11 +34,7 @@ AccountsScreen.prototype.render = function () {
var state = this.props
var identityList = valuesFor(state.identities)
var unconfTxList = valuesFor(state.unconfTxs)
- var actions = {
- onSelect: this.onSelect.bind(this),
- onShowDetail: this.onShowDetail.bind(this),
- goHome: this.goHome.bind(this),
- }
+
return (
h('.accounts-section.flex-grow', [
@@ -46,7 +42,7 @@ AccountsScreen.prototype.render = function () {
// subtitle and nav
h('.section-title.flex-center', [
h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', {
- onClick: actions.goHome,
+ onClick: this.goHome.bind(this),
}),
h('h2.page-subtitle', 'Select Account'),
]),
@@ -87,7 +83,7 @@ AccountsScreen.prototype.render = function () {
h('div.footer.hover-white.pointer', {
key: 'reveal-account-bar',
onClick: () => {
- this.onRevealAccount()
+ this.addNewAccount()
},
style: {
display: 'flex',
@@ -146,8 +142,8 @@ AccountsScreen.prototype.onShowDetail = function (address, event) {
this.props.dispatch(actions.showAccountDetail(address))
}
-AccountsScreen.prototype.onRevealAccount = function () {
- this.props.dispatch(actions.revealAccount())
+AccountsScreen.prototype.addNewAccount = function () {
+ this.props.dispatch(actions.addNewAccount(0))
}
AccountsScreen.prototype.goHome = function () {
diff --git a/ui/app/actions.js b/ui/app/actions.js
index 1f0d8fc78..070ba2da0 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -1,4 +1,6 @@
var actions = {
+ _setBackgroundConnection: _setBackgroundConnection,
+
GO_HOME: 'GO_HOME',
goHome: goHome,
// menu state
@@ -16,17 +18,16 @@ var actions = {
SHOW_INIT_MENU: 'SHOW_INIT_MENU',
SHOW_NEW_VAULT_SEED: 'SHOW_NEW_VAULT_SEED',
SHOW_INFO_PAGE: 'SHOW_INFO_PAGE',
- RECOVER_FROM_SEED: 'RECOVER_FROM_SEED',
- CLEAR_SEED_WORD_CACHE: 'CLEAR_SEED_WORD_CACHE',
- clearSeedWordCache: clearSeedWordCache,
- recoverFromSeed: recoverFromSeed,
unlockMetamask: unlockMetamask,
unlockFailed: unlockFailed,
showCreateVault: showCreateVault,
showRestoreVault: showRestoreVault,
showInitializeMenu: showInitializeMenu,
- createNewVault: createNewVault,
+ createNewVaultAndKeychain: createNewVaultAndKeychain,
+ createNewVaultAndRestore: createNewVaultAndRestore,
createNewVaultInProgress: createNewVaultInProgress,
+ addNewKeyring,
+ addNewAccount,
showNewVaultSeed: showNewVaultSeed,
showInfoPage: showInfoPage,
// seed recovery actions
@@ -53,8 +54,6 @@ var actions = {
SHOW_ACCOUNTS_PAGE: 'SHOW_ACCOUNTS_PAGE',
SHOW_CONF_TX_PAGE: 'SHOW_CONF_TX_PAGE',
SHOW_CONF_MSG_PAGE: 'SHOW_CONF_MSG_PAGE',
- REVEAL_ACCOUNT: 'REVEAL_ACCOUNT',
- revealAccount: revealAccount,
SET_CURRENT_FIAT: 'SET_CURRENT_FIAT',
setCurrentFiat: setCurrentFiat,
// account detail screen
@@ -68,10 +67,6 @@ var actions = {
showPrivateKey: showPrivateKey,
SAVE_ACCOUNT_LABEL: 'SAVE_ACCOUNT_LABEL',
saveAccountLabel: saveAccountLabel,
- AGREE_TO_ETH_WARNING: 'AGREE_TO_ETH_WARNING',
- agreeToEthWarning: agreeToEthWarning,
- SHOW_ETH_WARNING: 'SHOW_ETH_WARNING',
- showEthWarning: showEthWarning,
// tx conf screen
COMPLETED_TX: 'COMPLETED_TX',
TRANSACTION_ERROR: 'TRANSACTION_ERROR',
@@ -90,12 +85,12 @@ var actions = {
viewPendingTx: viewPendingTx,
VIEW_PENDING_TX: 'VIEW_PENDING_TX',
// app messages
+ confirmSeedWords: confirmSeedWords,
showAccountDetail: showAccountDetail,
BACK_TO_ACCOUNT_DETAIL: 'BACK_TO_ACCOUNT_DETAIL',
backToAccountDetail: backToAccountDetail,
showAccountsPage: showAccountsPage,
showConfTxPage: showConfTxPage,
- confirmSeedWords: confirmSeedWords,
// config screen
SHOW_CONFIG_PAGE: 'SHOW_CONFIG_PAGE',
SET_RPC_TARGET: 'SET_RPC_TARGET',
@@ -105,8 +100,6 @@ var actions = {
showConfigPage: showConfigPage,
setRpcTarget: setRpcTarget,
setProviderType: setProviderType,
- // hacky - need a way to get a reference to account manager
- _setAccountManager: _setAccountManager,
// loading overlay
SHOW_LOADING: 'SHOW_LOADING_INDICATION',
HIDE_LOADING: 'HIDE_LOADING_INDICATION',
@@ -143,13 +136,18 @@ var actions = {
RECOVERY_IN_PROGRESS: 'RECOVERY_IN_PROGRESS',
BACK_TO_UNLOCK_VIEW: 'BACK_TO_UNLOCK_VIEW',
backToUnlockView: backToUnlockView,
+ // SHOWING KEYCHAIN
+ SHOW_NEW_KEYCHAIN: 'SHOW_NEW_KEYCHAIN',
+ showNewKeychain: showNewKeychain,
+
+
}
module.exports = actions
-var _accountManager = null
-function _setAccountManager (accountManager) {
- _accountManager = accountManager
+var background = null
+function _setBackgroundConnection(backgroundConnection) {
+ background = backgroundConnection
}
function goHome () {
@@ -164,25 +162,57 @@ function tryUnlockMetamask (password) {
return (dispatch) => {
dispatch(actions.showLoadingIndication())
dispatch(actions.unlockInProgress())
- _accountManager.submitPassword(password, (err, selectedAccount) => {
+ background.submitPassword(password, (err, newState) => {
dispatch(actions.hideLoadingIndication())
if (err) {
- dispatch(actions.unlockFailed())
+ dispatch(actions.unlockFailed(err.message))
} else {
+ dispatch(this.updateMetamaskState(newState))
+ let selectedAccount
+ try {
+ selectedAccount = newState.metamask.selectedAccount
+ } catch (e) {}
dispatch(actions.unlockMetamask(selectedAccount))
}
})
}
}
-function createNewVault (password, entropy) {
+function confirmSeedWords () {
return (dispatch) => {
- dispatch(actions.createNewVaultInProgress())
- _accountManager.createNewVault(password, entropy, (err, result) => {
+ dispatch(actions.showLoadingIndication())
+ background.clearSeedWordCache((err, account) => {
+ dispatch(actions.hideLoadingIndication())
if (err) {
return dispatch(actions.showWarning(err.message))
}
- dispatch(actions.showNewVaultSeed(result))
+
+ console.log('Seed word cache cleared. ' + account)
+ dispatch(actions.showAccountDetail(account))
+ })
+ }
+}
+
+function createNewVaultAndRestore (password, seed) {
+ return (dispatch) => {
+ dispatch(actions.showLoadingIndication())
+ background.createNewVaultAndRestore(password, seed, (err, newState) => {
+ dispatch(actions.hideLoadingIndication())
+ if (err) return dispatch(actions.displayWarning(err.message))
+ dispatch(this.updateMetamaskState(newState))
+ })
+ }
+}
+
+function createNewVaultAndKeychain (password, entropy) {
+ return (dispatch) => {
+ background.createNewVaultAndKeychain(password, entropy, (err, newState) => {
+ if (err) {
+ return dispatch(actions.showWarning(err.message))
+ }
+
+ dispatch(this.updateMetamaskState(newState))
+ dispatch(this.showNewVaultSeed())
})
}
}
@@ -196,27 +226,39 @@ function revealSeedConfirmation () {
function requestRevealSeed (password) {
return (dispatch) => {
dispatch(actions.showLoadingIndication())
- _accountManager.tryPassword(password, (err, seed) => {
+ background.submitPassword(password, (err, newState) => {
dispatch(actions.hideLoadingIndication())
if (err) return dispatch(actions.displayWarning(err.message))
- _accountManager.recoverSeed((err, seed) => {
- if (err) return dispatch(actions.displayWarning(err.message))
- dispatch(actions.showNewVaultSeed(seed))
- })
+ background.placeSeedWords()
+ dispatch(actions.showNewVaultSeed())
})
}
}
-function recoverFromSeed (password, seed) {
+
+function addNewKeyring (type, opts) {
return (dispatch) => {
- // dispatch(actions.createNewVaultInProgress())
dispatch(actions.showLoadingIndication())
- _accountManager.recoverFromSeed(password, seed, (err, metamaskState) => {
- dispatch(actions.hideLoadingIndication())
- if (err) return dispatch(actions.displayWarning(err.message))
+ background.addNewKeyring(type, opts, (err, newState) => {
+ dispatch(this.hideLoadingIndication())
+ if (err) {
+ return dispatch(actions.showWarning(err))
+ }
+ dispatch(this.updateMetamaskState(newState))
+ dispatch(this.showAccountsPage())
+ })
+ }
+}
- var account = Object.keys(metamaskState.identities)[0]
- dispatch(actions.unlockMetamask(account))
+function addNewAccount (ringNumber = 0) {
+ return (dispatch) => {
+ dispatch(actions.showLoadingIndication())
+ background.addNewAccount(ringNumber, (err, newState) => {
+ dispatch(this.hideLoadingIndication())
+ if (err) {
+ return dispatch(actions.showWarning(err))
+ }
+ dispatch(this.updateMetamaskState(newState))
})
}
}
@@ -229,27 +271,14 @@ function showInfoPage () {
function setSelectedAddress (address) {
return (dispatch) => {
- _accountManager.setSelectedAddress(address)
- }
-}
-
-function revealAccount () {
- return (dispatch) => {
- dispatch(actions.showLoadingIndication())
- _accountManager.revealAccount((err) => {
- dispatch(actions.hideLoadingIndication())
- if (err) return dispatch(actions.displayWarning(err.message))
- dispatch({
- type: actions.REVEAL_ACCOUNT,
- })
- })
+ background.setSelectedAddress(address)
}
}
function setCurrentFiat (fiat) {
return (dispatch) => {
dispatch(this.showLoadingIndication())
- _accountManager.setCurrentFiat(fiat, (data, err) => {
+ background.setCurrentFiat(fiat, (data, err) => {
dispatch(this.hideLoadingIndication())
dispatch({
type: this.SET_CURRENT_FIAT,
@@ -267,7 +296,7 @@ function signMsg (msgData) {
return (dispatch) => {
dispatch(actions.showLoadingIndication())
- _accountManager.signMessage(msgData, (err) => {
+ background.signMessage(msgData, (err) => {
dispatch(actions.hideLoadingIndication())
if (err) return dispatch(actions.displayWarning(err.message))
@@ -278,7 +307,7 @@ function signMsg (msgData) {
function signTx (txData) {
return (dispatch) => {
- _accountManager.setGasMultiplier(txData.gasMultiplier, (err) => {
+ background.setGasMultiplier(txData.gasMultiplier, (err) => {
if (err) return dispatch(actions.displayWarning(err.message))
web3.eth.sendTransaction(txData, (err, data) => {
dispatch(actions.hideLoadingIndication())
@@ -293,7 +322,7 @@ function signTx (txData) {
function sendTx (txData) {
return (dispatch) => {
- _accountManager.approveTransaction(txData.id, (err) => {
+ background.approveTransaction(txData.id, (err) => {
if (err) {
alert(err.message)
dispatch(actions.txError(err))
@@ -319,12 +348,12 @@ function txError (err) {
}
function cancelMsg (msgData) {
- _accountManager.cancelMessage(msgData.id)
+ background.cancelMessage(msgData.id)
return actions.completedTx(msgData.id)
}
function cancelTx (txData) {
- _accountManager.cancelTransaction(txData.id)
+ background.cancelTransaction(txData.id)
return actions.completedTx(txData.id)
}
@@ -353,7 +382,7 @@ function showInitializeMenu () {
function agreeToDisclaimer () {
return (dispatch) => {
dispatch(this.showLoadingIndication())
- _accountManager.agreeToDisclaimer((err) => {
+ background.agreeToDisclaimer((err) => {
if (err) {
return dispatch(actions.showWarning(err.message))
}
@@ -385,6 +414,12 @@ function backToUnlockView () {
}
}
+function showNewKeychain () {
+ return {
+ type: actions.SHOW_NEW_KEYCHAIN,
+ }
+}
+
//
// unlock screen
//
@@ -395,9 +430,10 @@ function unlockInProgress () {
}
}
-function unlockFailed () {
+function unlockFailed (message) {
return {
type: actions.UNLOCK_FAILED,
+ value: message,
}
}
@@ -417,7 +453,7 @@ function updateMetamaskState (newState) {
function lockMetamask () {
return (dispatch) => {
- _accountManager.setLocked((err) => {
+ background.setLocked((err) => {
dispatch(actions.hideLoadingIndication())
if (err) {
return dispatch(actions.showWarning(err.message))
@@ -433,7 +469,7 @@ function lockMetamask () {
function showAccountDetail (address) {
return (dispatch) => {
dispatch(actions.showLoadingIndication())
- _accountManager.setSelectedAddress(address, (err, address) => {
+ background.setSelectedAddress(address, (err, address) => {
dispatch(actions.hideLoadingIndication())
if (err) {
return dispatch(actions.showWarning(err.message))
@@ -453,27 +489,6 @@ function backToAccountDetail (address) {
value: address,
}
}
-function clearSeedWordCache (account) {
- return {
- type: actions.CLEAR_SEED_WORD_CACHE,
- value: account,
- }
-}
-
-function confirmSeedWords () {
- return (dispatch) => {
- dispatch(actions.showLoadingIndication())
- _accountManager.clearSeedWordCache((err, account) => {
- dispatch(actions.hideLoadingIndication())
- if (err) {
- return dispatch(actions.showWarning(err.message))
- }
-
- console.log('Seed word cache cleared. ' + account)
- dispatch(actions.showAccountDetail(account))
- })
- }
-}
function showAccountsPage () {
return {
@@ -525,7 +540,7 @@ function goBackToInitView () {
//
function setRpcTarget (newRpc) {
- _accountManager.setRpcTarget(newRpc)
+ background.setRpcTarget(newRpc)
return {
type: actions.SET_RPC_TARGET,
value: newRpc,
@@ -533,7 +548,7 @@ function setRpcTarget (newRpc) {
}
function setProviderType (type) {
- _accountManager.setProviderType(type)
+ background.setProviderType(type)
return {
type: actions.SET_PROVIDER_TYPE,
value: type,
@@ -541,7 +556,7 @@ function setProviderType (type) {
}
function useEtherscanProvider () {
- _accountManager.useEtherscanProvider()
+ background.useEtherscanProvider()
return {
type: actions.USE_ETHERSCAN_PROVIDER,
}
@@ -600,7 +615,7 @@ function exportAccount (address) {
return function (dispatch) {
dispatch(self.showLoadingIndication())
- _accountManager.exportAccount(address, function (err, result) {
+ background.exportAccount(address, function (err, result) {
dispatch(self.hideLoadingIndication())
if (err) {
@@ -623,7 +638,7 @@ function showPrivateKey (key) {
function saveAccountLabel (account, label) {
return (dispatch) => {
dispatch(actions.showLoadingIndication())
- _accountManager.saveAccountLabel(account, label, (err) => {
+ background.saveAccountLabel(account, label, (err) => {
dispatch(actions.hideLoadingIndication())
if (err) {
return dispatch(actions.showWarning(err.message))
@@ -642,28 +657,9 @@ function showSendPage () {
}
}
-function agreeToEthWarning () {
- return (dispatch) => {
- _accountManager.agreeToEthWarning((err) => {
- if (err) {
- return dispatch(actions.showEthWarning(err.message))
- }
- dispatch({
- type: actions.AGREE_TO_ETH_WARNING,
- })
- })
- }
-}
-
-function showEthWarning () {
- return {
- type: actions.SHOW_ETH_WARNING,
- }
-}
-
function buyEth (address, amount) {
return (dispatch) => {
- _accountManager.buyEth(address, amount)
+ background.buyEth(address, amount)
dispatch({
type: actions.BUY_ETH,
})
@@ -741,7 +737,7 @@ function coinShiftRquest (data, marketData) {
if (response.error) return dispatch(actions.showWarning(response.error))
var message = `
Deposit your ${response.depositType} to the address bellow:`
- _accountManager.createShapeShiftTx(response.deposit, response.depositType)
+ background.createShapeShiftTx(response.deposit, response.depositType)
dispatch(actions.showQrView(response.deposit, [message].concat(marketData)))
})
}
diff --git a/ui/app/app.js b/ui/app/app.js
index ae6fe7071..a2532c153 100644
--- a/ui/app/app.js
+++ b/ui/app/app.js
@@ -7,9 +7,7 @@ const ReactCSSTransitionGroup = require('react-addons-css-transition-group')
// init
const DisclaimerScreen = require('./first-time/disclaimer')
const InitializeMenuScreen = require('./first-time/init-menu')
-const CreateVaultScreen = require('./first-time/create-vault')
-const CreateVaultCompleteScreen = require('./first-time/create-vault-complete')
-const RestoreVaultScreen = require('./first-time/restore-vault')
+const NewKeyChainScreen = require('./new-keychain')
// unlock
const UnlockScreen = require('./unlock')
// accounts
@@ -19,7 +17,6 @@ const SendTransactionScreen = require('./send')
const ConfirmTxScreen = require('./conf-tx')
// other views
const ConfigScreen = require('./config')
-const RevealSeedConfirmation = require('./recover-seed/confirmation')
const InfoScreen = require('./info')
const LoadingIndicator = require('./components/loading')
const SandwichExpando = require('sandwich-expando')
@@ -27,9 +24,12 @@ const MenuDroppo = require('menu-droppo')
const DropMenuItem = require('./components/drop-menu-item')
const NetworkIndicator = require('./components/network')
const Tooltip = require('./components/tooltip')
-const EthStoreWarning = require('./eth-store-warning')
const BuyView = require('./components/buy-button-subview')
const QrView = require('./components/qr-code')
+const HDCreateVaultComplete = require('./keychains/hd/create-vault-complete')
+const HDRestoreVaultScreen = require('./keychains/hd/restore-vault')
+const RevealSeedConfirmation = require('./keychains/hd/recover-seed/confirmation')
+
module.exports = connect(mapStateToProps)(App)
inherits(App, Component)
@@ -40,7 +40,6 @@ function mapStateToProps (state) {
// state from plugin
isLoading: state.appState.isLoading,
isConfirmed: state.metamask.isConfirmed,
- isEthConfirmed: state.metamask.isEthConfirmed,
isInitialized: state.metamask.isInitialized,
isUnlocked: state.metamask.isUnlocked,
currentView: state.appState.currentView,
@@ -302,6 +301,7 @@ App.prototype.renderDropdown = function () {
}),
])
}
+
App.prototype.renderBackButton = function (style, justArrow = false) {
var props = this.props
return (
@@ -319,12 +319,13 @@ App.prototype.renderBackButton = function (style, justArrow = false) {
}, 'BACK'),
])
)
-
}
+
App.prototype.renderBackToInitButton = function () {
var props = this.props
var button = null
if (!props.isConfirmed) return button
+
if (!props.isUnlocked) {
if (props.currentView.name === 'InitMenu') {
button = props.forgottenPassword ? h('.flex-row', {
@@ -348,42 +349,6 @@ App.prototype.renderBackToInitButton = function () {
}, 'LOGIN'),
h('i.fa.fa-arrow-right.cursor-pointer'),
]) : null
- } else if (props.isInitialized) {
- var style
- switch (props.currentView.name) {
- case 'createVault':
- style = {
- position: 'absolute',
- top: '41px',
- left: '80px',
- fontSize: '21px',
- fontFamily: 'Montserrat Bold',
- color: 'rgb(174, 174, 174)',
- }
- return this.renderBackButton(style, true)
- case 'restoreVault':
- style = {
- position: 'absolute',
- top: '41px',
- left: '70px',
- fontSize: '21px',
- fontFamily: 'Montserrat Bold',
- color: 'rgb(174, 174, 174)',
- }
- return this.renderBackButton(style, true)
- default:
- style = {
- position: 'absolute',
- bottom: '10px',
- left: '15px',
- fontSize: '21px',
- fontFamily: 'Montserrat Light',
- color: '#7F8082',
- width: '71.969px',
- alignItems: 'flex-end',
- }
- return this.renderBackButton(style)
- }
}
}
return button
@@ -397,38 +362,37 @@ App.prototype.renderPrimary = function () {
}
if (props.seedWords) {
- return h(CreateVaultCompleteScreen, {key: 'createVaultComplete'})
+ return h(HDCreateVaultComplete, {key: 'HDCreateVaultComplete'})
}
// show initialize screen
if (!props.isInitialized || props.forgottenPassword) {
+
// show current view
switch (props.currentView.name) {
- case 'createVault':
- return h(CreateVaultScreen, {key: 'createVault'})
-
case 'restoreVault':
- return h(RestoreVaultScreen, {key: 'restoreVault'})
-
- case 'createVaultComplete':
- return h(CreateVaultCompleteScreen, {key: 'createVaultComplete'})
+ return h(HDRestoreVaultScreen, {key: 'HDRestoreVaultScreen'})
default:
return h(InitializeMenuScreen, {key: 'menuScreenInit'})
-
}
}
// show unlock screen
if (!props.isUnlocked) {
- return h(UnlockScreen, {key: 'locked'})
+ switch (props.currentView.name) {
+
+ case 'restoreVault':
+ return h(HDRestoreVaultScreen, {key: 'HDRestoreVaultScreen'})
+
+ default:
+ return h(UnlockScreen, {key: 'locked'})
+ }
}
// show current view
switch (props.currentView.name) {
- case 'EthStoreWarning':
- return h(EthStoreWarning, {key: 'ethWarning'})
case 'accounts':
return h(AccountsScreen, {key: 'accounts'})
@@ -439,6 +403,9 @@ App.prototype.renderPrimary = function () {
case 'sendTransaction':
return h(SendTransactionScreen, {key: 'send-transaction'})
+ case 'newKeychain':
+ return h(NewKeyChainScreen, {key: 'new-keychain'})
+
case 'confTx':
return h(ConfirmTxScreen, {key: 'confirm-tx'})
@@ -451,10 +418,9 @@ App.prototype.renderPrimary = function () {
case 'info':
return h(InfoScreen, {key: 'info'})
- case 'createVault':
- return h(CreateVaultScreen, {key: 'createVault'})
case 'buyEth':
return h(BuyView, {key: 'buyEthView'})
+
case 'qr':
return h('div', {
style: {
@@ -510,12 +476,7 @@ App.prototype.renderCustomOption = function (rpcTarget) {
})
case 'http://localhost:8545':
- return h(DropMenuItem, {
- label: 'Custom RPC',
- closeMenu: () => this.setState({ isNetworkMenuOpen: false }),
- action: () => this.props.dispatch(actions.showConfigPage()),
- icon: h('i.fa.fa-question-circle.fa-lg'),
- })
+ return null
default:
return h(DropMenuItem, {
diff --git a/ui/app/components/identicon.js b/ui/app/components/identicon.js
index 4b2bf899e..6d4871d02 100644
--- a/ui/app/components/identicon.js
+++ b/ui/app/components/identicon.js
@@ -16,8 +16,8 @@ function IdenticonComponent () {
}
IdenticonComponent.prototype.render = function () {
- var state = this.props
- var diameter = state.diameter || this.defaultDiameter
+ var props = this.props
+ var diameter = props.diameter || this.defaultDiameter
return (
h('div', {
key: 'identicon-' + this.props.address,
@@ -33,15 +33,31 @@ IdenticonComponent.prototype.render = function () {
}
IdenticonComponent.prototype.componentDidMount = function () {
- var state = this.props
- var address = state.address
+ var props = this.props
+ var address = props.address
if (!address) return
var container = findDOMNode(this)
- var diameter = state.diameter || this.defaultDiameter
- var imageify = state.imageify === undefined ? true : state.imageify
- var img = iconFactory.iconForAddress(address, diameter, imageify)
+ var diameter = props.diameter || this.defaultDiameter
+ var img = iconFactory.iconForAddress(address, diameter, false)
container.appendChild(img)
}
+IdenticonComponent.prototype.componentDidUpdate = function () {
+ var props = this.props
+ var address = props.address
+
+ if (!address) return
+
+ var container = findDOMNode(this)
+
+ var children = container.children
+ for (var i = 0; i < children.length; i++) {
+ container.removeChild(children[i])
+ }
+
+ var diameter = props.diameter || this.defaultDiameter
+ var img = iconFactory.iconForAddress(address, diameter, false)
+ container.appendChild(img)
+}
diff --git a/ui/app/components/network.js b/ui/app/components/network.js
index 845861396..ff5aefd41 100644
--- a/ui/app/components/network.js
+++ b/ui/app/components/network.js
@@ -36,13 +36,14 @@ Network.prototype.render = function () {
} else if (providerName === 'mainnet') {
hoverText = 'Main Ethereum Network'
iconName = 'ethereum-network'
- } else if (parseInt(networkNumber) === 2) {
+ } else if (providerName === 'testnet') {
hoverText = 'Morden Test Network'
iconName = 'morden-test-network'
} else {
hoverText = 'Unknown Private Network'
iconName = 'unknown-private-network'
}
+
return (
h('#network_component.flex-center.pointer', {
style: {
diff --git a/ui/app/eth-store-warning.js b/ui/app/eth-store-warning.js
deleted file mode 100644
index fe3c7ce5d..000000000
--- a/ui/app/eth-store-warning.js
+++ /dev/null
@@ -1,89 +0,0 @@
-const connect = require('react-redux').connect
-const Component = require('react').Component
-const h = require('react-hyperscript')
-const inherits = require('util').inherits
-const actions = require('./actions')
-
-module.exports = connect(mapStateToProps)(EthStoreWarning)
-
-inherits(EthStoreWarning, Component)
-function EthStoreWarning () {
- Component.call(this)
-}
-
-function mapStateToProps (state) {
- return {
- selectedAccount: state.metamask.selectedAccount,
- }
-}
-
-EthStoreWarning.prototype.render = function () {
-
- return (
-
- h('.flex-column', {
- key: 'ethWarning',
- style: {
- paddingTop: '25px',
- marginRight: '30px',
- marginLeft: '30px',
- alignItems: 'center',
- },
- }, [
- h('.warning', {
- style: {
- margin: '10px 10px 10px 10px',
- },
- },
- `MetaMask is currently in beta; use
- caution in storing large
- amounts of ether.
- `),
-
- h('i.fa.fa-exclamation-triangle.fa-4', {
- style: {
- fontSize: '152px',
- color: '#AEAEAE',
- textAlign: 'center',
- },
- }),
-
- h('.flex-row', {
- style: {
- marginTop: '25px',
- marginBottom: '10px',
- },
- }, [
- h('input', {
- type: 'checkbox',
- onChange: this.toggleShowWarning.bind(this),
- }),
- h('.warning', {
- style: {
- fontSize: '11px',
- },
-
- }, 'Don\'t show me this message again'),
- ]),
- h('.flex-row', {
- style: {
- width: '100%',
- justifyContent: 'space-around',
- },
- }, [
- h('button', {
- onClick: this.toAccounts.bind(this),
- },
- 'Continue to MetaMask'),
- ]),
- ])
- )
-}
-
-EthStoreWarning.prototype.toggleShowWarning = function () {
- this.props.dispatch(actions.agreeToEthWarning())
-}
-
-EthStoreWarning.prototype.toAccounts = function () {
- this.props.dispatch(actions.showAccountDetail(this.props.account))
-}
diff --git a/ui/app/first-time/create-vault.js b/ui/app/first-time/create-vault.js
deleted file mode 100644
index 33ae62179..000000000
--- a/ui/app/first-time/create-vault.js
+++ /dev/null
@@ -1,129 +0,0 @@
-const inherits = require('util').inherits
-
-const Component = require('react').Component
-const connect = require('react-redux').connect
-const h = require('react-hyperscript')
-const actions = require('../actions')
-
-module.exports = connect(mapStateToProps)(CreateVaultScreen)
-
-inherits(CreateVaultScreen, Component)
-function CreateVaultScreen () {
- Component.call(this)
-}
-
-function mapStateToProps (state) {
- return {
- warning: state.appState.warning,
- }
-}
-
-CreateVaultScreen.prototype.render = function () {
- var state = this.props
- return (
-
- h('.initialize-screen.flex-column.flex-center.flex-grow', [
-
- h('h3.flex-center.text-transform-uppercase', {
- style: {
- background: '#EBEBEB',
- color: '#AEAEAE',
- marginBottom: 24,
- width: '100%',
- fontSize: '20px',
- padding: 6,
- },
- }, [
- 'Create Vault',
- ]),
-
- // password
- h('input.large-input.letter-spacey', {
- type: 'password',
- id: 'password-box',
- placeholder: 'New Password (min 8 chars)',
- style: {
- width: 260,
- marginTop: 12,
- },
- }),
-
- // confirm password
- h('input.large-input.letter-spacey', {
- type: 'password',
- id: 'password-box-confirm',
- placeholder: 'Confirm Password',
- onKeyPress: this.createVaultOnEnter.bind(this),
- style: {
- width: 260,
- marginTop: 16,
- },
- }),
-
- h('.flex-row.flex-space-between', {
- style: {
- marginTop: 30,
- width: '50%',
- },
- }, [
-
- // cancel
- h('button.primary', {
- onClick: this.showInitializeMenu.bind(this),
- }, 'CANCEL'),
-
- // submit
- h('button.primary', {
- onClick: this.createNewVault.bind(this),
- }, 'OK'),
-
- ]),
-
- (!state.inProgress && state.warning) && (
- h('span.in-progress-notification', state.warning)
- ),
-
- state.inProgress && (
- h('span.in-progress-notification', 'Generating Seed...')
- ),
- ])
- )
-}
-
-CreateVaultScreen.prototype.componentDidMount = function () {
- document.getElementById('password-box').focus()
-}
-
-CreateVaultScreen.prototype.showInitializeMenu = function () {
- this.props.dispatch(actions.showInitializeMenu())
-}
-
-// create vault
-
-CreateVaultScreen.prototype.createVaultOnEnter = function (event) {
- if (event.key === 'Enter') {
- event.preventDefault()
- this.createNewVault()
- }
-}
-
-CreateVaultScreen.prototype.createNewVault = function () {
- var passwordBox = document.getElementById('password-box')
- var password = passwordBox.value
- var passwordConfirmBox = document.getElementById('password-box-confirm')
- var passwordConfirm = passwordConfirmBox.value
- // var entropy = document.getElementById('entropy-text-entry').value
-
- if (password.length < 8) {
- this.warning = 'password not long enough'
- this.props.dispatch(actions.displayWarning(this.warning))
- return
- }
- if (password !== passwordConfirm) {
- this.warning = 'passwords don\'t match'
- this.props.dispatch(actions.displayWarning(this.warning))
- return
- }
-
- this.props.dispatch(actions.createNewVault(password, ''/* entropy*/))
-}
diff --git a/ui/app/first-time/init-menu.js b/ui/app/first-time/init-menu.js
index 94a9d3df6..14a89b988 100644
--- a/ui/app/first-time/init-menu.js
+++ b/ui/app/first-time/init-menu.js
@@ -5,6 +5,8 @@ const connect = require('react-redux').connect
const h = require('react-hyperscript')
const Mascot = require('../components/mascot')
const actions = require('../actions')
+const Tooltip = require('../components/tooltip')
+const getCaretCoordinates = require('textarea-caret')
module.exports = connect(mapStateToProps)(InitializeMenuScreen)
@@ -18,6 +20,7 @@ function mapStateToProps (state) {
return {
// state from plugin
currentView: state.appState.currentView,
+ warning: state.appState.warning,
}
}
@@ -27,7 +30,7 @@ InitializeMenuScreen.prototype.render = function () {
switch (state.currentView.name) {
default:
- return this.renderMenu()
+ return this.renderMenu(state)
}
}
@@ -36,7 +39,7 @@ InitializeMenuScreen.prototype.render = function () {
// document.getElementById('password-box').focus()
// }
-InitializeMenuScreen.prototype.renderMenu = function () {
+InitializeMenuScreen.prototype.renderMenu = function (state) {
return (
h('.initialize-screen.flex-column.flex-center.flex-grow', [
@@ -47,49 +50,131 @@ InitializeMenuScreen.prototype.renderMenu = function () {
h('h1', {
style: {
- fontSize: '1.4em',
+ fontSize: '1.3em',
textTransform: 'uppercase',
color: '#7F8082',
- marginBottom: 20,
+ marginBottom: 10,
},
}, 'MetaMask'),
- h('button.primary', {
- onClick: this.showCreateVault.bind(this),
+
+ h('div', [
+ h('h3', {
+ style: {
+ fontSize: '0.8em',
+ color: '#7F8082',
+ display: 'inline',
+ },
+ }, 'Encrypt your new DEN'),
+
+ h(Tooltip, {
+ title: 'Your DEN is your password-encrypted storage within MetaMask.',
+ }, [
+ h('i.fa.fa-question-circle.pointer', {
+ style: {
+ fontSize: '18px',
+ position: 'relative',
+ color: 'rgb(247, 134, 28)',
+ top: '2px',
+ marginLeft: '4px',
+ },
+ }),
+ ]),
+ ]),
+
+ h('span.in-progress-notification', state.warning),
+
+ // password
+ h('input.large-input.letter-spacey', {
+ type: 'password',
+ id: 'password-box',
+ placeholder: 'New Password (min 8 chars)',
+ onInput: this.inputChanged.bind(this),
style: {
- margin: 12,
+ width: 260,
+ marginTop: 12,
},
- }, 'Create New Vault'),
+ }),
+
+ // confirm password
+ h('input.large-input.letter-spacey', {
+ type: 'password',
+ id: 'password-box-confirm',
+ placeholder: 'Confirm Password',
+ onKeyPress: this.createVaultOnEnter.bind(this),
+ onInput: this.inputChanged.bind(this),
+ style: {
+ width: 260,
+ marginTop: 16,
+ },
+ }),
- h('.flex-row.flex-center.flex-grow', [
- h('hr'),
- h('div', 'OR'),
- h('hr'),
- ]),
h('button.primary', {
- onClick: this.showRestoreVault.bind(this),
+ onClick: this.createNewVaultAndKeychain.bind(this),
style: {
margin: 12,
},
- }, 'Restore Existing Vault'),
+ }, 'Create'),
+
+ h('.flex-row.flex-center.flex-grow', [
+ h('p.pointer', {
+ onClick: this.showRestoreVault.bind(this),
+ style: {
+ fontSize: '0.8em',
+ color: 'rgb(247, 134, 28)',
+ textDecoration: 'underline',
+ },
+ }, 'I already have a DEN that I would like to import'),
+ ]),
+
])
)
}
-// InitializeMenuScreen.prototype.splitWor = function() {
-// this.props.dispatch(actions.showInitializeMenu())
-// }
-
-InitializeMenuScreen.prototype.showInitializeMenu = function () {
- this.props.dispatch(actions.showInitializeMenu())
+InitializeMenuScreen.prototype.createVaultOnEnter = function (event) {
+ if (event.key === 'Enter') {
+ event.preventDefault()
+ this.createNewVaultAndKeychain()
+ }
}
-InitializeMenuScreen.prototype.showCreateVault = function () {
- this.props.dispatch(actions.showCreateVault())
+InitializeMenuScreen.prototype.componentDidMount = function () {
+ document.getElementById('password-box').focus()
}
InitializeMenuScreen.prototype.showRestoreVault = function () {
this.props.dispatch(actions.showRestoreVault())
}
+InitializeMenuScreen.prototype.createNewVaultAndKeychain = function () {
+ var passwordBox = document.getElementById('password-box')
+ var password = passwordBox.value
+ var passwordConfirmBox = document.getElementById('password-box-confirm')
+ var passwordConfirm = passwordConfirmBox.value
+ // var entropy = document.getElementById('entropy-text-entry').value
+
+ if (password.length < 8) {
+ this.warning = 'password not long enough'
+ this.props.dispatch(actions.displayWarning(this.warning))
+ return
+ }
+ if (password !== passwordConfirm) {
+ this.warning = 'passwords don\'t match'
+ this.props.dispatch(actions.displayWarning(this.warning))
+ return
+ }
+
+ this.props.dispatch(actions.createNewVaultAndKeychain(password, ''/* entropy*/))
+}
+
+InitializeMenuScreen.prototype.inputChanged = function (event) {
+ // tell mascot to look at page action
+ var element = event.target
+ var boundingRect = element.getBoundingClientRect()
+ var coordinates = getCaretCoordinates(element, element.selectionEnd)
+ this.animationEventEmitter.emit('point', {
+ x: boundingRect.left + coordinates.left - element.scrollLeft,
+ y: boundingRect.top + coordinates.top - element.scrollTop,
+ })
+}
diff --git a/ui/app/first-time/create-vault-complete.js b/ui/app/keychains/hd/create-vault-complete.js
index 2b5413955..7272ebdbd 100644
--- a/ui/app/first-time/create-vault-complete.js
+++ b/ui/app/keychains/hd/create-vault-complete.js
@@ -2,7 +2,7 @@ const inherits = require('util').inherits
const Component = require('react').Component
const connect = require('react-redux').connect
const h = require('react-hyperscript')
-const actions = require('../actions')
+const actions = require('../../actions')
module.exports = connect(mapStateToProps)(CreateVaultCompleteScreen)
@@ -71,4 +71,3 @@ CreateVaultCompleteScreen.prototype.render = function () {
CreateVaultCompleteScreen.prototype.confirmSeedWords = function () {
this.props.dispatch(actions.confirmSeedWords())
}
-
diff --git a/ui/app/recover-seed/confirmation.js b/ui/app/keychains/hd/recover-seed/confirmation.js
index 55b18025f..83dbc270f 100644
--- a/ui/app/recover-seed/confirmation.js
+++ b/ui/app/keychains/hd/recover-seed/confirmation.js
@@ -3,7 +3,7 @@ const inherits = require('util').inherits
const Component = require('react').Component
const connect = require('react-redux').connect
const h = require('react-hyperscript')
-const actions = require('../actions')
+const actions = require('../../../actions')
module.exports = connect(mapStateToProps)(RevealSeedConfirmatoin)
@@ -68,7 +68,7 @@ RevealSeedConfirmatoin.prototype.render = function () {
style: {
marginTop: '12px',
},
- }, 'Enter the phrase "I understand" to proceed.'),
+ }, `Enter the phrase "${this.confirmationPhrase}" to proceed.`),
// confirm confirmation
h('input.large-input.letter-spacey', {
diff --git a/ui/app/first-time/restore-vault.js b/ui/app/keychains/hd/restore-vault.js
index 4c1f21008..3fa25a2eb 100644
--- a/ui/app/first-time/restore-vault.js
+++ b/ui/app/keychains/hd/restore-vault.js
@@ -1,8 +1,8 @@
const inherits = require('util').inherits
-const PersistentForm = require('../../lib/persistent-form')
+const PersistentForm = require('../../../lib/persistent-form')
const connect = require('react-redux').connect
const h = require('react-hyperscript')
-const actions = require('../actions')
+const actions = require('../../actions')
module.exports = connect(mapStateToProps)(RestoreVaultScreen)
@@ -66,7 +66,7 @@ RestoreVaultScreen.prototype.render = function () {
type: 'password',
id: 'password-box-confirm',
placeholder: 'Confirm Password',
- onKeyPress: this.onMaybeCreate.bind(this),
+ onKeyPress: this.createOnEnter.bind(this),
dataset: {
persistentFormId: 'password-confirmation',
},
@@ -96,7 +96,7 @@ RestoreVaultScreen.prototype.render = function () {
// submit
h('button.primary', {
- onClick: this.restoreVault.bind(this),
+ onClick: this.createNewVaultAndRestore.bind(this),
}, 'OK'),
]),
@@ -110,13 +110,13 @@ RestoreVaultScreen.prototype.showInitializeMenu = function () {
this.props.dispatch(actions.showInitializeMenu())
}
-RestoreVaultScreen.prototype.onMaybeCreate = function (event) {
+RestoreVaultScreen.prototype.createOnEnter = function (event) {
if (event.key === 'Enter') {
- this.restoreVault()
+ this.createNewVaultAndRestore()
}
}
-RestoreVaultScreen.prototype.restoreVault = function () {
+RestoreVaultScreen.prototype.createNewVaultAndRestore = function () {
// check password
var passwordBox = document.getElementById('password-box')
var password = passwordBox.value
@@ -144,5 +144,5 @@ RestoreVaultScreen.prototype.restoreVault = function () {
// submit
this.warning = null
this.props.dispatch(actions.displayWarning(this.warning))
- this.props.dispatch(actions.recoverFromSeed(password, seed))
+ this.props.dispatch(actions.createNewVaultAndRestore(password, seed))
}
diff --git a/ui/app/new-keychain.js b/ui/app/new-keychain.js
new file mode 100644
index 000000000..cc9633166
--- /dev/null
+++ b/ui/app/new-keychain.js
@@ -0,0 +1,29 @@
+const inherits = require('util').inherits
+const Component = require('react').Component
+const h = require('react-hyperscript')
+const connect = require('react-redux').connect
+
+module.exports = connect(mapStateToProps)(NewKeychain)
+
+function mapStateToProps (state) {
+ return {}
+}
+
+inherits(NewKeychain, Component)
+function NewKeychain () {
+ Component.call(this)
+}
+
+NewKeychain.prototype.render = function () {
+ // const props = this.props
+
+ return (
+ h('div', {
+ style: {
+ background: 'blue',
+ },
+ }, [
+ h('h1', `Here's a list!!!!`),
+ ])
+ )
+}
diff --git a/ui/app/reducers/app.js b/ui/app/reducers/app.js
index c2ac099a6..49507eb30 100644
--- a/ui/app/reducers/app.js
+++ b/ui/app/reducers/app.js
@@ -29,13 +29,10 @@ function reduceApp (state, action) {
name: 'createVaultComplete',
seedWords,
}
- var ethStoreWarning = {
- name: 'EthStoreWarning',
- }
var appState = extend({
menuOpen: false,
- currentView: seedWords ? seedConfView : !state.metamask.isEthConfirmed ? ethStoreWarning : defaultView,
+ currentView: seedWords ? seedConfView : defaultView,
accountDetail: {
subview: 'transactions',
},
@@ -119,6 +116,15 @@ function reduceApp (state, action) {
warning: null,
})
+ case actions.SHOW_NEW_KEYCHAIN:
+ return extend(appState, {
+ currentView: {
+ name: 'newKeychain',
+ context: appState.currentView.context,
+ },
+ transForward: true,
+ })
+
// unlock
case actions.UNLOCK_METAMASK:
@@ -329,7 +335,7 @@ function reduceApp (state, action) {
case actions.UNLOCK_FAILED:
return extend(appState, {
- warning: 'Incorrect password. Try again.',
+ warning: action.value || 'Incorrect password. Try again.',
})
case actions.SHOW_LOADING:
@@ -540,4 +546,3 @@ function indexForPending (state, txId) {
})
return idx
}
-
diff --git a/ui/app/reducers/metamask.js b/ui/app/reducers/metamask.js
index 84953d734..aa809b333 100644
--- a/ui/app/reducers/metamask.js
+++ b/ui/app/reducers/metamask.js
@@ -10,7 +10,6 @@ function reduceMetamask (state, action) {
var metamaskState = extend({
isInitialized: false,
isUnlocked: false,
- isEthConfirmed: false,
rpcTarget: 'https://rawtestrpc.metamask.io/',
identities: {},
unconfTxs: {},
@@ -34,11 +33,6 @@ function reduceMetamask (state, action) {
isConfirmed: true,
})
- case actions.AGREE_TO_ETH_WARNING:
- return extend(metamaskState, {
- isEthConfirmed: !metamaskState.isEthConfirmed,
- })
-
case actions.UNLOCK_METAMASK:
return extend(metamaskState, {
isUnlocked: true,
diff --git a/ui/app/unlock.js b/ui/app/unlock.js
index b82e46d02..ec467f483 100644
--- a/ui/app/unlock.js
+++ b/ui/app/unlock.js
@@ -55,6 +55,8 @@ UnlockScreen.prototype.render = function () {
h('.error', {
style: {
display: warning ? 'block' : 'none',
+ padding: '0 20px',
+ textAlign: 'center',
},
}, warning),
@@ -65,6 +67,17 @@ UnlockScreen.prototype.render = function () {
},
}, 'Unlock'),
]),
+
+ h('.flex-row.flex-center.flex-grow', [
+ h('p.pointer', {
+ onClick: () => this.props.dispatch(actions.showRestoreVault()),
+ style: {
+ fontSize: '0.8em',
+ color: 'rgb(247, 134, 28)',
+ textDecoration: 'underline',
+ },
+ }, 'I forgot my password.'),
+ ]),
])
)
}
@@ -104,6 +117,3 @@ UnlockScreen.prototype.inputChanged = function (event) {
})
}
-UnlockScreen.prototype.emitAnim = function (name, a, b, c) {
- this.animationEventEmitter.emit(name, a, b, c)
-}
diff --git a/ui/index.js b/ui/index.js
index a6905b639..dedfd8c8c 100644
--- a/ui/index.js
+++ b/ui/index.js
@@ -8,7 +8,7 @@ module.exports = launchApp
function launchApp (opts) {
var accountManager = opts.accountManager
- actions._setAccountManager(accountManager)
+ actions._setBackgroundConnection(accountManager)
// check if we are unlocked first
accountManager.getState(function (err, metamaskState) {