Add a progress slider to mpris remote in app

Summary:
The progress slider can be mooved to seek through the song and
will display song length and current position on sides.

Reviewers: #kde_connect, nicolasfella

Reviewed By: #kde_connect, nicolasfella

Subscribers: nicolasfella, kdeconnect

Tags: #kde_connect

Differential Revision: https://phabricator.kde.org/D17417
This commit is contained in:
Billy Laws 2018-12-18 02:50:46 +01:00 committed by Nicolas Fella
parent 5b213e6144
commit 27f47ce8d4

View file

@ -28,10 +28,17 @@ Kirigami.Page
id: root
property QtObject pluginInterface
property bool muted: false
property bool updatePositionSlider: true
property int volumeUnmuted
property var volume: pluginInterface.volume
property var lastPosition: pluginInterface.position
property date lastPositionTime: new Date()
title: i18n("Multimedia Controls")
onLastPositionChanged: {
lastPositionTime = new Date();
}
onVolumeChanged: {
if (muted && volume != 0) {
toggleMute()
@ -52,12 +59,30 @@ Kirigami.Page
}
}
function toggleMute() {
function toggleMute()
{
muted = !muted
root.pluginInterface.volume = muted ? 0 : volumeUnmuted
muteButton.icon.name = muted ? "audio-volume-muted" : soundState(root.pluginInterface.volume)
}
function msToTime(currentTime, totalTime)
{
if (totalTime.getHours() == 2) {
// Skip a day ahead as Date type's minimum is 1am on the 1st of January and can't go lower
currentTime.setDate(2)
currentTime.setHours(currentTime.getHours() - 1)
return currentTime.toLocaleTimeString(Qt.locale(),"hh:mm:ss")
} else {
return currentTime.toLocaleTimeString(Qt.locale(),"mm:ss")
}
}
Connections {
target: root.pluginInterface
onNowPlayingChanged: positionSlider.value = lastPosition
}
Label {
id: noPlayersText
text: i18n("No players available")
@ -130,6 +155,36 @@ Kirigami.Page
onClicked: root.pluginInterface.sendAction("Next")
}
}
RowLayout {
Layout.fillWidth: true
Label {
text: msToTime(new Date(positionSlider.value), new Date(root.pluginInterface.length))
}
Slider {
id: positionSlider
to: root.pluginInterface.length
Layout.fillWidth: true
Timer {
id: positionUpdateTimer
interval: 1000
repeat: true
running: updatePositionSlider && root.pluginInterface.isPlaying
onTriggered: positionSlider.value = lastPosition + (new Date().getTime() - lastPositionTime.getTime())
}
onPressedChanged: {
if (pressed) {
updatePositionSlider = false
} else {
updatePositionSlider = true
root.pluginInterface.position = value
}
}
}
Label {
text: msToTime(new Date(root.pluginInterface.length), new Date(root.pluginInterface.length))
}
}
RowLayout {
Layout.fillWidth: true
Button {