diff options
svg notifications - remove unneeded deps and clean code
| -rw-r--r-- | app/scripts/lib/notifications.js | 81 | ||||
| -rw-r--r-- | package.json | 2 | ||||
| -rw-r--r-- | ui/app/components/pending-tx.js | 10 |
3 files changed, 36 insertions, 57 deletions
diff --git a/app/scripts/lib/notifications.js b/app/scripts/lib/notifications.js index d1dd144be..b04673620 100644 --- a/app/scripts/lib/notifications.js +++ b/app/scripts/lib/notifications.js @@ -1,8 +1,11 @@ const createId = require('hat') -const svg = require('virtual-dom/virtual-hyperscript/svg') -const stringifyVdom = require('virtual-dom-stringify') +const unmountComponentAtNode = require('react-dom').unmountComponentAtNode +const findDOMNode = require('react-dom').findDOMNode +const render = require('react-dom').render +const h = require('react-hyperscript') const uiUtils = require('../../../ui/app/util') const renderPendingTx = require('../../../ui/app/components/pending-tx').prototype.renderGeneric +const MetaMaskUiCss = require('../../../ui/css') var notificationHandlers = {} module.exports = { @@ -118,8 +121,10 @@ function transactionNotificationSVG(opts, cb){ var state = { txData: { txParams: { - from: '0xabcd', + from: '0x5fda30bb72b8dfe20e48a00dfc108d0915be9bb0', + to: '0x5fda30bb72b8dfe20e48a00dfc108d0915be9bb0', }, + time: (new Date()).getTime(), }, identities: { @@ -129,62 +134,38 @@ function transactionNotificationSVG(opts, cb){ }, } - const unmountComponentAtNode = require('react-dom').unmountComponentAtNode - const findDOMNode = require('react-dom').findDOMNode - const render = require('react-dom').render - const h = require('react-hyperscript') - const MetaMaskUiCss = require('../../../ui/css') - var css = MetaMaskUiCss() - var container = document.createElement('div') - var confirmView = h('div', [ - h('style', css), + var confirmView = h('div.app-primary', { + style: { + width: '450px', + height: '300px', + padding: '16px', + // background: '#F7F7F7', + background: 'white', + }, + }, [ + h('style', MetaMaskUiCss()), renderPendingTx(h, state), ]) render(confirmView, container, function ready(){ var rootElement = findDOMNode(this) - var source = rootElement.outerHTML + var viewSource = rootElement.outerHTML unmountComponentAtNode(container) - var vnode = svgWrapper() - var tagSource = stringifyVdom(vnode) - // workaround for https://github.com/alexmingoia/virtual-dom-stringify/issues/26 - tagSource = tagSource.split('foreignobject').join('foreignObject') + var svgSource = svgWrapper(viewSource) // insert content into svg wrapper - tagSource = tagSource.split('{{content}}').join(source) - cb(null, tagSource) + console.log(svgSource) + cb(null, svgSource) }) } -function svgWrapper(){ - var h = svg - return ( - - h('svg', { - 'xmlns': 'http://www.w3.org/2000/svg', - // 'width': '300', - // 'height': '200', - 'width': '450', - 'height': '300', - }, [ - h('rect', { - 'x': '0', - 'y': '0', - 'width': '100%', - 'height': '100%', - 'fill': 'white', - }), - h('foreignObject', { - 'x': '0', - 'y': '0', - 'width': '100%', - 'height': '100%', - }, [ - h('body', { - xmlns: 'http://www.w3.org/1999/xhtml', - },'{{content}}') - ]) - ]) - - ) +function svgWrapper(content){ + var wrapperSource = ` + <svg xmlns="http://www.w3.org/2000/svg" width="450" height="300"> + <foreignObject x="0" y="0" width="100%" height="100%"> + <body xmlns="http://www.w3.org/1999/xhtml" height="100%">{{content}}</body> + </foreignObject> + </svg> + ` + return wrapperSource.split('{{content}}').join(content) }
\ No newline at end of file diff --git a/package.json b/package.json index 3de5b191c..cafca2672 100644 --- a/package.json +++ b/package.json @@ -62,8 +62,6 @@ "textarea-caret": "^3.0.1", "three.js": "^0.73.2", "through2": "^2.0.1", - "virtual-dom": "^2.1.1", - "virtual-dom-stringify": "^3.0.1", "vreme": "^3.0.2", "web3": "ethereum/web3.js#0.16.0", "web3-provider-engine": "^7.8.1", diff --git a/ui/app/components/pending-tx.js b/ui/app/components/pending-tx.js index 49b79e9d0..d3bfbbc62 100644 --- a/ui/app/components/pending-tx.js +++ b/ui/app/components/pending-tx.js @@ -41,11 +41,11 @@ PendingTx.prototype.renderGeneric = function (h, state) { }, 'Submit Transaction'), // account that will sign - // h(AccountPanel, { - // showFullAddress: true, - // identity: identity, - // account: account, - // }), + h(AccountPanel, { + showFullAddress: true, + identity: identity, + account: account, + }), // tx data h('.tx-data.flex-column.flex-justify-center.flex-grow.select-none', [ |