use QColor for cue colors (rebased)

build/depends.py

@@ -781,6 +781,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",
@@ -1262,6 +1263,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",
@@ -1288,8 +1290,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

@@ -1499,7 +1499,7 @@ DJ505.PitchPlayMode = function (deck, offset) {
  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({
@@ -1561,8 +1561,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 +1572,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,8 +324,8 @@
  // 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);
  }
@@ -348,8 +348,8 @@
  },
  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 red-->
+ UPDATE cues SET color=4291103240 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>

res/skins/Deere/style.qss

@@ -1583,7 +1583,6 @@ WPushButton:hover {
 /*"Pressed" state*/
 WPushButton[value="1"],
 WPushButton[value="2"] {
- /*color: #FDFDFD;*/
  color: #FDFDFD;
  background-color: #006596;
  border: 0px solid #006596;
@@ -1596,129 +1595,17 @@ WPushButton[value="2"]:hover {
  border: 0px solid #0080BE;
 }
 
-/* Hotcue Color: No Color */
-#HotcueButton[value="1"][highlight="0"],
-#HotcueButton[value="2"][highlight="0"] {
- background-color: #006596;
-}
-
-#HotcueButton[value="1"][highlight="0"]:hover,
-#HotcueButton[value="2"][highlight="0"]:hover {
- background-color: #0080BE;
-}
-
-/* Hotcue Color: Red */
-#HotcueButton[value="1"][highlight="1"],
-#HotcueButton[value="2"][highlight="1"] {
- background-color: #c50a08;
-}
-
-#HotcueButton[value="1"][highlight="1"]:hover,
-#HotcueButton[value="2"][highlight="1"]:hover {
- background-color: #e50c08;
-}
-
-/* Hotcue Color: Green */
-#HotcueButton[value="1"][highlight="2"],
-#HotcueButton[value="2"][highlight="2"] {
- background-color: #32be44;
-}
-
-#HotcueButton[value="1"][highlight="2"]:hover,
-#HotcueButton[value="2"][highlight="2"]:hover {
- background-color: #52de64;
-}
-
-/* Hotcue Color: Blue */
-#HotcueButton[value="1"][highlight="3"],
-#HotcueButton[value="2"][highlight="3"] {
- background-color: #0044ff;
-}
-
-#HotcueButton[value="1"][highlight="3"]:hover,
-#HotcueButton[value="2"][highlight="3"]:hover {
- background-color: #0064ff;
-}
-
-/* Hotcue Color: Yellow */
-#HotcueButton[value="1"][highlight="4"],
-#HotcueButton[value="2"][highlight="4"] {
- color: #4B4B4B;
- background-color: #f8d200;
-}
-
-#HotcueButton[value="1"][highlight="4"]:hover,
-#HotcueButton[value="2"][highlight="4"]:hover {
- color: #4B4B4B;
- background-color: #f8f200;
-}
-
-/* Hotcue Color: Celeste */
-#HotcueButton[value="1"][highlight="5"],
-#HotcueButton[value="2"][highlight="5"] {
- color: #4B4B4B;
- background-color: #42d4f4;
+#HotcueButton {
+ qproperty-shouldHighlightBackgroundOnHover: true;
 }
 
-#HotcueButton[value="1"][highlight="5"]:hover,
-#HotcueButton[value="2"][highlight="5"]:hover {
- color: #4B4B4B;
- background-color: #62f4f4;
-}
-
-/* Hotcue Color: Purple */
-#HotcueButton[value="1"][highlight="6"],
-#HotcueButton[value="2"][highlight="6"] {
- background-color: #af00cc;
-}
-
-#HotcueButton[value="1"][highlight="6"]:hover,
-#HotcueButton[value="2"][highlight="6"]:hover {
- background-color: #cf00ec;
-}
-
-/* Hotcue Color: Pink */
-#HotcueButton[value="1"][highlight="7"],
-#HotcueButton[value="2"][highlight="7"] {
- color: #4B4B4B;
- background-color: #fca6d7;
-}
-
-#HotcueButton[value="1"][highlight="7"]:hover,
-#HotcueButton[value="2"][highlight="7"]:hover {
- color: #4B4B4B;
- background-color: #fcc6f7;
-}
-
-/* Hotcue Color: White */
-#HotcueButton[value="1"][highlight="8"],
-#HotcueButton[value="2"][highlight="8"] {
- color: #4B4B4B;
- background-color: #f2f2ff;
-}
-
-#HotcueButton[value="1"][highlight="8"]:hover,
-#HotcueButton[value="2"][highlight="8"]:hover {
- color: #4B4B4B;
- background-color: #ffffff;
-}
-
-/*"Enabled" state, e.g. for recording status
- 0 -- disconnected / off
- 1 -- connecting / enabling
- 2 -- connected / enabled
-WPushButton[value="2"] {
+#HotcueButton[backgroundIsDark=true][hasBackgroundColor=true] {
  color: #FDFDFD;
- background-color: #4B4B4B;
- border: 0px solid #006596;
 }
 
-WPushButton[value="2"]:hover {
- color: #FDFDFD;
- background-color: #4B4B4B;
- border: 0px solid #0080BE;
+#HotcueButton[backgroundIsDark=false][hasBackgroundColor=true] {
+ color: #1f1e1e;
 }
-*/
 
 #PlayToggle[value="0"] {
  image: url(skin:/icon/ic_play_48px.svg) no-repeat center center;

