From 91047b34c2ac602255895a14bc2a589a749df7de Mon Sep 17 00:00:00 2001
From: mjoseph <matheo.joseph@savoirfairelinux.com>
Date: Tue, 23 May 2023 09:45:47 -0400
Subject: [PATCH] searchbar: made one unique searchbar for contact and message
GitLab: #1083
Change-Id: I210c6c728485a7678817754a0728a07eeb3c3796
---
.../mainview/components/AddMemberPanel.qml | 4 +-
.../mainview/components/ChatViewHeader.qml | 19 ++-
src/app/mainview/components/ContactPicker.qml | 4 +-
src/app/mainview/components/Searchbar.qml | 127 ++++++++++++------
src/app/mainview/components/SidePanel.qml | 4 +-
5 files changed, 113 insertions(+), 45 deletions(-)
diff --git a/src/app/mainview/components/AddMemberPanel.qml b/src/app/mainview/components/AddMemberPanel.qml
index 954be20d4..a958615c6 100644
--- a/src/app/mainview/components/AddMemberPanel.qml
+++ b/src/app/mainview/components/AddMemberPanel.qml
@@ -34,7 +34,7 @@ Rectangle {
anchors.fill: parent
- ContactSearchBar {
+ Searchbar {
id: contactPickerContactSearchBar
Layout.alignment: Qt.AlignCenter
@@ -44,7 +44,7 @@ Rectangle {
placeHolderText: JamiStrings.addParticipant
- onContactSearchBarTextChanged: {
+ onSearchBarTextChanged: function(text){
ContactAdapter.setSearchFilter(text);
}
}
diff --git a/src/app/mainview/components/ChatViewHeader.qml b/src/app/mainview/components/ChatViewHeader.qml
index 4672c1d5c..9d7c82ebe 100644
--- a/src/app/mainview/components/ChatViewHeader.qml
+++ b/src/app/mainview/components/ChatViewHeader.qml
@@ -151,12 +151,29 @@ Rectangle {
Searchbar {
id: rowSearchBar
+ reductionEnabled: true
+
Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
Layout.preferredHeight: 30
- Layout.preferredWidth: 30 + (isOpen? JamiTheme.searchbarSize : 0)
+ Layout.preferredWidth: 40 + (isOpen? JamiTheme.searchbarSize : 0)
+ colorSearchBar: JamiTheme.backgroundColor
+
+ Behavior on Layout.preferredWidth {
+ NumberAnimation {
+ duration: 150
+ }
+ }
visible: root.swarmDetailsVisibility
+ onSearchBarTextChanged: function(text){
+ MessagesAdapter.searchbarPrompt = text;
+ }
+
+ onSearchClicked: {
+ root.searchClicked();
+ }
+
Shortcut {
sequence: "Ctrl+Shift+F"
context: Qt.ApplicationShortcut
diff --git a/src/app/mainview/components/ContactPicker.qml b/src/app/mainview/components/ContactPicker.qml
index df0eecfcf..cddfd72ad 100644
--- a/src/app/mainview/components/ContactPicker.qml
+++ b/src/app/mainview/components/ContactPicker.qml
@@ -89,7 +89,7 @@ Popup {
}
}
- ContactSearchBar {
+ Searchbar {
id: contactPickerContactSearchBar
Layout.alignment: Qt.AlignCenter
@@ -99,7 +99,7 @@ Popup {
placeHolderText: type === ContactList.TRANSFER ? JamiStrings.transferTo : JamiStrings.addParticipant
- onContactSearchBarTextChanged: {
+ onSearchBarTextChanged: function(text){
ContactAdapter.setSearchFilter(text);
}
}
diff --git a/src/app/mainview/components/Searchbar.qml b/src/app/mainview/components/Searchbar.qml
index d562d65c9..a6b433b00 100644
--- a/src/app/mainview/components/Searchbar.qml
+++ b/src/app/mainview/components/Searchbar.qml
@@ -1,6 +1,5 @@
/*
- * Copyright (C) 2023 Savoir-faire Linux Inc.
- * Author: Nicolas Vengeon <nicolas.vengeon@savoirfairelinux.com>
+ * Copyright (C) 2020-2023 Savoir-faire Linux Inc.
*
* This program is free software; you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
@@ -16,45 +15,79 @@
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
import QtQuick
-import QtQuick.Layouts
import QtQuick.Controls
+import net.jami.Models 1.1
import net.jami.Adapters 1.1
import net.jami.Constants 1.1
import "../../commoncomponents"
-RowLayout {
+Rectangle {
id: root
+
+ signal searchBarTextChanged(string text)
+ signal returnPressedWhileSearching
+ signal searchClicked
+
+ property bool reductionEnabled: false
+ property alias textContent: textArea.text
+ property alias placeHolderText: textArea.placeholderText
+
+ property var colorSearchBar: JamiTheme.secondaryBackgroundColor
+
property string currentConversationId: CurrentConversation.id
- property bool isOpen: extrasPanel.isOpen(ChatView.MessagesResearchPanel)
+ property bool isOpen: reductionEnabled ? extrasPanel.isOpen(ChatView.MessagesResearchPanel) : true
onIsOpenChanged: {
if (isOpen)
textArea.forceActiveFocus()
}
+ function clearText() {
+ textArea.clear();
+ textArea.forceActiveFocus();
+ }
+
+ radius: JamiTheme.primaryRadius
+ color: isOpen ? colorSearchBar : "transparent"
+
+ onFocusChanged: {
+ if (focus) {
+ textArea.forceActiveFocus();
+ }
+ }
+
+ LineEditContextMenu {
+ id: lineEditContextMenu
+
+ lineEditObj: textArea
+ }
+
PushButton {
- id: startSearchMessages
- Layout.preferredHeight: 30
- Layout.preferredWidth: 30
+ id: startSearch
- source: JamiResources.search_svg
- normalColor: JamiTheme.chatviewBgColor
+ anchors.verticalCenter: root.verticalCenter
+ anchors.left: root.left
+ anchors.leftMargin: 10
+ hoverEnabled: reductionEnabled
+ enabled: reductionEnabled
+
+
+ source: JamiResources.ic_baseline_search_24dp_svg
+ normalColor: "transparent"
imageColor: JamiTheme.chatviewButtonColor
- onClicked: chatViewHeader.searchClicked()
+ onClicked: root.searchClicked()
}
Rectangle {
id: rectTextArea
- Layout.preferredHeight: startSearchMessages.height
- Layout.alignment: Qt.AlignVCenter
-
+ height: root.height-5
+ anchors.left: startSearch.right
+ anchors.right: root.right
+ anchors.verticalCenter: root.verticalCenter
color: "transparent"
- border.color: JamiTheme.chatviewTextColor
- radius: 10
- border.width: 2
opacity: isOpen
visible: opacity
@@ -65,7 +98,7 @@ RowLayout {
}
width: isOpen ? JamiTheme.searchbarSize : 0
- Behavior on Layout.preferredWidth {
+ Behavior on width {
NumberAnimation {
duration: 150
}
@@ -73,45 +106,54 @@ RowLayout {
TextField {
id: textArea
+
property bool dontShowFocusState: true
background.visible: false
- anchors.right: clearTextButton.left
- anchors.left: rectTextArea.left
+
+
+ anchors.verticalCenter: parent.verticalCenter
+ anchors.left: parent.left
+ anchors.right: textArea.text.length ? clearTextButton.left : parent.right
+
color: JamiTheme.chatviewTextColor
+
placeholderText: JamiStrings.search
placeholderTextColor: JamiTheme.chatviewTextColor
- onTextChanged: {
- MessagesAdapter.searchbarPrompt = text;
+ height: root.height - 5
+
+ font.pointSize: JamiTheme.textFontSize
+ font.kerning: true
+
+ onTextChanged: root.searchBarTextChanged(textArea.text)
+ onReleased: function (event) {
+ if (event.button === Qt.RightButton)
+ lineEditContextMenu.openMenuAt(event);
}
}
PushButton {
id: clearTextButton
- anchors.verticalCenter: rectTextArea.verticalCenter
- anchors.right: rectTextArea.right
- anchors.margins: 5
- preferredSize: 21
- radius: rectTextArea.radius
+ anchors.verticalCenter: parent.verticalCenter
+ anchors.right: parent.right
+ anchors.rightMargin: 15
+
+ preferredSize: 15
+ radius: JamiTheme.primaryRadius
+
visible: textArea.text.length
opacity: visible ? 1 : 0
- normalColor: "transparent"
- imageColor: JamiTheme.chatviewButtonColor
+
+ normalColor: root.color
+ imageColor: JamiTheme.primaryForegroundColor
+
source: JamiResources.ic_clear_24dp_svg
toolTipText: JamiStrings.clearText
- property string convId: CurrentConversation.id
- onConvIdChanged: {
- textArea.clear();
- }
-
- onClicked: {
- textArea.clear();
- textArea.forceActiveFocus();
- }
+ onClicked: textArea.clear()
Behavior on opacity {
NumberAnimation {
@@ -121,4 +163,13 @@ RowLayout {
}
}
}
+
+ Keys.onPressed: function (keyEvent) {
+ if (keyEvent.key === Qt.Key_Enter || keyEvent.key === Qt.Key_Return) {
+ if (textArea.text !== "") {
+ returnPressedWhileSearching();
+ keyEvent.accepted = true;
+ }
+ }
+ }
}
diff --git a/src/app/mainview/components/SidePanel.qml b/src/app/mainview/components/SidePanel.qml
index cd5b6166d..170ade693 100644
--- a/src/app/mainview/components/SidePanel.qml
+++ b/src/app/mainview/components/SidePanel.qml
@@ -244,13 +244,13 @@ SidePanelBase {
}
}
- ContactSearchBar {
+ Searchbar {
id: contactSearchBar
Layout.fillHeight: true
Layout.fillWidth: true
- onContactSearchBarTextChanged: function (text) {
+ onSearchBarTextChanged: function(text){
// not calling positionViewAtBeginning will cause
// sort animation visual bugs
conversationListView.positionViewAtBeginning()
--
GitLab