ESCA111/neochat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

This splits ChatTextInput into ChatBox and a handful of subcomponents.

Browse Source 
- ChatBar: Contains the main TextArea and standard buttons.
  - Usually visible, but can be disabled when necessary.
- AttachmentPane: Contains an image when attaching an image and also a filename with mimetype icon.
  - Has a toolbar to cancel the attachment or edit it if it's an image.
  - Shown when there is an attachment.
- ReplyPane: Shows who you are replying to and the content of their message.
  - Also shows edits and has a button to cancel replies/edits
  - Shown when replying or editing
- CompletionMenu
  - Now a vertical list using a QQC2.Popup
  - Either a Pane or a Menu/Popup
- EmojiPickerPane

@teams/vdg
This commit is contained in:
Noah Davis
2021-03-17 23:48:06 +00:00
committed by Carl Schwan
parent b67f03d33f
commit 38e2c7222b
10 changed files with 1103 additions and 690 deletions
Download Patch File Download Diff File Expand all files Collapse all files

202
imports/NeoChat/Component/ChatBox/AttachmentPane.qml Normal file
View File

@@ -0,0 +1,202 @@
/* SPDX-FileCopyrightText: 2020 Carl Schwan <carl@carlschwan.de>
* SPDX-FileCopyrightText: 2020 Noah Davis <noahadvs@gmail.com>
* SPDX-License-Identifier: GPL-2.0-or-later
*/
import QtQuick 2.15
import QtQuick.Layouts 1.15
import QtQuick.Controls 2.15
import org.kde.kirigami 2.14 as Kirigami
import NeoChat.Page 1.0
import org.kde.neochat 1.0
Loader {
id: root
property string attachmentPath: ""
property var attachmentMimetype: FileType.mimeTypeForUrl(attachmentPath)
readonly property bool hasImage: attachmentMimetype.valid && FileType.supportedImageFormats.includes(attachmentMimetype.preferredSuffix)
signal clearAttachmentTriggered()
active: visible
sourceComponent: Component {
Pane {
id: attachmentPane
property string baseFileName: attachmentPath.toString().substring(attachmentPath.toString().lastIndexOf('/') + 1, attachmentPath.length)
Kirigami.Theme.colorSet: Kirigami.Theme.View
contentItem: Item {
property real spacing: attachmentPane.spacing > 0 ? attachmentPane.spacing : toolBar.spacing
implicitWidth: Math.max(image.implicitWidth, imageBusyIndicator.implicitWidth, fileInfoLayout.implicitWidth, toolBar.implicitWidth)
implicitHeight: Math.max(
(hasImage ? Math.max(image.preferredHeight, imageBusyIndicator.implicitHeight) + spacing : 0)
+ fileInfoLayout.implicitHeight,
toolBar.implicitHeight
)
Image {
id: image
property real preferredHeight: Math.min(implicitHeight, Kirigami.Units.gridUnit * 8)
height: preferredHeight
anchors {
horizontalCenter: parent.horizontalCenter
bottom: fileInfoLayout.top
bottomMargin: parent.spacing
}
width: Math.min(implicitWidth, attachmentPane.availableWidth)
asynchronous: true
cache: false // Cache is not needed. Images will rarely be shown repeatedly.
smooth: height == preferredHeight && parent.height == parent.implicitHeight // Don't smooth until height animation stops
source: hasImage ? attachmentPath : ""
visible: hasImage
fillMode: Image.PreserveAspectFit
onSourceChanged: {
// Reset source size height, which affect implicitHeight
sourceSize.height = -1
}
onSourceSizeChanged: {
if (implicitHeight > Kirigami.Units.gridUnit * 8) {
// This can save a lot of RAM when loading large images.
// It also improves visual quality for large images.
sourceSize.height = Kirigami.Units.gridUnit * 8
}
}
Behavior on height {
NumberAnimation {
property: "height"
duration: Kirigami.Units.shortDuration
easing.type: Easing.OutCubic
}
}
}
BusyIndicator {
id: imageBusyIndicator
anchors {
horizontalCenter: parent.horizontalCenter
top: parent.top
bottom: fileInfoLayout.top
bottomMargin: parent.spacing
}
visible: running
running: image.visible && image.progress < 1
}
RowLayout {
id: fileInfoLayout
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: undefined
anchors.bottom: parent.bottom
spacing: parent.spacing
Kirigami.Icon {
id: mimetypeIcon
implicitHeight: Kirigami.Units.fontMetrics.roundedIconSize(fileLabel.implicitHeight)
implicitWidth: implicitHeight
source: attachmentMimetype.iconName
}
Label {
id: fileLabel
text: baseFileName
}
states: State {
when: !hasImage
AnchorChanges {
target: fileInfoLayout
anchors.bottom: undefined
anchors.verticalCenter: parent.verticalCenter
}
}
}
// Using a toolbar to get a button spacing consistent with what the QQC2 style normally has
// Also has some accessibility info
ToolBar {
id: toolBar
width: parent.width
anchors.top: parent.top
leftPadding: 0
rightPadding: 0
topPadding: 0
bottomPadding: 0
Kirigami.Theme.inherit: true
Kirigami.Theme.colorSet: Kirigami.Theme.View
contentItem: RowLayout {
spacing: parent.spacing
Label {
Layout.leftMargin: -attachmentPane.leftPadding
Layout.topMargin: -attachmentPane.topPadding
leftPadding: cancelAttachmentButton.leftPadding + 1 + attachmentPane.leftPadding
rightPadding: cancelAttachmentButton.rightPadding + 1
topPadding: cancelAttachmentButton.topPadding + attachmentPane.topPadding
bottomPadding: cancelAttachmentButton.bottomPadding
text: i18n("Attachment:")
horizontalAlignment: Text.AlignLeft
verticalAlignment: Text.AlignVCenter
background: Kirigami.ShadowedRectangle {
property real cornerRadius: cancelAttachmentButton.background.hasOwnProperty("radius") ?
Math.min(cancelAttachmentButton.background.radius, height/2) : 0
corners.bottomLeftRadius: toolBar.mirrored ? cornerRadius : 0
corners.bottomRightRadius: toolBar.mirrored ? 0 : cornerRadius
color: Kirigami.Theme.backgroundColor
opacity: 0.75
}
}
Item {
Layout.fillWidth: true
}
Button {
id: editImageButton
visible: hasImage
icon.name: "document-edit"
text: i18n("Edit")
display: AbstractButton.IconOnly
Component {
id: imageEditorPage
ImageEditorPage {
imagePath: attachmentPath
}
}
onClicked: {
let imageEditor = applicationWindow().pageStack.layers.push(imageEditorPage);
imageEditor.newPathChanged.connect(function(newPath) {
applicationWindow().pageStack.layers.pop();
attachmentPath = newPath;
});
}
ToolTip.text: text
ToolTip.visible: hovered
}
Button {
id: cancelAttachmentButton
icon.name: "dialog-cancel"
text: i18n("Cancel")
display: AbstractButton.IconOnly
onClicked: {
clearAttachmentTriggered();
}
ToolTip.text: text
ToolTip.visible: hovered
}
}
background: null
}
}
background: Rectangle {
color: Kirigami.Theme.backgroundColor
}
}
}
}

