Hotcue RGB colors

CMakeLists.txt

@@ -188,7 +188,8 @@ add_library(mixxx-lib STATIC EXCLUDE_FROM_ALL
   src/control/controlproxy.cpp
   src/control/controlpushbutton.cpp
   src/control/controlttrotary.cpp
-  src/controllers/colorjsproxy.cpp
+  src/controllers/colormapper.cpp
+  src/controllers/colormapperjsproxy.cpp
   src/controllers/controller.cpp
   src/controllers/controllerdebug.cpp
   src/controllers/controllerengine.cpp
@@ -334,7 +335,6 @@ add_library(mixxx-lib STATIC EXCLUDE_FROM_ALL
   src/errordialoghandler.cpp
   src/library/analysisfeature.cpp
   src/library/analysislibrarytablemodel.cpp
-  src/library/trackloader.cpp
   src/library/autodj/autodjfeature.cpp
   src/library/autodj/autodjprocessor.cpp
   src/library/autodj/dlgautodj.cpp
@@ -431,6 +431,7 @@ add_library(mixxx-lib STATIC EXCLUDE_FROM_ALL
   src/library/tableitemdelegate.cpp
   src/library/trackcollection.cpp
   src/library/trackcollectionmanager.cpp
+  src/library/trackloader.cpp
   src/library/traktor/traktorfeature.cpp
   src/library/treeitem.cpp
   src/library/treeitemmodel.cpp
@@ -497,6 +498,7 @@ add_library(mixxx-lib STATIC EXCLUDE_FROM_ALL
   src/preferences/dialog/dlgprefwaveformdlg.ui
   src/preferences/dlgpreferencepage.cpp
   src/preferences/effectsettingsmodel.cpp
+  src/preferences/colorpalettesettings.cpp
   src/preferences/replaygainsettings.cpp
   src/preferences/settingsmanager.cpp
   src/preferences/upgrade.cpp
@@ -559,7 +561,7 @@ add_library(mixxx-lib STATIC EXCLUDE_FROM_ALL
   src/util/cache.cpp
   src/util/cmdlineargs.cpp
   src/util/color/color.cpp
-  src/util/color/predefinedcolor.cpp
+  src/util/color/colorpalette.cpp
   src/util/console.cpp
   src/util/db/dbconnection.cpp
   src/util/db/dbconnectionpool.cpp
@@ -946,6 +948,9 @@ add_executable(mixxx-test
   src/test/broadcastsettings_test.cpp
   src/test/cache_test.cpp
   src/test/channelhandle_test.cpp
+  src/test/colorconfig_test.cpp
+  src/test/colormapperjsproxy_test.cpp
+  src/test/colorpalette_test.cpp
   src/test/compatibility_test.cpp
   src/test/configobject_test.cpp
   src/test/controller_preset_validation_test.cpp

build/depends.py

@@ -790,6 +790,7 @@ def sources(self, build):
                    "src/preferences/effectsettingsmodel.cpp",
                    "src/preferences/broadcastprofile.cpp",
                    "src/preferences/upgrade.cpp",
+                   "src/preferences/colorpalettesettings.cpp",
                    "src/preferences/dlgpreferencepage.cpp",
 
                    "src/effects/effectmanifest.cpp",
@@ -925,7 +926,8 @@ def sources(self, build):
                    "src/controllers/midi/midioutputhandler.cpp",
                    "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",
@@ -1283,6 +1285,7 @@ def sources(self, build):
                    "src/util/cache.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",
@@ -1309,8 +1312,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/.eslintrc.json

@@ -1,7 +1,7 @@
 {
   "globals": {
+    "ColorMapper": "readonly",
     "_": "readonly",
-    "color": "readonly",
     "components": "readonly",
     "engine": "readonly",
     "midi": "readonly",
@@ -10,6 +10,8 @@
     "arrayContains": "readonly",
     "secondstominutes": "readonly",
     "msecondstominutes": "readonly",
+    "colorCodeToObject": "readonly",
+    "colorCodeFromObject": "readonly",
     "script": "readonly",
     "bpm": "readonly",
     "ButtonState": "readonly",

res/controllers/Roland_DJ-505-scripts.js

@@ -970,17 +970,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 = new ColorMapper({
+    "#CC0000": DJ505.PadColor.RED,
+    "#CC4400": DJ505.PadColor.CORAL,
+    "#CC8800": DJ505.PadColor.ORANGE,
+    "#CCCC00": DJ505.PadColor.YELLOW,
+    "#88CC00": DJ505.PadColor.GREEN,
+    "#00CC00": DJ505.PadColor.APPLEGREEN,
+    "#00CC88": DJ505.PadColor.AQUAMARINE,
+    "#00CCCC": DJ505.PadColor.TURQUOISE,
+    "#0088CC": DJ505.PadColor.CELESTE,
+    "#0000CC": DJ505.PadColor.BLUE,
+    "#4400CC": DJ505.PadColor.AZURE,
+    "#8800CC": DJ505.PadColor.PURPLE,
+    "#CC00CC": DJ505.PadColor.MAGENTA,
+    "#CC0044": DJ505.PadColor.RED,
+    "#FFCCCC": DJ505.PadColor.APRICOT,
+    "#FFFFFF": DJ505.PadColor.WHITE,
+});
 
 DJ505.PadSection = function(deck, offset) {
     // TODO: Add support for missing modes (flip, slicer, slicerloop)
@@ -1239,7 +1246,6 @@ DJ505.HotcueMode = function(deck, offset) {
     this.ledControl = DJ505.PadMode.HOTCUE;
     this.color = DJ505.PadColor.WHITE;
 
-    var hotcueColors = [this.color].concat(DJ505.PadColorMap.slice(1));
     this.pads = new components.ComponentContainer();
     for (var i = 0; i <= 7; i++) {
         this.pads[i] = new components.HotcueButton({
@@ -1251,7 +1257,7 @@ DJ505.HotcueMode = function(deck, offset) {
             group: deck.currentDeck,
             on: this.color,
             off: this.color + DJ505.PadColor.DIM_MODIFIER,
-            colors: hotcueColors,
+            colorMapper: DJ505.PadColorMap,
             outConnect: false,
         });
     }
@@ -1287,7 +1293,6 @@ DJ505.CueLoopMode = function(deck, offset) {
     this.ledControl = DJ505.PadMode.HOTCUE;
     this.color = DJ505.PadColor.BLUE;
 
-    var cueloopColors = [this.color].concat(DJ505.PadColorMap.slice(1));
     this.PerformancePad = function(n) {
         this.midi = [0x94 + offset, 0x14 + n];
         this.number = n + 1;
@@ -1303,7 +1308,7 @@ DJ505.CueLoopMode = function(deck, offset) {
         group: deck.currentDeck,
         on: this.color,
         off: this.color + DJ505.PadColor.DIM_MODIFIER,
-        colors: cueloopColors,
+        colorMapper: DJ505.PadColorMap,
         outConnect: false,
         unshift: function() {
             this.input = function(channel, control, value, status, group) {
@@ -1596,14 +1601,13 @@ 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));
 
     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.colorMapper = DJ505.PadColorMap;
+        this.colorKey = "hotcue_" + this.number + "_color";
         components.Button.call(this);
     };
     this.PerformancePad.prototype = new components.Button({
@@ -1614,10 +1618,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 = this.colorMapper.getNearestValue(colorCode);
+            this.send((this.mode.cuepoint === this.number) ? midiColor : (midiColor + DJ505.PadColor.DIM_MODIFIER));
         },
         unshift: function() {
             this.outKey = "pitch_adjust";
@@ -1665,8 +1669,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);
                 }
@@ -1676,13 +1680,13 @@ DJ505.PitchPlayMode = function(deck, offset) {
                     var previousCuepoint = this.mode.cuepoint;
                     this.mode.cuepoint = this.number;
                     this.mode.pads[previousCuepoint - 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/common-controller-scripts.js

@@ -5,6 +5,8 @@
        arrayContains:off
        secondstominutes:off
        msecondstominutes:off
+       colorCodeToObject:off
+       colorCodeFromObject:off
        script:off
        bpm:off
        ButtonState:off
@@ -102,6 +104,24 @@ var msecondstominutes = function(msecs) {
         + (msecs < 10 ? "0" + msecs : msecs);
 };
 
+// Converts an object with "red", "green" and "blue" properties (value range
+// 0-255) into an RGB color code (e.g. 0xFF0000).
+// eslint-disable-next-line no-unused-vars
+var colorCodeFromObject = function(color) {
+    return ((color.red & 0xFF) << 16 | (color.green & 0xFF) << 8 | (color.blue & 0xFF));
+};
+
+// Converts an RGB color code (e.g. 0xFF0000) into an object with "red",
+// "green" and "blue" properties (value range 0-255).
+// eslint-disable-next-line no-unused-vars
+var colorCodeToObject = function(colorCode) {
+    return {
+        "red": (colorCode >> 16) & 0xFF,
+        "green": (colorCode >> 8) & 0xFF,
+        "blue": colorCode & 0xFF,
+    };
+};
+
 var script = function() {
 };