[prev in list] [next in list] [prev in thread] [next in thread]
List: kde-commits
Subject: [spacebar] app/package/contents/ui: [app] Split the emoji handling TextArea to separate file
From: Martin Klapetek <mklapetek () kde ! org>
Date: 2016-06-11 18:40:47
Message-ID: E1bBnpv-00088M-5O () scm ! kde ! org
[Download RAW message or body]
Git commit e3ba17be9227d1a9e9ee674e62e8f4cd16fd35c3 by Martin Klapetek.
Committed on 11/06/2016 at 18:38.
Pushed by mklapetek into branch 'master'.
[app] Split the emoji handling TextArea to separate file
M +4 -35 app/package/contents/ui/ConversationPage.qml
A +168 -0 app/package/contents/ui/EmojiTextArea.qml [License: LGPL (v2+)]
http://commits.kde.org/spacebar/e3ba17be9227d1a9e9ee674e62e8f4cd16fd35c3
diff --git a/app/package/contents/ui/ConversationPage.qml \
b/app/package/contents/ui/ConversationPage.qml index b5fa9b8..63d49ec 100644
--- a/app/package/contents/ui/ConversationPage.qml
+++ b/app/package/contents/ui/ConversationPage.qml
@@ -238,44 +238,13 @@ Kirigami.Page {
RowLayout {
- TextArea {
- id: messageTextField
+ EmojiTextArea {
+ id: emojiTextArea
Layout.fillWidth: true
Layout.minimumHeight: sendButton.height
- Layout.maximumHeight: lineCount * fontMetrics.lineSpacing + \
units.largeSpacing + Layout.maximumHeight: emojiTextArea.lineCount \
* emojiTextArea.lineSpacing + units.largeSpacing
- verticalScrollBarPolicy: Qt.ScrollBarAlwaysOff
- horizontalScrollBarPolicy: Qt.ScrollBarAlwaysOff
- wrapMode: TextEdit.WordWrap
-
- FontMetrics {
- id: fontMetrics
- font: messageTextField.font
- }
-
- Keys.onReturnPressed: {
- if (event.modifiers == Qt.NoModifier) {
- if (conversation.canSendMessages) {
- view.model.sendNewMessage(text);
- text = "";
- } else {
- // TODO better text
- showPassiveNotification(i18n("You need to connect \
first"), 3000);
- }
- } else if (event.modifiers != Qt.NoModifier) {
- event.accepted = false;
- }
- }
-
- Connections {
- target: conversationPage
- onInsertEmoji: {
- messageTextField.insert(messageTextField.cursorPosition, \
emoji + " ");
- }
- onFocusTextInput: {
- messageTextField.forceActiveFocus();
- }
- }
+ emojisAutocompletionModel: emojisModel
}
Button {
diff --git a/app/package/contents/ui/EmojiTextArea.qml \
b/app/package/contents/ui/EmojiTextArea.qml new file mode 100644
index 0000000..4a08c55
--- /dev/null
+++ b/app/package/contents/ui/EmojiTextArea.qml
@@ -0,0 +1,168 @@
+/**
+ * Copyright 2016 Martin Klapetek <mklapetek@kde.org>
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU Library General Public License as
+ * published by the Free Software Foundation; either version 2 or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details
+ *
+ * You should have received a copy of the GNU Library General Public
+ * License along with this program; if not, write to the
+ * Free Software Foundation, Inc.,
+ * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
+ */
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Layouts 1.1
+import org.kde.telepathy 0.1
+import org.kde.kirigami 1.0 as Kirigami
+import org.kde.plasma.core 2.1 as PlasmaCore
+
+TextArea {
+ id: messageTextField
+
+ verticalScrollBarPolicy: Qt.ScrollBarAlwaysOff
+ horizontalScrollBarPolicy: Qt.ScrollBarAlwaysOff
+ wrapMode: TextEdit.WordWrap
+ textFormat: TextEdit.RichText
+
+ property int acc: -1
+ property alias emojisAutocompletionModel: emojisAutocompletionFilter.sourceModel
+ property alias lineSpacing: fontMetrics.lineSpacing
+
+ FontMetrics {
+ id: fontMetrics
+ font: messageTextField.font
+ }
+
+ TextAreaEmojisHandler {
+ id: emojisHandler
+ textArea: messageTextField
+ }
+
+ Rectangle {
+ id: autoSuggest
+ color: "white"
+ width: parent.width
+ height: Math.min(emojiAutocompletionView.count * 32, 32 * 9)
+ visible: false
+ y: -height - units.smallSpacing
+ clip: true
+
+ function hide() {
+ emojisAutocompletionFilter.filterString = "";
+ messageTextField.acc = -1;
+ autoSuggest.visible = false;
+ }
+
+ ListView {
+ id: emojiAutocompletionView
+ anchors.fill: parent
+ model: PlasmaCore.SortFilterModel {
+ id: emojisAutocompletionFilter
+ filterRole: "emojiText"
+ sortRole: "emojiText"
+ }
+
+ delegate: MouseArea {
+ width: parent.width - units.smallSpacing
+ height: 32
+ x: units.smallSpacing
+ z: 250
+
+ onClicked: {
+ messageTextField.selectWord();
+ messageTextField.remove(messageTextField.selectionStart, \
messageTextField.selectionEnd); + \
messageTextField.insert(messageTextField.cursorPosition, model.emojiText.substr(1) + \
" "); + autoSuggest.visible = false;
+ messageTextField.acc = -1;
+ emojisAutocompletionFilter.filterString = "";
+ }
+
+ PlasmaCore.IconItem {
+ id: emojiIcon
+ height: 24
+ width: 24
+ anchors.left: parent.left
+ anchors.verticalCenter: parent.verticalCenter
+ source: model.emojiFullPath
+ }
+
+ Kirigami.Label {
+ anchors.left: emojiIcon.right
+ anchors.right: parent.right
+ anchors.verticalCenter: emojiIcon.verticalCenter
+ anchors.margins: units.largeSpacing
+ textFormat: Text.StyledText
+ text: model.emojiText ? \
model.emojiText.replace(emojisAutocompletionFilter.filterString, + \
"<b>" + emojisAutocompletionFilter.filterString + "</b>") + \
: ""; + }
+ }
+ }
+ }
+
+ Keys.onPressed: {
+ if (event.text == ":") {
+ if (acc > 0) {
+ autoSuggest.hide();
+ } else {
+ acc = 0;
+ }
+ return;
+ }
+
+ if (acc == -1) {
+ return;
+ }
+
+ if (event.key == Qt.Key_Space || event.key == Qt.Key_Escape) {
+ autoSuggest.hide();
+ }
+
+ acc++;
+
+ if (event.key == Qt.Key_Backspace) {
+ emojisAutocompletionFilter.filterString = \
emojisAutocompletionFilter.filterString.slice(0, -1); + if \
(emojisAutocompletionFilter.filterString.length == 0) { + \
autoSuggest.hide(); + }
+ } else {
+ emojisAutocompletionFilter.filterString = \
emojisAutocompletionFilter.filterString + event.text; + }
+
+ if (acc >= 2) {
+ autoSuggest.visible = true;
+ }
+ }
+
+ Keys.onReturnPressed: {
+ if (event.modifiers == Qt.NoModifier) {
+ if (conversation.canSendMessages) {
+ view.model.sendNewMessage(emojisHandler.getText());
+ text = "";
+ } else {
+ // TODO better text
+ showPassiveNotification(i18n("You need to connect first"), 3000);
+ }
+ } else if (event.modifiers != Qt.NoModifier) {
+ event.accepted = false;
+ }
+ }
+
+ Connections {
+ target: conversationPage
+ onInsertEmoji: {
+ messageTextField.insert(messageTextField.cursorPosition, emoji + " ");
+ }
+ onFocusTextInput: {
+ messageTextField.forceActiveFocus();
+ }
+ }
+}
[prev in list] [next in list] [prev in thread] [next in thread]
Configure |
About |
News |
Add a list |
Sponsored by KoreLogic