fix colors change events

src/scripts/config-page.js

@@ -64,7 +64,6 @@ function processConfigItem(item, $parent) {
     $parent.add($container);
     processConfigItem(item.items, $container);
   } else {
-    console.debug('KEEGAN: itemType', item.type);
     var apiItem = {};
     var itemType = itemTypes[item.type];
     var templateData = {
@@ -74,8 +73,6 @@ function processConfigItem(item, $parent) {
       size: 4
     };
 
-    console.debug('KEEGAN: templateData', templateData);
-
     _.extend(templateData, item);
     apiItem.$element = HTML(_.formatHtml(itemType.template, templateData));
     apiItem.$manipulatorTarget =
@@ -89,14 +86,14 @@ function processConfigItem(item, $parent) {
     // proxy event related methods
     var eventProxies = {};
     apiItem.on = function(events, handler) {
-      eventProxies[handler] = function(event) {
+      eventProxies[handler] = function() {
-        handler.call(apiItem, event);
+        handler.apply(apiItem, arguments);
       };
       return apiItem.$manipulatorTarget.on(events, eventProxies[handler]);
     };
     apiItem.one = function(events, handler) {
       eventProxies[handler] = function(event) {
-        handler.call(apiItem, event);
+        handler.apply(apiItem, arguments);
         $.off(eventProxies[handler]);
       };
       return apiItem.$manipulatorTarget.on(events, eventProxies[handler]);

src/scripts/lib/items/color.js

@@ -7,7 +7,6 @@ module.exports = {
   manipulator: require('../manipulators').val,
   initialize: function() {
     var self = this;
-    console.debug('KEEGAN: initializer', self);
 
     /* eslint-disable  comma-spacing, no-multi-spaces, max-len,
         standard/array-bracket-even-spacing */
@@ -72,20 +71,20 @@ module.exports = {
     $elem.select('.color-box-container').add(HTML(grid));
 
     var $valueDisplay = $elem.select('.value');
-    var $picker = $elem.select('.picker-wrap')
+    var $picker = $elem.select('.picker-wrap');
 
-    $elem.on('click', function(ev) {
+    $elem.on('|click', function(ev) {
       $picker.set('show');
     });
 
-    self.on('change', function(ev) {
+    self.on('|change', function() {
       var value = self.get().replace(/^0x/, '').toLowerCase();
       $valueDisplay.set('$background-color', '#' + value);
       $elem.select('.color-box').set('-selected');
       $elem.select('.color-box[data-value="0x' + value + '"]').set('+selected');
     });
 
-    $elem.select('.color-box.selectable').on('click', function(ev) {
+    $elem.select('.color-box.selectable').on('|click', function(ev) {
       self.set(ev.target.dataset.value);
       $picker.set('-show');
     });

src/scripts/lib/manipulators.js

@@ -19,12 +19,10 @@ module.exports = {
         .trigger('change');
     },
     disable: function() {
-      return this.$manipulatorTarget.set('disabled', true)
+      return this.$manipulatorTarget.set('disabled', true);
-        .trigger('change');
     },
     enable: function() {
-      return this.$manipulatorTarget.set('disabled', false)
+      return this.$manipulatorTarget.set('disabled', false);
-        .trigger('change');
     }
   },
   checked: {