diff options
-rw-r--r-- | app/scripts/popup-core.js | 63 | ||||
-rw-r--r-- | app/scripts/popup.js | 88 | ||||
-rw-r--r-- | library/README.md | 6 | ||||
-rw-r--r-- | library/example/README.md | 5 | ||||
-rw-r--r-- | library/index.js | 2 | ||||
-rw-r--r-- | library/popup.js | 19 | ||||
-rw-r--r-- | library/server.js | 10 | ||||
-rw-r--r-- | ui/app/accounts/index.js | 1 | ||||
-rw-r--r-- | ui/app/reducers/app.js | 1 | ||||
-rw-r--r-- | ui/app/reducers/metamask.js | 1 | ||||
-rw-r--r-- | ui/index.js | 4 |
11 files changed, 107 insertions, 93 deletions
diff --git a/app/scripts/popup-core.js b/app/scripts/popup-core.js new file mode 100644 index 000000000..94413a1c4 --- /dev/null +++ b/app/scripts/popup-core.js @@ -0,0 +1,63 @@ +const EventEmitter = require('events').EventEmitter +const Dnode = require('dnode') +const Web3 = require('web3') +const MetaMaskUi = require('../../ui') +const StreamProvider = require('web3-stream-provider') +const setupMultiplex = require('./lib/stream-utils.js').setupMultiplex + + +module.exports = initializePopup + + +function initializePopup(connectionStream){ + // setup app + connectToAccountManager(connectionStream, setupApp) +} + +function connectToAccountManager (connectionStream, cb) { + // setup communication with background + // setup multiplexing + var mx = setupMultiplex(connectionStream) + // connect features + setupControllerConnection(mx.createStream('controller'), cb) + setupWeb3Connection(mx.createStream('provider')) +} + +function setupWeb3Connection (connectionStream) { + var providerStream = new StreamProvider() + providerStream.pipe(connectionStream).pipe(providerStream) + connectionStream.on('error', console.error.bind(console)) + providerStream.on('error', console.error.bind(console)) + global.web3 = new Web3(providerStream) +} + +function setupControllerConnection (connectionStream, cb) { + // this is a really sneaky way of adding EventEmitter api + // to a bi-directional dnode instance + var eventEmitter = new EventEmitter() + var accountManagerDnode = Dnode({ + sendUpdate: function (state) { + eventEmitter.emit('update', state) + }, + }) + connectionStream.pipe(accountManagerDnode).pipe(connectionStream) + accountManagerDnode.once('remote', function (accountManager) { + // setup push events + accountManager.on = eventEmitter.on.bind(eventEmitter) + cb(null, accountManager) + }) +} + +function setupApp (err, accountManager) { + if (err) { + alert(err.stack) + throw err + } + + var container = document.getElementById('app-content') + + MetaMaskUi({ + container: container, + accountManager: accountManager, + }) +} diff --git a/app/scripts/popup.js b/app/scripts/popup.js index 096b56115..e6f149f96 100644 --- a/app/scripts/popup.js +++ b/app/scripts/popup.js @@ -1,94 +1,22 @@ -const url = require('url') -const EventEmitter = require('events').EventEmitter -const async = require('async') -const Dnode = require('dnode') -const Web3 = require('web3') -const MetaMaskUi = require('../../ui') -const MetaMaskUiCss = require('../../ui/css') const injectCss = require('inject-css') +const MetaMaskUiCss = require('../../ui/css') +const startPopup = require('./popup-core') const PortStream = require('./lib/port-stream.js') -const StreamProvider = require('web3-stream-provider') -const setupMultiplex = require('./lib/stream-utils.js').setupMultiplex const isPopupOrNotification = require('./lib/is-popup-or-notification') const extension = require('./lib/extension') const notification = require('./lib/notifications') -// setup app var css = MetaMaskUiCss() injectCss(css) -async.parallel({ - currentDomain: getCurrentDomain, - accountManager: connectToAccountManager, -}, setupApp) - -function connectToAccountManager (cb) { - // setup communication with background - - var name = isPopupOrNotification() - closePopupIfOpen(name) - window.METAMASK_UI_TYPE = name - var pluginPort = extension.runtime.connect({ name }) - var portStream = new PortStream(pluginPort) - // setup multiplexing - var mx = setupMultiplex(portStream) - // connect features - setupControllerConnection(mx.createStream('controller'), cb) - setupWeb3Connection(mx.createStream('provider')) -} - -function setupWeb3Connection (stream) { - var remoteProvider = new StreamProvider() - remoteProvider.pipe(stream).pipe(remoteProvider) - stream.on('error', console.error.bind(console)) - remoteProvider.on('error', console.error.bind(console)) - global.web3 = new Web3(remoteProvider) -} - -function setupControllerConnection (stream, cb) { - var eventEmitter = new EventEmitter() - var background = Dnode({ - sendUpdate: function (state) { - eventEmitter.emit('update', state) - }, - }) - stream.pipe(background).pipe(stream) - background.once('remote', function (accountManager) { - // setup push events - accountManager.on = eventEmitter.on.bind(eventEmitter) - cb(null, accountManager) - }) -} +var name = isPopupOrNotification() +closePopupIfOpen(name) +window.METAMASK_UI_TYPE = name -function getCurrentDomain (cb) { - const unknown = '<unknown>' - if (!extension.tabs) return cb(null, unknown) - extension.tabs.query({active: true, currentWindow: true}, function (results) { - var activeTab = results[0] - var currentUrl = activeTab && activeTab.url - var currentDomain = url.parse(currentUrl).host - if (!currentUrl) { - return cb(null, unknown) - } - cb(null, currentDomain) - }) -} +var pluginPort = extension.runtime.connect({ name }) +var portStream = new PortStream(pluginPort) -function setupApp (err, opts) { - if (err) { - alert(err.stack) - throw err - } - - var container = document.getElementById('app-content') - - MetaMaskUi({ - container: container, - accountManager: opts.accountManager, - currentDomain: opts.currentDomain, - networkVersion: opts.networkVersion, - }) -} +startPopup(portStream) function closePopupIfOpen(name) { if (name !== 'notification') { diff --git a/library/README.md b/library/README.md new file mode 100644 index 000000000..7dc291564 --- /dev/null +++ b/library/README.md @@ -0,0 +1,6 @@ +start the dual servers (dapp + mascara) +``` +node server.js +``` + +open the example dapp at `http://localhost:9002/`
\ No newline at end of file diff --git a/library/example/README.md b/library/example/README.md deleted file mode 100644 index 2a5a1cce0..000000000 --- a/library/example/README.md +++ /dev/null @@ -1,5 +0,0 @@ -``` -trap 'kill %1' SIGINT -beefy frame.js:bundle.js 9001 --live & \ -beefy example/index.js:bundle.js index.js:zero.js --cwd example/ 9002 --live --open -```
\ No newline at end of file diff --git a/library/index.js b/library/index.js index 6e43181c9..ded588967 100644 --- a/library/index.js +++ b/library/index.js @@ -27,7 +27,7 @@ var shouldPop = false window.addEventListener('click', function(){ if (!shouldPop) return shouldPop = false - window.open('popup.html', '', 'width=1000') + window.open('http://localhost:9001/popup/popup.html', '', 'width=1000') console.log('opening window...') }) diff --git a/library/popup.js b/library/popup.js new file mode 100644 index 000000000..667b13371 --- /dev/null +++ b/library/popup.js @@ -0,0 +1,19 @@ +const injectCss = require('inject-css') +const MetaMaskUiCss = require('../ui/css') +const startPopup = require('../app/scripts/popup-core') +const setupIframe = require('./lib/setup-iframe.js') + + +var css = MetaMaskUiCss() +injectCss(css) + +var name = 'popup' +window.METAMASK_UI_TYPE = name + +var iframeStream = setupIframe({ + zeroClientProvider: 'http://127.0.0.1:9001', + sandboxAttributes: ['allow-scripts', 'allow-popups', 'allow-same-origin'], + container: document.body, +}) + +startPopup(iframeStream) diff --git a/library/server.js b/library/server.js index 7c764a4a7..033c65358 100644 --- a/library/server.js +++ b/library/server.js @@ -6,6 +6,7 @@ const path = require('path') const zeroBundle = createBundle('./index.js') const controllerBundle = createBundle('./controller.js') +// const popupBundle = createBundle('./popup.js') const appBundle = createBundle('./example/index.js') // @@ -14,14 +15,21 @@ const appBundle = createBundle('./example/index.js') const iframeServer = express() +// serve popup window +// iframeServer.get('/popup/scripts/popup.js', function(req, res){ +// res.send(popupBundle.latest) +// }) +iframeServer.use('/popup', express.static('../dist/chrome')) + // serve controller bundle iframeServer.get('/controller.js', function(req, res){ res.send(controllerBundle.latest) }) -// serve static +// serve background controller iframeServer.use(express.static('./server')) + iframeServer.listen('9001') diff --git a/ui/app/accounts/index.js b/ui/app/accounts/index.js index d3c84d387..735526c60 100644 --- a/ui/app/accounts/index.js +++ b/ui/app/accounts/index.js @@ -20,7 +20,6 @@ function mapStateToProps (state) { identities: state.metamask.identities, unconfTxs: state.metamask.unconfTxs, selectedAddress: state.metamask.selectedAddress, - currentDomain: state.appState.currentDomain, scrollToBottom: state.appState.scrollToBottom, pending, } diff --git a/ui/app/reducers/app.js b/ui/app/reducers/app.js index a6cd9ca1b..c39d89a4d 100644 --- a/ui/app/reducers/app.js +++ b/ui/app/reducers/app.js @@ -39,7 +39,6 @@ function reduceApp (state, action) { accountDetail: { subview: 'transactions', }, - currentDomain: 'example.com', transForward: true, // Used to render transition direction isLoading: false, // Used to display loading indicator warning: null, // Used to display error text diff --git a/ui/app/reducers/metamask.js b/ui/app/reducers/metamask.js index 7f18480cb..84953d734 100644 --- a/ui/app/reducers/metamask.js +++ b/ui/app/reducers/metamask.js @@ -11,7 +11,6 @@ function reduceMetamask (state, action) { isInitialized: false, isUnlocked: false, isEthConfirmed: false, - currentDomain: 'example.com', rpcTarget: 'https://rawtestrpc.metamask.io/', identities: {}, unconfTxs: {}, diff --git a/ui/index.js b/ui/index.js index 0e69b00d6..a6905b639 100644 --- a/ui/index.js +++ b/ui/index.js @@ -25,9 +25,7 @@ function startApp (metamaskState, accountManager, opts) { metamask: metamaskState, // appState represents the current tab's popup state - appState: { - currentDomain: opts.currentDomain, - }, + appState: {}, // Which blockchain we are using: networkVersion: opts.networkVersion, |