Working on TodoMVC example.

foxdonut · May 6, 2016 · ffcd8a2 · ffcd8a2
1 parent 3a52534
commit ffcd8a2
Show file tree

Hide file tree

Showing 5 changed files with 11 additions and 35 deletions.
diff --git a/todomvc/index.html b/todomvc/index.html
@@ -8,6 +8,7 @@
   </head>
   <body>
     <div id="app"></div>
+    <div id="tracer" style="position: fixed; top: 0px; right: 0px;"></div>
   </body>
   <script src="node_modules/todomvc-common/base.js"></script>
   <script src="js/meiosis.min.js"></script>

diff --git a/todomvc/js/meiosis-tracer.min.js b/todomvc/js/meiosis-tracer.min.js
diff --git a/todomvc/js/meiosis-tracer.min.js.map b/todomvc/js/meiosis-tracer.min.js.map
diff --git a/todomvc/vanillajs/postRender.js b/todomvc/vanillajs/postRender.js
@@ -1,6 +1,6 @@
 (function(ref) {
   ref.postRender = function(_view) {
-    var input = document.querySelector("input.edit");
+    var input = document.getElementById("app").querySelector("input.edit");
 
     if (input) {
       input.focus();

diff --git a/todomvc/vanillajs/ready.js b/todomvc/vanillajs/ready.js
@@ -2,26 +2,27 @@
 (function(ref) {
   var ENTER_KEY = 13;
   var ESCAPE_KEY = 27;
+  var root = document.getElementById("app");
 
   ref.ready = function(actions) {
-    meiosisVanillaJs.delegate(document.body, "input.new-todo", "keypress", function(evt) {
+    meiosisVanillaJs.delegate(root, "input.new-todo", "keypress", function(evt) {
       if (evt.keyCode === ENTER_KEY) {
         actions.saveTodo(evt.target.value);
       }
     });
 
-    meiosisVanillaJs.delegate(document.body, "input.toggle", "change", function(evt) {
+    meiosisVanillaJs.delegate(root, "input.toggle", "change", function(evt) {
       var todoId = parseInt(evt.target.dataset.id, 10);
       var completed = evt.target.checked;
       actions.setCompleted(todoId, completed);
     });
 
-    meiosisVanillaJs.delegate(document.body, ".view label", "dblclick", function(evt) {
+    meiosisVanillaJs.delegate(root, ".view label", "dblclick", function(evt) {
       var todoId = parseInt(evt.target.dataset.id, 10);
       actions.editTodo(todoId);
     });
 
-    meiosisVanillaJs.delegate(document.body, "input.edit", "keyup", function(evt) {
+    meiosisVanillaJs.delegate(root, "input.edit", "keyup", function(evt) {
       var todoId = parseInt(evt.target.dataset.id, 10);
 
       if (evt.keyCode === ESCAPE_KEY) {
@@ -32,40 +33,14 @@
       }
     });
 
-    meiosisVanillaJs.delegate(document.body, "input.edit", "blur", function(evt) {
+    meiosisVanillaJs.delegate(root, "input.edit", "blur", function(evt) {
       var todoId = parseInt(evt.target.dataset.id, 10);
       actions.saveTodo(evt.target.value, todoId);
     });
 
-    meiosisVanillaJs.delegate(document.body, "button.destroy", "click", function(evt) {
+    meiosisVanillaJs.delegate(root, "button.destroy", "click", function(evt) {
       var todoId = parseInt(evt.target.dataset.id, 10);
       actions.deleteTodoId(todoId);
     });
-
-    document.write("<div id='tracer' style='position: fixed; top: 0px; right: 0px;'></div>");
-
-    /*
-    // select the target node
-    var target = document.querySelector("body");
-
-    // create an observer instance
-    var observer = new MutationObserver(function(_mutations) {
-      var input = document.querySelector("input.edit");
-
-      if (input) {
-        input.focus();
-        input.selectionStart = input.value.length;
-      }
-    });
-
-    // configuration of the observer:
-    var config = { attributes: false, childList: true, characterData: false };
-
-    // pass in the target node, as well as the observer options
-    observer.observe(target, config);
-
-    // later, you can stop observing
-    //observer.disconnect();
-    */
   };
 })(window);