diff --git a/resources/qml/MessageView.qml b/resources/qml/MessageView.qml index 907ef63c..3cdfda22 100644 --- a/resources/qml/MessageView.qml +++ b/resources/qml/MessageView.qml @@ -62,6 +62,7 @@ Item { delegate: TimelineDefaultMessageStyle { messageActions: messageActionsC messageContextMenu: messageContextMenuC + scrolledToThis: eventId === room.scrollTarget && (y + height > chat.y + chat.contentY && y < chat.y + chat.height + chat.contentY) } footer: Item { anchors.horizontalCenter: parent.horizontalCenter diff --git a/resources/qml/TimelineDefaultMessageStyle.qml b/resources/qml/TimelineDefaultMessageStyle.qml index 2dcf153c..1d12daef 100644 --- a/resources/qml/TimelineDefaultMessageStyle.qml +++ b/resources/qml/TimelineDefaultMessageStyle.qml @@ -39,6 +39,7 @@ TimelineEvent { required property var reactions required property int status required property int trustlevel + required property int notificationlevel required property int type required property bool isEditable @@ -48,6 +49,7 @@ TimelineEvent { property int avatarMargin: (wrapper.isStateEvent || Settings.smallAvatars ? 0 : (Nheko.avatarSize + 8)) // align bubble with section header property alias hovered: messageHover.hovered + property bool scrolledToThis: false data: [ Loader { @@ -84,6 +86,59 @@ TimelineEvent { onSingleTapped: messageContextMenu.show(wrapper.eventId, wrapper.threadId, wrapper.type, wrapper.isSender, wrapper.isEncrypted, wrapper.isEditable, wrapper.main.hoveredLink, wrapper.main.copyText) } }, + Rectangle { + id: scrollHighlight + anchors.fill: gridContainer + + color: palette.highlight + enabled: false + opacity: 0 + visible: true + z: 1 + + states: State { + name: "revealed" + when: wrapper.scrolledToThis + } + transitions: Transition { + from: "" + to: "revealed" + + SequentialAnimation { + PropertyAnimation { + duration: 500 + easing.type: Easing.InOutQuad + from: 0 + properties: "opacity" + target: scrollHighlight + to: 1 + } + PropertyAnimation { + duration: 500 + easing.type: Easing.InOutQuad + from: 1 + properties: "opacity" + target: scrollHighlight + to: 0 + } + ScriptAction { + script: wrapper.room.eventShown() + } + } + } + }, + Rectangle { + anchors.top: gridContainer.top + anchors.left: gridContainer.left + anchors.topMargin: -2 + anchors.leftMargin: wrapper.avatarMargin + 2 + color: "transparent" + border.color: Nheko.theme.red + border.width: wrapper.notificationlevel == MtxEvent.Highlight ? 1 : 0 + radius: 4 + height: contentColumn.implicitHeight + 4 + width: contentColumn.implicitWidth + 4 + }, RowLayout { id: gridContainer