From 3f7c15c7afeb029223a7507387a95752428bb689 Mon Sep 17 00:00:00 2001 From: Malte E Date: Fri, 4 Feb 2022 23:12:30 +0100 Subject: [PATCH] Add message bubbles --- resources/qml/TimelineRow.qml | 26 +++++++++++++++++++++----- resources/qml/delegates/Reply.qml | 4 +++- src/UserSettingsPage.cpp | 30 ++++++++++++++++++++++++++++++ src/UserSettingsPage.h | 6 ++++++ 4 files changed, 60 insertions(+), 6 deletions(-) diff --git a/resources/qml/TimelineRow.qml b/resources/qml/TimelineRow.qml index 1d9a036a..876fc800 100644 --- a/resources/qml/TimelineRow.qml +++ b/resources/qml/TimelineRow.qml @@ -75,10 +75,19 @@ Item { id: row anchors.rightMargin: 1 - anchors.leftMargin: Nheko.avatarSize + 16 + anchors.leftMargin: Nheko.avatarSize + 12 anchors.left: parent.left anchors.right: parent.right - height: msg.height+reactionRow.height+2 + height: msg.height+(reactionRow.height> 0 ? reactionRow.height-4 : 0) + Rectangle { + anchors.fill: msg + property color userColor: TimelineManager.userColor(userId, Nheko.colors.base) + property color bgColor: Nheko.colors.base + color: Qt.rgba(userColor.r*0.1+bgColor.r*0.9,userColor.g*0.1+bgColor.g*0.9,userColor.b*0.1+bgColor.b*0.9,1) //TimelineManager.userColor(userId, Nheko.colors.base) + radius: 4 + visible: Settings.bubbles + } + GridLayout { id: msg anchors { @@ -98,7 +107,9 @@ Item { Layout.row: 0 Layout.column: 0 Layout.fillWidth: true - Layout.margins: 0 + Layout.margins: visible? 4 : 0 + Layout.bottomMargin: 0 + Layout.topMargin: visible? (Settings.bubbles? 4 : 2) : 0 id: reply function fromModel(role) { @@ -133,7 +144,10 @@ Item { Layout.row: 1 Layout.column: 0 Layout.fillWidth: true - Layout.margins: 2 + Layout.leftMargin: 4 + Layout.rightMargin: 4 + Layout.topMargin: reply.visible ? 2 : 4 + Layout.bottomMargin: Settings.bubbles? 4: 2 id: contentItem blurhash: r.blurhash @@ -164,6 +178,8 @@ Item { Layout.row: 0 Layout.rowSpan: 2 Layout.alignment: Qt.AlignTop | Qt.AlignRight + Layout.topMargin: 4 + Layout.rightMargin: Settings.bubbles? 4 : 0 StatusIndicator { Layout.alignment: Qt.AlignRight | Qt.AlignTop @@ -221,7 +237,7 @@ Item { Reactions { anchors { - top: msg.bottom + bottom: parent.bottom left: parent.left } diff --git a/resources/qml/delegates/Reply.qml b/resources/qml/delegates/Reply.qml index efa959a0..0d4ff041 100644 --- a/resources/qml/delegates/Reply.qml +++ b/resources/qml/delegates/Reply.qml @@ -130,7 +130,9 @@ Item { z: -1 anchors.fill: replyContainer - color: Qt.rgba(userColor.r, userColor.g, userColor.b, 0.1) + property color userColor: TimelineManager.userColor(userId, Nheko.colors.base) + property color bgColor: Nheko.colors.base + color: Qt.rgba(userColor.r*0.1+bgColor.r*0.9,userColor.g*0.1+bgColor.g*0.9,userColor.b*0.1+bgColor.b*0.9,1) // alpha makes this mix with the bubble color } } diff --git a/src/UserSettingsPage.cpp b/src/UserSettingsPage.cpp index a0aa8f84..993b9a01 100644 --- a/src/UserSettingsPage.cpp +++ b/src/UserSettingsPage.cpp @@ -70,6 +70,7 @@ UserSettings::load(std::optional profile) enlargeEmojiOnlyMessages_ = settings.value(QStringLiteral("user/timeline/enlarge_emoji_only_msg"), false).toBool(); markdown_ = settings.value(QStringLiteral("user/markdown_enabled"), true).toBool(); + bubbles_ = settings.value(QStringLiteral("user/bubbles_enabled"), true).toBool(); animateImagesOnHover_ = settings.value(QStringLiteral("user/animate_images_on_hover"), false).toBool(); typingNotifications_ = @@ -242,6 +243,16 @@ UserSettings::setMarkdown(bool state) save(); } +void +UserSettings::setBubbles(bool state) +{ + if (state == bubbles_) + return; + bubbles_ = state; + emit bubblesChanged(state); + save(); +} + void UserSettings::setAnimateImagesOnHover(bool state) { @@ -696,6 +707,7 @@ UserSettings::save() settings.setValue(QStringLiteral("read_receipts"), readReceipts_); settings.setValue(QStringLiteral("group_view"), groupView_); settings.setValue(QStringLiteral("markdown_enabled"), markdown_); + settings.setValue(QStringLiteral("bubbles_enabled"), bubbles_); settings.setValue(QStringLiteral("animate_images_on_hover"), animateImagesOnHover_); settings.setValue(QStringLiteral("desktop_notifications"), hasDesktopNotifications_); settings.setValue(QStringLiteral("alert_on_notification"), hasAlertOnNotification_); @@ -796,6 +808,8 @@ UserSettingsModel::data(const QModelIndex &index, int role) const return tr("Group's sidebar"); case Markdown: return tr("Send messages as Markdown"); + case Bubbles: + return tr("Enable Message bubbles"); case AnimateImagesOnHover: return tr("Play animated images only on hover"); case TypingNotifications: @@ -916,6 +930,8 @@ UserSettingsModel::data(const QModelIndex &index, int role) const return i->groupView(); case Markdown: return i->markdown(); + case Bubbles: + return i->bubbles(); case AnimateImagesOnHover: return i->animateImagesOnHover(); case TypingNotifications: @@ -1042,6 +1058,9 @@ UserSettingsModel::data(const QModelIndex &index, int role) const return tr( "Allow using markdown in messages.\nWhen disabled, all messages are sent as a plain " "text."); + case Bubbles: + return tr( + "Messages received a bubble background."); case AnimateImagesOnHover: return tr("Plays media like GIFs or WEBPs only when explicitly hovering over them."); case TypingNotifications: @@ -1158,6 +1177,7 @@ UserSettingsModel::data(const QModelIndex &index, int role) const case StartInTray: case GroupView: case Markdown: + case Bubbles: case AnimateImagesOnHover: case TypingNotifications: case SortByImportance: @@ -1375,6 +1395,13 @@ UserSettingsModel::setData(const QModelIndex &index, const QVariant &value, int } else return false; } + case Bubbles: { + if (value.userType() == QMetaType::Bool) { + i->setBubbles(value.toBool()); + return true; + } else + return false; + } case AnimateImagesOnHover: { if (value.userType() == QMetaType::Bool) { i->setAnimateImagesOnHover(value.toBool()); @@ -1737,6 +1764,9 @@ UserSettingsModel::UserSettingsModel(QObject *p) connect(s.get(), &UserSettings::markdownChanged, this, [this]() { emit dataChanged(index(Markdown), index(Markdown), {Value}); }); + connect(s.get(), &UserSettings::bubblesChanged, this, [this]() { + emit dataChanged(index(Bubbles), index(Bubbles), {Value}); + }); connect(s.get(), &UserSettings::groupViewStateChanged, this, [this]() { emit dataChanged(index(GroupView), index(GroupView), {Value}); diff --git a/src/UserSettingsPage.h b/src/UserSettingsPage.h index e9b8763d..e5d22f6a 100644 --- a/src/UserSettingsPage.h +++ b/src/UserSettingsPage.h @@ -40,6 +40,7 @@ class UserSettings : public QObject Q_PROPERTY(bool startInTray READ startInTray WRITE setStartInTray NOTIFY startInTrayChanged) Q_PROPERTY(bool groupView READ groupView WRITE setGroupView NOTIFY groupViewStateChanged) Q_PROPERTY(bool markdown READ markdown WRITE setMarkdown NOTIFY markdownChanged) + Q_PROPERTY(bool bubbles READ bubbles WRITE setBubbles NOTIFY bubblesChanged) Q_PROPERTY(bool animateImagesOnHover READ animateImagesOnHover WRITE setAnimateImagesOnHover NOTIFY animateImagesOnHoverChanged) Q_PROPERTY(bool typingNotifications READ typingNotifications WRITE setTypingNotifications NOTIFY @@ -139,6 +140,7 @@ public: void setEmojiFontFamily(QString family); void setGroupView(bool state); void setMarkdown(bool state); + void setBubbles(bool state); void setAnimateImagesOnHover(bool state); void setReadReceipts(bool state); void setTypingNotifications(bool state); @@ -190,6 +192,7 @@ public: bool privacyScreen() const { return privacyScreen_; } int privacyScreenTimeout() const { return privacyScreenTimeout_; } bool markdown() const { return markdown_; } + bool bubbles() const { return bubbles_; } bool animateImagesOnHover() const { return animateImagesOnHover_; } bool typingNotifications() const { return typingNotifications_; } bool sortByImportance() const { return sortByImportance_; } @@ -247,6 +250,7 @@ signals: void trayChanged(bool state); void startInTrayChanged(bool state); void markdownChanged(bool state); + void bubblesChanged(bool state); void animateImagesOnHoverChanged(bool state); void typingNotificationsChanged(bool state); void buttonInTimelineChanged(bool state); @@ -302,6 +306,7 @@ private: bool startInTray_; bool groupView_; bool markdown_; + bool bubbles_; bool animateImagesOnHover_; bool typingNotifications_; bool sortByImportance_; @@ -380,6 +385,7 @@ class UserSettingsModel : public QAbstractListModel ReadReceipts, ButtonsInTimeline, Markdown, + Bubbles, SidebarSection, GroupView,