diff --git a/resources/qml/EncryptionIndicator.qml b/resources/qml/EncryptionIndicator.qml index 00efe9e4..f2f9dec2 100644 --- a/resources/qml/EncryptionIndicator.qml +++ b/resources/qml/EncryptionIndicator.qml @@ -2,40 +2,24 @@ import QtQuick 2.12 import QtQuick.Controls 2.1 import im.nheko 1.0 -Rectangle { - id: indicator +Image { + id: stateImg property bool encrypted: false - function getEncryptionImage() { + width: 16 + height: 16 + source: { if (encrypted) return "image://colorimage/:/icons/icons/ui/lock.png?" + colors.buttonText; else return "image://colorimage/:/icons/icons/ui/unlock.png?#dd3d3d"; } - - function getEncryptionTooltip() { - if (encrypted) - return qsTr("Encrypted"); - else - return qsTr("This message is not encrypted!"); - } - - color: "transparent" - width: 16 - height: 16 - ToolTip.visible: ma.hovered && indicator.visible - ToolTip.text: getEncryptionTooltip() + ToolTip.visible: ma.hovered + ToolTip.text: encrypted ? qsTr("Encrypted") : qsTr("This message is not encrypted!") HoverHandler { id: ma } - Image { - id: stateImg - - anchors.fill: parent - source: getEncryptionImage() - } - } diff --git a/resources/qml/MessageView.qml b/resources/qml/MessageView.qml index 0503f467..6c8a4917 100644 --- a/resources/qml/MessageView.qml +++ b/resources/qml/MessageView.qml @@ -1,4 +1,5 @@ import "./delegates" +import "./emoji" import QtGraphicalEffects 1.0 import QtQuick 2.12 import QtQuick.Controls 2.3 @@ -29,6 +30,95 @@ ScrollView { } + Rectangle { + //closePolicy: Popup.NoAutoClose + + id: messageActions + + property Item attached: null + property alias model: row.model + // use comma to update on scroll + property var attachedPos: chat.contentY, attached ? chat.mapFromItem(attached, attached ? attached.width - width : 0, -height) : null + property int padding: 4 + + visible: Settings.buttonsInTimeline && !!attached && (attached.hovered || messageActionHover.hovered) + x: attached ? attachedPos.x : 0 + y: attached ? attachedPos.y : 0 + z: 10 + height: row.implicitHeight + padding * 2 + width: row.implicitWidth + padding * 2 + color: colors.window + border.color: colors.buttonText + border.width: 1 + radius: padding + + HoverHandler { + id: messageActionHover + grabPermissions: PointerHandler.CanTakeOverFromAnything + } + + Row { + id: row + + property var model + + anchors.centerIn: parent + spacing: messageActions.padding + + ImageButton { + id: editButton + + visible: !!row.model && row.model.isEditable + buttonTextColor: colors.buttonText + width: 16 + hoverEnabled: true + image: ":/icons/icons/ui/edit.png" + ToolTip.visible: hovered + ToolTip.text: row.model && row.model.isEditable ? qsTr("Edit") : qsTr("Edited") + onClicked: { + if (row.model.isEditable) + chat.model.editAction(row.model.id); + + } + } + + EmojiButton { + id: reactButton + + width: 16 + hoverEnabled: true + ToolTip.visible: hovered + ToolTip.text: qsTr("React") + emojiPicker: emojiPopup + event_id: row.model ? row.model.id : "" + } + + ImageButton { + id: replyButton + + width: 16 + hoverEnabled: true + image: ":/icons/icons/ui/mail-reply.png" + ToolTip.visible: hovered + ToolTip.text: qsTr("Reply") + onClicked: chat.model.replyAction(row.model.id) + } + + ImageButton { + id: optionsButton + + width: 16 + hoverEnabled: true + image: ":/icons/icons/ui/vertical-ellipsis.png" + ToolTip.visible: hovered + ToolTip.text: qsTr("Options") + onClicked: messageContextMenu.show(row.model.id, row.model.type, row.model.isEncrypted, row.model.isEditable, optionsButton) + } + + } + + } + ScrollHelper { flickable: parent anchors.fill: parent @@ -203,7 +293,25 @@ ScrollView { TimelineRow { id: timelinerow + property alias hovered: hoverHandler.hovered + y: section.visible && section.active ? section.y + section.height : 0 + + HoverHandler { + id: hoverHandler + + enabled: !Settings.mobileMode + + onHoveredChanged: { + if (hovered) { + if (!messageActionHover.hovered) { + messageActions.attached = timelinerow; + messageActions.model = model; + } + } + } + } + } Connections { diff --git a/resources/qml/TimelineRow.qml b/resources/qml/TimelineRow.qml index b731d29d..8f58ea72 100644 --- a/resources/qml/TimelineRow.qml +++ b/resources/qml/TimelineRow.qml @@ -79,68 +79,26 @@ Item { encrypted: model.isEncrypted Layout.alignment: Qt.AlignRight | Qt.AlignTop Layout.preferredHeight: 16 - width: 16 + Layout.preferredWidth: 16 } - ImageButton { - id: editButton - - visible: (Settings.buttonsInTimeline && model.isEditable) || model.isEdited - buttonTextColor: chat.model.edit == model.id ? colors.highlight : colors.buttonText + Image { + visible: model.isEdited Layout.alignment: Qt.AlignRight | Qt.AlignTop Layout.preferredHeight: 16 + Layout.preferredWidth: 16 + height: 16 width: 16 - hoverEnabled: true - image: ":/icons/icons/ui/edit.png" - ToolTip.visible: hovered - ToolTip.text: model.isEditable ? qsTr("Edit") : qsTr("Edited") - onClicked: { - if (model.isEditable) - chat.model.editAction(model.id); + sourceSize.width: 16 + sourceSize.height: 16 + source: "image://colorimage/:/icons/icons/ui/edit.png?" + colors.buttonText + ToolTip.visible: editHovered.hovered + ToolTip.text: qsTr("Edited") + HoverHandler { + id: editHovered } - } - EmojiButton { - id: reactButton - - visible: Settings.buttonsInTimeline - Layout.alignment: Qt.AlignRight | Qt.AlignTop - Layout.preferredHeight: 16 - width: 16 - hoverEnabled: true - ToolTip.visible: hovered - ToolTip.text: qsTr("React") - emojiPicker: emojiPopup - event_id: model.id - } - - ImageButton { - id: replyButton - - visible: Settings.buttonsInTimeline - Layout.alignment: Qt.AlignRight | Qt.AlignTop - Layout.preferredHeight: 16 - width: 16 - hoverEnabled: true - image: ":/icons/icons/ui/mail-reply.png" - ToolTip.visible: hovered - ToolTip.text: qsTr("Reply") - onClicked: chat.model.replyAction(model.id) - } - - ImageButton { - id: optionsButton - - visible: Settings.buttonsInTimeline - Layout.alignment: Qt.AlignRight | Qt.AlignTop - Layout.preferredHeight: 16 - width: 16 - hoverEnabled: true - image: ":/icons/icons/ui/vertical-ellipsis.png" - ToolTip.visible: hovered - ToolTip.text: qsTr("Options") - onClicked: messageContextMenu.show(model.id, model.type, model.isEncrypted, model.isEditable, optionsButton) } Label { diff --git a/resources/qml/delegates/NoticeMessage.qml b/resources/qml/delegates/NoticeMessage.qml index c38cb555..4da644e2 100644 --- a/resources/qml/delegates/NoticeMessage.qml +++ b/resources/qml/delegates/NoticeMessage.qml @@ -1,6 +1,4 @@ TextMessage { font.italic: true color: colors.buttonText - height: isReply ? Math.min(timelineRoot.height / 8, implicitHeight) : undefined - clip: isReply }