From 05b93e1962dea0192e6f5a7c79bdc41cd1f6823a Mon Sep 17 00:00:00 2001 From: Mark Washeim Date: Fri, 2 Dec 2022 11:32:30 +0100 Subject: [PATCH] Forgot an important bit. --- qml/pages/components/MediaItem.qml | 323 +++++++++++++++++++++++++++++ 1 file changed, 323 insertions(+) create mode 100644 qml/pages/components/MediaItem.qml diff --git a/qml/pages/components/MediaItem.qml b/qml/pages/components/MediaItem.qml new file mode 100644 index 0000000..dc880e3 --- /dev/null +++ b/qml/pages/components/MediaItem.qml @@ -0,0 +1,323 @@ +import QtQuick 2.6 +import Sailfish.Silica 1.0 +import QtMultimedia 5.6 + + + +ListItem { + id: item + + property string url + property string mediaUrl + property string mimeType: 'audio/mp3' + property int length + + property bool _isAudio: mimeType.substring(0, 6) === "audio/" + property bool _isImage: mimeType.substring(0, 6) === "image/" + + function _toTime(s) + { + if (s < 0) + { + return "-"; + } + + s /= 1000; + var seconds = Math.floor(s) % 60; + s /= 60; + var minutes = Math.floor(s) % 60; + s /= 60; + var hours = Math.floor(s); + + if (seconds < 10) + { + seconds = "0" + seconds; + } + if (minutes < 10) + { + minutes = "0" + minutes; + } + + if (hours > 0) + { + return hours + ":" + minutes + ":" + seconds; + } + else + { + return minutes + ":" + seconds; + } + } + + /* Returns the filename of the given URL. + */ + function _urlFilename(url) { + var idx = url.lastIndexOf("="); + if (idx !== -1) { + return url.substring(idx + 1); + } + + idx = url.lastIndexOf("/"); + if (idx === url.length - 1) { + idx = url.substring(0, idx).lastIndexOf("/"); + } + + if (idx !== -1) { + return url.substring(idx + 1); + } + + return url; + } + + /* Returns the icon source for the given media. + */ + function _mediaIcon(url, type) { + if (type.substring(0, 6) === "image/") { + return url; + } else if (type.substring(0, 6) === "video/") { + return "image://theme/icon-l-play"; + } else { + return "image://theme/icon-m-other"; + } + } + + /* Returns a user-friendly media type name for the given MIME type. + */ + function _mediaTypeName(type) { + if (type.substring(0, 6) === "image/") { + return qsTr("Image"); + } else if (type.substring(0, 6) === "video/") { + return qsTr("Video"); + } else if (type === "application/pdf") { + return qsTr("PDF document"); + } else { + return type; + } + } + + onClicked: { + console.log('MediaItem') + console.log(url) + console.log(mediaUrl) + if (_isAudio) + { + if (audioProxy.playing) + { + audioProxy.pause(); + } + else + { + audioProxy.play(); + } + } + else if (_isImage) + { + var props = { + "url": item.url, + "name": _urlFilename(item.url) + } + pageStack.push(Qt.resolvedUrl("ImagePage.qml"), props); + } + else + { + Qt.openUrlExternally(item.url); + } + } + + QtObject { + id: audioProxy + + property bool _active: audioPlayer.source == source + property bool playing: _active ? audioPlayer.playing + : false + property bool paused: _active ? audioPlayer.paused + : false + property real duration: _active ? audioPlayer.duration + : -1 + property real position: _active ? audioPlayer.position + : 0 + + property string source: _isAudio ? item.url : "" + + property Timer _seeker: Timer { + interval: 50 + + onTriggered: { + if (audioProxy._active) + { + if (! audioPlayer.playing) + { + console.log("Stream is not ready. Deferring seek operation.") + _seeker.start(); + } + else + { + audioPlayer.seek(Math.max(0, database.audioBookmark(audioProxy.source) - 3000)); + } + } + } + } + + function play() + { + if (_active) + { + audioPlayer.play(); + } + else + { + // save bookmark before switching to another podcast + if (audioPlayer.playing) + { + database.setAudioBookmark(audioPlayer.source, + audioPlayer.position); + } + + audioPlayer.stop(); + audioPlayer.source = source; + audioPlayer.play(); + _seeker.start(); + } + } + + function pause() + { + if (_active) + { + //database.setAudioBookmark(source, audioPlayer.position); + audioPlayer.pause(); + } + } + + function seek(value) + { + if (_active) audioPlayer.seek(value); + } + + onPositionChanged: { + if (_active) + { + if (! slider.down) + { + slider.value = position; + } + } + } + + onDurationChanged: { + if (_active) + { + slider.maximumValue = duration; + } + } + } + Audio { + id: audioPlayer + property bool playing: playbackState === Audio.PlayingState + property bool paused: playbackState === Audio.PausedState + autoLoad: false + autoPlay: false + } + Image { + id: mediaIcon + + anchors.left: parent.left + anchors.leftMargin: Theme.paddingLarge + anchors.rightMargin: Theme.paddingMedium + width: height + height: parent.height + asynchronous: true + smooth: true + fillMode: Image.PreserveAspectCrop + sourceSize.width: width * 2 + sourceSize.height: height * 2 + source: ! _isAudio ? _mediaIcon(item.url, item.mimeType) + : audioProxy.playing ? "image://theme/icon-l-pause" + : "image://theme/icon-l-play" + clip: true + + BusyIndicator { + running: parent.status === Image.Loading + anchors.centerIn: parent + size: BusyIndicatorSize.Medium + } + } + + Label { + id: mediaNameLabel + + anchors.left: mediaIcon.right + anchors.right: parent.right + anchors.leftMargin: Theme.paddingLarge + anchors.rightMargin: Theme.paddingLarge + truncationMode: TruncationMode.Fade + font.pixelSize: Theme.fontSizeSmall + color: Theme.primaryColor + text: _urlFilename(item.url) + } + Label { + id: label1 + anchors.top: mediaNameLabel.bottom + anchors.left: mediaNameLabel.left + font.pixelSize: Theme.fontSizeExtraSmall + color: Theme.secondaryColor + text: ! slider.visible ? _mediaTypeName(item.mimeType) + : audioProxy.playing ? _toTime(slider.sliderValue) + : _toTime(database.audioBookmark(audioProxy.source)) + + } + Label { + id: label2 + anchors.top: mediaNameLabel.bottom + anchors.right: parent.right + anchors.rightMargin: Theme.paddingLarge + font.pixelSize: Theme.fontSizeExtraSmall + color: Theme.secondaryColor + text: slider.visible ? _toTime(audioProxy.duration) + : item.length >= 0 ? Format.formatFileSize(item.length) + : "" + } + + Slider { + id: slider + + visible: _isAudio + enabled: audioProxy.playing || audioProxy.paused + + anchors.left: label1.right + anchors.right: label2.left + anchors.verticalCenter: label1.verticalCenter + + leftMargin: Theme.paddingSmall + rightMargin: Theme.paddingSmall + height: Theme.itemSizeSmall / 3 + + handleVisible: false + minimumValue: 0 + + onDownChanged: { + if (! down) + { + audioProxy.seek(sliderValue); + if (! audioProxy.playing) + { + audioProxy.play(); + } + } + } + + }//Slider + IconButton { + id: mediaDlBtn + icon.source: "image://theme/icon-m-cloud-download" + anchors { + right: parent.right + rightMargin: Theme.horizontalPageMargin + bottom: parent.bottom + bottomMargin: Theme.horizontalPageMargin + } + onClicked: { + var filename = url.split("/") + FileDownloader.downloadFile(url, filename[filename.length-1]) + } + } +}