From 2d8321dd3b8f75eb15ba6b4db86a1991a7958b7f Mon Sep 17 00:00:00 2001 From: Mikel Johnson Date: Fri, 13 Nov 2020 22:25:59 +0300 Subject: [PATCH 1/7] [Media Controller] Add shuffle and loop controls Co-authored-by: Kai Uwe Broulik --- .../contents/ui/ExpandedRepresentation.qml | 61 ++++++++++++++++++- applets/mediacontroller/contents/ui/main.qml | 6 ++ 2 files changed, 66 insertions(+), 1 deletion(-) diff --git a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml index 836cfc89da..693fc69bcd 100644 --- a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml +++ b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml @@ -419,6 +419,24 @@ PlasmaComponents3.Page { Layout.bottomMargin: PlasmaCore.Units.smallSpacing spacing: units.smallSpacing + PlasmaComponents3.ToolButton { + icon.name: "media-playlist-shuffle" + icon.width: expandedRepresentation.controlSize + icon.height: icon.width + checked: root.shuffle === true + enabled: root.canControl && root.shuffle !== undefined + Accessible.name: i18n("Shuffle") + onClicked: { + const service = mpris2Source.serviceForSource(mpris2Source.current); + let operation = service.operationDescription("SetShuffle"); + operation.on = !root.shuffle; + service.startOperationCall(operation); + } + + PlasmaComponents3.ToolTip { + text: parent.Accessible.name + } + } PlasmaComponents3.ToolButton { // Previous icon.width: expandedRepresentation.controlSize icon.height: icon.width @@ -451,6 +469,33 @@ PlasmaComponents3.Page { root.action_next() } } + PlasmaComponents3.ToolButton { + icon.name: root.loopStatus === "Track" ? "media-playlist-repeat-song" : "media-playlist-repeat" + icon.width: expandedRepresentation.controlSize + icon.height: icon.width + checked: root.loopStatus !== undefined && root.loopStatus !== "None" + enabled: root.canControl && root.loopStatus !== undefined + Accessible.name: root.loopStatus === "Track" ? i18n("Repeat Track") : i18n("Repeat") + onClicked: { + const service = mpris2Source.serviceForSource(mpris2Source.current); + let operation = service.operationDescription("SetLoopStatus"); + switch (root.loopStatus) { + case "Playlist": + operation.status = "Track"; + break; + case "Track": + operation.status = "None"; + break; + default: + operation.status = "Playlist"; + } + service.startOperationCall(operation); + } + + PlasmaComponents3.ToolTip { + text: parent.Accessible.name + } + } } } } @@ -458,13 +503,27 @@ PlasmaComponents3.Page { header: PlasmaExtras.PlasmoidHeading { id: headerItem location: PlasmaExtras.PlasmoidHeading.Location.Header - visible: playerList.model.length > 2 // more than one player, @multiplex is always there + visible: playerList.model.length > 1 //this removes top padding to allow tabbar to touch the edge topPadding: topInset bottomPadding: -bottomInset implicitHeight: PlasmaCore.Units.gridUnit * 2 + PlasmaExtras.Heading { // Song Title + anchors.fill: parent + anchors.leftMargin: units.smallSpacing + level: 2 + + textFormat: Text.PlainText + fontSizeMode: Text.VerticalFit + elide: Text.ElideRight + + text: root.identity + + visible: playerList.count <= 2 + } PlasmaComponents3.TabBar { id: playerSelector + visible: playerList.model.length > 2 // more than one player, @multiplex is always there position: PlasmaComponents3.TabBar.Header anchors.fill: parent diff --git a/applets/mediacontroller/contents/ui/main.qml b/applets/mediacontroller/contents/ui/main.qml index a12c8a2178..7d0d453f62 100644 --- a/applets/mediacontroller/contents/ui/main.qml +++ b/applets/mediacontroller/contents/ui/main.qml @@ -78,6 +78,12 @@ Item { readonly property bool canPlay: (canControl && mpris2Source.currentData.CanPlay) || false readonly property bool canPause: (canControl && mpris2Source.currentData.CanPause) || false + // var instead of bool so we can use "undefined" for "shuffle not supported" + readonly property var shuffle: !root.noPlayer && typeof mpris2Source.currentData.Shuffle === "boolean" + ? mpris2Source.currentData.Shuffle : undefined + readonly property var loopStatus: !root.noPlayer && typeof mpris2Source.currentData.LoopStatus === "string" + ? mpris2Source.currentData.LoopStatus : undefined + Plasmoid.switchWidth: units.gridUnit * 14 Plasmoid.switchHeight: units.gridUnit * 10 Plasmoid.icon: "media-playback-playing" -- GitLab From dae25290a4218b655e2042e337bc128675e5db31 Mon Sep 17 00:00:00 2001 From: Mikel Johnson Date: Fri, 13 Nov 2020 23:30:43 +0300 Subject: [PATCH 2/7] Make spacing a bit larger --- .../mediacontroller/contents/ui/ExpandedRepresentation.qml | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml index 693fc69bcd..479aff282b 100644 --- a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml +++ b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml @@ -420,6 +420,7 @@ PlasmaComponents3.Page { spacing: units.smallSpacing PlasmaComponents3.ToolButton { + Layout.rightMargin: units.smallSpacing * 2 icon.name: "media-playlist-shuffle" icon.width: expandedRepresentation.controlSize icon.height: icon.width @@ -437,6 +438,7 @@ PlasmaComponents3.Page { text: parent.Accessible.name } } + PlasmaComponents3.ToolButton { // Previous icon.width: expandedRepresentation.controlSize icon.height: icon.width @@ -469,7 +471,9 @@ PlasmaComponents3.Page { root.action_next() } } + PlasmaComponents3.ToolButton { + Layout.leftMargin: units.smallSpacing * 2 icon.name: root.loopStatus === "Track" ? "media-playlist-repeat-song" : "media-playlist-repeat" icon.width: expandedRepresentation.controlSize icon.height: icon.width -- GitLab From 93f5d5e3479cb1cacf8a80e4ef651968260b947d Mon Sep 17 00:00:00 2001 From: Mikel Johnson Date: Sat, 14 Nov 2020 10:23:20 +0300 Subject: [PATCH 3/7] Use PlasmaCore.Units --- .../contents/ui/ExpandedRepresentation.qml | 34 +++++++++---------- applets/mediacontroller/contents/ui/main.qml | 4 +-- 2 files changed, 19 insertions(+), 19 deletions(-) diff --git a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml index 479aff282b..92368d17f6 100644 --- a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml +++ b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml @@ -32,12 +32,12 @@ import QtGraphicalEffects 1.0 PlasmaComponents3.Page { id: expandedRepresentation - Layout.minimumWidth: units.gridUnit * 14 - Layout.minimumHeight: units.gridUnit * 14 + Layout.minimumWidth: PlasmaCore.Units.gridUnit * 14 + Layout.minimumHeight: PlasmaCore.Units.gridUnit * 14 Layout.preferredWidth: Layout.minimumWidth * 1.5 Layout.preferredHeight: Layout.minimumHeight * 1.5 - readonly property int controlSize: units.iconSizes.medium + readonly property int controlSize: PlasmaCore.Units.iconSizes.medium property double position: mpris2Source.currentData.Position || 0 readonly property real rate: mpris2Source.currentData.Rate || 1 @@ -172,11 +172,11 @@ PlasmaComponents3.Page { anchors { fill: parent - leftMargin: units.largeSpacing - rightMargin: units.largeSpacing + leftMargin: PlasmaCore.Units.largeSpacing + rightMargin: PlasmaCore.Units.largeSpacing } - spacing: units.largeSpacing + spacing: PlasmaCore.Units.largeSpacing Item { Layout.fillWidth: true @@ -209,7 +209,7 @@ PlasmaComponents3.Page { anchors { fill: parent - margins: units.largeSpacing*2 + margins: PlasmaCore.Units.largeSpacing*2 } } } @@ -239,7 +239,7 @@ PlasmaComponents3.Page { text: root.track || i18n("No media playing") Layout.fillWidth: true - Layout.maximumHeight: units.gridUnit*5 + Layout.maximumHeight: PlasmaCore.Units.gridUnit*5 } Kirigami.Heading { // Song Artist id: songArtist @@ -255,7 +255,7 @@ PlasmaComponents3.Page { text: root.artist Layout.fillWidth: true - Layout.maximumHeight: units.gridUnit*2 + Layout.maximumHeight: PlasmaCore.Units.gridUnit*2 } Kirigami.Heading { // Song Album color: (softwareRendering || !albumArt.visible) ? PlasmaCore.ColorScope.textColor : "white" @@ -302,7 +302,7 @@ PlasmaComponents3.Page { return "" } Layout.fillWidth: true - Layout.maximumHeight: units.gridUnit*2 + Layout.maximumHeight: PlasmaCore.Units.gridUnit*2 } } } @@ -314,18 +314,18 @@ PlasmaComponents3.Page { ColumnLayout { // Main Column Layout anchors.fill: parent RowLayout { // Seek Bar - spacing: units.smallSpacing + spacing: PlasmaCore.Units.smallSpacing // if there's no "mpris:length" in the metadata, we cannot seek, so hide it in that case enabled: !root.noPlayer && root.track && expandedRepresentation.length > 0 ? true : false opacity: enabled ? 1 : 0 Behavior on opacity { - NumberAnimation { duration: units.longDuration } + NumberAnimation { duration: PlasmaCore.Units.longDuration } } Layout.alignment: Qt.AlignHCenter Layout.fillWidth: true - Layout.maximumWidth: Math.min(units.gridUnit*45, Math.round(expandedRepresentation.width*(7/10))) + Layout.maximumWidth: Math.min(PlasmaCore.Units.gridUnit*45, Math.round(expandedRepresentation.width*(7/10))) // ensure the layout doesn't shift as the numbers change and measure roughly the longest text that could occur with the current song TextMetrics { @@ -417,10 +417,10 @@ PlasmaComponents3.Page { Layout.alignment: Qt.AlignHCenter Layout.bottomMargin: PlasmaCore.Units.smallSpacing - spacing: units.smallSpacing + spacing: PlasmaCore.Units.smallSpacing PlasmaComponents3.ToolButton { - Layout.rightMargin: units.smallSpacing * 2 + Layout.rightMargin: PlasmaCore.Units.smallSpacing * 2 icon.name: "media-playlist-shuffle" icon.width: expandedRepresentation.controlSize icon.height: icon.width @@ -473,7 +473,7 @@ PlasmaComponents3.Page { } PlasmaComponents3.ToolButton { - Layout.leftMargin: units.smallSpacing * 2 + Layout.leftMargin: PlasmaCore.Units.smallSpacing * 2 icon.name: root.loopStatus === "Track" ? "media-playlist-repeat-song" : "media-playlist-repeat" icon.width: expandedRepresentation.controlSize icon.height: icon.width @@ -514,7 +514,7 @@ PlasmaComponents3.Page { implicitHeight: PlasmaCore.Units.gridUnit * 2 PlasmaExtras.Heading { // Song Title anchors.fill: parent - anchors.leftMargin: units.smallSpacing + anchors.leftMargin: PlasmaCore.Units.smallSpacing level: 2 textFormat: Text.PlainText diff --git a/applets/mediacontroller/contents/ui/main.qml b/applets/mediacontroller/contents/ui/main.qml index 7d0d453f62..3a07b94da1 100644 --- a/applets/mediacontroller/contents/ui/main.qml +++ b/applets/mediacontroller/contents/ui/main.qml @@ -84,8 +84,8 @@ Item { readonly property var loopStatus: !root.noPlayer && typeof mpris2Source.currentData.LoopStatus === "string" ? mpris2Source.currentData.LoopStatus : undefined - Plasmoid.switchWidth: units.gridUnit * 14 - Plasmoid.switchHeight: units.gridUnit * 10 + Plasmoid.switchWidth: PlasmaCore.Units.gridUnit * 14 + Plasmoid.switchHeight: PlasmaCore.Units.gridUnit * 10 Plasmoid.icon: "media-playback-playing" Plasmoid.toolTipMainText: i18n("No media playing") Plasmoid.toolTipSubText: identity -- GitLab From 59d9a0db2e818b6f05829a210a7e0b2518c49455 Mon Sep 17 00:00:00 2001 From: Mikel Johnson Date: Sun, 15 Nov 2020 16:21:55 +0000 Subject: [PATCH 4/7] Update ExpandedRepresentation.qml --- .../mediacontroller/contents/ui/ExpandedRepresentation.qml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml index 92368d17f6..7e4c7bcc2d 100644 --- a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml +++ b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml @@ -420,7 +420,7 @@ PlasmaComponents3.Page { spacing: PlasmaCore.Units.smallSpacing PlasmaComponents3.ToolButton { - Layout.rightMargin: PlasmaCore.Units.smallSpacing * 2 + Layout.rightMargin: PlasmaCore.Units.largeSpacing icon.name: "media-playlist-shuffle" icon.width: expandedRepresentation.controlSize icon.height: icon.width @@ -473,7 +473,7 @@ PlasmaComponents3.Page { } PlasmaComponents3.ToolButton { - Layout.leftMargin: PlasmaCore.Units.smallSpacing * 2 + Layout.leftMargin: PlasmaCore.Units.largeSpacing icon.name: root.loopStatus === "Track" ? "media-playlist-repeat-song" : "media-playlist-repeat" icon.width: expandedRepresentation.controlSize icon.height: icon.width -- GitLab From 4608ca72dc8776dc53c06e5d3291af8d426dd6a2 Mon Sep 17 00:00:00 2001 From: Mikel Johnson Date: Sun, 15 Nov 2020 16:41:13 +0000 Subject: [PATCH 5/7] Update ExpandedRepresentation.qml --- .../mediacontroller/contents/ui/ExpandedRepresentation.qml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml index 7e4c7bcc2d..92368d17f6 100644 --- a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml +++ b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml @@ -420,7 +420,7 @@ PlasmaComponents3.Page { spacing: PlasmaCore.Units.smallSpacing PlasmaComponents3.ToolButton { - Layout.rightMargin: PlasmaCore.Units.largeSpacing + Layout.rightMargin: PlasmaCore.Units.smallSpacing * 2 icon.name: "media-playlist-shuffle" icon.width: expandedRepresentation.controlSize icon.height: icon.width @@ -473,7 +473,7 @@ PlasmaComponents3.Page { } PlasmaComponents3.ToolButton { - Layout.leftMargin: PlasmaCore.Units.largeSpacing + Layout.leftMargin: PlasmaCore.Units.smallSpacing * 2 icon.name: root.loopStatus === "Track" ? "media-playlist-repeat-song" : "media-playlist-repeat" icon.width: expandedRepresentation.controlSize icon.height: icon.width -- GitLab From f7d43b74661a90894b6868dc5e4d2b4be7d1cb32 Mon Sep 17 00:00:00 2001 From: Mikel Johnson Date: Sun, 15 Nov 2020 16:54:04 +0000 Subject: [PATCH 6/7] Update ExpandedRepresentation.qml --- .../mediacontroller/contents/ui/ExpandedRepresentation.qml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml index 92368d17f6..09af2e020c 100644 --- a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml +++ b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml @@ -420,7 +420,7 @@ PlasmaComponents3.Page { spacing: PlasmaCore.Units.smallSpacing PlasmaComponents3.ToolButton { - Layout.rightMargin: PlasmaCore.Units.smallSpacing * 2 + Layout.rightMargin: PlasmaCore.Units.largeSpacing - playerControls.spacing icon.name: "media-playlist-shuffle" icon.width: expandedRepresentation.controlSize icon.height: icon.width @@ -473,7 +473,7 @@ PlasmaComponents3.Page { } PlasmaComponents3.ToolButton { - Layout.leftMargin: PlasmaCore.Units.smallSpacing * 2 + Layout.leftMargin: PlasmaCore.Units.largeSpacing - playerControls.spacing icon.name: root.loopStatus === "Track" ? "media-playlist-repeat-song" : "media-playlist-repeat" icon.width: expandedRepresentation.controlSize icon.height: icon.width -- GitLab From ee1a594f1d11c6e68edf3fac7226582e21eb78b4 Mon Sep 17 00:00:00 2001 From: Mikel Johnson Date: Sun, 15 Nov 2020 17:26:18 +0000 Subject: [PATCH 7/7] Account for RTL --- .../mediacontroller/contents/ui/ExpandedRepresentation.qml | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml index 09af2e020c..224e9bc683 100644 --- a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml +++ b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml @@ -420,7 +420,8 @@ PlasmaComponents3.Page { spacing: PlasmaCore.Units.smallSpacing PlasmaComponents3.ToolButton { - Layout.rightMargin: PlasmaCore.Units.largeSpacing - playerControls.spacing + Layout.rightMargin: LayoutMirroring.enabled ? 0 : PlasmaCore.Units.largeSpacing - playerControls.spacing + Layout.leftMargin: LayoutMirroring.enabled ? PlasmaCore.Units.largeSpacing - playerControls.spacing : 0 icon.name: "media-playlist-shuffle" icon.width: expandedRepresentation.controlSize icon.height: icon.width @@ -473,7 +474,8 @@ PlasmaComponents3.Page { } PlasmaComponents3.ToolButton { - Layout.leftMargin: PlasmaCore.Units.largeSpacing - playerControls.spacing + Layout.leftMargin: LayoutMirroring.enabled ? 0 : PlasmaCore.Units.largeSpacing - playerControls.spacing + Layout.rightMargin: LayoutMirroring.enabled ? PlasmaCore.Units.largeSpacing - playerControls.spacing : 0 icon.name: root.loopStatus === "Track" ? "media-playlist-repeat-song" : "media-playlist-repeat" icon.width: expandedRepresentation.controlSize icon.height: icon.width -- GitLab