From b092cc11eb7da04abbef1e8917d8fef419f5068a Mon Sep 17 00:00:00 2001 From: miruka Date: Tue, 17 Mar 2020 16:39:29 -0400 Subject: [PATCH] Add room header buttons to access sidepanes --- src/backend/user_files.py | 1 + src/gui/MainPane/MainPane.qml | 1 - src/gui/Pages/Chat/RoomHeader.qml | 59 +++++++++++++++++++- src/gui/Pages/Chat/RoomPane/MemberView.qml | 3 + src/gui/Pages/Chat/RoomPane/RoomPane.qml | 12 ++++ src/gui/Pages/Chat/RoomPane/SettingsView.qml | 13 +++++ src/icons/thin/go-back-to-main-pane.svg | 3 + src/icons/thin/go-to-room-pane.svg | 3 + 8 files changed, 92 insertions(+), 3 deletions(-) create mode 100644 src/icons/thin/go-back-to-main-pane.svg create mode 100644 src/icons/thin/go-to-room-pane.svg diff --git a/src/backend/user_files.py b/src/backend/user_files.py index 1d6d6cdc..b7bc341f 100644 --- a/src/backend/user_files.py +++ b/src/backend/user_files.py @@ -194,6 +194,7 @@ class UISettings(JSONDataFile): async def default_data(self) -> JsonData: return { "alertOnMessageForMsec": 4000, + "alwaysCenterRoomHeader": False, "clearRoomFilterOnEnter": True, "clearRoomFilterOnEscape": True, "collapseSidePanesUnderWindowWidth": 400, diff --git a/src/gui/MainPane/MainPane.qml b/src/gui/MainPane/MainPane.qml index 22c611c6..f0d8bed3 100644 --- a/src/gui/MainPane/MainPane.qml +++ b/src/gui/MainPane/MainPane.qml @@ -14,7 +14,6 @@ HDrawer { if (! hasFocus) mainPaneList.detachedCurrentIndex = false - property alias filter: bottomBar.roomFilter readonly property bool small: diff --git a/src/gui/Pages/Chat/RoomHeader.qml b/src/gui/Pages/Chat/RoomHeader.qml index 90ede3ce..952a80a0 100644 --- a/src/gui/Pages/Chat/RoomHeader.qml +++ b/src/gui/Pages/Chat/RoomHeader.qml @@ -8,10 +8,35 @@ Rectangle { implicitHeight: theme.baseElementsHeight color: theme.chat.roomHeader.background + + readonly property bool showPaneButtons: mainUI.mainPane.collapse + + readonly property bool center: + showPaneButtons || window.settings.alwaysCenterRoomHeader + + HRowLayout { id: row anchors.fill: parent + HButton { + id: goToMainPaneButton + icon.name: "go-back-to-main-pane" + padded: false + visible: Layout.preferredWidth > 0 + + onClicked: mainUI.mainPane.toggleFocus() + + Layout.preferredWidth: showPaneButtons ? avatar.width : 0 + Layout.fillHeight: true + + Behavior on Layout.preferredWidth { HNumberAnimation {} } + } + + HSpacer { + visible: center + } + HRoomAvatar { id: avatar roomId: chat.roomId @@ -34,7 +59,12 @@ Rectangle { rightPadding: leftPadding Layout.preferredWidth: Math.min( - implicitWidth, row.width - row.spacing - avatar.width + implicitWidth, + row.width - + row.spacing * (showPaneButtons ? 3 : 1) - + goToMainPaneButton.width - + avatar.width - + goToRoomPaneButton.width ) Layout.fillHeight: true @@ -52,7 +82,16 @@ Rectangle { verticalAlignment: Text.AlignVCenter rightPadding: nameLabel.rightPadding - Layout.fillWidth: true + Layout.preferredWidth: Math.min( + implicitWidth, + row.width - + row.spacing * (showPaneButtons ? 3 : 1) - + goToMainPaneButton.width - + avatar.width - + nameLabel.width - + goToRoomPaneButton.width + ) + Layout.fillWidth: ! center Layout.fillHeight: true HoverHandler { id: topicHover } @@ -70,5 +109,21 @@ Rectangle { readonly property string topic: topicLabel.truncated ? chat.roomInfo.topic : "" } + + HSpacer { + visible: center + } + + HButton { + id: goToRoomPaneButton + padded: false + icon.name: "go-to-room-pane" + visible: goToMainPaneButton.visible + + onClicked: chat.roomPane.toggleFocus() + + Layout.preferredWidth: goToMainPaneButton.Layout.preferredWidth + Layout.fillHeight: true + } } } diff --git a/src/gui/Pages/Chat/RoomPane/MemberView.qml b/src/gui/Pages/Chat/RoomPane/MemberView.qml index 3391ab40..ce1934b6 100644 --- a/src/gui/Pages/Chat/RoomPane/MemberView.qml +++ b/src/gui/Pages/Chat/RoomPane/MemberView.qml @@ -7,6 +7,9 @@ import "../../.." import "../../../Base" HColumnLayout { + readonly property alias keybindFocusItem: filterField + + HListView { id: memberList clip: true diff --git a/src/gui/Pages/Chat/RoomPane/RoomPane.qml b/src/gui/Pages/Chat/RoomPane/RoomPane.qml index 7ee51748..c5034efe 100644 --- a/src/gui/Pages/Chat/RoomPane/RoomPane.qml +++ b/src/gui/Pages/Chat/RoomPane/RoomPane.qml @@ -34,6 +34,18 @@ MultiviewPane { onClicked: swipeView.currentIndex = Math.min(index, 1) } + + function toggleFocus() { + if (swipeView.currentItem.keybindFocusItem.activeFocus) { + pageLoader.takeFocus() + return + } + + roomPane.open() + swipeView.currentItem.keybindFocusItem.forceActiveFocus() + } + + MemberView {} SettingsView { fillAvailableHeight: true } } diff --git a/src/gui/Pages/Chat/RoomPane/SettingsView.qml b/src/gui/Pages/Chat/RoomPane/SettingsView.qml index 9b755415..e55d4290 100644 --- a/src/gui/Pages/Chat/RoomPane/SettingsView.qml +++ b/src/gui/Pages/Chat/RoomPane/SettingsView.qml @@ -53,6 +53,17 @@ HBox { encryptCheckBox.changed || requireInviteCheckbox.changed || forbidGuestsCheckBox.changed + readonly property Item keybindFocusItem: { + for (let i = 0; i < visibleChildren.length; i++) { + const child = visibleChildren[i] + + if (child.focus || (child.field && child.field.focus)) + return visibleChildren[i] + } + + return nameField.field + } + HRoomAvatar { id: avatar @@ -74,6 +85,8 @@ HBox { field.enabled: chat.roomInfo.can_set_name Layout.fillWidth: true + + Component.onCompleted: field.forceActiveFocus() } HLabeledTextField { diff --git a/src/icons/thin/go-back-to-main-pane.svg b/src/icons/thin/go-back-to-main-pane.svg new file mode 100644 index 00000000..ea3e93e9 --- /dev/null +++ b/src/icons/thin/go-back-to-main-pane.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/icons/thin/go-to-room-pane.svg b/src/icons/thin/go-to-room-pane.svg new file mode 100644 index 00000000..a1663147 --- /dev/null +++ b/src/icons/thin/go-to-room-pane.svg @@ -0,0 +1,3 @@ + + +