From 757327ceacd1aa8be82ce2439b74f81baa0caf5e Mon Sep 17 00:00:00 2001 From: Henk Kalkwater Date: Mon, 23 Aug 2021 01:53:20 +0200 Subject: [PATCH] AN attempt to get covers to work again Covers should now work when at least the playbackManager is playing. Covers based on the currently displayed item on the page does not work yet. The CoverPage has been revamped to use 1 model and 1 PathView to animate the items for cleaner code. --- sailfish/qml/cover/CoverPage.qml | 220 ++++++++---------- sailfish/qml/cover/PosterCover.qml | 7 +- sailfish/qml/cover/VideoCover.qml | 3 +- sailfish/qml/harbour-sailfin.qml | 29 ++- sailfish/qml/pages/MainPage.qml | 2 +- .../qml/pages/itemdetails/BaseDetailPage.qml | 2 +- 6 files changed, 118 insertions(+), 145 deletions(-) diff --git a/sailfish/qml/cover/CoverPage.qml b/sailfish/qml/cover/CoverPage.qml index d0ad20e..5119e50 100644 --- a/sailfish/qml/cover/CoverPage.qml +++ b/sailfish/qml/cover/CoverPage.qml @@ -26,149 +26,115 @@ import "../Utils.js" as Utils CoverBackground { id: cover - Label { - id: label + readonly property int rowCount: 8 + readonly property real rowOffset: ((rowCount - 1) * 0.5) + readonly property real rowHeight: height / 2 + readonly property real bottomOffset: width - rowHeight + readonly property bool onMainScreen: appWindow.itemData === null + readonly property bool itemId: appWindow.itemData.jellyfinId || appWindow.pageStack.currentPage.itemId + readonly property bool hasParent: !appWindow.itemData !== null && appWindow.itemData.jellyfinId.length !== 0 + + J.ItemModel { + id: randomItems + loader: J.UserItemsLoader { + id: randomItemsLoader + apiClient: appWindow.apiClient + limit: cover.rowCount * 2 + imageTypes: [J.ImageType.Primary] + sortBy: "IsFavoriteOrLiked,Random" + recursive: false + parentId: hasParent ? itemId : "" + autoReload: false + onParentIdChanged: { + if (parentId.length > 0) reload() + } + } + } + PathView { + id: pathView + model: randomItems + path: Path { + startX: -rowHeight * rowOffset + startY: rowHeight * 0.5 + + PathLine { + x: rowHeight * rowOffset + y: rowHeight * 0.5 + } + PathPercent { + value: 0.5 + } + PathLine { + x: rowHeight * rowOffset + bottomOffset + y: rowHeight * 1.5 + } + PathPercent { + value: 0.5 + } + PathLine { + x: -rowHeight * rowOffset + bottomOffset + y: rowHeight * 1.5 + } + PathPercent { + value: 1 + } + PathLine { + x: -rowHeight * rowOffset + y: rowHeight * 0.5 + } + } + delegate: RemoteImage { + height: rowHeight + width: height + source: model.jellyfinId + ? Utils.itemModelImageUrl(appWindow.apiClient.baseUrl, model.jellyfinId, model.imageTags["Primary"], "Primary", {"maxHeight": row1.height}) + : "" + blurhash: model.jellyfinId + ? model.imageBlurHashes["Primary"][model.imageTags["Primary"]] + : "" + fillMode: Image.PreserveAspectCrop + } + } + + Rectangle { + anchors.fill: parent + color: Theme.rgba(Theme.overlayBackgroundColor, Theme.opacityHigh) + } + + Column { anchors.centerIn: parent - text: qsTr("Sailfin") - } - property int rowCount: 8 - - J.ItemModel { - id: randomItems1 - /*loader: J.UserItemsLoader { - apiClient: appWindow.apiClient - limit: cover.rowCount - imageTypes: ["Primary"] - sortBy: ["IsFavoriteOrLiked", "Random"] - recursive: true - parentId: appWindow.collectionId - autoReload: false - }*/ - //Component.onCompleted: reload() - } - - J.ItemModel { - id: randomItems2 - /*loader: J.UserItemsLoader { - apiClient: appWindow.apiClient - limit: cover.rowCount - imageTypes: ["Primary"] - sortBy: ["IsFavoriteOrLiked", "Random"] - recursive: true - parentId: appWindow.collectionId - autoReload: false - }*/ - //Component.onCompleted: reload() - } - - Row { - id: row1 - property bool movingRight: true - property int moveCount: 0 - anchors.top: parent.top - anchors.left: parent.left - anchors.right: parent.right - transform: [ - Translate { - x: -row1.height// + (row1.width - row1.height) / 2; - }, - Translate { - id: row1Translate; - Behavior on x { NumberAnimation { duration: 500; easing.type: Easing.InOutQuad }} - } - ] - height: parent.height / 2 width: parent.width - Repeater { - model: randomItems1 - RemoteImage { - clip: true - height: row1.height - width: height - source: model.id ? Utils.itemModelImageUrl(appWindow.apiClient.baseUrl, model.id, model.imageTags.primary, "Primary", {"maxHeight": row1.height}) - : "" - fillMode: Image.PreserveAspectCrop - } + Image { + anchors.horizontalCenter: parent.horizontalCenter + source: Qt.resolvedUrl("../icon.png") + width: parent.width / 3 + height: width } - function move() { - if (movingRight) { - row1Translate.x -= row1.height - moveCount++; - } else { - row1Translate.x += row1.height - moveCount--; - } - if (moveCount == 0) movingRight = true; - if (moveCount == rowCount - 3) movingRight = false; - } - } - - Row { - id: row2 - property bool movingRight: false - property int moveCount: rowCount - 3 - anchors.bottom: parent.bottom - - anchors.left: parent.left - anchors.right: parent.right - transform: [ - Translate { - x: -row2.height * (rowCount - 2) + (row2.width - row2.height); - }, - Translate { - id: row2Translate; - Behavior on x { NumberAnimation { duration: 500; easing.type: Easing.InOutQuad }} - } - ] - height: parent.height / 2 - width: parent.width - Repeater { - model: randomItems2 - RemoteImage { - clip: true - height: row2.height - width: height - source: Utils.itemModelImageUrl(appWindow.apiClient.baseUrl, model.id, model.imageTags.primary, "Primary", {"maxHeight": row1.height}) - fillMode: Image.PreserveAspectCrop - } - } - - function move() { - if (movingRight) { - row2Translate.x -= row1.height - moveCount++; - } else { - row2Translate.x += row1.height - moveCount--; - } - if (moveCount == 0) movingRight = true; - if (moveCount == rowCount - 3) movingRight = false; + Label { + anchors.horizontalCenter: parent.horizontalCenter + text: qsTr("Sailfin") + font.bold: true } } Connections { - target: appWindow - onCollectionIdChanged: { - randomItems1.parentId = collectionId - randomItems2.parentId = collectionId - randomItems1.reload() - randomItems2.reload() + target: appWindow.pageStack + onCurrentPageChanged: { + console.log("Reloading cover collection") + /*randomItems1Loader.parentId = Qt.binding(function() { return onMainScreen ? "" : appWindow.itemData.jellyfinId; }) + randomItems2Loader.parentId = Qt.binding(function() { return onMainScreen ? "" : appWindow.itemData.jellyfinId; })*/ + //randomItems1.reload() + //randomItems2.reload() } } Timer { - property bool odd: false running: true interval: 5000 repeat: true onTriggered: { - if (odd) { - row1.move() - } else { - row2.move() - } - odd = !odd + pathView.incrementCurrentIndex() } } diff --git a/sailfish/qml/cover/PosterCover.qml b/sailfish/qml/cover/PosterCover.qml index e40bf1f..72e3fa4 100644 --- a/sailfish/qml/cover/PosterCover.qml +++ b/sailfish/qml/cover/PosterCover.qml @@ -20,16 +20,17 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA import QtQuick 2.6 import Sailfish.Silica 1.0 -import nl.netsoj.chris.Jellyfin 1.0 +import nl.netsoj.chris.Jellyfin 1.0 as J import "../components" import ".." CoverBackground { - property JellyfinItem mData: appWindow.itemData + // Due QTBUG-10822, declarartions such as `property J.Item foo` are not possible. + property var mData: appWindow.itemData RemoteImage { anchors.fill: parent - source: mData == null ? "" : Utils.itemImageUrl(ApiClient.baseUrl, mData, "Primary", {"maxWidth": parent.width}) + source: mData === null ? "" : Utils.itemImageUrl(appWindow.apiClient.baseUrl, mData, "Primary", {"maxWidth": parent.width}) fillMode: Image.PreserveAspectCrop onSourceChanged: console.log(source) } diff --git a/sailfish/qml/cover/VideoCover.qml b/sailfish/qml/cover/VideoCover.qml index 49c4304..7dc3fe1 100644 --- a/sailfish/qml/cover/VideoCover.qml +++ b/sailfish/qml/cover/VideoCover.qml @@ -26,8 +26,7 @@ import nl.netsoj.chris.Jellyfin 1.0 import "../components" PosterCover { - readonly property MediaPlayer player: appWindow.mediaPlayer - property var mData: appWindow.itemData + readonly property var player: appWindow.playbackManager // Wanted to display the currently running move on here, but it's hard :/ /*Rectangle { diff --git a/sailfish/qml/harbour-sailfin.qml b/sailfish/qml/harbour-sailfin.qml index 3bdb0d1..e3091aa 100644 --- a/sailfish/qml/harbour-sailfin.qml +++ b/sailfish/qml/harbour-sailfin.qml @@ -38,9 +38,7 @@ ApplicationWindow { readonly property ApiClient apiClient: _apiClient // Due QTBUG-10822, declarartions such as `property J.Item foo` are not possible. - property var itemData - // Id of the collection currently browsing. For use on the cover. - property string collectionId + property var itemData: pageStack.currentPage.itemData // Bad way to implement settings, but it'll do for now. property bool showDebugInfo: true @@ -68,19 +66,17 @@ ApplicationWindow { } } } - cover: CoverBackground {CoverPlaceholder { icon.source: "icon.png"; text: "Sailfin"}} - /*{ + //cover: CoverBackground {CoverPlaceholder { icon.source: "icon.png"; text: "Sailfin"}} + cover: { // Disabled due to buggy Loader behaviour if ([MediaPlayer.NoMedia, MediaPlayer.InvalidMedia, MediaPlayer.UnknownStatus].indexOf(_playbackManager.mediaStatus) >= 0) { - if (itemData) { - return Qt.resolvedUrl("cover/PosterCover.qml") - } else { - return Qt.resolvedUrl("cover/CoverPage.qml") - } + return Qt.resolvedUrl("cover/CoverPage.qml") } else if (playbackManager.hasVideo){ return Qt.resolvedUrl("cover/VideoCover.qml") + } else { + return Qt.resolvedUrl("cover/CoverPage.qml") } - }*/ + } Notification { id: errorNotification @@ -100,6 +96,17 @@ ApplicationWindow { autoOpen: true } + Connections { + target: pageStack + onCurrentPageChanged: { + if ("itemData" in pageStack.currentPage) { + appWindow.itemData = pageStack.currentPage.itemData + } else { + appWindow.itemData = null + } + } + } + // Keep the sytem alive while playing media KeepAlive { enabled: playbackManager.playbackState === MediaPlayer.PlayingState diff --git a/sailfish/qml/pages/MainPage.qml b/sailfish/qml/pages/MainPage.qml index bf9113c..d1eaaff 100644 --- a/sailfish/qml/pages/MainPage.qml +++ b/sailfish/qml/pages/MainPage.qml @@ -138,7 +138,7 @@ Page { } } Connections { - target: mediaLibraryModel + target: mediaLibraryLoader onReady: userItemModel.reload() } } diff --git a/sailfish/qml/pages/itemdetails/BaseDetailPage.qml b/sailfish/qml/pages/itemdetails/BaseDetailPage.qml index c696f5a..0d3c3c5 100644 --- a/sailfish/qml/pages/itemdetails/BaseDetailPage.qml +++ b/sailfish/qml/pages/itemdetails/BaseDetailPage.qml @@ -103,7 +103,7 @@ Page { if (status === PageStatus.Active) { console.log("Page ready, ItemID: ", itemId, ", UserID: ", apiClient.userId) jItemLoader.autoReload = true - appWindow.itemData = jItemLoader.data + //appWindow.itemData = jItemLoader.data } } }