aboutsummaryrefslogtreecommitdiffstats
path: root/development
diff options
context:
space:
mode:
authorDan Finlay <dan@danfinlay.com>2016-07-01 09:22:48 +0800
committerDan Finlay <dan@danfinlay.com>2016-07-01 09:22:48 +0800
commitc26a7cd89b7889bcfd0c9993e0aac1aac8e1c575 (patch)
treeafab326a85b6f25475425d102a5c4f5dabe31e31 /development
parente55938ed15428b452224f2d731c1e7ad141869d4 (diff)
downloadtangerine-wallet-browser-c26a7cd89b7889bcfd0c9993e0aac1aac8e1c575.tar
tangerine-wallet-browser-c26a7cd89b7889bcfd0c9993e0aac1aac8e1c575.tar.gz
tangerine-wallet-browser-c26a7cd89b7889bcfd0c9993e0aac1aac8e1c575.tar.bz2
tangerine-wallet-browser-c26a7cd89b7889bcfd0c9993e0aac1aac8e1c575.tar.lz
tangerine-wallet-browser-c26a7cd89b7889bcfd0c9993e0aac1aac8e1c575.tar.xz
tangerine-wallet-browser-c26a7cd89b7889bcfd0c9993e0aac1aac8e1c575.tar.zst
tangerine-wallet-browser-c26a7cd89b7889bcfd0c9993e0aac1aac8e1c575.zip
Add selector component to ui mocker
Diffstat (limited to 'development')
-rw-r--r--development/mocker.js32
-rw-r--r--development/selector.js30
2 files changed, 42 insertions, 20 deletions
diff --git a/development/mocker.js b/development/mocker.js
index 31b8c46a5..a21c13f4c 100644
--- a/development/mocker.js
+++ b/development/mocker.js
@@ -2,32 +2,32 @@ const render = require('react-dom').render
const h = require('react-hyperscript')
const Root = require('../ui/app/root')
const configureStore = require('./mockStore')
+const states = require('./states')
+const Selector = require('./selector')
+
+// Query String
const qs = require('qs')
-const queryString = qs.parse(window.location.href)
+let queryString = qs.parse(window.location.href.split('#')[1])
let selectedView = queryString.view || 'account detail'
+// CSS
const MetaMaskUiCss = require('../ui/css')
const injectCss = require('inject-css')
-const states = require('./states')
-
const firstState = states[selectedView]
updateQueryParams()
-function updateQueryParams() {
- const newParamsObj = {
- view: selectedView,
- }
- const newQs = qs.stringify(newParamsObj)
- //window.location.href = window.location.href.split('?')[0] + `?${newQs}`
-
+function updateQueryParams(newView) {
+ queryString.view = newView
+ const params = qs.stringify(queryString)
+ window.location.href = window.location.href.split('#')[0] + `#${params}`
}
const actions = {
_setAccountManager(){},
update: function(stateName) {
selectedView = stateName
- updateQueryParams()
+ updateQueryParams(stateName)
const newState = states[selectedView]
return {
type: 'GLOBAL_FORCE_UPDATE',
@@ -48,15 +48,7 @@ var store = configureStore(states[selectedView])
render(
h('.super-dev-container', [
- h('select', {
- value: 'account-detail',
- onChange:(event) => {
- const selectedKey = event.target.value
- store.dispatch(actions.update(selectedKey))
- },
- }, Object.keys(states).map((stateName) => {
- return h('option', { value: stateName }, stateName)
- })),
+ h(Selector, { actions, selectedKey: selectedView, states, store }),
h(Root, {
store: store,
diff --git a/development/selector.js b/development/selector.js
new file mode 100644
index 000000000..b58904cdf
--- /dev/null
+++ b/development/selector.js
@@ -0,0 +1,30 @@
+const Component = require('react').Component
+const h = require('react-hyperscript')
+const inherits = require('util').inherits
+
+module.exports = NewComponent
+
+inherits(NewComponent, Component)
+function NewComponent () {
+ Component.call(this)
+}
+
+NewComponent.prototype.render = function () {
+ const props = this.props
+ let { states, selectedKey, actions, store } = props
+
+ const state = this.state || {}
+ const selected = state.selected || selectedKey
+
+ return h('select', {
+ value: selected,
+ onChange:(event) => {
+ const selectedKey = event.target.value
+ store.dispatch(actions.update(selectedKey))
+ this.setState({ selected: selectedKey })
+ },
+ }, Object.keys(states).map((stateName) => {
+ return h('option', { value: stateName }, stateName)
+ }))
+
+}