widgets/mediaplayer: Add support for controlling multiple media sources

Implement #135

components/mobileshell/qml/widgets/mediacontrols/MediaControlsSource.qml

@@ -12,25 +12,52 @@ import org.kde.plasma.core 2.0 as PlasmaCore
 PlasmaCore.DataSource {
     id: mpris2Source
 
-    readonly property string source: "@multiplex"
+    engine: "mpris2"
-    readonly property var playerData: data[source]
+    connectedSources: sources
+    
+    readonly property string multiplexSource: "@multiplex"
+    
+    property var mprisSourcesModel: []
+    
+    readonly property bool hasPlayer: sources.length > 1
 
-    readonly property bool hasPlayer: sources.length > 1 && !!playerData
+    function startOperation(src, op) {
-    readonly property string identity: hasPlayer ? playerData.Identity : ""
+        var service = serviceForSource(src)
-    readonly property bool playing: hasPlayer && playerData.PlaybackStatus === "Playing"
+        var operation = service.operationDescription(op)
-    readonly property bool canControl: hasPlayer && playerData.CanControl
+        return service.startOperationCall(operation)
-    readonly property bool canGoBack: hasPlayer && playerData.CanGoPrevious
+    }
-    readonly property bool canGoNext: hasPlayer && playerData.CanGoNext
 
-    readonly property var currentMetadata: hasPlayer ? playerData.Metadata : ({})
+    function goPrevious(source) {
-
+        startOperation(source, "Previous");
-    readonly property string track: {
+    }
-        const xesamTitle = currentMetadata["xesam:title"]
+    function goNext(source) {
+        startOperation(source, "Next");
+    }
+    function playPause(source) {
+        startOperation(source, "PlayPause");
+    }
+    function isPlaying(source) {
+        return data[source] ? data[source].PlaybackStatus === "Playing" : false;
+    }
+    function canControl(source) {
+        return data[source] ? data[source].CanControl : false;
+    }
+    function canGoBack(source) {
+        return data[source] ? data[source].CanGoPrevious : false;
+    }
+    function canGoNext(source) {
+        return data[source] ? data[source].CanGoNext : false;
+    }
+    function track(source) {
+        if (!data[source]) {
+            return "";
+        }
+        const xesamTitle = data[source].Metadata["xesam:title"]
         if (xesamTitle) {
             return xesamTitle
         }
         // if no track title is given, print out the file name
-        const xesamUrl = currentMetadata["xesam:url"] ? currentMetadata["xesam:url"].toString() : ""
+        const xesamUrl = data[source].Metadata["xesam:url"] ? data[source].Metadata["xesam:url"].toString() : ""
         if (!xesamUrl) {
             return ""
         }
@@ -41,25 +68,43 @@ PlasmaCore.DataSource {
         const lastUrlPart = xesamUrl.substring(lastSlashPos + 1)
         return decodeURIComponent(lastUrlPart)
     }
-    readonly property string artist: currentMetadata["xesam:artist"] || ""
+    function artist(source) {
-    readonly property string albumArt: currentMetadata["mpris:artUrl"] || ""
+        return data[source] ? data[source].Metadata["xesam:artist"] || "" : "";
+    }
+    function albumArt(source) {
+        return data[source] ? data[source].Metadata["mpris:artUrl"] || "" : "";
+    }
+    
+    function updateMprisSourcesModel() {
+        let model = [];
+        
+        let sources = mpris2Source.sources;
+        for (let i = 0; i < sources.length; ++i) {
+            let source = sources[i];
+            if (source === mpris2Source.multiplexSource) {
+                continue;
+            }
+            
+            const playerData = mpris2Source.data[source];
+            // source data is removed before its name is removed from the list
+            if (!playerData) {
+                continue;
+            }
 
-    engine: "mpris2"
+            model.push({
-    connectedSources: [source]
+                'application': playerData["Identity"],
-
+                'source': source,
-    function startOperation(op) {
+            });
-        var service = serviceForSource(source)
+        }
-        var operation = service.operationDescription(op)
+        
-        return service.startOperationCall(operation)
+        mprisSourcesModel = model;
     }
-
+    
-    function goPrevious() {
+    Component.onCompleted: {
-        startOperation("Previous");
+        mpris2Source.serviceForSource("@multiplex").enableGlobalShortcuts()
-    }
+        updateMprisSourcesModel()
-    function goNext() {
-        startOperation("Next");
-    }
-    function playPause(source) {
-        startOperation("PlayPause");
     }
+    
+    onSourceAdded: updateMprisSourcesModel()
+    onSourceRemoved: updateMprisSourcesModel();
 }

components/mobileshell/qml/widgets/mediacontrols/MediaControlsWidget.qml

@@ -17,110 +17,156 @@ import org.kde.plasma.extras 2.0 as PlasmaExtras
 
 import "../../components" as Components
 
-Components.BaseItem {
+/**
+ * Embeddable component that provides MPRIS control.
+ */
+Item {
     id: root
-    
     visible: mpris2Source.hasPlayer
-    padding: visible ? Kirigami.Units.largeSpacing + Kirigami.Units.smallSpacing : 0
-    implicitHeight: visible ? bottomPadding + topPadding + PlasmaCore.Units.gridUnit * 2 + PlasmaCore.Units.smallSpacing : 0
     
-    background: BlurredBackground {
+    readonly property real padding: Kirigami.Units.largeSpacing + Kirigami.Units.smallSpacing
-        imageSource: mpris2Source.albumArt
+    readonly property real contentHeight: PlasmaCore.Units.gridUnit * 2 + PlasmaCore.Units.smallSpacing
+    implicitHeight: visible ? padding * 2 + contentHeight : 0
+    
+    MediaControlsSource {
+        id: mpris2Source
     }
     
-    contentItem: PlasmaCore.ColorScope {
+    // page indicator
-        colorGroup: PlasmaCore.Theme.ComplementaryColorGroup
+    RowLayout {
-        width: root.width - root.leftPadding - root.rightPadding
+        z: 1
+        visible: view.count > 1
+        spacing: Kirigami.Units.smallSpacing
+        anchors.bottomMargin: Kirigami.Units.smallSpacing * 2
+        anchors.bottom: view.bottom
+        anchors.horizontalCenter: parent.horizontalCenter
         
-        MediaControlsSource {
+        Repeater {
-            id: mpris2Source
+            model: view.count
+            delegate: Rectangle {
+                width: Kirigami.Units.smallSpacing
+                height: Kirigami.Units.smallSpacing
+                radius: width / 2
+                color: Qt.rgba(255, 255, 255, view.currentIndex == model.index ? 1 : 0.5)
+            }
         }
+    }
+    
+    // list of app media widgets
+    QQC2.SwipeView {
+        id: view
+        clip: true
         
-        RowLayout {
+        anchors.fill: parent
-            id: controlsRow
+        
-            width: parent.width
+        Repeater {
-            height: parent.height
+            model: mpris2Source.mprisSourcesModel
-            spacing: 0
+            
-
+            delegate: Components.BaseItem {
-            enabled: mpris2Source.canControl
+                id: playerItem
-
+                
-            Image {
+                property string source: modelData.source
-                id: albumArt
+                
-                Layout.preferredWidth: height
+                padding: root.padding
-                Layout.fillHeight: true
+                implicitHeight: root.contentHeight + root.padding * 2
-                asynchronous: true
+                implicitWidth: root.width
-                fillMode: Image.PreserveAspectFit
+                
-                source: mpris2Source.albumArt
+                background: BlurredBackground {
-                sourceSize.height: height
+                    imageSource: mpris2Source.albumArt(playerItem.source)
-                visible: status === Image.Loading || status === Image.Ready
-            }
-
-            ColumnLayout {
-                Layout.leftMargin: albumArt.visible ? Kirigami.Units.largeSpacing : 0
-                Layout.fillWidth: true
-                spacing: Kirigami.Units.smallSpacing
-
-                QQC2.Label {
-                    Layout.fillWidth: true
-                    wrapMode: Text.NoWrap
-                    elide: Text.ElideRight
-                    text: mpris2Source.track || i18n("No media playing")
-                    textFormat: Text.PlainText
-                    font.pointSize: PlasmaCore.Theme.defaultFont.pointSize
-                    maximumLineCount: 1
-                    color: "white"
                 }
+                
+                contentItem: PlasmaCore.ColorScope {
+                    colorGroup: PlasmaCore.Theme.ComplementaryColorGroup
+                    width: playerItem.width - playerItem.leftPadding - playerItem.rightPadding
+                    
+                    RowLayout {
+                        id: controlsRow
+                        width: parent.width
+                        height: parent.height
+                        spacing: 0
 
-                QQC2.Label {
+                        enabled: mpris2Source.canControl(playerItem.source)
-                    Layout.fillWidth: true
+
-                    wrapMode: Text.NoWrap
+                        Image {
-                    elide: Text.ElideRight
+                            id: albumArt
-                    // if no artist is given, show player name instead
+                            Layout.preferredWidth: height
-                    text: mpris2Source.artist || mpris2Source.identity || ""
+                            Layout.fillHeight: true
-                    textFormat: Text.PlainText
+                            asynchronous: true
-                    font.pointSize: PlasmaCore.Theme.smallestFont.pointSize
+                            fillMode: Image.PreserveAspectFit
-                    maximumLineCount: 1
+                            source: mpris2Source.albumArt(playerItem.source)
-                    opacity: 0.9
+                            sourceSize.height: height
-                    color: "white"
+                            visible: status === Image.Loading || status === Image.Ready
+                        }
+
+                        ColumnLayout {
+                            Layout.leftMargin: albumArt.visible ? Kirigami.Units.largeSpacing : 0
+                            Layout.fillWidth: true
+                            spacing: Kirigami.Units.smallSpacing
+
+                            QQC2.Label {
+                                Layout.fillWidth: true
+                                wrapMode: Text.NoWrap
+                                elide: Text.ElideRight
+                                text: mpris2Source.track(playerItem.source) || i18n("No media playing")
+                                textFormat: Text.PlainText
+                                font.pointSize: PlasmaCore.Theme.defaultFont.pointSize
+                                maximumLineCount: 1
+                                color: "white"
+                            }
+
+                            QQC2.Label {
+                                Layout.fillWidth: true
+                                wrapMode: Text.NoWrap
+                                elide: Text.ElideRight
+                                // if no artist is given, show player name instead
+                                text: mpris2Source.artist(playerItem.source) || modelData.application || ""
+                                textFormat: Text.PlainText
+                                font.pointSize: PlasmaCore.Theme.smallestFont.pointSize
+                                maximumLineCount: 1
+                                opacity: 0.9
+                                color: "white"
+                            }
+                        }
+
+                        PlasmaComponents3.ToolButton {
+                            Layout.fillHeight: true
+                            Layout.preferredWidth: height
+                            
+                            enabled: mpris2Source.canGoBack(playerItem.source)
+                            icon.name: LayoutMirroring.enabled ? "media-skip-forward" : "media-skip-backward"
+                            icon.width: PlasmaCore.Units.iconSizes.small
+                            icon.height: PlasmaCore.Units.iconSizes.small
+                            onClicked: mpris2Source.goPrevious(playerItem.source)
+                            visible: mpris2Source.canGoBack(playerItem.source) || mpris2Source.canGoNext(playerItem.source)
+                            Accessible.name: i18nd("plasma_lookandfeel_org.kde.lookandfeel", "Previous track")
+                        }
+
+                        PlasmaComponents3.ToolButton {
+                            Layout.fillHeight: true
+                            Layout.preferredWidth: height
+                            
+                            icon.name: mpris2Source.isPlaying(playerItem.source) ? "media-playback-pause" : "media-playback-start"
+                            icon.width: PlasmaCore.Units.iconSizes.small
+                            icon.height: PlasmaCore.Units.iconSizes.small
+                            onClicked: mpris2Source.playPause(playerItem.source)
+                            Accessible.name: i18nd("plasma_lookandfeel_org.kde.lookandfeel", "Play or Pause media")
+                        }
+
+                        PlasmaComponents3.ToolButton {
+                            Layout.fillHeight: true
+                            Layout.preferredWidth: height
+                            
+                            enabled: mpris2Source.canGoBack(playerItem.source)
+                            icon.name: LayoutMirroring.enabled ? "media-skip-backward" : "media-skip-forward"
+                            icon.width: PlasmaCore.Units.iconSizes.small
+                            icon.height: PlasmaCore.Units.iconSizes.small
+                            onClicked: mpris2Source.goNext(playerItem.source)
+                            visible: mpris2Source.canGoBack(playerItem.source) || mpris2Source.canGoNext(playerItem.source)
+                            Accessible.name: i18nd("plasma_lookandfeel_org.kde.lookandfeel", "Next track")
+                        }
+                    }
                 }
             }
-
-            PlasmaComponents3.ToolButton {
-                Layout.fillHeight: true
-                Layout.preferredWidth: height
-                
-                enabled: mpris2Source.canGoBack
-                icon.name: LayoutMirroring.enabled ? "media-skip-forward" : "media-skip-backward"
-                icon.width: PlasmaCore.Units.iconSizes.small
-                icon.height: PlasmaCore.Units.iconSizes.small
-                onClicked: mpris2Source.goPrevious()
-                visible: mpris2Source.canGoBack || mpris2Source.canGoNext
-                Accessible.name: i18nd("plasma_lookandfeel_org.kde.lookandfeel", "Previous track")
-            }
-
-            PlasmaComponents3.ToolButton {
-                Layout.fillHeight: true
-                Layout.preferredWidth: height
-                
-                icon.name: mpris2Source.playing ? "media-playback-pause" : "media-playback-start"
-                icon.width: PlasmaCore.Units.iconSizes.small
-                icon.height: PlasmaCore.Units.iconSizes.small
-                onClicked: mpris2Source.playPause()
-                Accessible.name: i18nd("plasma_lookandfeel_org.kde.lookandfeel", "Play or Pause media")
-            }
-
-            PlasmaComponents3.ToolButton {
-                Layout.fillHeight: true
-                Layout.preferredWidth: height
-                
-                enabled: mpris2Source.canGoNext
-                icon.name: LayoutMirroring.enabled ? "media-skip-backward" : "media-skip-forward"
-                icon.width: PlasmaCore.Units.iconSizes.small
-                icon.height: PlasmaCore.Units.iconSizes.small
-                onClicked: mpris2Source.goNext()
-                visible: mpris2Source.canGoBack || mpris2Source.canGoNext
-                Accessible.name: i18nd("plasma_lookandfeel_org.kde.lookandfeel", "Next track")
-            }
         }
     }
 }