user can now change the color manually in the codemirror editor and t…

…heir changes will be reflected in the colorpicker widget.
toolness · Jan 20, 2012 · c7d126e · c7d126e
1 parent d159dc4
commit c7d126e
Showing 1 changed file with 15 additions and 3 deletions.
diff --git a/static-files/scripts/editor.js b/static-files/scripts/editor.js
@@ -60,6 +60,7 @@ var Editor = (function() {
   var picker = null;
   var pickerPos = null;
   var inCursorActivity = false;
+  var inManualColorChange = false;
 
   function removePicker() {
     if (picker) {
@@ -128,17 +129,28 @@ var Editor = (function() {
               return t.string
             }).join("").trim();
             if (pickerPos && pickerPos.line == pos.line &&
-                pickerPos.ch == tokensStart)
+                pickerPos.ch == tokensStart) {
+              if (pickerPos.lastValue != cssValue) {
+                inManualColorChange = true;
+                picker.colorpicker("setColor", cssValue);
+                inManualColorChange = false;
+                pickerPos.lastValue = cssValue;
+              }
               return;
+            }
             removePicker();
-            pickerPos = {line: pos.line, ch: tokensStart};
+            pickerPos = {
+              line: pos.line,
+              ch: tokensStart,
+              lastValue: cssValue
+            };
             //console.log("cssValue is", cssValue);
             picker = $('<div class="picker"></div>').appendTo(document.body);
             picker.colorpicker({
               alpha: true,
               color: cssValue,
               onSelect: function(hex, rgba, inst) {
-                if (!pickerPos)
+                if (!pickerPos || inManualColorChange)
                   return;
                 var value;
                 if (rgba.a == 1) {