1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
metamask-extension/ui-dev.js
Dan Finlay 0cd11915ce Improved Ui Dev Mode
Dev mode now reloads on file changes (although it seems to sometimes reload too soon, not getting the update... we can tune the timeout interval in development/index.html)

Dev mode now reloads on all non-`node_modules` file changes, so the `ui` and `app` folders are both being watched for live reloading.
2016-07-01 14:23:37 -07:00

69 lines
1.6 KiB
JavaScript

const render = require('react-dom').render
const h = require('react-hyperscript')
const Root = require('./ui/app/root')
const configureStore = require('./development/mockStore')
const states = require('./development/states')
const Selector = require('./development/selector')
// Query String
const qs = require('qs')
let queryString = qs.parse(window.location.href.split('#')[1])
let selectedView = queryString.view || 'account detail'
const firstState = states[selectedView]
updateQueryParams(selectedView)
// CSS
const MetaMaskUiCss = require('./ui/css')
const injectCss = require('inject-css')
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(stateName)
const newState = states[selectedView]
return {
type: 'GLOBAL_FORCE_UPDATE',
value: newState,
}
},
}
var css = MetaMaskUiCss()
injectCss(css)
const container = document.querySelector('#app-content')
// parse opts
var store = configureStore(states[selectedView])
// start app
render(
h('.super-dev-container', [
h(Selector, { actions, selectedKey: selectedView, states, store }),
h('.mock-app-root', {
style: {
height: '500px',
width: '360px',
boxShadow: '2px 2px 5px grey',
margin: '20px',
},
}, [
h(Root, {
store: store,
}),
]),
]
), container)