342
imports/NeoChat/Component/ChatBox/ChatBar.qml Normal file
View File

@@ -0,0 +1,342 @@
/* SPDX-FileCopyrightText: 2020 Carl Schwan <carl@carlschwan.de>
* SPDX-FileCopyrightText: 2020 Noah Davis <noahadvs@gmail.com>
* SPDX-License-Identifier: GPL-2.0-or-later
*/
import QtQuick 2.15
import QtQuick.Layouts 1.15
import QtQuick.Controls 2.15
import Qt.labs.platform 1.0 as Platform
import org.kde.kirigami 2.14 as Kirigami
import org.kde.neochat 1.0
ToolBar {
id: chatBar
property string replyEventId: ""
property string editEventId: ""
property string inputFieldText: currentRoom ? currentRoom.cachedInput : ""
property alias textField: inputField
property alias emojiPaneOpened: emojiButton.checked
// store each user we autoComplete here, this will be helpful later to generate
// the matrix.to links.
// This use an hack to define: https://doc.qt.io/qt-5/qml-var.html#property-value-initialization-semantics
property var userAutocompleted: ({})
signal attachTriggered(string localPath)
signal closeAllTriggered()
signal inputFieldForceActiveFocusTriggered()
signal messageSent()
signal pasteImageTriggered()
property alias isCompleting: completionMenu.visible
onInputFieldForceActiveFocusTriggered: inputField.forceActiveFocus()
position: ToolBar.Footer
Kirigami.Theme.colorSet: Kirigami.Theme.View
// Using a custom background because some styles like Material
// or Fusion might have ugly colors for a TextArea placed inside
// of a toolbar. ToolBar is otherwise the closest QQC2 component
// to what we want because of the padding and spacing values.
background: Rectangle {
color: Kirigami.Theme.backgroundColor
}
contentItem: RowLayout {
spacing: chatBar.spacing
ScrollView {
Layout.fillHeight: true
Layout.fillWidth: true
Layout.minimumHeight: inputField.implicitHeight
// lineSpacing is height+leading, so subtract leading once since leading only exists between lines.
Layout.maximumHeight: fontMetrics.lineSpacing * 8 - fontMetrics.leading
+ inputField.topPadding + inputField.bottomPadding
FontMetrics {
id: fontMetrics
font: inputField.font
}
TextArea {
id: inputField
focus: true
/* Some QQC2 styles will have their own predefined backgrounds for TextAreas.
* Make sure there is no background since we are using the ToolBar background.
*
* This could cause a problem if the QQC2 style was designed around TextArea
* background colors being very different from the QPalette::Base color.
* Luckily, none of the Qt QQC2 styles do that and neither do KDE's QQC2 styles.
*/
background: null
leftPadding: mirrored ? 0 : Kirigami.Units.largeSpacing
rightPadding: !mirrored ? 0 : Kirigami.Units.largeSpacing
topPadding: 0
bottomPadding: 0
property real progress: 0
property bool autoAppeared: false
//property int lineHeight: contentHeight / lineCount
text: inputFieldText
placeholderText: editEventId.length > 0 ? i18n("Edit Message") : i18n("Write your message...")
verticalAlignment: TextEdit.AlignVCenter
horizontalAlignment: TextEdit.AlignLeft
wrapMode: Text.Wrap
ChatDocumentHandler {
id: documentHandler
document: inputField.textDocument
cursorPosition: inputField.cursorPosition
selectionStart: inputField.selectionStart
selectionEnd: inputField.selectionEnd
room: currentRoom ?? null
}
Timer {
id: timeoutTimer
repeat: false
interval: 2000
onTriggered: {
repeatTimer.stop()
currentRoom.sendTypingNotification(false)
}
}
Timer {
id: repeatTimer
repeat: true
interval: 5000
triggeredOnStart: true
onTriggered: currentRoom.sendTypingNotification(true)
}
Keys.onReturnPressed: {
if (isCompleting) {
chatBar.complete();
isCompleting = false;
return;
}
if (event.modifiers & Qt.ShiftModifier) {
inputField.insert(cursorPosition, "\n")
} else {
chatBar.postMessage()
}
}
Keys.onEscapePressed: {
closeAllTriggered()
}
Keys.onPressed: {
if (event.key === Qt.Key_PageDown) {
switchRoomDown();
} else if (event.key === Qt.Key_PageUp) {
switchRoomUp();
} else if (event.key === Qt.Key_V && event.modifiers & Qt.ControlModifier) {
chatBar.pasteImage();
}
}
Keys.onBacktabPressed: {
if (event.modifiers & Qt.ControlModifier) {
switchRoomUp();
return;
}
if (isCompleting) {
let decrementedIndex = completionMenu.currentIndex - 1
// Wrap around to the last item
if (decrementedIndex < 0) {
decrementedIndex = Math.max(completionMenu.count - 1, 0) // 0 if count == 0
}
completionMenu.currentIndex = decrementedIndex
}
}
Keys.onTabPressed: {
if (event.modifiers & Qt.ControlModifier) {
switchRoomDown();
return;
}
if (!isCompleting) {
return;
}
// TODO detect moved cursor
// ignore first time tab was clicked so that user can select
// first emoji/user
if (autoAppeared === false) {
let incrementedIndex = completionMenu.currentIndex + 1;
// Wrap around to the first item
if (incrementedIndex > completionMenu.count - 1) {
incrementedIndex = 0
}
completionMenu.currentIndex = incrementedIndex;
} else {
autoAppeared = false;
}
chatBar.complete();
}
onTextChanged: {
timeoutTimer.restart()
repeatTimer.start()
currentRoom.cachedInput = text
autoAppeared = false;
const completionInfo = documentHandler.getAutocompletionInfo();
if (completionInfo.type === ChatDocumentHandler.Ignore) {
return;
}
if (completionInfo.type === ChatDocumentHandler.None) {
isCompleting = false;
return;
}
if (completionInfo.type === ChatDocumentHandler.User) {
completionMenu.isCompletingEmoji = false
completionMenu.model = currentRoom.getUsers(completionInfo.keyword);
} else {
completionMenu.isCompletingEmoji = true
completionMenu.model = completionMenu.emojiModel.filterModel(completionInfo.keyword);
}
if (completionMenu.model.length === 0) {
isCompleting = false;
return;
}
isCompleting = true
autoAppeared = true;
completionMenu.endPosition = cursorPosition
}
}
}
Item {
visible: !isReply && (!hasAttachment || uploadingBusySpinner.running)
implicitWidth: uploadButton.implicitWidth
implicitHeight: uploadButton.implicitHeight
ToolButton {
id: uploadButton
anchors.fill: parent
// Matrix does not allow sending attachments in replies
visible: !isReply && !hasAttachment && !uploadingBusySpinner.running
icon.name: "mail-attachment"
text: i18n("Attach an image or file")
display: AbstractButton.IconOnly
onClicked: {
if (Clipboard.hasImage) {
attachDialog.open()
} else {
var fileDialog = openFileDialog.createObject(ApplicationWindow.overlay)
fileDialog.chosen.connect((path) => {
if (!path) { return }
attachTriggered(path)
})
fileDialog.open()
}
}
ToolTip.text: text
ToolTip.visible: hovered
}
BusyIndicator {
id: uploadingBusySpinner
anchors.fill: parent
visible: running
running: currentRoom && currentRoom.hasFileUploading
}
}
ToolButton {
id: emojiButton
icon.name: "preferences-desktop-emoticons"
text: i18n("Add an Emoji")
display: AbstractButton.IconOnly
checkable: true
ToolTip.text: text
ToolTip.visible: hovered
}
ToolButton {
id: sendButton
icon.name: "document-send"
text: i18n("Send message")
display: AbstractButton.IconOnly
onClicked: {
chatBar.postMessage()
}
ToolTip.text: text
ToolTip.visible: hovered
}
}
Action {
id: pasteAction
shortcut: StandardKey.Paste
onTriggered: {
if (Clipboard.hasImage) {
pasteImageTriggered();
}
activeFocusItem.paste();
}
}
CompletionMenu {
id: completionMenu
width: parent.width
//height: 80 //Math.min(implicitHeight, delegate.implicitHeight * 6)
height: implicitHeight
y: -height - 1
z: 1
Behavior on height {
NumberAnimation {
property: "height"
duration: Kirigami.Units.shortDuration
easing.type: Easing.OutCubic
}
}
onCompleteTriggered: {
complete()
isCompleting = false;
}
}
function pasteImage() {
let localPath = Platform.StandardPaths.writableLocation(Platform.StandardPaths.CacheLocation) + "/screenshots/" + (new Date()).getTime() + ".png";
if (!Clipboard.saveImage(localPath)) {
return;
}
attachTriggered(localPath)
}
function postMessage() {
checkForFancyEffectsReason();
roomManager.actionsHandler.postMessage(inputField.text.trim(), attachmentPath,
replyEventId, editEventId, userAutocompleted);
currentRoom.markAllMessagesAsRead();
inputField.clear();
inputField.text = Qt.binding(function() {
return currentRoom ? currentRoom.cachedInput : "";
});
messageSent()
}
function complete() {
documentHandler.replaceAutoComplete(completionMenu.currentDisplayText);
if (!completionMenu.isCompletingEmoji) {
userAutocompleted[completionMenu.currentDisplayText] = completionMenu.currentUserId;
}
}
}

