diff options
Merge pull request #381 from MetaMask/ImproveUiDevMode
Improved Ui Dev Mode
Diffstat (limited to 'development')
l--------- | development/fonts | 1 | ||||
l--------- | development/images | 1 | ||||
-rw-r--r-- | development/index.html | 38 | ||||
-rw-r--r-- | development/mocker.js | 68 |
4 files changed, 38 insertions, 70 deletions
diff --git a/development/fonts b/development/fonts deleted file mode 120000 index 77c7651c1..000000000 --- a/development/fonts +++ /dev/null @@ -1 +0,0 @@ -../app/fonts
\ No newline at end of file diff --git a/development/images b/development/images deleted file mode 120000 index 38cd3b8d4..000000000 --- a/development/images +++ /dev/null @@ -1 +0,0 @@ -../app/images
\ No newline at end of file diff --git a/development/index.html b/development/index.html index aca074f3e..00cfb96c8 100644 --- a/development/index.html +++ b/development/index.html @@ -3,6 +3,7 @@ <head> <meta charset="utf-8"> <title>MetaMask</title> + </head> <body> @@ -23,4 +24,41 @@ html, body, #app-content, .super-dev-container { background: #F7F7F7; } </style> + +<script> +liveReloadCode(Date.now(), 300) +function liveReloadCode(lastUpdate, updateRate) { + setTimeout(iter, updateRate) + + function iter() { + var xhr = new XMLHttpRequest() + + xhr.open('GET', '/-/live-reload') + xhr.onreadystatechange = function() { + if(xhr.readyState !== 4) { + return + } + + try { + var change = JSON.parse(xhr.responseText).lastUpdate + + if(lastUpdate < change) { + return reload() + } + } catch(err) { + } + + xhr = + xhr.onreadystatechange = null + setTimeout(iter, updateRate) + } + + xhr.send(null) + } +} + +function reload() { + window.location.reload() +} + </script> </html> diff --git a/development/mocker.js b/development/mocker.js deleted file mode 100644 index 0656e66ea..000000000 --- a/development/mocker.js +++ /dev/null @@ -1,68 +0,0 @@ -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') -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) - |