builds smoothly + forwards txs to extension

Gruntfile.js

@@ -28,27 +28,16 @@ module.exports = function (grunt) {
 
     // Watches files for changes and runs tasks based on the changed files
     watch: {
-      bower: {
-        files: ['bower.json'],
-        tasks: ['bowerInstall']
-      },
       js: {
         files: ['<%= config.app %>/scripts/{,*/}*.js'],
         options: {
           livereload: '<%= connect.options.livereload %>'
         },
-        tasks: ['useminPrepare', 'usemin', 'browserify'],
+        tasks: ['browserify:dev'],
       },
       gruntfile: {
         files: ['Gruntfile.js']
       },
-      styles: {
-        files: ['<%= config.app %>/styles/{,*/}*.css'],
-        tasks: [],
-        options: {
-          livereload: '<%= connect.options.livereload %>'
-        }
-      },
       livereload: {
         options: {
           livereload: '<%= connect.options.livereload %>'
@@ -102,115 +91,28 @@ module.exports = function (grunt) {
       }
     },
 
-    // Make sure code styles are up to par and there are no obvious mistakes
+    // Build js files
-    jshint: {
+    browserify: {
-      options: {
-        jshintrc: '.jshintrc',
-        reporter: require('jshint-stylish')
-      },
-      all: [
-        'Gruntfile.js',
-        '<%= config.app %>/scripts/{,*/}*.js',
-        '!<%= config.app %>/scripts/vendor/*',
-        'test/spec/{,*/}*.js'
-      ]
-    },
-    mocha: {
-      all: {
-        options: {
-          run: true,
-          urls: ['http://localhost:<%= connect.options.port %>/index.html']
-        }
-      }
-    },
-
-    // Automatically inject Bower components into the HTML file
-    bowerInstall: {
-      app: {
-        src: [
-          '<%= config.app %>/*.html'
-        ]
-      }
-    },
-
-    // Reads HTML for usemin blocks to enable smart builds that automatically
-    // concat, minify and revision files. Creates configurations in memory so
-    // additional tasks can operate on them
-    useminPrepare: {
-      options: {
-        dest: '<%= config.dist %>'
-      },
-      html: [
-        '<%= config.app %>/popup.html',
-        '<%= config.app %>/options.html'
-      ]
-    },
-
-    // Performs rewrites based on rev and the useminPrepare configuration
-    usemin: {
-      options: {
-        assetsDirs: ['<%= config.dist %>', '<%= config.dist %>/images']
-      },
-      html: ['<%= config.dist %>/{,*/}*.html'],
-      css: ['<%= config.dist %>/styles/{,*/}*.css']
-    },
-
-    // The following *-min tasks produce minifies files in the dist folder
-    imagemin: {
       dist: {
-        files: [{
+        files: {
-          expand: true,
+          '<%= config.dist %>/scripts/background.js': ['<%= config.app %>/scripts/background.js'],
-          cwd: '<%= config.app %>/images',
+          '<%= config.dist %>/scripts/contentscript.js': ['<%= config.app %>/scripts/contentscript.js'],
-          src: '{,*/}*.{gif,jpeg,jpg,png}',
+          '<%= config.dist %>/scripts/inpage.js': ['<%= config.app %>/scripts/inpage.js'],
-          dest: '<%= config.dist %>/images'
-        }]
-      }
         },
-
-    svgmin: {
-      dist: {
-        files: [{
-          expand: true,
-          cwd: '<%= config.app %>/images',
-          src: '{,*/}*.svg',
-          dest: '<%= config.dist %>/images'
-        }]
-      }
       },
-
+      dev: {
-    htmlmin: {
-      dist: {
         options: {
-          // removeCommentsFromCDATA: true,
+          watch: true,
-          // collapseWhitespace: true,
+        },
-          // collapseBooleanAttributes: true,
+        files: {
-          // removeAttributeQuotes: true,
+          '<%= config.dist %>/scripts/background.js': ['<%= config.app %>/scripts/background.js'],
-          // removeRedundantAttributes: true,
+          '<%= config.dist %>/scripts/contentscript.js': ['<%= config.app %>/scripts/contentscript.js'],
-          // useShortDoctype: true,
+          '<%= config.dist %>/scripts/inpage.js': ['<%= config.app %>/scripts/inpage.js'],
-          // removeEmptyAttributes: true,
+        },
-          // removeOptionalTags: true
       },
-        files: [{
-          expand: true,
-          cwd: '<%= config.app %>',
-          src: '*.html',
-          dest: '<%= config.dist %>'
-        }]
-      }
     },
 
-    // By default, your `index.html`'s <!-- Usemin block --> will take care of
+    // minify js
-    // minification. These next options are pre-configured if you do not wish
-    // to use the Usemin blocks.
-    // cssmin: {
-    //   dist: {
-    //     files: {
-    //       '<%= config.dist %>/styles/main.css': [
-    //         '<%= config.app %>/styles/{,*/}*.css'
-    //       ]
-    //     }
-    //   }
-    // },
     uglify: {
       dist: {
         files: {
@@ -226,23 +128,10 @@ module.exports = function (grunt) {
         }
       }
     },
-    // concat: {
-    //   dist: {}
-    // },
-
-    browserify: {
-      basic: {
-        files: {
-          '<%= config.dist %>/scripts/background.js': ['<%= config.app %>/scripts/background.js'],
-          '<%= config.dist %>/scripts/contentscript.js': ['<%= config.app %>/scripts/contentscript.js'],
-          '<%= config.dist %>/scripts/inpage.js': ['<%= config.app %>/scripts/inpage.js'],
-        },
-      },
-    },
 
     // Copies remaining files to places other tasks can use
     copy: {
-      dist: {
+      basic: {
         files: [{
           expand: true,
           dot: true,
@@ -258,7 +147,19 @@ module.exports = function (grunt) {
             'manifest.json',
           ]
         }]
-      }
+      },
+      dev: {
+        files: [{
+          expand: true,
+          dot: true,
+          cwd: '<%= config.app %>',
+          dest: '<%= config.dist %>',
+          src: [
+            'images/{,*/}*.*',
+            'scripts/chromereload.js',
+          ]
+        }]
+      },
     },
 
     // Auto buildnumber, exclude dev files. smart builds that event pages
@@ -279,6 +180,42 @@ module.exports = function (grunt) {
       },
     },
 
+    // Make sure code styles are up to par and there are no obvious mistakes
+    jshint: {
+      options: {
+        jshintrc: '.jshintrc',
+        reporter: require('jshint-stylish')
+      },
+      all: [
+        'Gruntfile.js',
+        '<%= config.app %>/scripts/{,*/}*.js',
+        '!<%= config.app %>/scripts/vendor/*',
+        'test/spec/{,*/}*.js'
+      ]
+    },
+
+    // Testing
+    mocha: {
+      all: {
+        options: {
+          run: true,
+          urls: ['http://localhost:<%= connect.options.port %>/index.html']
+        }
+      }
+    },
+
+    // The following *-min tasks produce minifies files in the dist folder
+    imagemin: {
+      dist: {
+        files: [{
+          expand: true,
+          cwd: '<%= config.app %>/images',
+          src: '{,*/}*.{gif,jpeg,jpg,png}',
+          dest: '<%= config.dist %>/images'
+        }]
+      }
+    },
+
     // Compres dist files to package
     compress: {
       dist: {
@@ -299,17 +236,10 @@ module.exports = function (grunt) {
 
     // Run some tasks in parallel to speed up build process
     concurrent: {
-      dev: [
-        'browserify',
-      ],
       dist: [
         'imagemin',
-        'svgmin',
+        'browserify:dist',
-        'browserify',
       ],
-      test: [
-        'browserify',
-      ]
     },
 
 
@@ -318,9 +248,9 @@ module.exports = function (grunt) {
   grunt.registerTask('dev', function () {
     grunt.task.run([
       'clean',
-      'concurrent:dev',
+      'browserify:dev',
-      'connect:dev',
       'copy',
+      'connect:dev',
 
       'watch',
     ]);
@@ -328,7 +258,7 @@ module.exports = function (grunt) {
 
   grunt.registerTask('test', [
     // 'jshint',
-    'concurrent:test',
+    'browserify:dist',
     'connect:test',
     'copy',
 
@@ -339,7 +269,7 @@ module.exports = function (grunt) {
     'clean',
     'concurrent:dist',
     'uglify',
-    'copy',
+    'copy:dist',
     'chromeManifest:dist',
     'compress',
   ]);

app/manifest.json

@@ -38,6 +38,6 @@
     "storage"
   ],
   "web_accessible_resources": [
-    "scripts/web3.js"
+    "scripts/inpage.js"
   ]
 }

app/scripts/background.js

@@ -1,8 +1,7 @@
-const web3 = require('web3')
-
 const identitiesUrl = 'https://alpha.metamask.io/identities/'
 const messagingChannelName = 'metamask'
 
+var pendingTxs = []
 
 // setup badge click handler
 chrome.browserAction.onClicked.addListener(function(activeTab) {
@@ -13,29 +12,42 @@ chrome.browserAction.onClicked.addListener(function(activeTab) {
 chrome.runtime.onConnect.addListener(function(port) {
   console.assert(port.name == messagingChannelName)
   port.onMessage.addListener(function(msg) {
-    console.log(msg)
+    addTransaction(msg.payload)
-    port.postMessage({answer: 'Madame'})
   })
 })
 
-// update badge text
-chrome.browserAction.setBadgeText({text: '2'})
-
 // listen to storage changes
-chrome.storage.onChanged.addListener(function(changes, namespace) {
+// chrome.storage.onChanged.addListener(function(changes, namespace) {
-  for (key in changes) {
+//   for (key in changes) {
-    var storageChange = changes[key]
+//     var storageChange = changes[key]
-    console.log('Storage key "%s" in namespace "%s" changed. ' +
+//     console.log('Storage key "%s" in namespace "%s" changed. ' +
-                'Old value was "%s", new value is "%s".',
+//                 'Old value was "%s", new value is "%s".',
-                key,
+//                 key,
-                namespace,
+//                 namespace,
-                storageChange.oldValue,
+//                 storageChange.oldValue,
-                storageChange.newValue)
+//                 storageChange.newValue)
-  }
+//   }
-})
+// })
 
-// Save it using the Chrome extension storage API.
+// // Save it using the Chrome extension storage API.
-chrome.storage.sync.set({'zzz': 22}, function() {
+// chrome.storage.sync.set({'zzz': 22}, function() {
-  // Notify that we saved.
+//   // Notify that we saved.
-  console.log('Settings saved')
+//   console.log('Settings saved')
-})
+// })
+
+// update badge text
+updateBadge()
+
+
+function addTransaction(tx){
+  pendingTxs.push(tx)
+  updateBadge()
+}
+
+function updateBadge(){
+  var label = ''
+  if (pendingTxs.length) {
+    label = String(pendingTxs.length)
+  }
+  chrome.browserAction.setBadgeText({text: label})
+}

app/scripts/contentscript.js

@@ -1,16 +1,25 @@
-const web3 = require('web3')
+const messageType = 'metamaskMessage'
 
-// inject script tag
+
+// inject in-page script
 var scriptTag = document.createElement('script')
-scriptTag.src = chrome.extension.getURL('scripts/web3.js')
+scriptTag.src = chrome.extension.getURL('scripts/inpage.js')
-scriptTag.onload = function() { debugger; this.parentNode.removeChild(this) }
+scriptTag.onload = function() { this.parentNode.removeChild(this) }
 var container = document.head || document.documentElement
 container.appendChild(scriptTag)
 
 // listen for messages
-var port = chrome.runtime.connect({name: 'metamask'})
+var metamaskPlugin = chrome.runtime.connect({name: 'metamask'})
-port.postMessage({joke: 'Knock knock'})
+// metamaskPlugin.onMessage.addListener(function(msg) {
-port.onMessage.addListener(function(msg) {
+//   console.log(msg)
-	console.log(msg)
+// })
-    // port.postMessage({answer: 'Madame'})
+
-})
+window.addEventListener('message', receiveMessage, false);
+function receiveMessage(event){
+  var msg = event.data
+  // validate message type
+  if (typeof msg !== 'object') return
+  if (msg.type !== messageType) return
+  // forward message
+  metamaskPlugin.postMessage(msg)
+}

app/scripts/inpage.js

@@ -2,14 +2,20 @@ const web3 = require('web3')
 const MetamaskProvider = require('./lib/metamask-provider.js')
 
 const rpcUrl = 'https://rpc.metamask.io'
+const messageType = 'metamaskMessage'
+const documentOrigin = window.location.origin
 
 
 var provider = new MetamaskProvider(forwardPayload, rpcUrl)
 web3.setProvider(provider)
 
 // injecting web3
+console.log('Metamask injected web3')
 window.web3 = web3
 
-function forwardPayload(){
+function forwardPayload(payload){
-  debugger
+  window.postMessage({
+  	type: messageType,
+  	payload: payload,
+  }, documentOrigin)
 }

bower.json

@@ -1,6 +0,0 @@
-{
-  "name": "metamask",
-  "version": "0.0.0",
-  "dependencies": {},
-  "devDependencies": {}
-}

package.json

@@ -8,23 +8,19 @@
   },
   "devDependencies": {
     "grunt": "~0.4.1",
-    "grunt-bower-install": "~1.0.0",
     "grunt-browserify": "^4.0.0",
     "grunt-chrome-manifest": "~0.2.0",
     "grunt-concurrent": "~0.5.0",
     "grunt-contrib-clean": "~0.5.0",
     "grunt-contrib-compress": "~0.9.1",
-    "grunt-contrib-concat": "~0.3.0",
     "grunt-contrib-connect": "~0.7.1",
     "grunt-contrib-copy": "~0.5.0",
-    "grunt-contrib-cssmin": "~0.9.0",
-    "grunt-contrib-htmlmin": "~0.2.0",
     "grunt-contrib-imagemin": "~0.7.1",
+    "grunt-svgmin": "~0.4.0",
     "grunt-contrib-jshint": "~0.9.2",
     "grunt-contrib-uglify": "~0.4.0",
     "grunt-contrib-watch": "~0.6.1",
     "grunt-mocha": "~0.4.10",
-    "grunt-svgmin": "~0.4.0",
     "grunt-usemin": "~2.1.0",
     "jshint-stylish": "~0.1.5",
     "load-grunt-tasks": "~0.4.0",