294
imports/NeoChat/Component/ChatBox/ChatBox.qml Normal file
View File

@@ -0,0 +1,294 @@
/* SPDX-FileCopyrightText: 2020 Carl Schwan <carl@carlschwan.de>
* SPDX-FileCopyrightText: 2020 Noah Davis <noahadvs@gmail.com>
* SPDX-License-Identifier: GPL-2.0-or-later
*/
import QtQuick 2.15
import Qt.labs.platform 1.0 as Platform
import org.kde.kirigami 2.14 as Kirigami
import NeoChat.Component.ChatBox 1.0
import NeoChat.Component.Emoji 1.0
import org.kde.neochat 1.0
Item {
id: root
readonly property bool isReply: replyEventId.length > 0
property var replyUser
property alias replyEventId: chatBar.replyEventId
property string replyContent: ""
readonly property bool hasAttachment: attachmentPath.length > 0
property string attachmentPath: ""
property alias inputFieldText: chatBar.inputFieldText
readonly property bool isEdit: editEventId.length > 0
property alias editEventId: chatBar.editEventId
signal fancyEffectsReasonFound(string fancyEffect)
Kirigami.Theme.colorSet: Kirigami.Theme.View
implicitWidth: {
let w = 0
for(let i = 0; i < visibleChildren.length; ++i) {
w = Math.max(w, Math.ceil(visibleChildren[i].implicitWidth))
}
return w
}
implicitHeight: {
let h = 0
for(let i = 0; i < visibleChildren.length; ++i) {
h += Math.ceil(visibleChildren[i].implicitHeight)
}
return h
}
// For some reason, this is needed to make the height animation work even though
// it used to work and height should be directly affected by implicitHeight
height: implicitHeight
Behavior on height {
NumberAnimation {
property: "height"
duration: Kirigami.Units.shortDuration
easing.type: Easing.OutCubic
}
}
Kirigami.Separator {
id: emojiPickerLoaderSeparator
visible: emojiPickerLoader.visible
width: parent.width
height: visible ? implicitHeight : 0
anchors.bottom: emojiPickerLoader.top
z: 1
}
Loader {
id: emojiPickerLoader
active: visible
visible: chatBar.emojiPaneOpened
width: parent.width
height: visible ? implicitHeight : 0
anchors.bottom: replySeparator.top
sourceComponent: EmojiPicker{
textArea: chatBar.textField
emojiModel: EmojiModel { id: emojiModel }
}
Behavior on height {
NumberAnimation {
property: "height"
duration: Kirigami.Units.shortDuration
easing.type: Easing.OutCubic
}
}
}
Kirigami.Separator {
id: replySeparator
visible: replyPane.visible
width: parent.width
height: visible ? implicitHeight : 0
anchors.bottom: replyPane.top
}
ReplyPane {
id: replyPane
visible: isReply || isEdit
isEdit: root.isEdit
user: root.replyUser
content: root.replyContent
width: parent.width
height: visible ? implicitHeight : 0
anchors.bottom: attachmentSeparator.top
Behavior on height {
NumberAnimation {
property: "height"
duration: Kirigami.Units.shortDuration
easing.type: Easing.OutCubic
}
}
}
Kirigami.Separator {
id: attachmentSeparator
visible: attachmentPane.visible
width: parent.width
height: visible ? implicitHeight : 0
anchors.bottom: attachmentPane.top
}
AttachmentPane {
id: attachmentPane
attachmentPath: root.attachmentPath
visible: hasAttachment
width: parent.width
height: visible ? implicitHeight : 0
anchors.bottom: chatBarSeparator.top
Behavior on height {
NumberAnimation {
property: "height"
duration: Kirigami.Units.shortDuration
easing.type: Easing.OutCubic
}
}
}
Kirigami.Separator {
id: chatBarSeparator
visible: chatBar.visible
width: parent.width
height: visible ? implicitHeight : 0
anchors.bottom: chatBar.top
}
ChatBar {
id: chatBar
visible: currentRoom.canSendEvent("m.room.message")
width: parent.width
height: visible ? implicitHeight : 0
anchors.bottom: parent.bottom
Behavior on height {
NumberAnimation {
property: "height"
duration: Kirigami.Units.shortDuration
easing.type: Easing.OutCubic
}
}
}
Connections {
target: replyPane
function onClearEditReplyTriggered() {
if (isEdit) {
clearEdit()
}
if (isReply) {
clearReply()
}
}
}
Connections {
target: attachmentPane
function onClearAttachmentTriggered() {
clearAttachment()
}
}
Connections {
target: chatBar
function onAttachTriggered(localPath) {
attach(localPath)
}
function onCloseAllTriggered() {
closeAll()
}
function onMessageSent() {
closeAll()
checkForFancyEffectsReason()
}
}
function checkForFancyEffectsReason() {
if (!Config.showFancyEffects) {
return
}
let text = root.inputFieldText.trim()
if (text.includes('\u{2744}')) {
root.fancyEffectsReasonFound("snowflake")
}
if (text.includes('\u{1F386}')) {
root.fancyEffectsReasonFound("fireworks")
}
if (text.includes('\u{1F387}')) {
root.fancyEffectsReasonFound("fireworks")
}
if (text.includes('\u{1F389}')) {
root.fancyEffectsReasonFound("confetti")
}
if (text.includes('\u{1F38A}')) {
root.fancyEffectsReasonFound("confetti")
}
}
function addText(text) {
root.inputFieldText = inputFieldText + text
}
function insertText(str) {
root.inputFieldText = inputFieldText.substr(0, inputField.cursorPosition) + str + inputFieldText.substr(inputField.cursorPosition)
}
function clearText() {
// ChatBar's TextArea syncs currentRoom.cachedInput with the TextArea's text property
root.inputFieldText = ""
}
function focusInputField() {
chatBar.inputFieldForceActiveFocusTriggered()
}
function edit(editContent, editFormatedContent, editEventId) {
// Set the input field in edit mode
root.inputFieldText = editContent;
root.editEventId = editEventId;
root.replyContent = editContent;
// clean autocompletion list
chatBar.userAutocompleted = {};
// Fill autocompletion list with values extracted from message.
// We can't just iterate on every user in the list and try to
// find matching display name since some users have display name
// matching frequent words and this will marks too many words as
// mentions.
const regex = /<a href=\"https:\/\/matrix.to\/#\/(@[a-zA-Z09]*:[a-zA-Z09.]*)\">([^<]*)<\/a>/g;
let match;
while ((match = regex.exec(editFormatedContent.toString())) !== null) {
chatBar.userAutocompleted[match[2]] = match[1];
}
}
function clearEdit() {
// Clear input when edits are cancelled.
// Cached input will be
clearText()
clearReply()
root.editEventId = "";
}
function attach(localPath) {
root.attachmentPath = localPath
}
function clearAttachment() {
root.attachmentPath = ""
}
function clearReply() {
replyUser = null;
root.replyContent = "";
root.replyEventId = "";
// Don't clear input when replies are cancelled
}
function closeAll() {
if (hasAttachment) {
clearAttachment();
}
if (isEdit) {
clearEdit();
}
if (isReply) {
clearReply();
}
chatBar.emojiPaneOpened = false;
}
}

