From d8c94fca75ca2aed11387c0b1d4c6064bead447e Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Fri, 26 May 2017 00:19:24 -0700 Subject: [PATCH 1/4] Add address image map to icon factory Deriving from the new address image map repository I've added here: https://github.com/MetaMask/ethereum-contract-icons With this PR, images for addresses added to that repository will be shown instead of jazzicons in MetaMask. --- app/scripts/inpage.js | 4 +-- app/scripts/lib/inpage-provider.js | 2 ++ gulpfile.js | 10 ++++++++ package.json | 1 + ui/lib/icon-factory.js | 39 ++++++++++++++++-------------- 5 files changed, 36 insertions(+), 20 deletions(-) diff --git a/app/scripts/inpage.js b/app/scripts/inpage.js index ec764535e..10e5ea39b 100644 --- a/app/scripts/inpage.js +++ b/app/scripts/inpage.js @@ -1,6 +1,6 @@ /*global Web3*/ cleanContextForImports() -require('web3/dist/web3.min.js') +require('web3') const LocalMessageDuplexStream = require('post-message-stream') // const PingStream = require('ping-pong-stream/ping') // const endOfStream = require('end-of-stream') @@ -30,7 +30,7 @@ var web3 = new Web3(inpageProvider) web3.setProvider = function () { console.log('MetaMask - overrode web3.setProvider') } -console.log('MetaMask - injected web3') +console.log('MetaMask - injected modified web3') // export global web3, with usage-detection setupDappAutoReload(web3, inpageProvider.publicConfigStore) diff --git a/app/scripts/lib/inpage-provider.js b/app/scripts/lib/inpage-provider.js index 8b8623974..5206adc82 100644 --- a/app/scripts/lib/inpage-provider.js +++ b/app/scripts/lib/inpage-provider.js @@ -39,6 +39,8 @@ function MetamaskInpageProvider (connectionStream) { self.idMap = {} // handle sendAsync requests via asyncProvider self.sendAsync = function (payload, cb) { + console.trace('sending async ' + payload.method) + console.dir(payload) // rewrite request ids var request = eachJsonMessage(payload, (message) => { var newId = createRandomId() diff --git a/gulpfile.js b/gulpfile.js index 9f4a606be..5bba1b9b3 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -52,6 +52,15 @@ gulp.task('copy:images', copyTask({ './dist/opera/images', ], })) +gulp.task('copy:contractImages', copyTask({ + source: './node_modules/ethereum-contract-icons/images/', + destinations: [ + './dist/firefox/images/contract', + './dist/chrome/images/contract', + './dist/edge/images/contract', + './dist/opera/images/contract', + ], +})) gulp.task('copy:fonts', copyTask({ source: './app/fonts/', destinations: [ @@ -127,6 +136,7 @@ const staticFiles = [ ] var copyStrings = staticFiles.map(staticFile => `copy:${staticFile}`) +copyStrings.push('copy:contractImages') if (!disableLiveReload) { copyStrings.push('copy:reload') diff --git a/package.json b/package.json index 6b6996d9d..9f47d76cb 100644 --- a/package.json +++ b/package.json @@ -66,6 +66,7 @@ "eth-query": "^2.1.1", "eth-sig-util": "^1.1.1", "eth-simple-keyring": "^1.1.1", + "ethereum-contract-icons": "^1.0.0", "ethereumjs-tx": "^1.3.0", "ethereumjs-util": "ethereumjs/ethereumjs-util#ac5d0908536b447083ea422b435da27f26615de9", "ethereumjs-wallet": "^0.6.0", diff --git a/ui/lib/icon-factory.js b/ui/lib/icon-factory.js index 82cc839d6..4aed9109b 100644 --- a/ui/lib/icon-factory.js +++ b/ui/lib/icon-factory.js @@ -1,4 +1,7 @@ var iconFactory +const isValidAddress = require('ethereumjs-util').isValidAddress +const toChecksumAddress = require('ethereumjs-util').toChecksumAddress +const iconMap = require('ethereum-contract-icons') module.exports = function (jazzicon) { if (!iconFactory) { @@ -12,22 +15,12 @@ function IconFactory (jazzicon) { this.cache = {} } -IconFactory.prototype.iconForAddress = function (address, diameter, imageify) { - if (imageify) { - return this.generateIdenticonImg(address, diameter) - } else { - return this.generateIdenticonSvg(address, diameter) +IconFactory.prototype.iconForAddress = function (address, diameter) { + const addr = toChecksumAddress(address) + if (iconExistsFor(addr)) { + return imageElFor(addr) } -} - -// returns img dom element -IconFactory.prototype.generateIdenticonImg = function (address, diameter) { - var identicon = this.generateIdenticonSvg(address, diameter) - var identiconSrc = identicon.innerHTML - var dataUri = toDataUri(identiconSrc) - var img = document.createElement('img') - img.src = dataUri - return img + return this.generateIdenticonSvg(address, diameter) } // returns svg dom element @@ -49,12 +42,22 @@ IconFactory.prototype.generateNewIdenticon = function (address, diameter) { // util +function iconExistsFor (address) { + return (address in iconMap) && isValidAddress(address) +} + +function imageElFor (address) { + const fileName = iconMap[address] + const path = `images/contract/${fileName}` + const img = document.createElement('img') + img.src = path + img.style.width = '100%' + return img +} + function jsNumberForAddress (address) { var addr = address.slice(2, 10) var seed = parseInt(addr, 16) return seed } -function toDataUri (identiconSrc) { - return 'data:image/svg+xml;charset=utf-8,' + encodeURIComponent(identiconSrc) -} From 7cd42ae9ba07b04bae8e86be1536610ea4931f51 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Fri, 26 May 2017 00:45:58 -0700 Subject: [PATCH 2/4] Bump changelog --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 4ad1b2f50..ca9cc6f5a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,6 +8,7 @@ - Fix bug where submit button was enabled for invalid gas inputs. - Now enforce 95% of block's gasLimit to protect users. - Removing provider-engine from the inpage provider. This fixes some error handling inconsistencies introduced in 3.7.0. +- Some contracts will now display logos instead of jazzicons. ## 3.7.0 2017-5-23 From 1dfc0f74bf578524107b796672f96eb71a2fed62 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Fri, 26 May 2017 00:50:27 -0700 Subject: [PATCH 3/4] Correct inpage to be not modified --- app/scripts/inpage.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/scripts/inpage.js b/app/scripts/inpage.js index 10e5ea39b..ec764535e 100644 --- a/app/scripts/inpage.js +++ b/app/scripts/inpage.js @@ -1,6 +1,6 @@ /*global Web3*/ cleanContextForImports() -require('web3') +require('web3/dist/web3.min.js') const LocalMessageDuplexStream = require('post-message-stream') // const PingStream = require('ping-pong-stream/ping') // const endOfStream = require('end-of-stream') @@ -30,7 +30,7 @@ var web3 = new Web3(inpageProvider) web3.setProvider = function () { console.log('MetaMask - overrode web3.setProvider') } -console.log('MetaMask - injected modified web3') +console.log('MetaMask - injected web3') // export global web3, with usage-detection setupDappAutoReload(web3, inpageProvider.publicConfigStore) From 7268fcb694b1cf43e1983b2f693ed731d3c2ec9b Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Fri, 26 May 2017 00:50:59 -0700 Subject: [PATCH 4/4] Revert inpage-provider --- app/scripts/lib/inpage-provider.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/app/scripts/lib/inpage-provider.js b/app/scripts/lib/inpage-provider.js index 5206adc82..8b8623974 100644 --- a/app/scripts/lib/inpage-provider.js +++ b/app/scripts/lib/inpage-provider.js @@ -39,8 +39,6 @@ function MetamaskInpageProvider (connectionStream) { self.idMap = {} // handle sendAsync requests via asyncProvider self.sendAsync = function (payload, cb) { - console.trace('sending async ' + payload.method) - console.dir(payload) // rewrite request ids var request = eachJsonMessage(payload, (message) => { var newId = createRandomId()