From f9e41f7e9f77993de02102d5a86961017c633c88 Mon Sep 17 00:00:00 2001
From: Black Hat <bhat@encom.eu.org>
Date: Sun, 22 Jul 2018 20:31:52 +0800
Subject: [PATCH] Update libqmatrixclient && improve setting page(Rather a
 hack, needs improvement).

---
 include/libqmatrixclient           |   2 +-
 qml/Setting.qml                    | 117 ++++++++++++-----------------
 qml/form/SettingAccountForm.qml    |  35 +++++++++
 qml/form/SettingAppearancePage.qml |  19 +++++
 qml/main.qml                       |   6 ++
 res.qrc                            |   2 +
 6 files changed, 110 insertions(+), 71 deletions(-)
 create mode 100644 qml/form/SettingAccountForm.qml
 create mode 100644 qml/form/SettingAppearancePage.qml

diff --git a/include/libqmatrixclient b/include/libqmatrixclient
index f004c32..716aa2a 160000
--- a/include/libqmatrixclient
+++ b/include/libqmatrixclient
@@ -1 +1 @@
-Subproject commit f004c32ae4291fd8eca7f4106af7582e6fc86f5a
+Subproject commit 716aa2a97d6654cc45ed6a9c8b08cad6d833e301
diff --git a/qml/Setting.qml b/qml/Setting.qml
index 7ddeff6..a71a3a2 100644
--- a/qml/Setting.qml
+++ b/qml/Setting.qml
@@ -4,85 +4,62 @@ import QtQuick.Controls.Material 2.2
 import QtQuick.Layouts 1.3
 
 import "component"
+import "form"
 
 Page {
-    property alias darkTheme: themeSwitch.checked
-    property alias miniMode: miniModeSwitch.checked
+    property alias darkTheme: appearanceForm.darkTheme
+    property alias miniMode: appearanceForm.miniMode
     property var connection
 
-    header: TabBar {
-        id: tabBar
-        width: parent.width
-        currentIndex: settingView.currentIndex
+    SettingAccountForm {
+        id: accountForm
+        parent: null
+    }
 
-        TabButton {
-            text: "Account"
+    SettingAppearancePage {
+        id: appearanceForm
+        parent: null
+    }
 
+    RowLayout {
+        ColumnLayout {
+            Material.elevation: 10
+            Layout.preferredWidth: 240
+            Layout.fillHeight: true
+
+            spacing: 0
+
+            ItemDelegate {
+                Layout.fillWidth: true
+
+                text: "Account"
+                onClicked: pushToStack(accountForm)
+            }
+
+            ItemDelegate {
+                Layout.fillWidth: true
+
+                text: "Appearance"
+                onClicked: pushToStack(appearanceForm)
+            }
+
+            ItemDelegate {
+                Layout.fillWidth: true
+
+                text: "About"
+            }
         }
-        TabButton {
-            text: "Appearance"
-        }
-        TabButton {
-            text: "About"
+
+        StackView {
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+
+            id: settingStackView
         }
     }
 
-    SwipeView {
-        id: settingView
-
-        currentIndex: tabBar.currentIndex
-        anchors.fill: parent
-
-        Item {
-            id: accountPage
-
-            RowLayout {
-                height: 80
-
-                ImageStatus {
-                    Layout.preferredWidth: height
-                    Layout.fillHeight: true
-
-                    source: connection ? connection.localUser && connection.localUser.avatarUrl ? "image://mxc/" + connection.localUser.avatarUrl : "" : "qrc:/asset/img/avatar.png"
-                    displayText: connection && connection.localUser.displayName ? connection.localUser.displayName : "N"
-                    opaqueBackground: false
-                }
-
-                ColumnLayout {
-                    Layout.fillWidth: true
-                    Layout.fillHeight: true
-
-                    Label {
-                        font.pointSize: 24
-                        text: connection ? connection.localUser.displayName : ""
-                    }
-
-                    Label {
-                        font.pointSize: 16
-                        text: "No text."
-                    }
-                }
-            }
-        }
-
-        Item {
-            id: appearancePage
-
-            Column {
-                Switch {
-                    id: themeSwitch
-                    text: "Dark theme"
-                }
-
-                Switch {
-                    id: miniModeSwitch
-                    text: "Mini Room List"
-                }
-            }
-        }
-
-        Item {
-            id: thirdPage
-        }
+    function pushToStack(item) {
+        settingStackView.clear()
+        settingStackView.push(item)
     }
 }
diff --git a/qml/form/SettingAccountForm.qml b/qml/form/SettingAccountForm.qml
new file mode 100644
index 0000000..4bdab36
--- /dev/null
+++ b/qml/form/SettingAccountForm.qml
@@ -0,0 +1,35 @@
+import QtQuick 2.9
+import QtQuick.Controls 2.2
+import QtQuick.Layouts 1.3
+
+import "qrc:/qml/component"
+
+Page {
+    RowLayout {
+        height: 60
+
+        ImageStatus {
+            Layout.preferredWidth: height
+            Layout.fillHeight: true
+
+            source: connection ? connection.localUser && connection.localUser.avatarUrl ? "image://mxc/" + connection.localUser.avatarUrl : "" : "qrc:/asset/img/avatar.png"
+            displayText: connection && connection.localUser.displayName ? connection.localUser.displayName : "N"
+            opaqueBackground: false
+        }
+
+        ColumnLayout {
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+
+            Label {
+                font.pointSize: 18
+                text: connection ? connection.localUser.displayName : ""
+            }
+
+            Label {
+                font.pointSize: 12
+                text: "No text."
+            }
+        }
+    }
+}
diff --git a/qml/form/SettingAppearancePage.qml b/qml/form/SettingAppearancePage.qml
new file mode 100644
index 0000000..55c4fd5
--- /dev/null
+++ b/qml/form/SettingAppearancePage.qml
@@ -0,0 +1,19 @@
+import QtQuick 2.9
+import QtQuick.Controls 2.2
+
+Page {
+    property alias darkTheme: themeSwitch.checked
+    property alias miniMode: miniModeSwitch.checked
+
+    Column {
+        Switch {
+            id: themeSwitch
+            text: "Dark theme"
+        }
+
+        Switch {
+            id: miniModeSwitch
+            text: "Mini Room List"
+        }
+    }
+}
diff --git a/qml/main.qml b/qml/main.qml
index 604d6ad..565fc99 100644
--- a/qml/main.qml
+++ b/qml/main.qml
@@ -120,11 +120,17 @@ ApplicationWindow {
 
     Room {
         id: roomPage
+
+        parent: null
+
         connection: window.connection
     }
 
     Setting {
         id: settingPage
+
+        parent: null
+
         connection: window.connection
     }
 
diff --git a/res.qrc b/res.qrc
index ce9cec1..42cf666 100644
--- a/res.qrc
+++ b/res.qrc
@@ -27,5 +27,7 @@
         <file>qml/component/AudioBubble.qml</file>
         <file>qml/form/SettingForm.qml</file>
         <file>qml/Setting.qml</file>
+        <file>qml/form/SettingAccountForm.qml</file>
+        <file>qml/form/SettingAppearancePage.qml</file>
     </qresource>
 </RCC>