114
imports/NeoChat/Component/ChatBox/CompletionMenu.qml Normal file
View File

@@ -0,0 +1,114 @@
// SPDX-FileCopyrightText: 2020 Carl Schwan <carl@carlschwan.de>
// SPDX-FileCopyrightText: 2020 Noah Davis <noahadvs@gmail.com>
// SPDX-License-Identifier: GPL-2.0-or-later
import QtQuick 2.15
import QtQuick.Layouts 1.15
import QtQuick.Controls 2.15
import org.kde.kirigami 2.14 as Kirigami
import org.kde.neochat 1.0
Popup {
id: control
// Expose internal ListView properties.
property alias model: completionListView.model
property alias currentIndex: completionListView.currentIndex
property alias currentItem: completionListView.currentItem
property alias count: completionListView.count
property alias delegate: completionListView.delegate
// Autocomplee text
property string currentDisplayText: currentItem && currentItem.displayName ? currentItem.displayName : ""
property string currentUserId: currentItem && currentItem.id ? currentItem.id : ""
//FIXME: EmojiModel should probably be a singleton
property var emojiModel: EmojiModel {}
property bool isCompletingEmoji: false
property int beginPosition: 0
property int endPosition: 0
signal completeTriggered()
Kirigami.Theme.colorSet: Kirigami.Theme.View
bottomPadding: 0
leftPadding: 0
rightPadding: 0
topPadding: 0
clip: true
onVisibleChanged: if (!visible) {
completionListView.currentIndex = 0;
}
implicitHeight: Math.min(completionListView.contentHeight, Kirigami.Units.gridUnit * 5)
contentItem: ScrollView {
ListView {
id: completionListView
implicitWidth: contentWidth
model: control.model
delegate: isCompletingEmoji ? emojiDelegate : usernameDelegate
keyNavigationWraps: true
//interactive: Window.window ? contentHeight + control.topPadding + control.bottomPadding > Window.window.height : false
clip: true
currentIndex: control.currentIndex || 0
}
}
background: Rectangle {
color: Kirigami.Theme.backgroundColor
}
Component {
id: usernameDelegate
Kirigami.BasicListItem {
id: usernameItem
width: ListView.view.width ?? implicitWidth
property string displayName: modelData.displayName
leading: Kirigami.Avatar {
implicitHeight: Kirigami.Units.gridUnit
implicitWidth: implicitHeight
source: modelData.avatarMediaId ? ("image://mxc/" + modelData.avatarMediaId) : ""
color: modelData.color ? Qt.darker(modelData.color, 1.1) : null
}
text: modelData.displayName
onClicked: completeTriggered();
Component.onCompleted: {
completionMenu.currentUserId = Qt.binding(() => {
return modelData.id ?? "";
});
}
}
}
Component {
id: emojiDelegate
Kirigami.BasicListItem {
id: emojiItem
width: ListView.view.width ?? implicitWidth
property string displayName: modelData.unicode
text: modelData.unicode + " " + modelData.shortname
leading: Label {
id: unicodeLabel
Layout.preferredHeight: Kirigami.Units.gridUnit
Layout.preferredWidth: textMetrics.tightBoundingRect.width
font.pointSize: Kirigami.Units.gridUnit * 0.75
text: emojiItem.modelData.unicode
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
}
TextMetrics {
id: textMetrics
text: modelData.unicode
font: unicodeLabel.font
}
onClicked: completeTriggered();
}
}
}

