From 19e7adad1920ac506b3ef5c639ec110a2615bd7c Mon Sep 17 00:00:00 2001
From: kumavis <aaron@kumavis.me>
Date: Fri, 29 Sep 2017 11:50:24 -0700
Subject: [PATCH] development - fix ui dev

---
 development/index.html | 102 ++++++++++++++++++++---------------------
 ui-dev.js              |  45 ++++++++++--------
 2 files changed, 75 insertions(+), 72 deletions(-)
diff --git a/development/index.html b/development/index.html
index a0814cb55..e5a027447 100644
--- a/development/index.html
+++ b/development/index.html
@@ -3,62 +3,58 @@
   <head>
     <meta charset="utf-8">
     <title>MetaMask</title>
-
   </head>
   <body>
-
-    <!-- app content -->
-    <div id="app-content" style="height: 100%"></div>
     <script src="./bundle.js" type="text/javascript" charset="utf-8"></script>
+    
+    <style>
+      html, body, #test-container, .super-dev-container {
+        height: 100%;
+        width: 100%;
+        position: relative;
+        background: white;
+      }
+      #app-content {
+        background: #F7F7F7;
+      }
+    </style>
+
+    <script>
+      liveReloadCode(Date.now(), 300)
+      function liveReloadCode(lastUpdate, updateRate) {
+        setTimeout(iter, updateRate)
+
+        function iter() {
+          var xhr = new XMLHttpRequest()
+
+          xhr.open('GET', '/-/live-reload')
+          xhr.onreadystatechange = function() {
+            if(xhr.readyState !== 4) {
+              return
+            }
+
+            try {
+              var change = JSON.parse(xhr.responseText).lastUpdate
+
+              if(lastUpdate < change) {
+                return reload()
+              }
+            } catch(err) {
+            }
+
+            xhr =
+            xhr.onreadystatechange = null
+            setTimeout(iter, updateRate)
+          }
+
+          xhr.send(null)
+        }
+      }
+
+      function reload() {
+        window.location.reload()
+      }
+    </script>
 
   </body>
-
-<style>
-html, body, #test-container, .super-dev-container {
-  height: 100%;
-  width: 100%;
-  position: relative;
-  background: white;
-}
-#app-content {
-  background: #F7F7F7;
-}
-</style>
-
-<script>
-liveReloadCode(Date.now(), 300)
-function liveReloadCode(lastUpdate, updateRate) {
-  setTimeout(iter, updateRate)
-
-  function iter() {
-    var xhr = new XMLHttpRequest()
-
-    xhr.open('GET', '/-/live-reload')
-    xhr.onreadystatechange = function() {
-      if(xhr.readyState !== 4) {
-        return
-      }
-
-      try {
-        var change = JSON.parse(xhr.responseText).lastUpdate
-
-        if(lastUpdate < change) {
-          return reload()
-        }
-      } catch(err) {
-      }
-
-      xhr =
-      xhr.onreadystatechange = null
-      setTimeout(iter, updateRate)
-    }
-
-    xhr.send(null)
-  }
-}
-
-function reload() {
-  window.location.reload()
-}
- </script>
 </html>
diff --git a/ui-dev.js b/ui-dev.js
index de5dfd8ef..620d81667 100644
--- a/ui-dev.js
+++ b/ui-dev.js
@@ -61,30 +61,37 @@ const actions = {
 var css = MetaMaskUiCss()
 injectCss(css)
 
-const container = document.querySelector('#test-container')
-
 // parse opts
 var store = configureStore(states[selectedView])
 
 // start app
-render(
-  h('.super-dev-container', [
+startApp()
 
-    h(Selector, { actions, selectedKey: selectedView, states, store }),
+function startApp(){
+  const body = document.body
+  const container = document.createElement('div')
+  container.id = 'test-container'
+  body.appendChild(container)
 
-    h('#app-content', {
-      style: {
-        height: '500px',
-        width: '360px',
-        boxShadow: 'grey 0px 2px 9px',
-        margin: '20px',
-      },
-    }, [
-      h(Root, {
-       store: store,
-      }),
-    ]),
+  render(
+    h('.super-dev-container', [
 
-  ]
-), container)
+      h(Selector, { actions, selectedKey: selectedView, states, store }),
+
+      h('#app-content', {
+        style: {
+          height: '500px',
+          width: '360px',
+          boxShadow: 'grey 0px 2px 9px',
+          margin: '20px',
+        },
+      }, [
+        h(Root, {
+         store: store,
+        }),
+      ]),
+
+    ]
+  ), container)
+}
 
