diff --git a/qtquick/SailfinStyle/Page.qml b/qtquick/SailfinStyle/Page.qml
new file mode 100644
index 0000000..2380c62
--- /dev/null
+++ b/qtquick/SailfinStyle/Page.qml
@@ -0,0 +1,6 @@
+import QtQuick 2.12
+import QtQuick.Templates 2.12 as T
+
+T.Page {
+
+}
diff --git a/qtquick/SailfinStyle/SailfinStyle.qml b/qtquick/SailfinStyle/SailfinStyle.qml
new file mode 100644
index 0000000..b19db14
--- /dev/null
+++ b/qtquick/SailfinStyle/SailfinStyle.qml
@@ -0,0 +1,20 @@
+pragma Singleton
+import QtQuick 2.12
+
+QtObject {
+ readonly property real scaleFactor: 1.0
+ readonly property real unit: 8.0 * scaleFactor
+ readonly property real smallPadding: unit
+ readonly property real mediumPadding: 2 * unit
+ readonly property real largePadding: 3 * unit
+ readonly property real hugePadding: 4 * unit
+ readonly property real enormousPadding: 5 * unit
+
+ // Fonts
+ readonly property real fontMultiplier: 1.0
+ readonly property real fontSizeMedium: 3 * unit * fontMultiplier
+ readonly property real fontSizeLarge: 4 * unit * fontMultiplier
+
+ // Specific controls
+ readonly property real toolbarHeight: 8 * unit
+}
diff --git a/qtquick/SailfinStyle/ToolBar.qml b/qtquick/SailfinStyle/ToolBar.qml
new file mode 100644
index 0000000..ce5d534
--- /dev/null
+++ b/qtquick/SailfinStyle/ToolBar.qml
@@ -0,0 +1,45 @@
+import QtQuick 2.12
+import QtGraphicalEffects 1.12
+import QtQuick.Templates 2.12 as T
+
+import "."
+
+T.ToolBar {
+ horizontalPadding: SailfinStyle.mediumPadding
+ topPadding: SailfinStyle.smallPadding
+ bottomPadding: implicitBackgroundHeight / 3 * 2 + SailfinStyle.smallPadding
+
+ implicitHeight: Math.max(background ? background.implicitHeight : 0, contentHeight + topPadding + bottomPadding)
+ implicitWidth: Math.max(background ? background.implicitWidth : 0, contentWidth + leftPadding + rightPadding)
+
+ contentHeight: contentItem.implicitHeight || (contentChildren.length === 1 ? contentChildren[0].implicitHeight : 0)
+ contentWidth: contentItem.implicitWidth || (contentChildren.length === 1 ? contentChildren[0].implicitWidth : 0)
+
+ background: Item {
+ implicitHeight: SailfinStyle.toolbarHeight
+ // FIXME: SVG is being "cut", show a rectangle as background as workaround.
+ Rectangle {
+ anchors {
+ left: parent.left; right: parent.right; top: parent.top; bottom: parent.bottom;
+ bottomMargin: 75
+ }
+ color: "crimson"
+ }
+
+ BorderImage {
+ id: backgroundImage
+ anchors.fill: parent
+ border { left: 0; right: 0; bottom: 75; top: 10; }
+ horizontalTileMode: BorderImage.Stretch
+ verticalTileMode: BorderImage.Stretch
+ source: Qt.resolvedUrl("assets/ToolBarBackground.svg")
+ visible: false
+ }
+
+ ColorOverlay {
+ anchors.fill: backgroundImage
+ source: backgroundImage
+ color: "crimson"
+ }
+ }
+}
diff --git a/qtquick/SailfinStyle/assets/ToolBarBackground.svg b/qtquick/SailfinStyle/assets/ToolBarBackground.svg
new file mode 100644
index 0000000..868ba0e
--- /dev/null
+++ b/qtquick/SailfinStyle/assets/ToolBarBackground.svg
@@ -0,0 +1,22 @@
+
+
diff --git a/qtquick/SailfinStyle/qmldir b/qtquick/SailfinStyle/qmldir
new file mode 100644
index 0000000..8c5d182
--- /dev/null
+++ b/qtquick/SailfinStyle/qmldir
@@ -0,0 +1,4 @@
+module SailfinStyle
+depends QtQuick.Controls 2.12
+
+singleton SailfinStyle 1.0 SailfinStyle.qml
diff --git a/qtquick/qml.qrc b/qtquick/qml.qrc
index a82a7b3..2926ffa 100644
--- a/qtquick/qml.qrc
+++ b/qtquick/qml.qrc
@@ -3,5 +3,12 @@
qml/main.qml
qml/components/Background.qml
assets/img/particle.png
+ qtquickcontrols2.conf
+ SailfinStyle/assets/ToolBarBackground.svg
+ SailfinStyle/qmldir
+ SailfinStyle/SailfinStyle.qml
+ SailfinStyle/ToolBar.qml
+ qml/pages/setup/ServerSelectPage.qml
+ SailfinStyle/Page.qml
diff --git a/qtquick/qml/components/Background.qml b/qtquick/qml/components/Background.qml
index f760e91..4ebb171 100644
--- a/qtquick/qml/components/Background.qml
+++ b/qtquick/qml/components/Background.qml
@@ -2,7 +2,23 @@ import QtQuick 2.12
import QtQuick.Particles 2.12
Rectangle {
- color: "black"
+ id: root
+ anchors.fill: parent
+ color: "#ccc"
+
+ readonly property real normalStrength: 0.5
+
+ MouseArea {
+ anchors.fill: parent
+ acceptedButtons: Qt.LeftButton | Qt.RightButton
+ onClicked: {
+ if (mouse.button == Qt.LeftButton) {
+ enter();
+ } else {
+ exit();
+ }
+ }
+ }
ParticleSystem {
id: particleSystem
@@ -10,27 +26,91 @@ Rectangle {
Emitter {
id: emitter
- anchors.fill: parent
+ anchors.centerIn: parent
+ width: parent.width * 0.5
+ height: parent.height * 0.5
system: particleSystem
- emitRate: width * height / (lifeSpan * 100)
+ emitRate: Math.sqrt(width * height) * 30 / (lifeSpan)
lifeSpan: 10000
- lifeSpanVariation: 500
- size: 16
- endSize: 64
+ lifeSpanVariation: 1000
+ size: 12
+ endSize: 24
+ sizeVariation: 6
+ shape: EllipseShape {}
+ }
+
+ Attractor {
+ id: affector
+ anchors.centerIn: parent
+ width: parent.width * 2
+ height: parent.height * 2
+ affectedParameter: Attractor.Position
+ system: particleSystem
+ pointX: width / 2
+ pointY: height / 2
+ proportionalToDistance: Attractor.Linear
+ strength: -normalStrength
}
Wander {
anchors.fill: parent
system: particleSystem
- pace: 100
+ pace: 300
affectedParameter: Wander.Velocity
- xVariance: 300
- yVariance: 300
+ xVariance: 1000
+ yVariance: 1000
}
ImageParticle {
- source: "/assets/img/particle.png"
+ //source: Qt.resolvedUrl("../../assets/img/particle.png")
+ source: "qrc:/particleresources/fuzzydot.png"
system: particleSystem
+ alpha: 0.7
+ alphaVariation: 0.3
+ }
+
+ SequentialAnimation {
+ id: enterAnimation
+ NumberAnimation {
+ target: affector
+ property: "strength"
+ from: - 5 * normalStrength
+ to: -normalStrength
+ easing.type: Easing.OutQuad
+ duration: 1000
+ }
+ ScriptAction {
+ script: emitter.burst(10)
+ }
+ }
+
+ SequentialAnimation {
+ id: exitAnimation
+ PropertyAction {
+ target: affector
+ property: "strength"
+ value: 4 * normalStrength
+ }
+ PauseAnimation {
+ duration: 500
+ }
+ NumberAnimation {
+ target: affector
+ property: "strength"
+ easing.type: Easing.InOutQuad
+ to: -normalStrength
+ duration: 500
+ }
+ }
+
+ function enter() {
+ console.log("Enter animation")
+ enterAnimation.start();
+ }
+
+ function exit() {
+ console.log("Exit animation")
+ exitAnimation.start();
}
}
diff --git a/qtquick/qml/main.qml b/qtquick/qml/main.qml
index d171b11..1ee0590 100644
--- a/qtquick/qml/main.qml
+++ b/qtquick/qml/main.qml
@@ -1,14 +1,33 @@
import QtQuick 2.12
+import QtQuick.Controls 2.12
+import QtGraphicalEffects 1.12
import QtQuick.Window 2.12
-import "components"
+import nl.netsoj.chris.Jellyfin 1.0
-Window {
+import "components"
+import "../SailfinStyle"
+
+ApplicationWindow {
width: 600
height: 600
visible: true
- Background {
+ background: Background {
anchors.fill: parent
}
+
+ StackView {
+ id: pageStack
+ anchors.fill: parent
+ }
+
+ Connections {
+ target: ApiClient
+ onSetupRequired: pageStack.push(Qt.resolvedUrl("pages/setup/ServerSelectPage.qml"));
+ }
+
+ Component.onCompleted: {
+ ApiClient.restoreSavedSession()
+ }
}
diff --git a/qtquick/qml/pages/setup/ServerSelectPage.qml b/qtquick/qml/pages/setup/ServerSelectPage.qml
new file mode 100644
index 0000000..9fe0b52
--- /dev/null
+++ b/qtquick/qml/pages/setup/ServerSelectPage.qml
@@ -0,0 +1,24 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.12
+
+import nl.netsoj.chris.Jellyfin 1.0
+
+import "../../../SailfinStyle"
+
+Page {
+ header: ToolBar {
+ Label {
+ anchors.horizontalCenter: parent.horizontalCenter
+ font.pixelSize: SailfinStyle.fontSizeLarge
+ text: qsTr("Select a server")
+ }
+ }
+ BusyIndicator {
+ anchors.centerIn: parent
+ }
+
+ ServerDiscoveryModel {
+ id: discoveryModel
+ }
+
+}
diff --git a/qtquick/qtquickcontrols2.conf b/qtquick/qtquickcontrols2.conf
new file mode 100644
index 0000000..7ef3c8b
--- /dev/null
+++ b/qtquick/qtquickcontrols2.conf
@@ -0,0 +1,2 @@
+[Controls]
+Style=SailfinStyle
diff --git a/qtquick/src/main.cpp b/qtquick/src/main.cpp
index a1fbc5c..e00bee0 100644
--- a/qtquick/src/main.cpp
+++ b/qtquick/src/main.cpp
@@ -1,3 +1,8 @@
+#define QT_DEBUG
+#define QT_QML_DEBUG
+#include
+//#endif
+
#include
#include
#include
diff --git a/ui-workfiles/corner-button.svg b/ui-workfiles/corner-button.svg
new file mode 100644
index 0000000..07bf893
--- /dev/null
+++ b/ui-workfiles/corner-button.svg
@@ -0,0 +1,97 @@
+
+
diff --git a/ui-workfiles/toolbar.svg b/ui-workfiles/toolbar.svg
new file mode 100644
index 0000000..047521d
--- /dev/null
+++ b/ui-workfiles/toolbar.svg
@@ -0,0 +1,107 @@
+
+