116
imports/NeoChat/Component/ChatBox/ReplyPane.qml Normal file
View File

@@ -0,0 +1,116 @@
/* SPDX-FileCopyrightText: 2020 Carl Schwan <carl@carlschwan.de>
* SPDX-FileCopyrightText: 2020 Noah Davis <noahadvs@gmail.com>
* SPDX-License-Identifier: GPL-2.0-or-later
*/
import QtQuick 2.15
import QtQuick.Layouts 1.15
import QtQuick.Controls 2.15
import org.kde.kirigami 2.14 as Kirigami
Loader {
id: root
property bool isEdit: false
property var user: null
property string content: ""
property string avatarMediaUrl: user ? "image://mxc/" + replyUser.avatarMediaId : ""
signal clearEditReplyTriggered()
active: visible
sourceComponent: Pane {
id: replyPane
Kirigami.Theme.colorSet: Kirigami.Theme.View
spacing: leftPadding
contentItem: RowLayout {
Layout.fillWidth: true
spacing: replyPane.spacing
FontMetrics {
id: fontMetrics
font: textArea.font
}
Kirigami.Avatar {
id: avatar
Layout.alignment: textContentLayout.height > avatar.height ? Qt.AlignHCenter | Qt.AlignTop : Qt.AlignCenter
Layout.preferredWidth: Layout.preferredHeight
Layout.preferredHeight: fontMetrics.lineSpacing * 2 - fontMetrics.leading
source: root.avatarMediaUrl
name: user ? user.displayName : ""
color: user ? user.color : "transparent"
visible: Boolean(user)
}
ColumnLayout {
id: textContentLayout
Layout.alignment: Qt.AlignCenter
Layout.fillWidth: true
spacing: fontMetrics.leading
Label {
textFormat: TextEdit.RichText
wrapMode: Label.Wrap
text: {
let stylesheet = "<style>.user-pill{}</style>"
let heading = "<b>%1</b>"
let userName = user ? "<font color=\""+ user.color +"\">" + user.displayName + "</font>" : ""
if (isEdit) {
heading = heading.arg(i18n("Editing message:")) + "<br/>"
} else {
heading = heading.arg(i18n("Replying to %1:"))
heading = heading.arg(userName) + "<br/>"
}
return stylesheet + heading
}
}
ScrollView {
Layout.alignment: Qt.AlignLeft | Qt.AlignTop
Layout.fillWidth: true
Layout.maximumHeight: fontMetrics.lineSpacing * 8 - fontMetrics.leading
TextArea {
id: textArea
leftPadding: 0
rightPadding: 0
topPadding: 0
bottomPadding: 0
text: {
let stylesheet = "<style> a{color:"+Kirigami.Theme.linkColor+";}.user-pill{}</style>"
let userName = user ? "<font color=\""+ user.color +"\">" + user.displayName + "</font>" : ""
return stylesheet + content
}
selectByMouse: true
selectByKeyboard: true
readOnly: true
wrapMode: Label.Wrap
textFormat: TextEdit.RichText
background: null
HoverHandler {
cursorShape: textArea.hoveredLink ? Qt.PointingHandCursor : Qt.IBeamCursor
}
}
}
}
Button {
id: cancelReplyButton
Layout.alignment: avatar.Layout.alignment
icon.name: "dialog-cancel"
text: i18n("Cancel")
display: AbstractButton.IconOnly
onClicked: {
clearEditReplyTriggered()
}
ToolTip.text: text
ToolTip.visible: hovered
}
}
background: Rectangle {
color: Kirigami.Theme.backgroundColor
}
}
}

7
imports/NeoChat/Component/ChatBox/qmldir Normal file
View File

@@ -0,0 +1,7 @@
module NeoChat.Component.ChatBox
ChatBox 1.0 ChatBox.qml
ChatBar 1.0 ChatBar.qml
ReplyPane 1.0 ReplyPane.qml
AttachmentPane 1.0 AttachmentPane.qml
CompletionMenu 1.0 CompletionMenu.qml
EmojiPickerPane 1.0 EmojiPickerPane.qml

671
imports/NeoChat/Component/ChatTextInput.qml
View File

