Find nearest color JS

build/depends.py

@@ -776,6 +776,7 @@ def sources(self, build):
                    "src/preferences/effectsettingsmodel.cpp",
                    "src/preferences/broadcastprofile.cpp",
                    "src/preferences/upgrade.cpp",
+                   "src/preferences/hotcuecolorpalettesettings.cpp",
                    "src/preferences/dlgpreferencepage.cpp",
 
                    "src/effects/effectmanifest.cpp",
@@ -912,6 +913,8 @@ def sources(self, build):
                    "src/controllers/softtakeover.cpp",
                    "src/controllers/keyboard/keyboardeventfilter.cpp",
                    "src/controllers/colorjsproxy.cpp",
+                   "src/controllers/colormapper.cpp",
+                   "src/controllers/colormapperjsproxy.cpp",
 
                    "src/main.cpp",
                    "src/mixxx.cpp",
@@ -1254,6 +1257,7 @@ def sources(self, build):
                    "src/util/movinginterquartilemean.cpp",
                    "src/util/console.cpp",
                    "src/util/color/color.cpp",
+                   "src/util/color/colorpalette.cpp",
                    "src/util/db/dbconnection.cpp",
                    "src/util/db/dbconnectionpool.cpp",
                    "src/util/db/dbconnectionpooler.cpp",
@@ -1280,8 +1284,7 @@ def sources(self, build):
                    "src/util/desktophelper.cpp",
                    "src/util/widgetrendertimer.cpp",
                    "src/util/workerthread.cpp",
