feat: add quick FX for stem

This allows the effect manager to apply quick effect on each stem. Effects are applied post stem fader, but pre deck fader
mixxxdj · Jul 30, 2024 · bc48a22 · bc48a22
1 parent 67b2d61
commit bc48a22
Show file tree

Hide file tree

Showing 22 changed files with 574 additions and 68 deletions.
diff --git a/CMakeLists.txt b/CMakeLists.txt
@@ -2776,6 +2776,7 @@ if(QML)
     src/qml/qmlplayermanagerproxy.cpp
     src/qml/qmlplayerproxy.cpp
     src/qml/qmlvisibleeffectsmodel.cpp
+    src/qml/qmlchainpresetmodel.cpp
     src/qml/qmlwaveformoverview.cpp
     # The following sources need to be in this target to get QML_ELEMENT properly interpreted
     src/control/controlmodel.cpp

diff --git a/res/qml/ComboBox.qml b/res/qml/ComboBox.qml
@@ -6,6 +6,9 @@ import "Theme"
 ComboBox {
     id: root
 
+    property alias popupWidth: popup.width
+    property bool clip: false
+
     background: Skin.EmbeddedBackground {
     }
 
@@ -40,10 +43,12 @@ ComboBox {
         font: root.font
         color: Theme.deckTextColor
         verticalAlignment: Text.AlignVCenter
-        elide: Text.ElideRight
+        elide: root.clip ? Text.ElideNone : Text.ElideRight
+        clip: root.clip
     }
 
     popup: Popup {
+        id: popup
         y: root.height
         width: root.width
         implicitHeight: contentItem.implicitHeight

diff --git a/res/qml/EqColumn.qml b/res/qml/EqColumn.qml
@@ -22,6 +22,7 @@ Column {
         Column {
             id: stem
             spacing: 4
+            width: 10
             visible: opacity != 0
             Repeater {
                 model: root.player.stemsModel
@@ -59,11 +60,8 @@ Column {
                 knob.color: Theme.eqLowColor
             }
 
-            Skin.EqKnob {
-                knob.group: "[QuickEffectRack1_" + root.group + "]"
-                knob.key: "super1"
-                statusGroup: "[QuickEffectRack1_" + root.group + "_Effect1]"
-                statusKey: "enabled"
+            Skin.QuickFxKnob {
+                group: "[QuickEffectRack1_" + root.group + "]"
                 knob.arcStyle: ShapePath.DashLine
                 knob.arcStylePattern: [2, 2]
                 knob.color: Theme.eqFxColor

diff --git a/res/qml/Mixxx/Controls/Knob.qml b/res/qml/Mixxx/Controls/Knob.qml
@@ -17,7 +17,7 @@ Item {
     property alias foreground: foreground.data
     property real min: 0
     property real max: 1
-    property real wheelStepSize: (root.max - root.min) / 10
+    property real wheelStepSize: (root.max - root.min) / 100
     property real angle: 130
     property bool arc: false
     property int arcStart: Knob.Center

diff --git a/res/qml/QuickFxKnob.qml b/res/qml/QuickFxKnob.qml
@@ -0,0 +1,83 @@
+import "." as Skin
+import Mixxx 1.0 as Mixxx
+import QtQuick 2.12
+import "Theme"
+
+Rectangle {
+    id: root
+
+    property alias knob: knob
+    required property string group
+
+    color: Theme.knobBackgroundColor
+    width: 56
+    height: 56
+    radius: 5
+
+    Skin.ControlKnob {
+        id: knob
+
+        group: root.group
+        key: "super1"
+
+        anchors.horizontalCenter: root.horizontalCenter
+        anchors.top: root.top
+        width: 40
+        height: 40
+    }
+
+    Mixxx.ControlProxy {
+        id: statusControl
+
+        group: root.group
+        key: "enabled"
+    }
+
+    Rectangle {
+        id: statusButton
+
+        anchors.left: root.left
+        anchors.bottom: root.bottom
+        anchors.leftMargin: 4
+        anchors.bottomMargin: 4
+        width: 8
+        height: width
+        radius: width / 2
+        border.width: 1
+        border.color: Theme.buttonNormalColor
+        color: statusControl.value ? knob.color : "transparent"
+
+        TapHandler {
+            onTapped: statusControl.value = !statusControl.value
+        }
+    }
+
+    Mixxx.ControlProxy {
+        id: fxSelect
+
+        group: root.group
+        key: "loaded_chain_preset"
+    }
+
+    Skin.ComboBox {
+        id: effectSelector
+        anchors.left: statusButton.right
+        anchors.leftMargin: 2
+        anchors.right: root.right
+        anchors.top: knob.bottom
+        anchors.margins: 1
+        spacing: 2
+        indicator.width: 0
+        popupWidth: 150
+        clip: true
+
+        opacity: statusControl.value ? 1 : 0.5
+        textRole: "display"
+        font.pixelSize: 10
+        model: Mixxx.EffectsManager.quickChainPresetModel
+        currentIndex: fxSelect.value == -1 ? 0 : fxSelect.value
+        onActivated: (index) => {
+            fxSelect.value = index
+        }
+    }
+}
diff --git a/res/qml/StemKnob.qml b/res/qml/StemKnob.qml
@@ -6,62 +6,139 @@ import "Theme"
 Rectangle {
     id: root
 
-    property alias knob: knob
+    property alias knob: volume
 
     required property string group
     required property string label
     required property color stemColor
     required property int index
 
-    width: 56
-    height: 56
-    radius: 5
-    color: stemColor
+    readonly property string fxGroup: `[QuickEffectRack1_${group.substr(0, group.length-1)}Stem${index + 1}]]`
 
-    Skin.ControlKnob {
-        id: knob
-        group: root.group
-        key: `stem_${root.index + 1}_volume`
-        color: Theme.gainKnobColor
-        anchors.topMargin: 5
-        anchors.top: root.top
-        anchors.horizontalCenter: root.horizontalCenter
+width: 56
+height: 56
+radius: 5
+color: stemColor
+opacity: statusControl.value ? 0.5 : 1
 
-        arcStart: 0
+Mixxx.ControlProxy {
+    id: statusControl
 
-        width: 36
-        height: 36
-    }
+    group: root.group
+    key: `stem_${root.index + 1}_mute`
+}
+
+Mixxx.ControlProxy {
+    id: fxControl
+
+    group: root.fxGroup
+    key: "enabled"
+}
+
+Rectangle {
+    id: statusButton
 
-    Text {
-        anchors.bottom: root.bottom
-        anchors.horizontalCenter: root.horizontalCenter
-        text: label
+    anchors.left: root.left
+    anchors.top: root.top
+    anchors.leftMargin: 4
+    anchors.topMargin: 4
+    width: 8
+    height: width
+    radius: width / 2
+    border.width: 1
+    border.color: Theme.buttonNormalColor
+    color: statusControl.value ? volume.color : "transparent"
+
+    TapHandler {
+        onTapped: statusControl.value = !statusControl.value
     }
+}
+
+Text {
+    id: stemLabel
+    anchors.top: root.top
+    anchors.right: root.right
+    anchors.topMargin: 2
+    anchors.rightMargin: 2
+    elide: Text.ElideRight
+    text: label
+    font.pixelSize: 10
+}
+
+Skin.ControlKnob {
+    id: volume
+    group: root.group
+    key: `stem_${root.index + 1}_volume`
+    color: Theme.gainKnobColor
+    anchors.leftMargin: 1
+    anchors.top: statusButton.bottom
+    anchors.left: root.left
+
+    arcStart: 0
 
-    Mixxx.ControlProxy {
-        id: statusControl
+    width: 32
+    height: 32
+}
+
+Rectangle {
+    id: fxButton
+
+    anchors.top: stemLabel.bottom
+    anchors.right: root.right
+    anchors.left: volume.right
+    anchors.leftMargin: 8
+    anchors.rightMargin: 8
+    width: 8
+    height: width
+    radius: width / 2
+    border.width: 1
+    border.color: Theme.buttonNormalColor
+    color: fxControl.value ? effectSuperKnob.color : "transparent"
 
-        group: root.group
-        key: `stem_${root.index + 1}_mute`
+    TapHandler {
+        onTapped: fxControl.value = !fxControl.value
     }
+}
+
+Skin.ControlMiniKnob {
+    id: effectSuperKnob
 
-    Rectangle {
-        id: statusButton
-
-        anchors.left: root.left
-        anchors.top: root.top
-        anchors.leftMargin: 4
-        anchors.topMargin: 4
-        width: 8
-        height: width
-        radius: width / 2
-        border.width: 1
-        border.color: Theme.buttonNormalColor
-        color: statusControl.value ? knob.color : "transparent"
-
-        TapHandler {
-            onTapped: statusControl.value = !statusControl.value
-        }
+    anchors.right: root.right
+    anchors.left: volume.right
+    anchors.bottom: effectSelector.top
+    anchors.margins: 2
+    arcStart: Knob.ArcStart.Minimum
+    group: root.fxGroup
+    key: "super1"
+    color: Theme.effectColor
+    opacity: fxControl.value ? 1 : 0.5
+}
+
+Mixxx.ControlProxy {
+    id: fxSelect
+
+    group: root.fxGroup
+    key: "loaded_chain_preset"
+}
+
+Skin.ComboBox {
+    id: effectSelector
+    anchors.left: root.left
+    anchors.right: root.right
+    anchors.bottom: root.bottom
+    anchors.margins: 1
+    spacing: 2
+    indicator.width: 0
+    popupWidth: 150
+    clip: true
+
+    opacity: fxControl.value ? 1 : 0.5
+    textRole: "display"
+    font.pixelSize: 10
+    model: Mixxx.EffectsManager.quickChainPresetModel
+    currentIndex: fxSelect.value == -1 ? 0 : fxSelect.value
+    onActivated: (index) => {
+        fxSelect.value = index
     }
 }
+}