network status getting set upon start-up and showing in title bar but not auto-updating yet

.gitignore

@@ -10,3 +10,4 @@ package
 
 .DS_Store
 builds/
+notes.txt

CHANGELOG.md

@@ -2,6 +2,7 @@
 
 ## Current Master
 
+- show network conection in title bar
 - Redesigned init, vault create, vault restore and seed confirmation screens.
 - Added pending transactions to transaction list on account screen.
 - Clicking a pending transaction takes you back to the transaction approval screen.

ui/app/actions.js

@@ -6,6 +6,8 @@ var actions = {
   toggleMenu: toggleMenu,
   SET_MENU_STATE: 'SET_MENU_STATE',
   closeMenu: closeMenu,
+  getNetworkStatus: 'getNetworkStatus',
+
   // remote state
   UPDATE_METAMASK_STATE: 'UPDATE_METAMASK_STATE',
   updateMetamaskState: updateMetamaskState,
@@ -131,6 +133,12 @@ function closeMenu() {
   }
 }
 
+function getNetworkStatus(){
+  return {
+    type: actions.getNetworkStatus,
+  }
+}
+
 // async actions
 
 function tryUnlockMetamask(password) {

ui/app/app.js

@@ -27,6 +27,7 @@ const txHelper = require('../lib/tx-helper')
 const SandwichExpando = require('sandwich-expando')
 const MenuDroppo = require('menu-droppo')
 const DropMenuItem = require('./components/drop-menu-item')
+const NetworkIndicator = require('./components/network')
 
 module.exports = connect(mapStateToProps)(App)
 
@@ -46,6 +47,7 @@ function mapStateToProps(state) {
     unconfTxs: state.metamask.unconfTxs,
     unconfMsgs: state.metamask.unconfMsgs,
     menuOpen: state.appState.menuOpen,
+    network: state.metamask.network,
   }
 }
 
@@ -109,20 +111,21 @@ App.prototype.renderAppBar = function(){
       }, state.isUnlocked && [
 
         // mini logo
-        h('img', {
-          height: 24,
-          width: 24,
-          src: '/images/icon-128.png',
-        }),
+        // h('img', {
+        //   height: 24,
+        //   width: 24,
+        //   src: '/images/icon-128.png',
+        // }),
+        h(NetworkIndicator, {network: this.props.network}),
 
         // metamask name
         h('h1', 'MetaMask'),
-
         // hamburger
         h(SandwichExpando, {
           width: 16,
           barHeight: 2,
           padding: 0,
+          paddingLeft: '200px',
           isOpen: state.menuOpen,
           color: 'rgb(247,146,30)',
           onClick: (event) => {

ui/app/components/network.js

@@ -0,0 +1,34 @@
+const Component = require('react').Component
+const h = require('react-hyperscript')
+const inherits = require('util').inherits
+
+module.exports = Network
+
+inherits(Network, Component)
+
+function Network() {
+  Component.call(this)
+}
+
+Network.prototype.render = function() {
+  var state = this.props
+  var networkNumber = state.network
+  var networkName;
+  var imagePath = "/images/"
+
+  if(networkNumber == undefined || networkNumber == "error"){
+    networkName = "no-connection"
+  }else if(networkNumber ==  1){
+    networkName = "ethereum-network"
+  }else if(networkNumber ==  2){
+    networkName = "morden-test-network"
+  }else{
+    networkName = "unknown-private-network"
+  }
+  return (
+    h('#network_component.flex-center', {
+      style: {},
+      title: networkName
+    },[ h('img',{src: imagePath + networkName + ".jpg", width: '25px'}) ])
+  )
+}