m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

Merge pull request #1309 from MetaMask/mascara2

Browse Source 
Mascara - various fixes
This commit is contained in:
Frankie 2017-04-05 09:30:07 +02:00 committed by GitHub
commit dd6b4505f4
22 changed files with 236 additions and 150 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/scripts/lib/auto-faucet.js
View File

@ -3,9 +3,11 @@ const METAMASK_DEBUG = 'GULP_METAMASK_DEBUG'
const env = process.env.METAMASK_ENV const env = process.env.METAMASK_ENV
module.exports = function (address) { module.exports = function (address) {
if (METAMASK_DEBUG || env === 'test') return // Don't faucet in development or test // Don't faucet in development or test
let data = address if (METAMASK_DEBUG === true || env === 'test') return
let headers = new Headers() global.log.info('auto-fauceting:', address)
const data = address
const headers = new Headers()
headers.append('Content-type', 'application/rawdata') headers.append('Content-type', 'application/rawdata')
fetch(uri, { fetch(uri, {
method: 'POST', method: 'POST',

19
app/scripts/lib/buy-eth-url.js Normal file
View File

@ -0,0 +1,19 @@
module.exports = getBuyEthUrl
function getBuyEthUrl({ network, amount, address }){
let url
switch (network) {
case '1':
url = `https://buy.coinbase.com/?code=9ec56d01-7e81-5017-930c-513daa27bb6a&amount=${amount}&address=${address}&crypto_currency=ETH`
break
case '3':
url = 'https://faucet.metamask.io/'
break
case '42':
url = 'https://github.com/kovan-testnet/faucet'
break
}
return url
}

19
app/scripts/metamask-controller.js
View File

@ -23,6 +23,7 @@ const ConfigManager = require('./lib/config-manager')
const autoFaucet = require('./lib/auto-faucet') const autoFaucet = require('./lib/auto-faucet')
const nodeify = require('./lib/nodeify') const nodeify = require('./lib/nodeify')
const accountImporter = require('./account-import-strategies') const accountImporter = require('./account-import-strategies')
const getBuyEthUrl = require('./lib/buy-eth-url')
const version = require('../manifest.json').version const version = require('../manifest.json').version
@ -614,24 +615,8 @@ module.exports = class MetamaskController extends EventEmitter {
buyEth (address, amount) { buyEth (address, amount) {
if (!amount) amount = '5' if (!amount) amount = '5'
const network = this.getNetworkState() const network = this.getNetworkState()
let url const url = getBuyEthUrl({ network, address, amount })
switch (network) {
case '1':
url = `https://buy.coinbase.com/?code=9ec56d01-7e81-5017-930c-513daa27bb6a&amount=${amount}&address=${address}&crypto_currency=ETH`
break
case '3':
url = 'https://faucet.metamask.io/'
break
case '42':
url = 'https://github.com/kovan-testnet/faucet'
break
}
if (url) this.platform.openWindow({ url }) if (url) this.platform.openWindow({ url })
} }

24
app/scripts/platforms/sw.js Normal file
View File

@ -0,0 +1,24 @@
class SwPlatform {
//
// Public
//
reload () {
// you cant actually do this
global.location.reload()
}
openWindow ({ url }) {
// this doesnt actually work
global.open(url, '_blank')
}
getVersion () {
return '<unable to read version>'
}
}
module.exports = SwPlatform

22
app/scripts/platforms/window.js Normal file
View File

@ -0,0 +1,22 @@
class WindowPlatform {
//
// Public
//
reload () {
global.location.reload()
}
openWindow ({ url }) {
global.open(url, '_blank')
}
getVersion () {
return '<unable to read version>'
}
}
module.exports = WindowPlatform

0
mascara/example/index.js → mascara/example/app.js
View File

4
mascara/example/index.html → mascara/example/app/index.html
View File

@ -3,15 +3,13 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>MetaMask ZeroClient Example</title> <title>MetaMask ZeroClient Example</title>
<script src="http://localhost:9001/metamascara.js"></script>
</head> </head>
<body> <body>
<button class="action-button-1">SYNC TX</button> <button class="action-button-1">SYNC TX</button>
<button class="action-button-2">ASYNC TX</button> <button class="action-button-2">ASYNC TX</button>
<script src="./zero.js"></script>
<script src="./app.js"></script> <script src="./app.js"></script>
</body> </body>
</html> </html>

31
mascara/example/server.js Normal file
View File

@ -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}`)

2
mascara/server/index.html → mascara/proxy/index.html
View File

@ -15,6 +15,6 @@
<body> <body>
Hello! I am the MetaMask iframe. Hello! I am the MetaMask iframe.
<script src="/controller.js"></script> <script src="./proxy.js"></script>
</body> </body>
</html> </html>

103
mascara/server.js
View File

@ -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()
})
}
}

32
mascara/server/index.js Normal file
View File

@ -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/ui.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
}

45
mascara/server/util.js Normal file
View File

@ -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()
})
}
}

8
mascara/src/background.js
View File

@ -8,6 +8,7 @@ const PortStream = require('../../app/scripts/lib/port-stream.js')
const DbController = require('./lib/index-db-controller') const DbController = require('./lib/index-db-controller')
const SwPlatform = require('../../app/scripts/platforms/sw')
const MetamaskController = require('../../app/scripts/metamask-controller') const MetamaskController = require('../../app/scripts/metamask-controller')
const extension = {} //require('../../app/scripts/lib/extension') 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 firstTimeState = require('../../app/scripts/first-time-state')
const STORAGE_KEY = 'metamask-config' const STORAGE_KEY = 'metamask-config'
const METAMASK_DEBUG = 'GULP_METAMASK_DEBUG' // const METAMASK_DEBUG = 'GULP_METAMASK_DEBUG'
const METAMASK_DEBUG = true
let popupIsOpen = false let popupIsOpen = false
const log = require('loglevel') const log = require('loglevel')
@ -70,7 +72,11 @@ function setupController (initState, client) {
// MetaMask Controller // MetaMask Controller
// //
const platform = new SwPlatform()
const controller = new MetamaskController({ const controller = new MetamaskController({
// platform specific implementation
platform,
// User confirmation callbacks: // User confirmation callbacks:
showUnconfirmedMessage: noop, showUnconfirmedMessage: noop,
unlockAccountMessage: noop, unlockAccountMessage: noop,

4
mascara/src/lib/setup-provider.js
View File

@ -4,14 +4,14 @@ const MetamaskInpageProvider = require('../../../app/scripts/lib/inpage-provider
module.exports = getProvider module.exports = getProvider
function getProvider(){ function getProvider(opts){
if (global.web3) { if (global.web3) {
console.log('MetaMask ZeroClient - using environmental web3 provider') console.log('MetaMask ZeroClient - using environmental web3 provider')
return global.web3.currentProvider return global.web3.currentProvider
} }
console.log('MetaMask ZeroClient - injecting zero-client iframe!') console.log('MetaMask ZeroClient - injecting zero-client iframe!')
var iframeStream = setupIframe({ var iframeStream = setupIframe({
zeroClientProvider: 'http://localhost:9001', zeroClientProvider: opts.mascaraUrl,
sandboxAttributes: ['allow-scripts', 'allow-popups', 'allow-same-origin'], sandboxAttributes: ['allow-scripts', 'allow-popups', 'allow-same-origin'],
container: document.body, container: document.body,
}) })

15
mascara/src/mascara.js
View File

@ -1,15 +1,22 @@
const Web3 = require('web3') const Web3 = require('web3')
const setupProvider = require('./lib/setup-provider.js') const setupProvider = require('./lib/setup-provider.js')
const MASACARA_DOMAIN = 'http://localhost:9001'
// //
// setup web3 // setup web3
// //
var provider = setupProvider()
hijackProvider(provider) var provider = setupProvider({
mascaraUrl: MASACARA_DOMAIN + '/proxy/',
})
instrumentForUserInteractionTriggers(provider)
var web3 = new Web3(provider) var web3 = new Web3(provider)
web3.setProvider = function(){ web3.setProvider = function(){
console.log('MetaMask - overrode web3.setProvider') console.log('MetaMask - overrode web3.setProvider')
} }
// //
// //
// export web3 // export web3
@ -25,12 +32,12 @@ var shouldPop = false
window.addEventListener('click', function(){ window.addEventListener('click', function(){
if (!shouldPop) return if (!shouldPop) return
shouldPop = false 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...') console.log('opening window...')
}) })
function hijackProvider(provider){ function instrumentForUserInteractionTriggers(provider){
var _super = provider.sendAsync.bind(provider) var _super = provider.sendAsync.bind(provider)
provider.sendAsync = function(payload, cb){ provider.sendAsync = function(payload, cb){
if (payload.method === 'eth_sendTransaction') { if (payload.method === 'eth_sendTransaction') {

2
mascara/src/dapp-connection.js → mascara/src/proxy.js
View File

@ -4,7 +4,7 @@ const SwStream = require('sw-stream/lib/sw-stream.js')
const SetupUntrustedComunication = ('./lib/setup-untrusted-connection.js') const SetupUntrustedComunication = ('./lib/setup-untrusted-connection.js')
const background = new SWcontroller({ const background = new SWcontroller({
fileName: '/popup/sw-build.js', fileName: '/background.js',
}) })
const pageStream = new ParentStream() const pageStream = new ParentStream()

9
mascara/src/popup.js → mascara/src/ui.js
View File

@ -4,8 +4,13 @@ const SwStream = require('sw-stream/lib/sw-stream.js')
const MetaMaskUiCss = require('../../ui/css') const MetaMaskUiCss = require('../../ui/css')
const setupIframe = require('./lib/setup-iframe.js') const setupIframe = require('./lib/setup-iframe.js')
const MetamaskInpageProvider = require('../../app/scripts/lib/inpage-provider.js') const MetamaskInpageProvider = require('../../app/scripts/lib/inpage-provider.js')
const MetamascaraPlatform = require('../../app/scripts/platforms/window')
const startPopup = require('../../app/scripts/popup-core') const startPopup = require('../../app/scripts/popup-core')
// create platform global
global.platform = new MetamascaraPlatform()
var css = MetaMaskUiCss() var css = MetaMaskUiCss()
injectCss(css) injectCss(css)
const container = document.getElementById('app-content') const container = document.getElementById('app-content')
@ -14,7 +19,7 @@ var name = 'popup'
window.METAMASK_UI_TYPE = name window.METAMASK_UI_TYPE = name
const background = new SWcontroller({ const background = new SWcontroller({
fileName: '/popup/sw-build.js', fileName: '/background.js',
}) })
// Setup listener for when the service worker is read // Setup listener for when the service worker is read
@ -33,4 +38,4 @@ background.on('ready', (readSw) => {
}) })
background.startWorker() background.startWorker()
console.log('hello from /library/popup.js') console.log('hello from MetaMascara ui!')

11
mascara/ui/index.html Normal file
View File

@ -0,0 +1,11 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>MetaMask Plugin</title>
</head>
<body>
<div id="app-content"></div>
<script src="./ui.js" type="text/javascript" charset="utf-8"></script>
</body>
</html>

8
ui/app/actions.js
View File

@ -1,3 +1,5 @@
const getBuyEthUrl = require('../../app/scripts/lib/buy-eth-url')
var actions = { var actions = {
_setBackgroundConnection: _setBackgroundConnection, _setBackgroundConnection: _setBackgroundConnection,
@ -833,10 +835,10 @@ function showSendPage () {
} }
} }
function buyEth (address, amount) { function buyEth (opts) {
return (dispatch) => { return (dispatch) => {
log.debug(`background.buyEth`) const url = getBuyEthUrl(opts)
background.buyEth(address, amount) global.platform.openWindow({ url })
dispatch({ dispatch({
type: actions.BUY_ETH, type: actions.BUY_ETH,
}) })

13
ui/app/components/buy-button-subview.js
View File

@ -104,7 +104,8 @@ BuyButtonSubview.prototype.render = function () {
} }
BuyButtonSubview.prototype.formVersionSubview = function () { BuyButtonSubview.prototype.formVersionSubview = function () {
if (this.props.network === '1') { const network = this.props.network
if (network === '1') {
if (this.props.buyView.formView.coinbase) { if (this.props.buyView.formView.coinbase) {
return h(CoinbaseForm, this.props) return h(CoinbaseForm, this.props)
} else if (this.props.buyView.formView.shapeshift) { } else if (this.props.buyView.formView.shapeshift) {
@ -123,15 +124,15 @@ BuyButtonSubview.prototype.formVersionSubview = function () {
marginBottom: '15px', marginBottom: '15px',
}, },
}, 'In order to access this feature, please switch to the Main Network'), }, 'In order to access this feature, please switch to the Main Network'),
((this.props.network === '3') || (this.props.network === '42')) ? h('h3.text-transform-uppercase', 'or go to the') : null, ((network === '3') || (network === '42')) ? h('h3.text-transform-uppercase', 'or go to the') : null,
(this.props.network === '3') ? h('button.text-transform-uppercase', { (network === '3') ? h('button.text-transform-uppercase', {
onClick: () => this.props.dispatch(actions.buyEth()), onClick: () => this.props.dispatch(actions.buyEth({ network })),
style: { style: {
marginTop: '15px', marginTop: '15px',
}, },
}, 'Ropsten Test Faucet') : null, }, 'Ropsten Test Faucet') : null,
(this.props.network === '42') ? h('button.text-transform-uppercase', { (network === '42') ? h('button.text-transform-uppercase', {
onClick: () => this.props.dispatch(actions.buyEth()), onClick: () => this.props.dispatch(actions.buyEth({ network })),
style: { style: {
marginTop: '15px', marginTop: '15px',
}, },

2
ui/app/components/coinbase-form.js
View File

@ -112,7 +112,7 @@ CoinbaseForm.prototype.toCoinbase = function () {
var message var message
if (isValidAddress(address) && isValidAmountforCoinBase(amount).valid) { if (isValidAddress(address) && isValidAmountforCoinBase(amount).valid) {
props.dispatch(actions.buyEth(address, props.buyView.amount)) props.dispatch(actions.buyEth({ network: '1', address, amount: props.buyView.amount }))
} else if (!isValidAmountforCoinBase(amount).valid) { } else if (!isValidAmountforCoinBase(amount).valid) {
message = isValidAmountforCoinBase(amount).message message = isValidAmountforCoinBase(amount).message
return props.dispatch(actions.displayWarning(message)) return props.dispatch(actions.displayWarning(message))

5
ui/app/components/transaction-list-item.js
View File

@ -7,7 +7,6 @@ const addressSummary = require('../util').addressSummary
const explorerLink = require('../../lib/explorer-link') const explorerLink = require('../../lib/explorer-link')
const CopyButton = require('./copyButton') const CopyButton = require('./copyButton')
const vreme = new (require('vreme')) const vreme = new (require('vreme'))
const extension = require('extensionizer')
const Tooltip = require('./tooltip') const Tooltip = require('./tooltip')
const TransactionIcon = require('./transaction-list-item-icon') const TransactionIcon = require('./transaction-list-item-icon')
@ -50,7 +49,7 @@ TransactionListItem.prototype.render = function () {
event.stopPropagation() event.stopPropagation()
if (!transaction.hash || !isLinkable) return if (!transaction.hash || !isLinkable) return
var url = explorerLink(transaction.hash, parseInt(network)) var url = explorerLink(transaction.hash, parseInt(network))
extension.tabs.create({ url }) global.platform.openWindow({ url })
}, },
style: { style: {
padding: '20px 0', padding: '20px 0',
@ -63,7 +62,7 @@ TransactionListItem.prototype.render = function () {
event.stopPropagation() event.stopPropagation()
if (!isTx || isPending) return if (!isTx || isPending) return
var url = `https://metamask.github.io/eth-tx-viz/?tx=${transaction.hash}` var url = `https://metamask.github.io/eth-tx-viz/?tx=${transaction.hash}`
extension.tabs.create({ url }) global.platform.openWindow({ url })
}, },
}, [ }, [
h(TransactionIcon, { txParams, transaction, isTx, isMsg }), h(TransactionIcon, { txParams, transaction, isTx, isMsg }),