res/skins/LateNight/button_hotcue.xml

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

res/skins/LateNight/style.qss

@@ -700,44 +700,6 @@ QPushButton#pushButtonAutoDJ:checked,
 }
 /* ToDo
  * orange Play button when playing from Cue / Hotcue */
-/* Hotcue Color: Green */
-#HotcueButton[displayValue="1"][highlight="2"],
-#HotcueButton[displayValue="2"][highlight="2"] {
- background-color: #32be44;
-}
-/* Hotcue Color: Blue */
-#HotcueButton[displayValue="1"][highlight="3"],
-#HotcueButton[displayValue="2"][highlight="3"],
-#SpecialCueButton[value="1"] {
- background-color: #0044ff;
-}
-/* Hotcue Color: Yellow */
-#HotcueButton[displayValue="1"][highlight="4"],
-#HotcueButton[displayValue="2"][highlight="4"] {
- background-color: #f8d200;
-}
-/* Hotcue Color: Celeste */
-#HotcueButton[displayValue="1"][highlight="5"],
-#HotcueButton[displayValue="2"][highlight="5"] {
- background-color: #42d4f4;
-}
-/* Hotcue Color: Purple */
-#HotcueButton[displayValue="1"][highlight="6"],
-#HotcueButton[displayValue="2"][highlight="6"] {
- background-color: #af00cc;
-}
-/* Hotcue Color: Pink */
-#HotcueButton[displayValue="1"][highlight="7"],
-#HotcueButton[displayValue="2"][highlight="7"] {
- background-color: #fca6d7;
-}
-/* Hotcue Color: White */
-#HotcueButton[displayValue="1"][highlight="8"],
-#HotcueButton[displayValue="2"][highlight="8"] {
- background-color: #f2f2ff;
-}
-/************** Button borders & backgrounds **********************************/
-
 
 
 /************** Button icons **************************************************/

res/skins/Shade/deck_hotcue_button.xml

@@ -8,13 +8,13 @@
  <RightClickIsPushButton>true</RightClickIsPushButton>
  <State>
  <Number>0</Number>
- <Pressed>skin:/btn/btn_hotcue_<Variable name="hotcue"/>_down.png</Pressed>
+ <Pressed>skin:/btn/btn_hotcue_<Variable name="hotcue"/>.png</Pressed>
  <Unpressed>skin:/btn/btn_hotcue_<Variable name="hotcue"/>.png</Unpressed>
  </State>
  <State>
  <Number>1</Number>
- <Pressed>skin:/btn/btn_hotcue_<Variable name="hotcue"/>_overdown.png</Pressed>
- <Unpressed>skin:/btn/btn_hotcue_<Variable name="hotcue"/>_over.png</Unpressed>
+ <Pressed>skin:/btn/btn_hotcue_<Variable name="hotcue"/>.png</Pressed>
+ <Unpressed>skin:/btn/btn_hotcue_<Variable name="hotcue"/>.png</Unpressed>
  </State>
  <Connection>
  <ConfigKey>[Channel<Variable name="channum"/>],hotcue_<Variable name="hotcue"/>_activate</ConfigKey>
@@ -33,8 +33,8 @@
  <ConnectValueFromWidget>false</ConnectValueFromWidget>
  </Connection>
  <Connection>
- <ConfigKey>[Channel<Variable name="channum"/>],hotcue_<Variable name="hotcue"/>_color_id</ConfigKey>
- <BindProperty>highlight</BindProperty>
+ <ConfigKey>[Channel<Variable name="channum"/>],hotcue_<Variable name="hotcue"/>_color</ConfigKey>
+ <BindProperty>backgroundColorRgba</BindProperty>
  </Connection>
  </PushButton>
 </Template>