-                   "src/util/workerthreadscheduler.cpp",
-                   "src/util/color/predefinedcolor.cpp"
+                   "src/util/workerthreadscheduler.cpp"
                    ]
 
         proto_args = {

res/controllers/Roland_DJ-505-scripts.js

@@ -941,17 +941,24 @@ DJ505.PadColor = {
     DIM_MODIFIER: 0x10,
 };
 
-DJ505.PadColorMap = [
-    DJ505.PadColor.OFF,
-    DJ505.PadColor.RED,
-    DJ505.PadColor.GREEN,
-    DJ505.PadColor.BLUE,
-    DJ505.PadColor.YELLOW,
-    DJ505.PadColor.CELESTE,
-    DJ505.PadColor.PURPLE,
-    DJ505.PadColor.APRICOT,
-    DJ505.PadColor.WHITE,
-];
+DJ505.PadColorMap = {
+    '#FFCC0000': DJ505.PadColor.RED,
+    '#FFCC4400': DJ505.PadColor.CORAL,
+    '#FFCC8800': DJ505.PadColor.ORANGE,
+    '#FFCCCC00': DJ505.PadColor.YELLOW,
+    '#FF88CC00': DJ505.PadColor.GREEN,
+    '#FF00CC00': DJ505.PadColor.APPLEGREEN,
+    '#FF00CC88': DJ505.PadColor.AQUAMARINE,
+    '#FF00CCCC': DJ505.PadColor.TURQUOISE,
+    '#FF0088CC': DJ505.PadColor.CELESTE,
+    '#FF0000CC': DJ505.PadColor.BLUE,
+    '#FF4400CC': DJ505.PadColor.AZURE,
+    '#FF8800CC': DJ505.PadColor.PURPLE,
+    '#FFCC00CC': DJ505.PadColor.MAGENTA,
+    '#FFCC0044': DJ505.PadColor.RED,
+    '#FFFFCCCC': DJ505.PadColor.APRICOT,
+    '#FFFFFFFF': DJ505.PadColor.WHITE,
+};
 
 DJ505.PadSection = function (deck, offset) {
     // TODO: Add support for missing modes (flip, slicer, slicerloop)
@@ -1190,7 +1197,7 @@ DJ505.HotcueMode = function (deck, offset) {
     this.ledControl = DJ505.PadMode.HOTCUE;
     this.color = DJ505.PadColor.WHITE;
 
-    var hotcueColors = [this.color].concat(DJ505.PadColorMap.slice(1));
+    var hotcueColors = DJ505.PadColorMap;
     this.pads = new components.ComponentContainer();
     for (var i = 0; i <= 7; i++) {
         this.pads[i] = new components.HotcueButton({
@@ -1226,7 +1233,7 @@ DJ505.CueLoopMode = function (deck, offset) {
     this.ledControl = DJ505.PadMode.HOTCUE;
     this.color = DJ505.PadColor.BLUE;
 
-    var cueloopColors = [this.color].concat(DJ505.PadColorMap.slice(1));
+    var cueloopColors = DJ505.PadColorMap;
     this.PerformancePad = function(n) {
         this.midi = [0x94 + offset, 0x14 + n];
         this.number = n + 1;
@@ -1492,14 +1499,14 @@ DJ505.PitchPlayMode = function (deck, offset) {
     this.color = DJ505.PadColor.GREEN;
     this.cuepoint = 1;
     this.range = PitchPlayRange.MID;
-    var pitchplayColors = [this.color].concat(DJ505.PadColorMap.slice(1));
+    var pitchplayColors = DJ505.PadColorMap;
 
     this.PerformancePad = function(n) {
         this.midi = [0x94 + offset, 0x14 + n];
         this.number = n + 1;
         this.on = this.color + DJ505.PadColor.DIM_MODIFIER;
         this.colors = pitchplayColors;
-        this.colorIdKey = 'hotcue_' + this.number + '_color_id';
+        this.colorKey = 'hotcue_' + this.number + '_color';
         components.Button.call(this);
     };
     this.PerformancePad.prototype = new components.Button({
@@ -1510,10 +1517,10 @@ DJ505.PitchPlayMode = function (deck, offset) {
         mode: this,
         outConnect: false,
         off: DJ505.PadColor.OFF,
-        outputColor: function(id) {
+        outputColor: function(colorCode) {
             // For colored hotcues (shifted only)
-            var color = this.colors[id];
-            this.send((this.mode.cuepoint === this.number) ? color : (color + DJ505.PadColor.DIM_MODIFIER));
+            var midiColor = color.nearestColorMidiCode(colorCode, this.colors)
+            this.send((this.mode.cuepoint === this.number) ? midiColor : (midiColor + DJ505.PadColor.DIM_MODIFIER));
         },
         unshift: function() {
             this.outKey = "pitch_adjust";
@@ -1561,8 +1568,8 @@ DJ505.PitchPlayMode = function (deck, offset) {
             this.outKey = "hotcue_" + this.number + "_enabled";
             this.output = function (value, group, control) {
                 var outval = this.outValueScale(value);
-                if (this.colorIdKey !== undefined && outval !== this.off) {
-                    this.outputColor(engine.getValue(this.group, this.colorIdKey));
+                if (this.colorKey !== undefined && outval !== this.off) {
+                    this.outputColor(engine.getValue(this.group, this.colorKey));
                 } else {
                     this.send(DJ505.PadColor.OFF);
                 }
@@ -1572,13 +1579,13 @@ DJ505.PitchPlayMode = function (deck, offset) {
                     var previous_cuepoint = this.mode.cuepoint;
                     this.mode.cuepoint = this.number;
                     this.mode.pads[previous_cuepoint - 1].trigger();
-                    this.outputColor(engine.getValue(this.group, this.colorIdKey));
+                    this.outputColor(engine.getValue(this.group, this.colorKey));
                 }
             };
             this.connect = function() {
                 components.Button.prototype.connect.call(this); // call parent connect
-                if (undefined !== this.group && this.colorIdKey !== undefined) {
-                    this.connections[1] = engine.makeConnection(this.group, this.colorIdKey, function (id) {
+                if (undefined !== this.group && this.colorKey !== undefined) {
+                    this.connections[1] = engine.makeConnection(this.group, this.colorKey, function (id) {
                         if (engine.getValue(this.group, this.outKey)) {
                             this.outputColor(id);
                         }

res/controllers/midi-components-0.0.js

@@ -295,9 +295,9 @@
             return;
         }
         if (options.colors !== undefined || options.sendRGB !== undefined) {
-            this.colorIdKey = 'hotcue_' + options.number + '_color_id';
+            this.colorKey = 'hotcue_' + options.number + '_color';
             if (options.colors === undefined) {
-                options.colors = color.predefinedColorsList();
+                options.colors = color.hotcueColorPalette();
             }
         }
         this.number = options.number;
@@ -312,8 +312,8 @@
             this.inKey = 'hotcue_' + this.number + '_clear';
         },
         getColor: function() {
-            if (this.colorIdKey !== undefined) {
-                return color.predefinedColorFromId(engine.getValue(this.group,this.colorIdKey));
+            if (this.colorKey !== undefined) {
+                return color.colorFromHexCode(engine.getValue(this.group,this.colorKey));
             } else {
                 return null;
             }
@@ -324,32 +324,29 @@
             // and there is no hotcueColor for turning the LED
             // off. So the `send()` function is responsible for turning the 
             // actual LED off.
-            if (this.colorIdKey !== undefined && outval !== this.off) {
-                this.outputColor(engine.getValue(this.group, this.colorIdKey));
+            if (this.colorKey !== undefined && outval !== this.off) {
+                this.outputColor(engine.getValue(this.group, this.colorKey));
             } else {
                 this.send(outval);
             }
         },
-        outputColor: function (id) {
-            var color = this.colors[id];
-            if (color instanceof Array) {
-                if (color.length !== 3) {
-                    print("ERROR: invalid color array for id: " + id);
-                    return;
-                }
+        outputColor: function (colorCode) {
+            if (this.colors !== undefined) {
+                var nearestColor = color.nearestColorMidiCode(colorCode, this.colors);
+                print("COLOR = "+nearestColor);
+                this.send(nearestColor);
+            } else {
                 if (this.sendRGB === undefined) {
                     print("ERROR: no function defined for sending RGB colors");
                     return;
                 }
-                this.sendRGB(color);
-            } else if (typeof color === 'number') {
-                this.send(color);
+                this.sendRGB(color.colorFromHexCode(colorCode));
             }
         },
         connect: function() {
             Button.prototype.connect.call(this); // call parent connect
-            if (undefined !== this.group && this.colorIdKey !== undefined) {
-                this.connections[1] = engine.makeConnection(this.group, this.colorIdKey, function (id) {
+            if (undefined !== this.group && this.colorKey !== undefined) {
+                this.connections[1] = engine.makeConnection(this.group, this.colorKey, function (id) {
                     if (engine.getValue(this.group,this.outKey)) {
                         this.outputColor(id);
                     }

res/schema.xml

@@ -480,5 +480,30 @@ METADATA
         position INTEGER
         );
     </sql>
-  </revision>  
+  </revision>
+  <revision version="31" min_compatible="3">
+    <description>
+      Convert the PredefinedColor id to the actual RGBA value.
+    </description>
+    <sql>
+      <!-- No Color becomes black-->
+      UPDATE cues SET color=4278190080 WHERE color=0;
+      <!-- Red -->
+      UPDATE cues SET color=4291103240 WHERE color=1;
+      <!-- Green -->
+      UPDATE cues SET color=4281515588 WHERE color=2;
+      <!-- Blue -->
+      UPDATE cues SET color=4278207743 WHERE color=3;
+      <!-- Yellow -->
+      UPDATE cues SET color=4294496768 WHERE color=4;
+      <!-- Celeste -->
+      UPDATE cues SET color=4282569972 WHERE color=5;
+      <!-- Magenta -->
+      UPDATE cues SET color=4289659084 WHERE color=6;
+      <!-- Pink -->
+      UPDATE cues SET color=4294747863 WHERE color=7;
+      <!-- White -->
+      UPDATE cues SET color=4294111999 WHERE color=8;
+    </sql>
+  </revision>
 </schema>

res/skins/Deere/hotcue_button.xml

@@ -46,8 +46,8 @@
       <ConnectValueFromWidget>false</ConnectValueFromWidget>
     </Connection>
     <Connection>
-      <ConfigKey><Variable name="group"/>,hotcue_<Variable name="hotcue"/>_color_id</ConfigKey>
-      <BindProperty>highlight</BindProperty>
+      <ConfigKey><Variable name="group"/>,hotcue_<Variable name="hotcue"/>_color</ConfigKey>
+      <BindProperty>backgroundColorRgba</BindProperty>
     </Connection>
   </PushButton>
 </Template>