Update the CSS tag on keyup instead of timer

Per #1
jhubert · Dec 2, 2014 · 1faf163 · 1faf163
1 parent 23603e6
commit 1faf163
Showing 1 changed file with 3 additions and 10 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,
     cssPrefix = 'LiveCSSEditor-';
@@ -182,7 +181,6 @@ var LiveCSSEditor = function (settings) {
 
     setStorage('boxsize', code.style.width + ',' + code.style.height);
 
-    clearInterval(timer);
     resetCSSTag();
     panel.parentElement.removeChild(panel);
   }
@@ -197,6 +195,7 @@ var LiveCSSEditor = function (settings) {
     bottomButton.onclick = toggleBottom;
     closeButton.onclick = removeEditor;
     codeArea.onkeydown = handleTabInTextarea;
+    codeArea.onkeyup = updateCSSTag;
     leftRightButton.onclick = toggleLeftRight;
     resetButton.onclick = resetBoxSize;
   }
@@ -272,23 +271,17 @@ var LiveCSSEditor = function (settings) {
     setStorage('cache', css);
   }
 
-  function autoUpdate() {
+  function updateCSSTag() {
     var source = getEl('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;
 
@@ -302,7 +295,7 @@ var LiveCSSEditor = function (settings) {
     }
     fillStyleTag(css);
 
-    startAutoUpdate();
+    updateCSSTag();
   }
 
   if (!getEl('panel')) {