From 5a91adf7d802097805938e3d54fe7256b19724d1 Mon Sep 17 00:00:00 2001 From: kumavis Date: Tue, 4 Apr 2017 18:23:46 -0700 Subject: add platforms to mascara + move buyEther window open to ui --- mascara/src/background.js | 8 +++++++- mascara/src/popup.js | 5 +++++ 2 files changed, 12 insertions(+), 1 deletion(-) (limited to 'mascara') diff --git a/mascara/src/background.js b/mascara/src/background.js index 6f9fb3d13..957570050 100644 --- a/mascara/src/background.js +++ b/mascara/src/background.js @@ -8,6 +8,7 @@ const PortStream = require('../../app/scripts/lib/port-stream.js') const DbController = require('./lib/index-db-controller') +const SwPlatform = require('../../app/scripts/platforms/sw') const MetamaskController = require('../../app/scripts/metamask-controller') const extension = {} //require('../../app/scripts/lib/extension') @@ -17,7 +18,8 @@ const migrations = require('../../app/scripts/migrations/') const firstTimeState = require('../../app/scripts/first-time-state') const STORAGE_KEY = 'metamask-config' -const METAMASK_DEBUG = 'GULP_METAMASK_DEBUG' +// const METAMASK_DEBUG = 'GULP_METAMASK_DEBUG' +const METAMASK_DEBUG = true let popupIsOpen = false const log = require('loglevel') @@ -70,7 +72,11 @@ function setupController (initState, client) { // MetaMask Controller // + const platform = new SwPlatform() + const controller = new MetamaskController({ + // platform specific implementation + platform, // User confirmation callbacks: showUnconfirmedMessage: noop, unlockAccountMessage: noop, diff --git a/mascara/src/popup.js b/mascara/src/popup.js index ef7759a81..b740e81a5 100644 --- a/mascara/src/popup.js +++ b/mascara/src/popup.js @@ -4,8 +4,13 @@ const SwStream = require('sw-stream/lib/sw-stream.js') const MetaMaskUiCss = require('../../ui/css') const setupIframe = require('./lib/setup-iframe.js') const MetamaskInpageProvider = require('../../app/scripts/lib/inpage-provider.js') +const MetamascaraPlatform = require('../../app/scripts/platforms/window') const startPopup = require('../../app/scripts/popup-core') +// create platform global +global.platform = new MetamascaraPlatform() + + var css = MetaMaskUiCss() injectCss(css) const container = document.getElementById('app-content') -- cgit v1.2.3 From 0cfad78f5decbce04a7fa56e8f80e4fcecd12a79 Mon Sep 17 00:00:00 2001 From: kumavis Date: Tue, 4 Apr 2017 22:45:39 -0700 Subject: mascara - rename things + break out mascara asset server --- mascara/example/app.js | 57 +++++++++++++++++++++ mascara/example/app/index.html | 15 ++++++ mascara/example/index.html | 17 ------- mascara/example/index.js | 57 --------------------- mascara/example/server.js | 31 ++++++++++++ mascara/proxy/index.html | 20 ++++++++ mascara/server.js | 103 -------------------------------------- mascara/server/index.html | 20 -------- mascara/server/index.js | 32 ++++++++++++ mascara/server/util.js | 45 +++++++++++++++++ mascara/src/dapp-connection.js | 21 -------- mascara/src/lib/setup-provider.js | 4 +- mascara/src/mascara.js | 15 ++++-- mascara/src/proxy.js | 21 ++++++++ mascara/ui/index.html | 11 ++++ 15 files changed, 245 insertions(+), 224 deletions(-) create mode 100644 mascara/example/app.js create mode 100644 mascara/example/app/index.html delete mode 100644 mascara/example/index.html delete mode 100644 mascara/example/index.js create mode 100644 mascara/example/server.js create mode 100644 mascara/proxy/index.html delete mode 100644 mascara/server.js delete mode 100644 mascara/server/index.html create mode 100644 mascara/server/index.js create mode 100644 mascara/server/util.js delete mode 100644 mascara/src/dapp-connection.js create mode 100644 mascara/src/proxy.js create mode 100644 mascara/ui/index.html (limited to 'mascara') diff --git a/mascara/example/app.js b/mascara/example/app.js new file mode 100644 index 000000000..aae7ccd19 --- /dev/null +++ b/mascara/example/app.js @@ -0,0 +1,57 @@ +window.addEventListener('load', web3Detect) +window.addEventListener('message', console.warn) + +function web3Detect() { + if (global.web3) { + logToDom('web3 detected!') + startApp() + } else { + logToDom('no web3 detected!') + } +} + +function startApp(){ + console.log('app started') + + var primaryAccount + console.log('getting main account...') + web3.eth.getAccounts((err, addresses) => { + if (err) console.error(err) + console.log('set address', addresses[0]) + primaryAccount = addresses[0] + }) + + document.querySelector('.action-button-1').addEventListener('click', function(){ + console.log('saw click') + console.log('sending tx') + primaryAccount + web3.eth.sendTransaction({ + from: primaryAccount, + to: primaryAccount, + value: 0, + }, function(err, txHash){ + if (err) throw err + console.log('sendTransaction result:', err || txHash) + }) + }) + document.querySelector('.action-button-2').addEventListener('click', function(){ + console.log('saw click') + setTimeout(function(){ + console.log('sending tx') + web3.eth.sendTransaction({ + from: primaryAccount, + to: primaryAccount, + value: 0, + }, function(err, txHash){ + if (err) throw err + console.log('sendTransaction result:', err || txHash) + }) + }) + }) + +} + +function logToDom(message){ + document.body.appendChild(document.createTextNode(message)) + console.log(message) +} diff --git a/mascara/example/app/index.html b/mascara/example/app/index.html new file mode 100644 index 000000000..02323e5f9 --- /dev/null +++ b/mascara/example/app/index.html @@ -0,0 +1,15 @@ + + + + + + MetaMask ZeroClient Example + + + + + + + + + \ No newline at end of file diff --git a/mascara/example/index.html b/mascara/example/index.html deleted file mode 100644 index 47d6da34f..000000000 --- a/mascara/example/index.html +++ /dev/null @@ -1,17 +0,0 @@ - - - - - - - MetaMask ZeroClient Example - - - - - - - - - - \ No newline at end of file diff --git a/mascara/example/index.js b/mascara/example/index.js deleted file mode 100644 index aae7ccd19..000000000 --- a/mascara/example/index.js +++ /dev/null @@ -1,57 +0,0 @@ -window.addEventListener('load', web3Detect) -window.addEventListener('message', console.warn) - -function web3Detect() { - if (global.web3) { - logToDom('web3 detected!') - startApp() - } else { - logToDom('no web3 detected!') - } -} - -function startApp(){ - console.log('app started') - - var primaryAccount - console.log('getting main account...') - web3.eth.getAccounts((err, addresses) => { - if (err) console.error(err) - console.log('set address', addresses[0]) - primaryAccount = addresses[0] - }) - - document.querySelector('.action-button-1').addEventListener('click', function(){ - console.log('saw click') - console.log('sending tx') - primaryAccount - web3.eth.sendTransaction({ - from: primaryAccount, - to: primaryAccount, - value: 0, - }, function(err, txHash){ - if (err) throw err - console.log('sendTransaction result:', err || txHash) - }) - }) - document.querySelector('.action-button-2').addEventListener('click', function(){ - console.log('saw click') - setTimeout(function(){ - console.log('sending tx') - web3.eth.sendTransaction({ - from: primaryAccount, - to: primaryAccount, - value: 0, - }, function(err, txHash){ - if (err) throw err - console.log('sendTransaction result:', err || txHash) - }) - }) - }) - -} - -function logToDom(message){ - document.body.appendChild(document.createTextNode(message)) - console.log(message) -} diff --git a/mascara/example/server.js b/mascara/example/server.js new file mode 100644 index 000000000..d39c19600 --- /dev/null +++ b/mascara/example/server.js @@ -0,0 +1,31 @@ +const express = require('express') +const createMetamascaraServer = require('../server/') +const createBundle = require('../server/util').createBundle +const serveBundle = require('../server/util').serveBundle + +// +// Iframe Server +// + +const mascaraServer = createMetamascaraServer() + +// start the server +const mascaraPort = 9001 +mascaraServer.listen(mascaraPort) +console.log(`Mascara service listening on port ${mascaraPort}`) + + +// +// Dapp Server +// + +const dappServer = express() + +// serve dapp bundle +serveBundle(dappServer, '/app.js', createBundle(require.resolve('./app.js'))) +dappServer.use(express.static(__dirname + '/app/')) + +// start the server +const dappPort = '9002' +dappServer.listen(dappPort) +console.log(`Dapp listening on port ${dappPort}`) diff --git a/mascara/proxy/index.html b/mascara/proxy/index.html new file mode 100644 index 000000000..b83fc41af --- /dev/null +++ b/mascara/proxy/index.html @@ -0,0 +1,20 @@ + + + + + + + MetaMask ZeroClient Iframe + + + + + + + + Hello! I am the MetaMask iframe. + + + \ No newline at end of file diff --git a/mascara/server.js b/mascara/server.js deleted file mode 100644 index 67c89f11b..000000000 --- a/mascara/server.js +++ /dev/null @@ -1,103 +0,0 @@ -const express = require('express') -const browserify = require('browserify') -const watchify = require('watchify') -const babelify = require('babelify') - -const zeroBundle = createBundle('./src/mascara.js') -const controllerBundle = createBundle('./src/dapp-connection.js') -const popupBundle = createBundle('./src/popup.js') -const swBuild = createBundle('./src/background.js') - -const appBundle = createBundle('./example/index.js') - -// -// Iframe Server -// - -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) -}) -iframeServer.get('/popup/sw-build.js', function(req, res){ - console.log('/sw-build.js') - res.setHeader('Content-Type', 'application/javascript') - res.send(swBuild.latest) -}) - -// serve background controller -iframeServer.use(express.static('./server')) - -// start the server -const mascaraPort = 9001 -iframeServer.listen(mascaraPort) -console.log(`Mascara service listening on port ${mascaraPort}`) - - -// -// Dapp Server -// - -const dappServer = express() - -// serve metamask-lib bundle -dappServer.get('/zero.js', function(req, res){ - res.send(zeroBundle.latest) -}) - -// serve dapp bundle -dappServer.get('/app.js', function(req, res){ - res.send(appBundle.latest) -}) - -// serve static -dappServer.use(express.static('./example')) - -// start the server -const dappPort = '9002' -dappServer.listen(dappPort) -console.log(`Dapp listening on port ${dappPort}`) - -// -// util -// - -function serveBundle(entryPoint){ - const bundle = createBundle(entryPoint) - return function(req, res){ - res.send(bundle.latest) - } -} - -function createBundle(entryPoint){ - - var bundleContainer = {} - - var bundler = browserify({ - entries: [entryPoint], - cache: {}, - packageCache: {}, - plugin: [watchify], - }) - - bundler.on('update', bundle) - bundle() - - return bundleContainer - - function bundle() { - bundler.bundle(function(err, result){ - if (err) throw err - console.log(`Bundle updated! (${entryPoint})`) - bundleContainer.latest = result.toString() - }) - } - -} diff --git a/mascara/server/index.html b/mascara/server/index.html deleted file mode 100644 index 2308dd98b..000000000 --- a/mascara/server/index.html +++ /dev/null @@ -1,20 +0,0 @@ - - - - - - - MetaMask ZeroClient Iframe - - - - - - - - Hello! I am the MetaMask iframe. - - - \ No newline at end of file diff --git a/mascara/server/index.js b/mascara/server/index.js new file mode 100644 index 000000000..61dc61a02 --- /dev/null +++ b/mascara/server/index.js @@ -0,0 +1,32 @@ +const express = require('express') +const createBundle = require('./util').createBundle +const serveBundle = require('./util').serveBundle + +module.exports = createMetamascaraServer + + +function createMetamascaraServer(){ + + // start bundlers + const metamascaraBundle = createBundle('./src/mascara.js') + const proxyBundle = createBundle('./src/proxy.js') + const uiBundle = createBundle('./src/popup.js') + const backgroundBuild = createBundle('./src/background.js') + + // serve bundles + const server = express() + // ui window + serveBundle(server, '/ui.js', uiBundle) + server.use(express.static(__dirname+'/../ui/')) + server.use(express.static(__dirname+'/../../dist/chrome')) + // metamascara + serveBundle(server, '/metamascara.js', metamascaraBundle) + // proxy + serveBundle(server, '/proxy/proxy.js', proxyBundle) + server.use('/proxy/', express.static(__dirname+'/../proxy')) + // background + serveBundle(server, '/background.js', backgroundBuild) + + return server + +} diff --git a/mascara/server/util.js b/mascara/server/util.js new file mode 100644 index 000000000..6e25b35d8 --- /dev/null +++ b/mascara/server/util.js @@ -0,0 +1,45 @@ +const browserify = require('browserify') +const watchify = require('watchify') + +module.exports = { + serveBundle, + createBundle, +} + + +function serveBundle(server, path, bundle){ + server.get(path, function(req, res){ + res.setHeader('Content-Type', 'application/javascript; charset=UTF-8') + res.send(bundle.latest) + }) +} + +function createBundle(entryPoint){ + + var bundleContainer = {} + + var bundler = browserify({ + entries: [entryPoint], + cache: {}, + packageCache: {}, + plugin: [watchify], + }) + + bundler.on('update', bundle) + bundle() + + return bundleContainer + + function bundle() { + bundler.bundle(function(err, result){ + if (err) { + console.log(`Bundle failed! (${entryPoint})`) + console.error(err) + return + } + console.log(`Bundle updated! (${entryPoint})`) + bundleContainer.latest = result.toString() + }) + } + +} diff --git a/mascara/src/dapp-connection.js b/mascara/src/dapp-connection.js deleted file mode 100644 index 30680c9d7..000000000 --- a/mascara/src/dapp-connection.js +++ /dev/null @@ -1,21 +0,0 @@ -const ParentStream = require('iframe-stream').ParentStream -const SWcontroller = require('client-sw-ready-event/lib/sw-client.js') -const SwStream = require('sw-stream/lib/sw-stream.js') -const SetupUntrustedComunication = ('./lib/setup-untrusted-connection.js') - -const background = new SWcontroller({ - fileName: '/popup/sw-build.js', -}) - -const pageStream = new ParentStream() -background.on('ready', (_) => { - let swStream = SwStream({ - serviceWorker: background.controller, - context: 'dapp', - }) - pageStream.pipe(swStream).pipe(pageStream) - -}) - -background.on('error', console.error) -background.startWorker() diff --git a/mascara/src/lib/setup-provider.js b/mascara/src/lib/setup-provider.js index 4f2432ae4..62335b18d 100644 --- a/mascara/src/lib/setup-provider.js +++ b/mascara/src/lib/setup-provider.js @@ -4,14 +4,14 @@ const MetamaskInpageProvider = require('../../../app/scripts/lib/inpage-provider module.exports = getProvider -function getProvider(){ +function getProvider(opts){ if (global.web3) { console.log('MetaMask ZeroClient - using environmental web3 provider') return global.web3.currentProvider } console.log('MetaMask ZeroClient - injecting zero-client iframe!') var iframeStream = setupIframe({ - zeroClientProvider: 'http://localhost:9001', + zeroClientProvider: opts.mascaraUrl, sandboxAttributes: ['allow-scripts', 'allow-popups', 'allow-same-origin'], container: document.body, }) diff --git a/mascara/src/mascara.js b/mascara/src/mascara.js index 759353c1b..f9bed7e52 100644 --- a/mascara/src/mascara.js +++ b/mascara/src/mascara.js @@ -1,15 +1,22 @@ const Web3 = require('web3') const setupProvider = require('./lib/setup-provider.js') +const MASACARA_DOMAIN = 'http://localhost:9001' + // // setup web3 // -var provider = setupProvider() -hijackProvider(provider) + +var provider = setupProvider({ + mascaraUrl: MASACARA_DOMAIN + '/proxy/', +}) +instrumentForUserInteractionTriggers(provider) + var web3 = new Web3(provider) web3.setProvider = function(){ console.log('MetaMask - overrode web3.setProvider') } + // // // export web3 @@ -25,12 +32,12 @@ var shouldPop = false window.addEventListener('click', function(){ if (!shouldPop) return shouldPop = false - window.open('http://localhost:9001/popup/popup.html', '', 'width=360 height=500') + window.open(MASACARA_DOMAIN, '', 'width=360 height=500') console.log('opening window...') }) -function hijackProvider(provider){ +function instrumentForUserInteractionTriggers(provider){ var _super = provider.sendAsync.bind(provider) provider.sendAsync = function(payload, cb){ if (payload.method === 'eth_sendTransaction') { diff --git a/mascara/src/proxy.js b/mascara/src/proxy.js new file mode 100644 index 000000000..e580076c1 --- /dev/null +++ b/mascara/src/proxy.js @@ -0,0 +1,21 @@ +const ParentStream = require('iframe-stream').ParentStream +const SWcontroller = require('client-sw-ready-event/lib/sw-client.js') +const SwStream = require('sw-stream/lib/sw-stream.js') +const SetupUntrustedComunication = ('./lib/setup-untrusted-connection.js') + +const background = new SWcontroller({ + fileName: '/background.js', +}) + +const pageStream = new ParentStream() +background.on('ready', (_) => { + let swStream = SwStream({ + serviceWorker: background.controller, + context: 'dapp', + }) + pageStream.pipe(swStream).pipe(pageStream) + +}) + +background.on('error', console.error) +background.startWorker() diff --git a/mascara/ui/index.html b/mascara/ui/index.html new file mode 100644 index 000000000..c5eeb05ef --- /dev/null +++ b/mascara/ui/index.html @@ -0,0 +1,11 @@ + + + + + MetaMask Plugin + + +
+ + + \ No newline at end of file -- cgit v1.2.3 From 1aac162b462424f5b6ce6685f337670368bd10b5 Mon Sep 17 00:00:00 2001 From: kumavis Date: Tue, 4 Apr 2017 23:08:46 -0700 Subject: mascara - rename popup to ui --- mascara/server/index.js | 2 +- mascara/src/popup.js | 41 ----------------------------------------- mascara/src/ui.js | 41 +++++++++++++++++++++++++++++++++++++++++ 3 files changed, 42 insertions(+), 42 deletions(-) delete mode 100644 mascara/src/popup.js create mode 100644 mascara/src/ui.js (limited to 'mascara') diff --git a/mascara/server/index.js b/mascara/server/index.js index 61dc61a02..9fd664eee 100644 --- a/mascara/server/index.js +++ b/mascara/server/index.js @@ -10,7 +10,7 @@ function createMetamascaraServer(){ // start bundlers const metamascaraBundle = createBundle('./src/mascara.js') const proxyBundle = createBundle('./src/proxy.js') - const uiBundle = createBundle('./src/popup.js') + const uiBundle = createBundle('./src/ui.js') const backgroundBuild = createBundle('./src/background.js') // serve bundles diff --git a/mascara/src/popup.js b/mascara/src/popup.js deleted file mode 100644 index b740e81a5..000000000 --- a/mascara/src/popup.js +++ /dev/null @@ -1,41 +0,0 @@ -const injectCss = require('inject-css') -const SWcontroller = require('client-sw-ready-event/lib/sw-client.js') -const SwStream = require('sw-stream/lib/sw-stream.js') -const MetaMaskUiCss = require('../../ui/css') -const setupIframe = require('./lib/setup-iframe.js') -const MetamaskInpageProvider = require('../../app/scripts/lib/inpage-provider.js') -const MetamascaraPlatform = require('../../app/scripts/platforms/window') -const startPopup = require('../../app/scripts/popup-core') - -// create platform global -global.platform = new MetamascaraPlatform() - - -var css = MetaMaskUiCss() -injectCss(css) -const container = document.getElementById('app-content') - -var name = 'popup' -window.METAMASK_UI_TYPE = name - -const background = new SWcontroller({ - fileName: '/popup/sw-build.js', -}) - -// Setup listener for when the service worker is read -background.on('ready', (readSw) => { - let connectionStream = SwStream({ - serviceWorker: background.controller, - context: name, - }) - startPopup({container, connectionStream}, (err, store) => { - if (err) return displayCriticalError(err) - store.subscribe(() => { - const state = store.getState() - if (state.appState.shouldClose) window.close() - }) - }) -}) - -background.startWorker() -console.log('hello from /library/popup.js') diff --git a/mascara/src/ui.js b/mascara/src/ui.js new file mode 100644 index 000000000..c4866867b --- /dev/null +++ b/mascara/src/ui.js @@ -0,0 +1,41 @@ +const injectCss = require('inject-css') +const SWcontroller = require('client-sw-ready-event/lib/sw-client.js') +const SwStream = require('sw-stream/lib/sw-stream.js') +const MetaMaskUiCss = require('../../ui/css') +const setupIframe = require('./lib/setup-iframe.js') +const MetamaskInpageProvider = require('../../app/scripts/lib/inpage-provider.js') +const MetamascaraPlatform = require('../../app/scripts/platforms/window') +const startPopup = require('../../app/scripts/popup-core') + +// create platform global +global.platform = new MetamascaraPlatform() + + +var css = MetaMaskUiCss() +injectCss(css) +const container = document.getElementById('app-content') + +var name = 'popup' +window.METAMASK_UI_TYPE = name + +const background = new SWcontroller({ + fileName: '/background.js', +}) + +// Setup listener for when the service worker is read +background.on('ready', (readSw) => { + let connectionStream = SwStream({ + serviceWorker: background.controller, + context: name, + }) + startPopup({container, connectionStream}, (err, store) => { + if (err) return displayCriticalError(err) + store.subscribe(() => { + const state = store.getState() + if (state.appState.shouldClose) window.close() + }) + }) +}) + +background.startWorker() +console.log('hello from MetaMascara ui!') -- cgit v1.2.3