import QtQuick 2.9 import QtQuick.Controls 2.2 import QtQuick.Controls.Material 2.2 import QtQuick.Layouts 1.3 import Matrique 0.1 import Matrique.Settings 0.1 import "component" import "form" import "qrc:/js/util.js" as Util Page { property alias listModel: accountSettingsListView.model Page { id: accountForm parent: null padding: 64 ColumnLayout { anchors.fill: parent ListView { Layout.fillWidth: true Layout.fillHeight: true id: accountSettingsListView boundsBehavior: Flickable.DragOverBounds clip: true delegate: Column { property bool expanded: false spacing: 16 SwipeDelegate { width: accountSettingsListView.width height: 64 clip: true Row { anchors.fill: parent anchors.margins: 8 spacing: 8 ImageItem { width: parent.height height: parent.height hint: user.displayName defaultColor: Util.stringToColor(user.displayName) image: user.avatar } ColumnLayout { Label { text: user.displayName } Label { text: user.id } } } swipe.right: Rectangle { width: parent.height height: parent.height anchors.right: parent.right color: Material.accent MaterialIcon { anchors.fill: parent icon: "\ue879" color: "white" } SwipeDelegate.onClicked: matriqueController.logout(connection) } onClicked: expanded = !expanded } ColumnLayout { width: parent.width - 32 height: expanded ? implicitHeight : 0 anchors.horizontalCenter: parent.horizontalCenter spacing: 0 clip: true ListView { Layout.fillWidth: true Layout.preferredHeight: 32 orientation: ListView.Horizontal model: ["#498882", "#42a5f5", "#5c6bc0", "#7e57c2", "#ab47bc", "#ff7043"] delegate: Rectangle { width: parent.height height: parent.height color: modelData MouseArea { anchors.fill: parent onClicked: matriqueController.setColor(connection.localUserId, modelData) } } } RowLayout { Layout.fillWidth: true spacing: 16 Label { text: "Homeserver:" } TextField { Layout.fillWidth: true text: connection.homeserver selectByMouse: true readOnly: true } } RowLayout { Layout.fillWidth: true spacing: 16 Label { text: "Device ID:" } TextField { Layout.fillWidth: true text: connection.deviceId selectByMouse: true readOnly: true } } RowLayout { Layout.fillWidth: true spacing: 16 Label { text: "Access Token:" } TextField { Layout.fillWidth: true text: connection.accessToken selectByMouse: true readOnly: true } } Behavior on height { PropertyAnimation { easing.type: Easing.InOutCubic; duration: 200 } } } } } Button { text: "Add Account" flat: true highlighted: true onClicked: Util.pushToStack(stackView, loginPage) } } } Page { id: generalForm parent: null padding: 64 Column { Switch { text: "Lazy load at initial sync" checked: MSettings.lazyLoad onCheckedChanged: MSettings.lazyLoad = checked } Switch { text: "Use RichText instead of StyledText" checked: MSettings.richText onCheckedChanged: MSettings.richText = checked } Switch { text: "Use press and hold instead of right click" checked: MSettings.pressAndHold onCheckedChanged: MSettings.pressAndHold = checked } } } Page { id: appearanceForm parent: null padding: 64 Column { Switch { text: "Dark theme" checked: MSettings.darkTheme onCheckedChanged: MSettings.darkTheme = checked } Switch { text: "Mini Room List" checked: MSettings.miniMode onCheckedChanged: MSettings.miniMode = checked } Switch { text: "Rearrange rooms by activity" checked: MSettings.rearrangeByActivity onCheckedChanged: MSettings.rearrangeByActivity = checked } } } Page { id: aboutForm parent: null padding: 64 ColumnLayout { spacing: 16 Image { Layout.preferredWidth: 64 Layout.preferredHeight: 64 source: "qrc:/asset/img/icon.png" } Label { text: "Matrique, an IM client for the Matrix protocol." } Label { text: "Released under GNU General Public License, version 3." } } } Rectangle { width: 240 height: parent.height id: settingDrawer color: MSettings.darkTheme ? "#323232" : "#f3f3f3" Column { anchors.fill: parent ItemDelegate { width: parent.width text: "Account" onClicked: pushToStack(accountForm) } ItemDelegate { width: parent.width text: "General" onClicked: pushToStack(generalForm) } ItemDelegate { width: parent.width text: "Appearance" onClicked: pushToStack(appearanceForm) } ItemDelegate { width: parent.width text: "About" onClicked: pushToStack(aboutForm) } } } StackView { anchors.fill: parent anchors.leftMargin: settingDrawer.width id: settingStackView } function pushToStack(item) { settingStackView.clear() settingStackView.push(item) } }