Update the CSS tag on keyup instead of timer

Per #1
jhubert · Mar 2, 2014 · c9cb9b3 · c9cb9b3
1 parent 4c8db80
commit c9cb9b3
Showing 1 changed file with 4 additions and 11 deletions.
diff --git a/chrome/source/css_editor.js b/chrome/source/css_editor.js
@@ -6,7 +6,6 @@ var LiveCSSEditor = function (settings) {
   settings = settings || { warn: true, save: true, modify: true };
 
   var cssCache = '',
-    timer = null,
     tab = '  ',
     urlKey = document.location;
 
@@ -156,7 +155,6 @@ var LiveCSSEditor = function (settings) {
 
     setStorage('boxsize', code.style.width + ',' + code.style.height);
 
-    clearInterval(timer);
     resetCSSTag();
     panel.parentElement.removeChild(panel);
   }
@@ -171,6 +169,7 @@ var LiveCSSEditor = function (settings) {
     bottomButton.onclick = toggleBottom;
     closeButton.onclick = removeEditor;
     codeArea.onkeydown = handleTabInTextarea;
+    codeArea.onkeyup = updateCSSTag;
     leftRightButton.onclick = toggleLeftRight;
     resetButton.onclick = resetBoxSize;
   }
@@ -230,23 +229,17 @@ var LiveCSSEditor = function (settings) {
     setStorage('cache', css);
   }
 
-  function autoUpdate() {
+  function updateCSSTag() {
     var source = get('code');
     /* Don't bother replacing the CSS if it hasn't changed */
     if (source) {
       if (cssCache === source.value) {
         return false;
       }
       fillStyleTag(source.value);
-    } else {
-      clearInterval(timer);
     }
   }
 
-  function startAutoUpdate() {
-    timer = setInterval(autoUpdate, 1000);
-  }
-
   function init() {
     var source, css;
 
@@ -260,12 +253,12 @@ var LiveCSSEditor = function (settings) {
     }
     fillStyleTag(css);
 
-    startAutoUpdate();
+    updateCSSTag();
   }
 
   if (!get('panel')) {
     init();
   } else {
     removeEditor();
   }
-};
+};