d3v1l/matrixion
1
0
Fork 0
mirror of https://github.com/Nheko-Reborn/nheko.git synced 2024-11-25 20:48:52 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add progress bar to audio messages

Browse source
This commit is contained in:
Nicolas Werner 2019-10-06 00:27:18 +02:00
parent ea98d7b2ae
commit 8a511a7862
1 changed files with 113 additions and 71 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

184
resources/qml/delegates/AudioMessage.qml
View file

@ -1,96 +1,138 @@
import QtQuick 2.6 import QtQuick 2.6
import QtQuick.Layouts 1.6 import QtQuick.Layouts 1.6
import QtMultimedia 5.12 import QtQuick.Controls 2.5
import QtMultimedia 5.6
Rectangle { Rectangle {
radius: 10 radius: 10
color: colors.dark color: colors.dark
height: row.height + 24 height: content.height + 24
width: parent.width width: parent.width
RowLayout { ColumnLayout {
id: row id: content
anchors.centerIn: parent
width: parent.width - 24 width: parent.width - 24
anchors.centerIn: parent
spacing: 15 RowLayout {
Text {
Rectangle { id: positionText
id: button text: "--:--:--"
color: colors.light color: colors.text
radius: 22
height: 44
width: 44
Image {
id: img
anchors.centerIn: parent
source: "qrc:/icons/icons/ui/arrow-pointing-down.png"
fillMode: Image.Pad
} }
MouseArea { Slider {
anchors.fill: parent Layout.fillWidth: true
onClicked: { id: progress
switch (button.state) { value: media.position
case "": timelineManager.cacheMedia(eventData.url, eventData.mimetype); break; from: 0
case "stopped": to: media.duration
audio.play(); console.log("play");
onMoved: media.seek(value)
//indeterminate: true
function updatePositionTexts() {
function formatTime(date) {
var hh = date.getUTCHours();
var mm = date.getUTCMinutes();
var ss = date.getSeconds();
if (hh < 10) {hh = "0"+hh;}
if (mm < 10) {mm = "0"+mm;}
if (ss < 10) {ss = "0"+ss;}
return hh+":"+mm+":"+ss;
}
positionText.text = formatTime(new Date(media.position))
durationText.text = formatTime(new Date(media.duration))
}
onValueChanged: updatePositionTexts()
}
Text {
id: durationText
text: "--:--:--"
color: colors.text
}
}
RowLayout {
width: parent.width
spacing: 15
Rectangle {
id: button
color: colors.light
radius: 22
height: 44
width: 44
Image {
id: img
anchors.centerIn: parent
source: "qrc:/icons/icons/ui/arrow-pointing-down.png"
fillMode: Image.Pad
}
MouseArea {
anchors.fill: parent
onClicked: {
switch (button.state) {
case "": timelineManager.cacheMedia(eventData.url, eventData.mimetype); break;
case "stopped":
media.play(); console.log("play");
button.state = "playing" button.state = "playing"
break break
case "playing": case "playing":
audio.pause(); console.log("pause"); media.pause(); console.log("pause");
button.state = "stopped" button.state = "stopped"
break break
}
}
cursorShape: Qt.PointingHandCursor
}
MediaPlayer {
id: media
onError: console.log(errorString)
onStatusChanged: if(status == MediaPlayer.Loaded) progress.updatePositionTexts()
}
Connections {
target: timelineManager
onMediaCached: {
if (mxcUrl == eventData.url) {
media.source = "file://" + cacheUrl
button.state = "stopped"
console.log("media loaded: " + mxcUrl + " at " + cacheUrl)
}
console.log("media cached: " + mxcUrl + " at " + cacheUrl)
} }
} }
cursorShape: Qt.PointingHandCursor
}
MediaPlayer {
id: audio
onError: console.log(errorString)
}
Connections { states: [
target: timelineManager State {
onMediaCached: { name: "stopped"
if (mxcUrl == eventData.url) { PropertyChanges { target: img; source: "qrc:/icons/icons/ui/play-sign.png" }
audio.source = "file://" + cacheUrl },
button.state = "stopped" State {
console.log("media loaded: " + mxcUrl + " at " + cacheUrl) name: "playing"
PropertyChanges { target: img; source: "qrc:/icons/icons/ui/pause-symbol.png" }
} }
console.log("media cached: " + mxcUrl + " at " + cacheUrl) ]
}
} }
ColumnLayout {
id: col
states: [ Text {
State { Layout.fillWidth: true
name: "stopped" text: eventData.body
PropertyChanges { target: img; source: "qrc:/icons/icons/ui/play-sign.png" } textFormat: Text.PlainText
}, elide: Text.ElideRight
State { color: colors.text
name: "playing" }
PropertyChanges { target: img; source: "qrc:/icons/icons/ui/pause-symbol.png" } Text {
Layout.fillWidth: true
text: eventData.filesize
textFormat: Text.PlainText
elide: Text.ElideRight
color: colors.text
} }
]
}
ColumnLayout {
id: col
Text {
Layout.fillWidth: true
text: eventData.body
textFormat: Text.PlainText
elide: Text.ElideRight
color: colors.text
}
Text {
Layout.fillWidth: true
text: eventData.filesize
textFormat: Text.PlainText
elide: Text.ElideRight
color: colors.text
} }
} }
} }