diff --git a/mascara/example/app.js b/mascara/example/app.js index aae7ccd19..d0cb6ba83 100644 --- a/mascara/example/app.js +++ b/mascara/example/app.js @@ -1,57 +1,26 @@ -window.addEventListener('load', web3Detect) +const EthQuery = require('ethjs-query') + +window.addEventListener('load', loadProvider) window.addEventListener('message', console.warn) -function web3Detect() { - if (global.web3) { - logToDom('web3 detected!') - startApp() - } else { - logToDom('no web3 detected!') - } +async function loadProvider() { + const ethereumProvider = window.metamask.createDefaultProvider({ host: 'http://localhost:9001' }) + const ethQuery = new EthQuery(ethereumProvider) + const accounts = await ethQuery.accounts() + logToDom(accounts.length ? accounts[0] : 'LOCKED or undefined') + setupButton(ethQuery) } -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)) + document.getElementById('account').innerText = message console.log(message) } + +function setupButton (ethQuery) { + const button = document.getElementById('action-button-1') + button.addEventListener('click', async () => { + const accounts = await ethQuery.accounts() + logToDom(accounts.length ? accounts[0] : 'LOCKED or undefined') + }) +} \ No newline at end of file diff --git a/mascara/example/app/index.html b/mascara/example/app/index.html index 02323e5f9..f3e38877c 100644 --- a/mascara/example/app/index.html +++ b/mascara/example/app/index.html @@ -3,13 +3,13 @@ - MetaMask ZeroClient Example + MetaMask ZeroClient Example - - + +
\ No newline at end of file diff --git a/mascara/src/lib/setup-iframe.js b/mascara/src/lib/setup-iframe.js deleted file mode 100644 index dcf404574..000000000 --- a/mascara/src/lib/setup-iframe.js +++ /dev/null @@ -1,19 +0,0 @@ -const Iframe = require('iframe') -const createIframeStream = require('iframe-stream').IframeStream - -module.exports = setupIframe - - -function setupIframe(opts) { - opts = opts || {} - var frame = Iframe({ - src: opts.zeroClientProvider || 'https://zero.metamask.io/', - container: opts.container || document.head, - sandboxAttributes: opts.sandboxAttributes || ['allow-scripts', 'allow-popups'], - }) - var iframe = frame.iframe - iframe.style.setProperty('display', 'none') - var iframeStream = createIframeStream(iframe) - - return iframeStream -} diff --git a/mascara/src/lib/setup-provider.js b/mascara/src/lib/setup-provider.js deleted file mode 100644 index 62335b18d..000000000 --- a/mascara/src/lib/setup-provider.js +++ /dev/null @@ -1,22 +0,0 @@ -const setupIframe = require('./setup-iframe.js') -const MetamaskInpageProvider = require('../../../app/scripts/lib/inpage-provider.js') - -module.exports = 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: opts.mascaraUrl, - sandboxAttributes: ['allow-scripts', 'allow-popups', 'allow-same-origin'], - container: document.body, - }) - - var inpageProvider = new MetamaskInpageProvider(iframeStream) - return inpageProvider - -} diff --git a/mascara/src/mascara.js b/mascara/src/mascara.js index 1655d1f64..0af6f532f 100644 --- a/mascara/src/mascara.js +++ b/mascara/src/mascara.js @@ -1,47 +1 @@ -const Web3 = require('web3') -const setupProvider = require('./lib/setup-provider.js') -const setupDappAutoReload = require('../../app/scripts/lib/auto-reload.js') -const MASCARA_ORIGIN = process.env.MASCARA_ORIGIN || 'http://localhost:9001' -console.log('MASCARA_ORIGIN:', MASCARA_ORIGIN) - -// -// setup web3 -// - -const provider = setupProvider({ - mascaraUrl: MASCARA_ORIGIN + '/proxy/', -}) -instrumentForUserInteractionTriggers(provider) - -const web3 = new Web3(provider) -setupDappAutoReload(web3, provider.publicConfigStore) -// -// ui stuff -// - -let shouldPop = false -window.addEventListener('click', maybeTriggerPopup) - -// -// util -// - -function maybeTriggerPopup(){ - if (!shouldPop) return - shouldPop = false - window.open(MASCARA_ORIGIN, '', 'width=360 height=500') - console.log('opening window...') -} - -function instrumentForUserInteractionTriggers(provider){ - const _super = provider.sendAsync.bind(provider) - provider.sendAsync = function(payload, cb){ - if (payload.method === 'eth_sendTransaction') { - console.log('saw send') - shouldPop = true - } - _super(payload, cb) - } -} - - +global.metamask = require('metamascara') diff --git a/package.json b/package.json index 14e7f100f..4da6d99a7 100644 --- a/package.json +++ b/package.json @@ -99,6 +99,7 @@ "json-rpc-engine": "^3.1.0", "json-rpc-middleware-stream": "^1.0.0", "loglevel": "^1.4.1", + "metamascara": "^1.1.1", "metamask-logo": "^2.1.2", "mississippi": "^1.2.0", "mkdirp": "^0.5.1",