Get rid of old emoji picker

resources/qml/MessageInput.qml

@@ -457,13 +457,13 @@ Rectangle {
             image: ":/icons/icons/ui/smile.svg"
             ToolTip.visible: hovered
             ToolTip.text: qsTr("Emoji")
-            onClicked: emojiPopup2.visible ? emojiPopup2.close() : emojiPopup2.show(emojiButton, room.roomId, function(plaintext, markdown) {
+            onClicked: emojiPopup.visible ? emojiPopup.close() : emojiPopup.show(emojiButton, room.roomId, function(plaintext, markdown) {
                 messageInput.insert(messageInput.cursorPosition, markdown);
                 TimelineManager.focusMessageInput();
             })
 
             StickerPicker {
-                id: emojiPopup2
+                id: emojiPopup
 
                 colors: Nheko.colors
                 emoji: true

resources/qml/MessageView.qml

@@ -149,9 +149,9 @@ Item {
                     ToolTip.visible: hovered
                     ToolTip.delay: Nheko.tooltipDelay
                     ToolTip.text: qsTr("React")
-                    onClicked: emojiPopup.visible ? emojiPopup.close() : emojiPopup.show(reactButton, function(emoji) {
+                    onClicked: emojiPopup.visible ? emojiPopup.close() : emojiPopup.show(reactButton, room.roomId, function(plaintext, markdown) {
                         var event_id = row.model ? row.model.eventId : "";
-                        room.input.reaction(event_id, emoji);
+                        room.input.reaction(event_id, plaintext);
                         TimelineManager.focusMessageInput();
                     })
                 }
@@ -666,8 +666,9 @@ Item {
 
             visible: room ? room.permissions.canSend(MtxEvent.Reaction) : false
             text: qsTr("Re&act")
-            onTriggered: emojiPopup.show(null, function(emoji) {
+            onTriggered: emojiPopup.visible ? emojiPopup.close() : emojiPopup.show(null, room.roomId, function(plaintext, markdown) {
-                room.input.reaction(messageContextMenu.eventId, emoji);
+                room.input.reaction(messageContextMenu.eventId, plaintext);
+                TimelineManager.focusMessageInput();
             })
         }
 

resources/qml/Root.qml

@@ -43,13 +43,6 @@ Pane {
     //    repeat: true
     //}
 
-    EmojiPicker {
-        id: emojiPopup
-
-        colors: palette
-        model: TimelineManager.completerFor("allemoji", "")
-    }
-
     function showAliasEditor(settings) {
         var component = Qt.createComponent("qrc:/qml/dialogs/AliasEditor.qml")
         if (component.status == Component.Ready) {

resources/qml/TimelineView.qml

@@ -29,6 +29,13 @@ Item {
 
     onRoomChanged: if (room != null) room.triggerSpecialEffects()
 
+    StickerPicker {
+        id: emojiPopup
+
+        colors: Nheko.colors
+        emoji: true
+    }
+
     // focus message input on key press, but not on Ctrl-C and such.
     Keys.onPressed: {
         if (event.text && event.key !== Qt.Key_Enter && event.key !== Qt.Key_Return && !topBar.searchHasFocus) {

resources/qml/emoji/EmojiPicker.qml

@@ -1,307 +0,0 @@
-// SPDX-FileCopyrightText: Nheko Contributors
-//
-// SPDX-License-Identifier: GPL-3.0-or-later
-
-import "../"
-import QtGraphicalEffects 1.0
-import QtQuick 2.9
-import QtQuick.Controls 2.3
-import QtQuick.Layouts 1.3
-import QtQuick.Window 2.15
-import im.nheko 1.0
-import im.nheko.EmojiModel 1.0
-
-Menu {
-    id: emojiPopup
-
-    property var callback
-    property var colors
-    property alias model: gridView.model
-    property var textArea
-    property string emojiCategory: "people"
-    property real highlightHue: Nheko.colors.highlight.hslHue
-    property real highlightSat: Nheko.colors.highlight.hslSaturation
-    property real highlightLight: Nheko.colors.highlight.hslLightness
-
-    function show(showAt, callback) {
-        console.debug("Showing emojiPicker");
-        emojiPopup.callback = callback;
-        popup(showAt ? showAt : null);
-    }
-
-    margins: 2
-    bottomPadding: 0
-    leftPadding: 0
-    rightPadding: 0
-    topPadding: 0
-    modal: true
-    focus: true
-    closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
-    //height: columnView.implicitHeight + 4
-    //width: columnView.implicitWidth
-    width: 7 * 52 + 20
-
-    Rectangle {
-        color: Nheko.colors.window
-        height: columnView.implicitHeight + Nheko.paddingSmall*2
-        width: 7 * 52 + 20
-
-        ColumnLayout {
-            id: columnView
-
-            spacing: Nheko.paddingSmall
-            anchors.leftMargin: Nheko.paddingSmall
-            anchors.rightMargin: Nheko.paddingSmall
-            anchors.bottom: parent.bottom
-            anchors.left: parent.left
-            anchors.right: parent.right
-
-            // Search field
-            TextField {
-                id: emojiSearch
-
-                Layout.preferredWidth: 7 * 52 + 20 - Nheko.paddingSmall
-                palette: Nheko.colors
-                background: null
-                placeholderTextColor: Nheko.colors.buttonText
-                color: Nheko.colors.text
-                placeholderText: qsTr("Search")
-                selectByMouse: true
-                rightPadding: clearSearch.width
-                onTextChanged: searchTimer.restart()
-                onVisibleChanged: {
-                    if (visible)
-                    forceActiveFocus();
-                    else
-                    clear();
-                }
-
-                Timer {
-                    id: searchTimer
-
-                    interval: 350 // tweak as needed?
-                    onTriggered: {
-                        emojiPopup.model.searchString = emojiSearch.text;
-                        emojiPopup.model.category = Emoji.Category.Search;
-                    }
-                }
-
-                ImageButton {
-                    id: clearSearch
-
-                    visible: emojiSearch.text !== ''
-
-                    image: ":/icons/icons/ui/round-remove-button.svg"
-                    focusPolicy: Qt.NoFocus
-                    onClicked: emojiSearch.clear()
-                    hoverEnabled: true
-                    anchors {
-                        top: parent.top
-                        bottom: parent.bottom
-                        right: parent.right
-                        rightMargin: Nheko.paddingSmall
-                    }
-                }
-            }
-
-            // emoji grid
-            GridView {
-                id: gridView
-
-                Layout.preferredHeight: cellHeight * 5
-                Layout.preferredWidth: 7 * 52 + 20
-                cellWidth: 52
-                cellHeight: 52
-                boundsBehavior: Flickable.StopAtBounds
-                clip: true
-                currentIndex: -1 // prevent sorting from stealing focus
-                cacheBuffer: 500
-
-                ScrollHelper {
-                    flickable: parent
-                    anchors.fill: parent
-                    enabled: !Settings.mobileMode
-                }
-
-                // Individual emoji
-                delegate: AbstractButton {
-                    width: 48
-                    height: 48
-                    hoverEnabled: true
-                    ToolTip.text: model.toolTip
-                    ToolTip.visible: hovered
-                    // TODO: maybe add favorites at some point?
-                    onClicked: {
-                        console.debug("Picked " + model.unicode);
-                        emojiPopup.close();
-                        callback(model.unicode);
-                    }
-
-                    // give the emoji a little oomf
-                    // DropShadow {
-                    //     width: parent.width
-                    //     height: parent.height
-                    //     horizontalOffset: 3
-                    //     verticalOffset: 3
-                    //     radius: 8
-                    //     samples: 17
-                    //     color: "#80000000"
-                    //     source: parent.contentItem
-                    // }
-
-                    contentItem: Text {
-                        horizontalAlignment: Text.AlignHCenter
-                        verticalAlignment: Text.AlignVCenter
-                        font.family: Settings.emojiFont
-                        font.pixelSize: 36
-                        text: model.unicode.replace('\ufe0f', '')
-                        color: Nheko.colors.text
-                    }
-
-                    background: Rectangle {
-                        anchors.fill: parent
-                        color: hovered ? Nheko.colors.highlight : 'transparent'
-                        radius: 5
-                    }
-
-                }
-
-                ScrollBar.vertical: ScrollBar {
-                    id: emojiScroll
-                }
-
-            }
-
-            // Separator
-            Rectangle {
-                visible: emojiSearch.text === ''
-                Layout.fillWidth: true
-                Layout.preferredHeight: 1
-                color: emojiPopup.Nheko.theme.separator
-            }
-
-            // Category picker row
-            RowLayout {
-                visible: emojiSearch.text === ''
-                Layout.bottomMargin: 0
-                Layout.preferredHeight: 42
-                implicitHeight: 42
-                Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom
-
-                // Display the normal categories
-                Repeater {
-
-                    model: ListModel {
-                        // TODO: Would like to get 'simple' icons for the categories
-                        ListElement {
-                            image: ":/icons/icons/emoji-categories/people.svg"
-                            category: Emoji.Category.People
-                        }
-
-                        ListElement {
-                            image: ":/icons/icons/emoji-categories/nature.svg"
-                            category: Emoji.Category.Nature
-                        }
-
-                        ListElement {
-                            image: ":/icons/icons/emoji-categories/foods.svg"
-                            category: Emoji.Category.Food
-                        }
-
-                        ListElement {
-                            image: ":/icons/icons/emoji-categories/activity.svg"
-                            category: Emoji.Category.Activity
-                        }
-
-                        ListElement {
-                            image: ":/icons/icons/emoji-categories/travel.svg"
-                            category: Emoji.Category.Travel
-                        }
-
-                        ListElement {
-                            image: ":/icons/icons/emoji-categories/objects.svg"
-                            category: Emoji.Category.Objects
-                        }
-
-                        ListElement {
-                            image: ":/icons/icons/emoji-categories/symbols.svg"
-                            category: Emoji.Category.Symbols
-                        }
-
-                        ListElement {
-                            image: ":/icons/icons/emoji-categories/flags.svg"
-                            category: Emoji.Category.Flags
-                        }
-
-                    }
-
-                    delegate: AbstractButton {
-                        Layout.preferredWidth: 36
-                        Layout.preferredHeight: 36
-                        hoverEnabled: true
-                        leftPadding: 2
-                        rightPadding: 2
-                        topPadding: 2
-                        bottomPadding: 2
-                        ToolTip.text: {
-                            switch (model.category) {
-                            case Emoji.Category.People:
-                                return qsTr('People');
-                            case Emoji.Category.Nature:
-                                return qsTr('Nature');
-                            case Emoji.Category.Food:
-                                return qsTr('Food');
-                            case Emoji.Category.Activity:
-                                return qsTr('Activity');
-                            case Emoji.Category.Travel:
-                                return qsTr('Travel');
-                            case Emoji.Category.Objects:
-                                return qsTr('Objects');
-                            case Emoji.Category.Symbols:
-                                return qsTr('Symbols');
-                            case Emoji.Category.Flags:
-                                return qsTr('Flags');
-                            }
-                        }
-                        ToolTip.visible: hovered
-                        onClicked: {
-                            //emojiPopup.model.category = model.category;
-                            gridView.positionViewAtIndex(emojiPopup.model.sourceModel.categoryToIndex(model.category), GridView.Beginning);
-                        }
-
-                        MouseArea {
-                            id: mouseArea
-
-                            anchors.fill: parent
-                            onPressed: mouse.accepted = false
-                            cursorShape: Qt.PointingHandCursor
-                        }
-
-                        contentItem: Image {
-                            horizontalAlignment: Image.AlignHCenter
-                            verticalAlignment: Image.AlignVCenter
-                            smooth: true
-                            mipmap: true
-                            sourceSize.width: 32
-                            sourceSize.height: 32
-                            source: "image://colorimage/" + model.image + "?" + (hovered ? Nheko.colors.highlight : Nheko.colors.buttonText)
-                        }
-
-                        background: Rectangle {
-                            anchors.fill: parent
-                            color: emojiPopup.model.category === model.category ? Qt.hsla(highlightHue, highlightSat, highlightLight, 0.2) : 'transparent'
-                            radius: 5
-                            border.color: emojiPopup.model.category === model.category ? Nheko.colors.highlight : 'transparent'
-                        }
-
-                    }
-
-                }
-
-            }
-
-        }
-
-    }
-
-}

resources/res.qrc

@@ -176,7 +176,6 @@
         <file>qml/dialogs/AllowedRoomsSettingsDialog.qml</file>
         <file>qml/dialogs/RoomSettings.qml</file>
         <file>qml/dialogs/UserProfile.qml</file>
-        <file>qml/emoji/EmojiPicker.qml</file>
         <file>qml/emoji/StickerPicker.qml</file>
         <file>qml/pages/LoginPage.qml</file>
         <file>qml/pages/RegisterPage.qml</file>