From 620a34baf350a0818e45b66f881e14380a6ac782 Mon Sep 17 00:00:00 2001 From: Elias Date: Mon, 17 Dec 2018 20:55:13 +0100 Subject: [PATCH] Add browser window in Community tab Add Community tab background --- ScreenPlay/Resources.qrc | 1 + ScreenPlay/main.cpp | 3 + ScreenPlay/main.qml | 13 +- ScreenPlay/qml/Background.qml | 36 ++++ ScreenPlay/qml/Community/Community.qml | 217 ++++------------------- ScreenPlay/qml/Community/XMLNewsfeed.qml | 179 +++++++++++++++++++ 6 files changed, 268 insertions(+), 181 deletions(-) create mode 100644 ScreenPlay/qml/Community/XMLNewsfeed.qml diff --git a/ScreenPlay/Resources.qrc b/ScreenPlay/Resources.qrc index 739b84e3..0a87e5b1 100644 --- a/ScreenPlay/Resources.qrc +++ b/ScreenPlay/Resources.qrc @@ -123,6 +123,7 @@ qml/Screen/Screen.qml assets/icons/icon_screen.svg qml/Background.qml + qml/Community/XMLNewsfeed.qml qml/Workshop/WorkshopAvailableTest.qml qml/Workshop/WorkshopLoader.qml diff --git a/ScreenPlay/main.cpp b/ScreenPlay/main.cpp index 54925a42..018744a2 100644 --- a/ScreenPlay/main.cpp +++ b/ScreenPlay/main.cpp @@ -20,6 +20,7 @@ #include #include #include +#include #ifdef Q_OS_WIN #include @@ -52,6 +53,8 @@ int main(int argc, char* argv[]) trsl.load(":/translations/ScreenPlay_de.qm"); app.installTranslator(&trsl); + QtWebEngine::initialize(); + QFontDatabase::addApplicationFont(":/assets/fonts/LibreBaskerville-Italic.ttf"); QFontDatabase::addApplicationFont(":/assets/fonts/Roboto-Light.ttf"); QFontDatabase::addApplicationFont(":/assets/fonts/Roboto-Regular.ttf"); diff --git a/ScreenPlay/main.qml b/ScreenPlay/main.qml index 326cc287..af9cd6b6 100644 --- a/ScreenPlay/main.qml +++ b/ScreenPlay/main.qml @@ -5,6 +5,7 @@ import QtQuick.Layouts 1.3 import QtGraphicalEffects 1.0 import Qt.labs.platform 1.0 + import "qml/" import "qml/Installed" @@ -29,16 +30,23 @@ ApplicationWindow { if (name === "Create") { bg.state = "create" pageLoader.visible = false - pageLoaderCreate.setSource("qrc:/qml/Create/Create.qml") pageLoaderCreate.visible = true pageLoaderWorkshop.visible = false + pageLoaderCreate.setSource("qrc:/qml/Create/Create.qml") sidebar.state = "inactive" } else if (name === "Workshop") { bg.state = "init" pageLoader.visible = false pageLoaderCreate.visible = false - pageLoaderWorkshop.setSource("qrc:/qml/Workshop/Workshop.qml") pageLoaderWorkshop.visible = true + pageLoaderWorkshop.setSource("qrc:/qml/Workshop/Workshop.qml") + sidebar.state = "inactive" + } else if (name === "Community") { + bg.state = "community" + pageLoader.visible = true + pageLoaderCreate.visible = false + pageLoaderWorkshop.visible = false + pageLoader.setSource("qrc:/qml/Community/Community.qml") sidebar.state = "inactive" } else { bg.state = "init" @@ -50,7 +58,6 @@ ApplicationWindow { } } - Background { id: bg anchors.fill: parent diff --git a/ScreenPlay/qml/Background.qml b/ScreenPlay/qml/Background.qml index f6e5f34d..b9084a29 100644 --- a/ScreenPlay/qml/Background.qml +++ b/ScreenPlay/qml/Background.qml @@ -15,6 +15,11 @@ Item { } } + Rectangle { + id: bgCommunity + anchors.fill: parent + } + property var myDate: new Date() Timer { @@ -42,6 +47,10 @@ Item { target: colorShaderCreate shaderOpacity: 0 } + PropertyChanges { + target: bgCommunity + opacity: 0 + } }, State { name: "create" @@ -49,6 +58,21 @@ Item { target: colorShaderCreate shaderOpacity: 1 } + PropertyChanges { + target: bgCommunity + opacity: 0 + } + }, + State { + name: "community" + PropertyChanges { + target: colorShaderCreate + shaderOpacity: 0 + } + PropertyChanges { + target: bgCommunity + opacity: 1 + } } ] @@ -73,6 +97,18 @@ Item { property: "shaderOpacity" duration: 0 } + }, + + Transition { + from: "*" + to: "community" + + PropertyAnimation { + target: bgCommunity + property: "opacity" + duration: 400 + easing.type: Easing.InOutQuart + } } ] } diff --git a/ScreenPlay/qml/Community/Community.qml b/ScreenPlay/qml/Community/Community.qml index 16ea78da..8980d0cc 100644 --- a/ScreenPlay/qml/Community/Community.qml +++ b/ScreenPlay/qml/Community/Community.qml @@ -3,13 +3,13 @@ import QtQuick.Controls 2.3 import QtQuick.Controls.Material 2.2 import QtGraphicalEffects 1.0 import QtQuick.Layouts 1.3 -import QtQuick.XmlListModel 2.0 +//import QtQuick.XmlListModel 2.0 +import QtWebEngine 1.8 Item { id: community anchors.fill: parent - Rectangle { id: stomtWrapper width: 500 @@ -55,10 +55,10 @@ Item { } } Text { - id:txtStomtDescription + id: txtStomtDescription font.pointSize: 14 color: "white" - height:100 + height: 100 text: qsTr("We use Stomt because it provides quick and easy feedback via I like/I wish. So you can easily give us feedback and speak your mind. We will read these wishes on a daily basis!") font.family: "Roboto" font.weight: Font.Normal @@ -75,7 +75,7 @@ Item { } } - Component { + Component { id: component_feedback Feedback { id: feedback @@ -93,15 +93,14 @@ Item { } Timer { - interval: 200; running: true; repeat: false + interval: 200 + running: true + repeat: false onTriggered: { - feedModel.source = "https://screen-play.app/index.php?option=com_content&view=category&layout=blog&id=10&format=feed&type=rss" loader_feedback.sourceComponent = component_feedback } - } - Button { id: btnStomt text: qsTr("Open ScreenPlay Stomt page") @@ -147,179 +146,38 @@ Item { } } - XmlListModel { - id: feedModel - - query: "/rss/channel/item" - XmlRole { - name: "title" - query: "title/string()" + // XMLNewsfeed { + // id: changelogFlickableWrapper + // anchors { + // bottom: footer.top + // left: stomtWrapper.right + // leftMargin: 90 + // right: parent.right + // rightMargin: 20 + // top: parent.top + // topMargin: 20 + // } + // } + WebEngineView { + id: we + url:"https://forum.screen-play.app/" + onUrlChanged: { + var tmp = we.url.toString() + if(!tmp.includes("https://forum.screen-play.app/")) { + we.url = "https://forum.screen-play.app/" + } } - XmlRole { - name: "backgroundImage" - query: "description/string()" - } - XmlRole { - name: "link" - query: "link/string()" - } - XmlRole { - name: "pubDate" - query: "pubDate/string()" - } - XmlRole { - name: "category" - query: "category/string()" - } - } - - GridView { - id: changelogFlickableWrapper - flickableDirection: Flickable.VerticalFlick - maximumFlickVelocity: 5000 - flickDeceleration: 5000 - cellHeight: 205 - cellWidth: 360 - model: feedModel anchors { - top: parent.top - topMargin: 20 - right: parent.right - rightMargin: 20 bottom: footer.top - left: stomtWrapper.right - leftMargin: 90 + leftMargin: 0 + right: parent.right + rightMargin: 0 + top: parent.top + topMargin:0 } - header: Item { - height: 100 - width: parent.width - - Text { - id: name - text: qsTr("News & Patchnotes") - wrapMode: Text.WordWrap - color: "#626262" - renderType: Text.NativeRendering - verticalAlignment: Text.AlignVCenter - horizontalAlignment: Text.AlignLeft - font.pixelSize: 32 - font.family: "Roboto" - - anchors { - top: parent.top - topMargin: 30 - horizontalCenter: parent.horizontalCenter - } - } - } - - delegate: Item { - id: root - width: 352 - height: 197 - - RectangularGlow { - id: effectchangelogWrapper - anchors { - top: parent.top - topMargin: 3 - } - height: parent.height - width: parent.width - cached: true - glowRadius: 3 - spread: 0.2 - color: "black" - opacity: 0.2 - cornerRadius: 15 - } - - Rectangle { - anchors.fill: parent - anchors.margins: 5 - radius: 4 - - Image { - fillMode: Image.PreserveAspectCrop - anchors.fill: parent - source: { - var a = backgroundImage - var r = new RegExp(/]+src="([^">]+)"/) - var url = r.exec(a) - return url[1].toString() - } - } - - LinearGradient { - visible: true - opacity: .5 - anchors.fill: parent - start: Qt.point(0, parent.height) - end: Qt.point(0, parent.height - 150) - gradient: Gradient { - GradientStop { - position: 0.0 - color: "#BB000000" - } - GradientStop { - position: 1.0 - color: "#00000000" - } - } - } - - Text { - id: txtTitle - text: title - renderType: Text.NativeRendering - anchors { - right: parent.right - bottom: parent.bottom - left: parent.left - margins: 20 - } - color: "white" - font.family: "Roboto" - font.weight: Font.Normal - font.pixelSize: 18 - wrapMode: Text.WordWrap - } - Text { - id: txtPubDate - text: { - return pubDate.replace("+0000", "") - } - anchors { - right: parent.right - rightMargin: 20 - bottom: txtTitle.top - bottomMargin: 10 - left: parent.left - leftMargin: 20 - } - color: "white" - font.family: "Roboto" - renderType: Text.NativeRendering - font.weight: Font.Normal - font.pixelSize: 14 - wrapMode: Text.WordWrap - } - MouseArea { - anchors.fill: parent - onClicked: Qt.openUrlExternally(link) - hoverEnabled: true - cursorShape: Qt.PointingHandCursor - } - } - } - - ScrollBar.vertical: ScrollBar { - snapMode: ScrollBar.SnapOnRelease - policy: ScrollBar.AlwaysOn - } } Rectangle { @@ -338,7 +196,8 @@ Item { text: qsTr("Forums") Material.background: Material.Blue Material.foreground: "white" - onClicked: Qt.openUrlExternally("https://forum.screen-play.app/") + onClicked: Qt.openUrlExternally( + "https://forum.screen-play.app/") icon.source: "qrc:/assets/icons/icon_people.svg" icon.color: "white" icon.width: 16 @@ -352,7 +211,8 @@ Item { icon.color: "white" icon.width: 16 icon.height: 16 - onClicked: Qt.openUrlExternally("https://screen-play.app/index.php/blog") + onClicked: Qt.openUrlExternally( + "https://screen-play.app/index.php/blog") } Button { text: qsTr("Source Code") @@ -363,7 +223,8 @@ Item { icon.color: "white" icon.width: 16 icon.height: 16 - onClicked: Qt.openUrlExternally("https://gitlab.com/aimber/ScreenPlay/") + onClicked: Qt.openUrlExternally( + "https://gitlab.com/aimber/ScreenPlay/") } Button { text: qsTr("Workshop") diff --git a/ScreenPlay/qml/Community/XMLNewsfeed.qml b/ScreenPlay/qml/Community/XMLNewsfeed.qml new file mode 100644 index 00000000..fe7416d2 --- /dev/null +++ b/ScreenPlay/qml/Community/XMLNewsfeed.qml @@ -0,0 +1,179 @@ +import QtQuick 2.9 +import QtQuick.Controls 2.3 +import QtQuick.Controls.Material 2.2 +import QtGraphicalEffects 1.0 +import QtQuick.Layouts 1.3 +import QtQuick.XmlListModel 2.0 + +GridView { + id: changelogFlickableWrapper + flickableDirection: Flickable.VerticalFlick + maximumFlickVelocity: 5000 + flickDeceleration: 5000 + cellHeight: 205 + cellWidth: 360 + model: feedModel + + Timer { + interval: 200 + running: true + repeat: false + onTriggered: { + feedModel.source = "https://screen-play.app/index.php?option=com_content&view=category&layout=blog&id=10&format=feed&type=rss" + } + } + + XmlListModel { + id: feedModel + + query: "/rss/channel/item" + XmlRole { + name: "title" + query: "title/string()" + } + XmlRole { + name: "backgroundImage" + query: "description/string()" + } + XmlRole { + name: "link" + query: "link/string()" + } + XmlRole { + name: "pubDate" + query: "pubDate/string()" + } + XmlRole { + name: "category" + query: "category/string()" + } + } + + header: Item { + height: 100 + width: parent.width + + Text { + id: name + text: qsTr("News & Patchnotes") + wrapMode: Text.WordWrap + color: "#626262" + renderType: Text.NativeRendering + verticalAlignment: Text.AlignVCenter + horizontalAlignment: Text.AlignLeft + font.pixelSize: 32 + font.family: "Roboto" + + anchors { + top: parent.top + topMargin: 30 + horizontalCenter: parent.horizontalCenter + } + } + } + + delegate: Item { + id: root + width: 352 + height: 197 + + RectangularGlow { + id: effectchangelogWrapper + anchors { + top: parent.top + topMargin: 3 + } + height: parent.height + width: parent.width + cached: true + glowRadius: 3 + spread: 0.2 + color: "black" + opacity: 0.2 + cornerRadius: 15 + } + + Rectangle { + anchors.fill: parent + anchors.margins: 5 + radius: 4 + + Image { + fillMode: Image.PreserveAspectCrop + anchors.fill: parent + source: { + var a = backgroundImage + var r = new RegExp(/]+src="([^">]+)"/) + var url = r.exec(a) + return url[1].toString() + } + } + + LinearGradient { + visible: true + opacity: .5 + anchors.fill: parent + start: Qt.point(0, parent.height) + end: Qt.point(0, parent.height - 150) + gradient: Gradient { + GradientStop { + position: 0.0 + color: "#BB000000" + } + GradientStop { + position: 1.0 + color: "#00000000" + } + } + } + + Text { + id: txtTitle + text: title + renderType: Text.NativeRendering + anchors { + right: parent.right + bottom: parent.bottom + left: parent.left + margins: 20 + } + color: "white" + font.family: "Roboto" + font.weight: Font.Normal + font.pixelSize: 18 + wrapMode: Text.WordWrap + } + Text { + id: txtPubDate + text: { + return pubDate.replace("+0000", "") + } + anchors { + right: parent.right + rightMargin: 20 + bottom: txtTitle.top + bottomMargin: 10 + left: parent.left + leftMargin: 20 + } + color: "white" + font.family: "Roboto" + renderType: Text.NativeRendering + font.weight: Font.Normal + font.pixelSize: 14 + wrapMode: Text.WordWrap + } + MouseArea { + anchors.fill: parent + onClicked: Qt.openUrlExternally(link) + hoverEnabled: true + cursorShape: Qt.PointingHandCursor + } + } + } + + ScrollBar.vertical: ScrollBar { + snapMode: ScrollBar.SnapOnRelease + policy: ScrollBar.AlwaysOn + } +}