Initial work on UI side

app/scripts/keyring-controller.js

@@ -12,6 +12,11 @@ module.exports = class KeyringController extends EventEmitter {
     this.keyChains = []
   }
 
+  keyFromPassword(password, callback) {
+    deriveKeyFromPassword(password, callback);
+  }
+
+  // Takes a pw and callback, returns a password-dervied key
   getKeyForPassword(password, callback) {
     let salt = this.configManager.getSalt()
 

app/scripts/lib/config-manager.js

@@ -110,6 +110,16 @@ ConfigManager.prototype.setWallet = function (wallet) {
   this.setData(data)
 }
 
+ConfigManager.prototype.getKeychains = function () {
+  return this.migrator.getData().keychains || []
+}
+
+ConfigManager.prototype.setKeychains = function (keychains) {
+  var data = this.migrator.getData()
+  data.keychains = keychains
+  this.setData(data)
+}
+
 ConfigManager.prototype.getSelectedAccount = function () {
   var config = this.getConfig()
   return config.selectedAccount
@@ -249,6 +259,17 @@ ConfigManager.prototype.setNicknameForWallet = function (account, nickname) {
 
 // observable
 
+ConfigManager.prototype.getSalt = function () {
+  var data = this.getData()
+  return ('salt' in data) && data.salt
+}
+
+ConfigManager.prototype.setSalt = function(salt) {
+  var data = this.getData()
+  data.salt = salt
+  this.setData(data)
+}
+
 ConfigManager.prototype.subscribe = function (fn) {
   this._subs.push(fn)
   var unsubscribe = this.unsubscribe.bind(this, fn)

ui/app/actions.js

@@ -132,6 +132,10 @@ 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
@@ -326,6 +330,12 @@ function backToUnlockView () {
   }
 }
 
+function showNewKeychain () {
+  return {
+    type: actions.SHOW_NEW_KEYCHAIN
+  }
+}
+
 //
 // unlock screen
 //

ui/app/app.js

@@ -8,6 +8,7 @@ const ReactCSSTransitionGroup = require('react-addons-css-transition-group')
 const DisclaimerScreen = require('./first-time/disclaimer')
 const InitializeMenuScreen = require('./first-time/init-menu')
 const CreateVaultScreen = require('./first-time/create-vault')
+const NewKeychainScreen = require('./new-keychain')
 // unlock
 const UnlockScreen = require('./unlock')
 // accounts
@@ -432,6 +433,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'})
 

ui/app/new-keychain.js

@@ -0,0 +1,33 @@
+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!!!!`),
+      h('button',
+        {
+          onClick: () => this.props.dispatch(actions.goHome())
+        })
+    ])
+  )
+}

ui/app/reducers/app.js

@@ -119,6 +119,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:
@@ -540,4 +549,3 @@ function indexForPending (state, txId) {
   })
   return idx
 }
-