@@ -1,671 +0,0 @@
/**
* SPDX-FileCopyrightText: 2020 Carl Schwan <carl@carlschwan.de>
*
* SPDX-License-Identifier: GPL-2.0-or-later
*/
import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12
import Qt.labs.platform 1.0 as Platform
import org.kde.kirigami 2.13 as Kirigami
import NeoChat.Component 1.0
import NeoChat.Component.Emoji 1.0
import NeoChat.Dialog 1.0
import NeoChat.Page 1.0
import org.kde.neochat 1.0
ToolBar {
id: root
property alias isReply: replyItem.visible
property bool isReaction: false
property var replyUser
property string replyEventID: ""
property string replyContent: ""
property string editEventId
property alias isAutoCompleting: autoCompleteListView.visible
property var autoCompleteModel
property int autoCompleteBeginPosition
property int autoCompleteEndPosition
property bool hasAttachment: false
property url attachmentPath: ""
property var attachmentMimetype: FileType.mimeTypeForUrl(attachmentPath)
property bool hasImageAttachment: hasAttachment && attachmentMimetype.valid
&& FileType.supportedImageFormats.includes(attachmentMimetype.preferredSuffix)
signal fancyEffectsReasonFound(string fancyEffect)
position: ToolBar.Footer
function addText(text) {
inputField.insert(inputField.length, text)
}
Kirigami.Theme.colorSet: Kirigami.Theme.View
Action {
id: pasteAction
shortcut: StandardKey.Paste
onTriggered: {
if (Clipboard.hasImage) {
root.pasteImage();
}
activeFocusItem.paste();
}
}
contentItem: ColumnLayout {
id: layout
spacing: 0
EmojiPicker {
id: emojiPicker
Layout.fillWidth: true
visible: false
textArea: inputField
emojiModel: EmojiModel { id: emojiModel }
onChosen: {
textArea.insert(textArea.cursorPosition, emoji);
textArea.forceActiveFocus();
}
}
ColumnLayout {
Layout.fillWidth: true
Layout.margins: 8
id: replyItem
visible: false
RowLayout {
Kirigami.Avatar {
Layout.preferredWidth: Kirigami.Units.gridUnit
Layout.preferredHeight: Kirigami.Units.gridUnit
source: replyUser ? ("image://mxc/" + replyUser.avatarMediaId) : ""
name: replyUser ? replyUser.name : i18n("No name")
}
Label {
Layout.alignment: Qt.AlignVCenter
text: replyUser ? replyUser.displayName : i18n("No name")
rightPadding: 8
}
}
TextEdit {
Layout.fillWidth: true
text: "<style>a{color: " + color + ";} .user-pill{}</style>" + replyContent
color: Kirigami.Theme.textColor
selectByMouse: true
readOnly: true
wrapMode: Label.Wrap
textFormat: Text.RichText
selectedTextColor: "white"
}
}
ListView {
Layout.fillWidth: true
Layout.preferredHeight: 36
Layout.margins: 8
id: autoCompleteListView
visible: false
model: autoCompleteModel
clip: true
spacing: 4
orientation: ListView.Horizontal
highlightFollowsCurrentItem: true
keyNavigationWraps: true
delegate: Control {
readonly property string userId: modelData.id ?? ""
readonly property string displayText: modelData.displayName ?? modelData.unicode
readonly property bool isEmoji: modelData.unicode != null
readonly property bool highlighted: autoCompleteListView.currentIndex == index
padding: Kirigami.Units.smallSpacing
contentItem: RowLayout {
spacing: Kirigami.Units.largeSpacing
Label {
width: Kirigami.Units.gridUnit
height: Kirigami.Units.gridUnit
visible: isEmoji
text: displayText
font.family: "Emoji"
font.pointSize: 20
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
}
Kirigami.Avatar {
Layout.preferredWidth: Kirigami.Units.gridUnit
Layout.preferredHeight: Kirigami.Units.gridUnit
source: modelData.avatarMediaId ? ("image://mxc/" + modelData.avatarMediaId) : ""
color: modelData.color ? Qt.darker(modelData.color, 1.1) : null
visible: !isEmoji
}
Label {
Layout.fillHeight: true
visible: !isEmoji
text: displayText
color: highlighted ? Kirigami.Theme.highlightTextColor : Kirigami.Theme.textColor
font.underline: highlighted
verticalAlignment: Text.AlignVCenter
rightPadding: Kirigami.Units.largeSpacing
}
}
MouseArea {
anchors.fill: parent
onClicked: {
autoCompleteListView.currentIndex = index
inputField.autoComplete();
}
}
}
}
Kirigami.Separator {
Layout.fillWidth: true
Layout.preferredHeight: 1
visible: emojiPicker.visible || replyItem.visible || autoCompleteListView.visible
}
Image {
Layout.preferredHeight: Kirigami.Units.gridUnit * 10
source: attachmentPath
visible: hasImageAttachment
fillMode: Image.PreserveAspectFit
Layout.preferredWidth: paintedWidth
RowLayout {
anchors.right: parent.right
Button {
icon.name: "document-edit"
// HACK: Use a component because an url doesn't work
Component {
id: imageEditorPage
ImageEditorPage {
imagePath: attachmentPath
}
}
onClicked: {
let imageEditor = applicationWindow().pageStack.layers.push(imageEditorPage, {
imagePath: attachmentPath
});
imageEditor.newPathChanged.connect(function(newPath) {
applicationWindow().pageStack.layers.pop();
attachmentPath = newPath;
});
}
ToolTip {
text: i18n("Edit")
}
}
Button {
icon.name: "dialog-cancel"
onClicked: {
hasAttachment = false;
attachmentPath = "";
}
ToolTip {
text: i18n("Cancel")
}
}
}
Rectangle {
color: Qt.rgba(255, 255, 255, 40)
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
implicitHeight: fileLabel.implicitHeight
Label {
id: fileLabel
Layout.alignment: Qt.AlignVCenter
text: attachmentPath !== "" ? attachmentPath.toString().substring(attachmentPath.toString().lastIndexOf('/') + 1, attachmentPath.length) : ""
}
}
}
RowLayout {
visible: hasAttachment && !hasImageAttachment
ToolButton {
icon.name: "dialog-cancel"
onClicked: {
hasAttachment = false;
attachmentPath = "";
}
}
Kirigami.Icon {
id: mimetypeIcon
implicitHeight: Kirigami.Units.fontMetrics.roundedIconSize(horizontalFileLabel.implicitHeight)
implicitWidth: implicitHeight
source: attachmentMimetype.iconName
}
Label {
id: horizontalFileLabel
Layout.alignment: Qt.AlignVCenter
text: attachmentPath !== "" ? attachmentPath.toString().substring(attachmentPath.toString().lastIndexOf('/') + 1, attachmentPath.length) : ""
}
}
RowLayout {
visible: editEventId.length > 0
ToolButton {
icon.name: "dialog-cancel"
onClicked: clearEditReply();
}
Label {
Layout.alignment: Qt.AlignVCenter
text: i18n("Edit Message")
}
}
Kirigami.Separator {
Layout.fillWidth: true
Layout.preferredHeight: 1
visible: hasAttachment
}
RowLayout {
Layout.fillWidth: true
spacing: 0 //Kirigami.Units.smallSpacing
Button {
id: cancelReplyButton
visible: isReply
icon.name: "dialog-cancel"
onClicked: clearEditReply()
}
RowLayout {
Layout.fillHeight: true
Layout.preferredWidth: replyItem.visible ? Kirigami.Units.largeSpacing : Kirigami.Units.gridUnit * 2 + Kirigami.Units.smallSpacing + Kirigami.Units.largeSpacing
ToolButton {
id: uploadButton
visible: !isReply && !hasAttachment
icon.name: "mail-attachment"
onClicked: {
if (Clipboard.hasImage) {
attachDialog.open()
} else {
var fileDialog = openFileDialog.createObject(ApplicationWindow.overlay)
fileDialog.chosen.connect(function(path) {
if (!path) return
root.attach(path)
})
fileDialog.open()
}
}
ToolTip {
text: i18n("Attach an image or file")
}
BusyIndicator {
anchors.fill: parent
running: currentRoom && currentRoom.hasFileUploading
}
}
}
ScrollView {
Layout.fillWidth: true
Layout.maximumHeight: inputField.lineHeight * 8
TextArea {
id: inputField
property real progress: 0
property bool autoAppeared: false
// store each user we autoComplete here, this will be helpful later to generate
// the matrix.to links.
// This use an hack to define: https://doc.qt.io/qt-5/qml-var.html#property-value-initialization-semantics
property var userAutocompleted: ({})
ChatDocumentHandler {
id: documentHandler
document: inputField.textDocument
cursorPosition: inputField.cursorPosition
selectionStart: inputField.selectionStart
selectionEnd: inputField.selectionEnd
room: currentRoom ?? null
}
property int lineHeight: contentHeight / lineCount
wrapMode: Text.Wrap
placeholderText: i18n("Write your message...")
topPadding: 0
bottomPadding: 0
leftPadding: Kirigami.Units.smallSpacing
selectByMouse: true
verticalAlignment: TextEdit.AlignVCenter
enabled: room.canSendEvent("m.room.message")
text: currentRoom != null ? currentRoom.cachedInput : ""
background: MouseArea {
acceptedButtons: Qt.NoButton
cursorShape: Qt.IBeamCursor
z: 1
}
Rectangle {
width: currentRoom && currentRoom.hasFileUploading ? parent.width * currentRoom.fileUploadingProgress / 100 : 0
height: parent.height
opacity: 0.2
}
Timer {
id: timeoutTimer
repeat: false
interval: 2000
onTriggered: {
repeatTimer.stop()
currentRoom.sendTypingNotification(false)
}
}
Timer {
id: repeatTimer
repeat: true
interval: 5000
triggeredOnStart: true
onTriggered: currentRoom.sendTypingNotification(true)
}
Keys.onReturnPressed: {
if (isAutoCompleting) {
inputField.autoComplete();
isAutoCompleting = false;
return;
}
if (event.modifiers & Qt.ShiftModifier) {
insert(cursorPosition, "\n")
} else {
postMessage()
text = ""
clearEditReply()
closeAll()
}
}
Keys.onEscapePressed: {
clearEditReply();
closeAll();
}
Keys.onPressed: {
if (event.key === Qt.Key_PageDown) {
switchRoomDown();
} else if (event.key === Qt.Key_PageUp) {
switchRoomUp();
} else if (event.key === Qt.Key_V && event.modifiers & Qt.ControlModifier) {
root.pasteImage();
}
}
Keys.onBacktabPressed: {
if (event.modifiers & Qt.ControlModifier) {
switchRoomUp();
return;
}
if (isAutoCompleting) {
autoCompleteListView.decrementCurrentIndex();
}
}
Keys.onTabPressed: {
if (event.modifiers & Qt.ControlModifier) {
switchRoomDown();
return;
}
if (!isAutoCompleting) {
return;
}
// TODO detect moved cursor
// ignore first time tab was clicked so that user can select
// first emoji/user
if (autoAppeared === false) {
autoCompleteListView.incrementCurrentIndex()
} else {
autoAppeared = false;
}
inputField.autoComplete();
}
onTextChanged: {
timeoutTimer.restart()
repeatTimer.start()
currentRoom.cachedInput = text
autoAppeared = false;
const autocompletionInfo = documentHandler.getAutocompletionInfo();
if (autocompletionInfo.type === ChatDocumentHandler.Ignore) {
return;
}
if (autocompletionInfo.type === ChatDocumentHandler.None) {
isAutoCompleting = false;
autoCompleteListView.currentIndex = 0;
return;
}
if (autocompletionInfo.type === ChatDocumentHandler.User) {
autoCompleteModel = currentRoom.getUsers(autocompletionInfo.keyword);
} else {
autoCompleteModel = emojiModel.filterModel(autocompletionInfo.keyword);
}
if (autoCompleteModel.length === 0) {
isAutoCompleting = false;
autoCompleteListView.currentIndex = 0;
return;
}
isAutoCompleting = true
autoAppeared = true;
autoCompleteEndPosition = cursorPosition
}
function checkForFancyEffectsReason() {
if (!Config.showFancyEffects) {
return
}
var inputFieldText = inputField.text.trim()
if (inputFieldText.includes('\u{2744}')) {
root.fancyEffectsReasonFound("snowflake")
}
if (inputFieldText.includes('\u{1F386}')) {
root.fancyEffectsReasonFound("fireworks")
}
if (inputFieldText.includes('\u{1F387}')) {
root.fancyEffectsReasonFound("fireworks")
}
if (inputFieldText.includes('\u{1F389}')) {
root.fancyEffectsReasonFound("confetti")
}
if (inputFieldText.includes('\u{1F38A}')) {
root.fancyEffectsReasonFound("confetti")
}
}
function postMessage() {
checkForFancyEffectsReason();
roomManager.actionsHandler.postMessage(inputField.text.trim(), attachmentPath,
replyEventID, editEventId, inputField.userAutocompleted);
clearAttachment();
currentRoom.markAllMessagesAsRead();
clear();
text = Qt.binding(function() {
return currentRoom != null ? currentRoom.cachedInput : "";
});
}
function autoComplete() {
documentHandler.replaceAutoComplete(autoCompleteListView.currentItem.displayText)
if (!autoCompleteListView.currentItem.isEmoji) {
inputField.userAutocompleted[autoCompleteListView.currentItem.displayText] = autoCompleteListView.currentItem.userId;
}
}
}
}
ToolButton {
id: emojiButton
icon.name: "preferences-desktop-emoticons"
icon.color: "transparent"
checkable: true
checked: emojiPicker.visible
onToggled: emojiPicker.visible = !emojiPicker.visible
ToolTip {
text: i18n("Add an Emoji")
}
}
ToolButton {
icon.name: "document-send"
icon.color: "transparent"
enabled: inputField.length > 0 || hasAttachment
onClicked: {
inputField.postMessage()
inputField.text = ""
root.clearEditReply()
root.closeAll()
}
ToolTip {
text: i18n("Send message")
}
}
}
}
background: Rectangle {
implicitHeight: 40
color: Kirigami.Theme.backgroundColor
Kirigami.Separator {
anchors {
left: parent.left
right: parent.right
top: parent.top
}
}
}
function insert(str) {
inputField.insert(inputField.cursorPosition, str)
}
function clear() {
inputField.clear();
inputField.userAutocompleted = {};
}
function clearEditReply() {
isReply = false;
replyUser = null;
clear();
root.replyContent = "";
root.replyEventID = "";
root.editEventId = "";
focus();
}
function focus() {
inputField.forceActiveFocus()
}
function edit(editContent, editFormatedContent, editEventId) {
console.log("Editing ", editContent, "html:", editFormatedContent)
// Set the input field in edit mode
inputField.text = editContent;
root.editEventId = editEventId
// clean autocompletion list
inputField.userAutocompleted = {};
// Fill autocompletion list with values extracted from message.
// We can't just iterate on every user in the list and try to
// find matching display name since some users have display name
// matching frequent words and this will marks too many words as
// mentions.
const regex = /<a href=\"https:\/\/matrix.to\/#\/(@[a-zA-Z09]*:[a-zA-Z09.]*)\">([^<]*)<\/a>/g;
let match;
while ((match = regex.exec(editFormatedContent.toString())) !== null) {
inputField.userAutocompleted[match[2]] = match[1];
}
}
function closeAll() {
replyItem.visible = false
autoCompleteListView.visible = false
emojiPicker.visible = false
}
function attach(localPath) {
hasAttachment = true
attachmentPath = localPath
}
function clearAttachment() {
hasAttachment = false
attachmentPath = ""
}
function pasteImage() {
var localPath = Platform.StandardPaths.writableLocation(Platform.StandardPaths.CacheLocation) + "/screenshots/" + (new Date()).getTime() + ".png";
if (!Clipboard.saveImage(localPath)) {
return;
}
root.attach(localPath);
}
}

