1
0
mirror of https://gitlab.com/kelteseth/ScreenPlay.git synced 2024-11-06 19:12:30 +01:00
ScreenPlay/ScreenPlayWorkshop/qml/SteamWorkshopStartPage.qml
2023-06-02 10:19:12 +02:00

573 lines
21 KiB
QML

import QtQuick
import QtQuick.Controls
import QtQuick.Controls.Material
import Qt5Compat.GraphicalEffects
import QtQuick.Layouts
import ScreenPlayWorkshop
import WorkshopEnums
import "upload/"
Item {
id: root
property StackView stackView
property ScreenPlayWorkshop screenPlayWorkshop
property SteamWorkshop steamWorkshop
property Background background
StackView.onActivated: {
root.state = "searching";
root.steamWorkshop.searchWorkshopByText("");
}
onVisibleChanged: {
if (!visible)
sidebar.close();
}
MouseArea {
id: rootMouseArea
enabled: false
z: enabled ? 10 : 0
cursorShape: enabled ? Qt.WaitCursor : Qt.ArrowCursor
acceptedButtons: Qt.NoButton
propagateComposedEvents: true
anchors.fill: parent
preventStealing: true
}
Connections {
id: searchConnection
target: root.steamWorkshop
function onWorkshopBannerCompleted() {
bannerTxt.text = root.steamWorkshop.workshopListModel.getBannerText();
background.backgroundImage = root.steamWorkshop.workshopListModel.getBannerUrl();
banner.bannerPublishedFileID = root.steamWorkshop.workshopListModel.getBannerID();
bannerTxtUnderline.numberSubscriber = root.steamWorkshop.workshopListModel.getBannerAmountSubscriber();
}
function onWorkshopSearchCompleted(itemCount) {
root.state = "";
}
}
PopupSteamWorkshopAgreement {
id: popupSteamWorkshopAgreement
}
Connections {
function onUserNeedsToAcceptWorkshopLegalAgreement() {
popupSteamWorkshopAgreement.open();
}
target: root.steamWorkshop.uploadListModel
}
Flickable {
id: scrollView
maximumFlickVelocity: 3000
flickDeceleration: 7500
anchors.fill: parent
contentWidth: parent.width
contentHeight: gridView.height + header.height + 150
onContentYChanged: {
// Calculate parallax scrolling
if (contentY >= 0)
background.imageOffsetTop = (contentY * -0.4);
else
background.imageOffsetTop = 0;
}
Item {
id: header
height: 450
anchors {
top: parent.top
right: parent.right
left: parent.left
}
Item {
id: banner
property var bannerPublishedFileID
height: header.height
anchors {
top: parent.top
right: parent.right
left: parent.left
}
Image {
id: bannerImg2
asynchronous: true
fillMode: Image.PreserveAspectCrop
anchors {
right: parent.right
left: parent.left
bottom: parent.bottom
}
}
ColumnLayout {
anchors {
top: parent.top
topMargin: 100
right: parent.right
left: parent.left
leftMargin: 100
}
spacing: 10
HeaderLabel {
id: bannerTxtUnderline
property int numberSubscriber: 0
text: numberSubscriber + " SUBSCRIBED TO:"
font.pointSize: 12
}
HeaderLabel {
id: bannerTxt
font.pointSize: 42
}
RowLayout {
spacing: 10
Button {
text: qsTr("Download now!")
Material.accent: Material.color(Material.Orange)
highlighted: true
icon.source: "qrc:/qml/ScreenPlayWorkshop/assets/icons/icon_download.svg"
onClicked: {
text = qsTr("Downloading...");
root.steamWorkshop.subscribeItem(root.steamWorkshop.workshopListModel.getBannerID());
}
}
RowLayout {
spacing: 20
Button {
text: qsTr("Details")
Material.accent: Material.color(Material.Orange)
highlighted: true
//icon.source: "qrc:/qml/ScreenPlayWorkshop/assets/icons/icon_info.svg"
visible: false
onClicked: {
sidebar.setWorkshopItem(publishedFileID, imgUrl, additionalPreviewUrl, subscriptionCount);
}
}
ToolButton {
onClicked: Qt.openUrlExternally("steam://url/CommunityFilePage/" + banner.bannerPublishedFileID)
icon.source: "qrc:/qml/ScreenPlayWorkshop/assets/icons/icon_open_in_new.svg"
}
}
}
}
}
}
GridView {
id: gridView
cellWidth: 330
cellHeight: 190
height: contentHeight
interactive: false
model: root.steamWorkshop.workshopListModel
boundsBehavior: Flickable.StopAtBounds
anchors {
top: header.bottom
topMargin: 100
left: parent.left
right: parent.right
leftMargin: 45
}
header: Item {
property alias searchField: tiSearch
height: 90
width: gridView.width - gridView.anchors.leftMargin
Rectangle {
color: Material.backgroundColor
radius: 3
width: parent.width - 10
height: 70
clip: true
anchors.centerIn: parent
SteamImage {
id: avatar
width: 70
height: 70
Component.onCompleted: {
steamWorkshop.steamAccount.loadAvatar();
}
anchors {
left: parent.left
verticalCenter: parent.verticalCenter
}
Connections {
function onAvatarChanged(_avatar) {
avatar.setImage(_avatar);
avatarPlaceholder.opacity = 0;
}
target: steamWorkshop.steamAccount
}
}
Image {
id: avatarPlaceholder
anchors.fill: avatar
source: "qrc:/qml/ScreenPlayWorkshop/assets/images/steam_default_avatar.png"
}
Button {
id: btnSteamProfile
objectName: "btnSteamProfile"
anchors {
verticalCenter: parent.verticalCenter
left: avatar.right
leftMargin: 20
}
text: qsTr("Profile")
icon.source: "qrc:/qml/ScreenPlayWorkshop/assets/icons/icon_account_circle.svg"
onClicked: {
stackView.push("qrc:/qml/ScreenPlayWorkshop/qml/SteamProfile.qml", {
"screenPlayWorkshop": root.screenPlayWorkshop,
"steamWorkshop": root.steamWorkshop,
"stackView": root.stackView
});
}
}
Button {
id: btnSteamUpload
anchors {
verticalCenter: parent.verticalCenter
left: btnSteamProfile.right
leftMargin: 20
}
text: qsTr("Upload")
icon.source: "qrc:/qml/ScreenPlayWorkshop/assets/icons/icon_file_upload.svg"
onClicked: {
stackView.push("qrc:/qml/ScreenPlayWorkshop/qml/upload/UploadProject.qml", {
"screenPlayWorkshop": root.screenPlayWorkshop,
"steamWorkshop": root.steamWorkshop,
"stackView": root.stackView
});
}
}
Item {
id: searchWrapper
height: 50
anchors {
left: btnSteamUpload.right
right: wrapperRight.left
rightMargin: 20
leftMargin: 20
verticalCenter: parent.verticalCenter
}
TextField {
id: tiSearch
placeholderTextColor: Material.secondaryTextColor
placeholderText: qsTr("Search for Wallpaper and Widgets...")
Keys.onReturnPressed: event => {
event.accepted = true;
tiSearch.searchWorkshop();
}
// WORKAROUND:
// onEditingFinished causes internal qml layout crash in Qt 6.4
Timer {
id: timer
interval: 300
repeat: false
onTriggered: tiSearch.searchWorkshop()
}
onTextEdited: timer.restart()
function searchWorkshop() {
if (root.state === "searching") {
print("SEARCHING");
return;
}
root.state = "searching";
print("EDITING FINISHED", root.state);
if (tiSearch.text === "") {
Qt.callLater(function () {
root.steamWorkshop.searchWorkshop(SteamEnums.K_EUGCQuery_RankedByTrend);
});
return;
}
Qt.callLater(function () {
root.steamWorkshop.searchWorkshopByText(tiSearch.text);
});
}
anchors {
top: parent.top
right: parent.right
bottom: parent.bottom
left: parent.left
leftMargin: 20
}
}
ToolButton {
property bool hasContent: tiSearch.text.length > 0
icon.source: hasContent ? "qrc:/qml/ScreenPlayWorkshop/assets/icons/icon_close.svg" : "qrc:/qml/ScreenPlayWorkshop/assets/icons/icon_search.svg"
onClicked: {
if (hasContent) {
root.state = "searching";
tiSearch.clear();
Qt.callLater(function () {
root.steamWorkshop.searchWorkshop(SteamEnums.K_EUGCQuery_RankedByTrend);
});
return;
}
root.state = "searching";
Qt.callLater(function () {
root.steamWorkshop.searchWorkshopByText(tiSearch.text);
});
}
icon.width: 20
icon.height: 20
anchors {
right: parent.right
rightMargin: 0
bottom: parent.bottom
bottomMargin: 0
}
}
}
RowLayout {
id: wrapperRight
spacing: 20
anchors {
right: cbQuerySort.left
rightMargin: 20
verticalCenter: parent.verticalCenter
}
Item {
Layout.fillWidth: true
Layout.fillHeight: true
}
Button {
text: qsTr("Open Workshop in Steam")
font.capitalization: Font.Capitalize
onClicked: Qt.openUrlExternally("steam://url/SteamWorkshopPage/672870")
icon.source: "qrc:/qml/ScreenPlayWorkshop/assets/icons/icon_steam.svg"
icon.width: 18
icon.height: 18
height: cbQuerySort.height
}
}
ComboBox {
id: cbQuerySort
width: 220
height: searchWrapper.height
textRole: "text"
valueRole: "value"
currentIndex: 2
Layout.preferredHeight: searchWrapper.height
model: [{
"value": SteamEnums.k_EUGCQuery_RankedByVote,
"text": qsTr("Ranked By Vote")
}, {
"value": SteamEnums.K_EUGCQuery_RankedByPublicationDate,
"text": qsTr("Publication Date")
}, {
"value": SteamEnums.K_EUGCQuery_RankedByTrend,
"text": qsTr("Ranked By Trend")
}, {
"value": SteamEnums.K_EUGCQuery_FavoritedByFriendsRankedByPublicationDate,
"text": qsTr("Favorited By Friends")
}, {
"value": SteamEnums.K_EUGCQuery_CreatedByFriendsRankedByPublicationDate,
"text": qsTr("Created By Friends")
}, {
"value": SteamEnums.K_EUGCQuery_CreatedByFollowedUsersRankedByPublicationDate,
"text": qsTr("Created By Followed Users")
}, {
"value": SteamEnums.K_EUGCQuery_NotYetRated,
"text": qsTr("Not Yet Rated")
}, {
"value": SteamEnums.K_EUGCQuery_RankedByTotalVotesAsc,
"text": qsTr("Total VotesAsc")
}, {
"value": SteamEnums.K_EUGCQuery_RankedByVotesUp,
"text": qsTr("Votes Up")
}, {
"value": SteamEnums.K_EUGCQuery_RankedByTotalUniqueSubscriptions,
"text": qsTr("Total Unique Subscriptions")
}]
onActivated: {
root.state = "searching";
root.steamWorkshop.searchWorkshop(cbQuerySort.currentValue);
}
anchors {
verticalCenter: parent.verticalCenter
right: parent.right
rightMargin: 10
}
}
}
}
delegate: WorkshopItem {
imgUrl: m_workshopPreview
name: m_workshopTitle
publishedFileID: m_publishedFileID
additionalPreviewUrl: m_additionalPreviewUrl
subscriptionCount: m_subscriptionCount
itemIndex: index
steamWorkshop: root.steamWorkshop
onClicked: {
sidebar.setWorkshopItem(m_publishedFileID, m_workshopPreview, additionalPreviewUrl, subscriptionCount);
}
}
ScrollBar.vertical: ScrollBar {
id: workshopScrollBar
snapMode: ScrollBar.SnapOnRelease
}
footer: RowLayout {
height: 150
width: parent.width
spacing: 10
Item {
Layout.fillWidth: true
}
Button {
id: btnBack
Layout.alignment: Qt.AlignVCenter
text: qsTr("Back")
enabled: root.steamWorkshop.workshopListModel.currentPage > 1
onClicked: {
root.state = "searching";
root.steamWorkshop.workshopListModel.setCurrentPage(root.steamWorkshop.workshopListModel.currentPage - 1);
root.steamWorkshop.searchWorkshop(SteamEnums.K_EUGCQuery_RankedByTrend);
}
}
Text {
id: txtPage
Layout.alignment: Qt.AlignVCenter
text: root.steamWorkshop.workshopListModel.currentPage + "/" + root.steamWorkshop.workshopListModel.pages
color: Material.primaryTextColor
}
Button {
id: btnForward
Layout.alignment: Qt.AlignVCenter
text: qsTr("Forward")
enabled: root.steamWorkshop.workshopListModel.currentPage <= root.steamWorkshop.workshopListModel.pages - 1
onClicked: {
root.state = "searching";
root.steamWorkshop.workshopListModel.setCurrentPage(root.steamWorkshop.workshopListModel.currentPage + 1);
root.steamWorkshop.searchWorkshop(SteamEnums.K_EUGCQuery_RankedByTrend);
}
}
Item {
Layout.fillWidth: true
}
}
}
Behavior on contentHeight {
PropertyAnimation {
duration: 400
property: "contentHeight"
easing.type: Easing.InOutQuart
}
}
ScrollBar.vertical: ScrollBar {
snapMode: ScrollBar.SnapOnRelease
}
}
component HeaderLabel: Label {
id: textObj
color: "white"
wrapMode: Text.WrapAnywhere
clip: true
width: Math.min(100, textWidth)
readonly property alias textWidth: textMetrics.boundingRect.width
TextMetrics {
id: textMetrics
font: textObj.font
text: textObj.text
elide: textObj.elide
}
background: Rectangle {
opacity: .9
color: Material.theme === Material.Light ? Material.background : "#242424"
}
padding: 10
}
Sidebar {
id: sidebar
topMargin: 60
steamWorkshop: root.steamWorkshop
onTagClicked: tag => {
gridView.headerItem.searchField.text = tag;
root.steamWorkshop.searchWorkshopByText(tag);
sidebar.close();
}
}
states: [
State {
name: "searching"
PropertyChanges {
target: rootMouseArea
enabled: true
}
}
]
}