3
imports/NeoChat/Component/Timeline/TimelineContainer.qml
View File

@@ -35,6 +35,7 @@ Item {
signal openExternally()
signal replyClicked(string eventID)
signal replyToMessageClicked(var replyUser, string replyContent, string eventID)
signal edit(string message, string formattedBody, string eventId)
property alias hovered: controlContainer.hovered
@@ -53,7 +54,7 @@ Item {
hoverComponent.editClicked = () => {
if (hoverComponent.showEdit) {
chatTextInput.edit(message, model.formattedBody, eventId);
edit(message, model.formattedBody, eventId);
}
};
hoverComponent.replyClicked = () => {

36
imports/NeoChat/Page/RoomPage.qml
View File

@@ -16,6 +16,7 @@ import org.kde.kitemmodels 1.0
import org.kde.neochat 1.0
import NeoChat.Component 1.0
import NeoChat.Component.ChatBox 1.0
import NeoChat.Component.Timeline 1.0
import NeoChat.Dialog 1.0
import NeoChat.Menu.Timeline 1.0
@@ -121,8 +122,8 @@ Kirigami.ScrollablePage {
switchRoomDown();
} else if (!(event.modifiers & Qt.ControlModifier) && event.key < Qt.Key_Escape) {
event.accepted = true;
chatTextInput.addText(event.text);
chatTextInput.focus();
chatBox.addText(event.text);
chatBox.focus();
return;
}
}
@@ -181,7 +182,7 @@ Kirigami.ScrollablePage {
ListView {
id: messageListView
pixelAligned: true
visible: !invitation.visible
readonly property int largestVisibleIndex: count > 0 ? indexAt(contentX + (width / 2), contentY + height - 1) : -1
@@ -203,7 +204,7 @@ Kirigami.ScrollablePage {
function updateReadMarker() {
if(!noNeedMoreContent && contentY - 5000 < originY)
currentRoom.getPreviousContent(20);
const index = eventToIndex(currentRoom.readMarkerEventId)
const index = currentRoom.readMarkerEventId ? eventToIndex(currentRoom.readMarkerEventId) : 0
if(index === -1) {
return
}
@@ -245,7 +246,7 @@ Kirigami.ScrollablePage {
fileDialog.chosen.connect(function(path) {
if (!path) return
chatTextInput.attach(path)
chatBox.attach(path)
})
fileDialog.open()
@@ -265,7 +266,7 @@ Kirigami.ScrollablePage {
onClicked: {
var localPath = Platform.StandardPaths.writableLocation(Platform.StandardPaths.CacheLocation) + "/screenshots/" + (new Date()).getTime() + ".png"
if (!Clipboard.saveImage(localPath)) return
chatTextInput.attach(localPath)
chatBox.attach(localPath)
attachDialog.close()
}
}
@@ -352,6 +353,7 @@ Kirigami.ScrollablePage {
}
onReplyClicked: goToEvent(eventID)
onReplyToMessageClicked: replyToMessage(replyUser, replyContent, eventId);
onEdit: chatBox.edit(message, formattedBody, eventId)
hoverComponent: hoverActions
@@ -373,6 +375,7 @@ Kirigami.ScrollablePage {
isLoaded: timelineDelegateChooser.delegateLoaded
onReplyClicked: goToEvent(eventID)
onReplyToMessageClicked: replyToMessage(replyUser, replyContent, eventId);
onEdit: chatBox.edit(message, formattedBody, eventId)
hoverComponent: hoverActions
@@ -399,6 +402,7 @@ Kirigami.ScrollablePage {
isLoaded: timelineDelegateChooser.delegateLoaded
onReplyClicked: goToEvent(eventID)
onReplyToMessageClicked: replyToMessage(replyUser, replyContent, eventId);
onEdit: chatBox.edit(message, formattedBody, eventId)
hoverComponent: hoverActions
innerObject: TextDelegate {
@@ -597,7 +601,7 @@ Kirigami.ScrollablePage {
DropArea {
id: dropAreaFile
anchors.fill: parent
onDropped: chatTextInput.attach(drop.urls[0])
onDropped: chatBox.attach(drop.urls[0])
}
QQC2.Pane {
@@ -639,11 +643,9 @@ Kirigami.ScrollablePage {
}
}
footer: ChatTextInput {
id: chatTextInput
footer: ChatBox {
id: chatBox
visible: !invitation.visible && !(messageListView.count === 0 && !currentRoom.allHistoryLoaded)
Layout.fillWidth: true
}
background: FancyEffectsContainer {
@@ -673,7 +675,7 @@ Kirigami.ScrollablePage {
Connections {
enabled: Config.showFancyEffects
target: chatTextInput
target: chatBox
onFancyEffectsReasonFound: {
fancyEffectsContainer.processFancyEffectsReason(fancyEffect)
}
@@ -783,10 +785,10 @@ Kirigami.ScrollablePage {
}
function replyToMessage(replyUser, replyContent, eventId) {
chatTextInput.replyUser = replyUser;
chatTextInput.replyEventID = eventId;
chatTextInput.replyContent = replyContent;
chatTextInput.isReply = true;
chatTextInput.focus();
chatBox.editEventId = "";
chatBox.replyUser = replyUser;
chatBox.replyEventId = eventId;
chatBox.replyContent = replyContent;
chatBox.focusInputField();
}
}

8
res.qrc
View File

@@ -15,10 +15,16 @@
<file>imports/NeoChat/Page/DevicesPage.qml</file>
<file>imports/NeoChat/Page/WelcomePage.qml</file>
<file>imports/NeoChat/Component/qmldir</file>
<file>imports/NeoChat/Component/ChatTextInput.qml</file>
<file>imports/NeoChat/Component/AutoMouseArea.qml</file>
<file>imports/NeoChat/Component/FullScreenImage.qml</file>
<file>imports/NeoChat/Component/FancyEffectsContainer.qml</file>
<file>imports/NeoChat/Component/ChatBox</file>
<file>imports/NeoChat/Component/ChatBox/ChatBox.qml</file>
<file>imports/NeoChat/Component/ChatBox/ChatBar.qml</file>
<file>imports/NeoChat/Component/ChatBox/AttachmentPane.qml</file>
<file>imports/NeoChat/Component/ChatBox/ReplyPane.qml</file>
<file>imports/NeoChat/Component/ChatBox/CompletionMenu.qml</file>
<file>imports/NeoChat/Component/ChatBox/qmldir</file>
<file>imports/NeoChat/Component/Emoji/EmojiPicker.qml</file>
<file>imports/NeoChat/Component/Emoji/qmldir</file>
<file>imports/NeoChat/Component/Timeline/qmldir</file>