diff --git a/resources/qml/CommunitiesList.qml b/resources/qml/CommunitiesList.qml
index 61287789..ec9ef940 100644
--- a/resources/qml/CommunitiesList.qml
+++ b/resources/qml/CommunitiesList.qml
@@ -3,6 +3,7 @@
//
// SPDX-License-Identifier: GPL-3.0-or-later
+import "./components"
import "./dialogs"
import Qt.labs.platform 1.1 as Platform
import QtQml 2.12
@@ -36,14 +37,27 @@ Page {
id: communityContextMenu
property string tagId
+ property bool hidden
+ property bool muted
- function show(id_, tags_) {
+ function show(id_, hidden_, muted_) {
tagId = id_;
+ hidden = hidden_;
+ muted = muted_;
open();
}
Platform.MenuItem {
+ text: qsTr("Do not show notification counts for this space or tag.")
+ checkable: true
+ checked: communityContextMenu.muted
+ onTriggered: Communities.toggleTagMute(communityContextMenu.tagId)
+ }
+
+ Platform.MenuItem {
text: qsTr("Hide rooms with this tag or from this space by default.")
+ checkable: true
+ checked: communityContextMenu.hidden
onTriggered: Communities.toggleTagId(communityContextMenu.tagId)
}
@@ -57,19 +71,30 @@ Page {
property color unimportantText: Nheko.colors.buttonText
property color bubbleBackground: Nheko.colors.highlight
property color bubbleText: Nheko.colors.highlightedText
+ required property string avatarUrl
+ required property string displayName
+ required property string tooltip
+ required property bool collapsed
+ required property bool collapsible
+ required property bool hidden
+ required property int depth
+ required property string id
+ required property int unreadMessages
+ required property bool hasLoudNotification
+ required property bool muted
height: avatarSize + 2 * Nheko.paddingMedium
width: ListView.view.width
state: "normal"
ToolTip.visible: hovered && collapsed
- ToolTip.text: model.tooltip
+ ToolTip.text: communityItem.tooltip
ToolTip.delay: Nheko.tooltipDelay
- onClicked: Communities.setCurrentTagId(model.id)
- onPressAndHold: communityContextMenu.show(model.id)
+ onClicked: Communities.setCurrentTagId(communityItem.id)
+ onPressAndHold: communityContextMenu.show(communityItem.id, communityItem.hidden, communityItem.muted)
states: [
State {
name: "highlight"
- when: (communityItem.hovered || model.hidden) && !(Communities.currentTagId == model.id)
+ when: (communityItem.hovered || communityItem.hidden) && !(Communities.currentTagId === communityItem.id)
PropertyChanges {
target: communityItem
@@ -83,7 +108,7 @@ Page {
},
State {
name: "selected"
- when: Communities.currentTagId == model.id
+ when: Communities.currentTagId == communityItem.id
PropertyChanges {
target: communityItem
@@ -102,7 +127,7 @@ Page {
TapHandler {
acceptedButtons: Qt.RightButton
- onSingleTapped: communityContextMenu.show(model.id)
+ onSingleTapped: communityContextMenu.show(communityItem.id, communityItem.hidden, communityItem.muted)
gesturePolicy: TapHandler.ReleaseWithinBounds
acceptedDevices: PointerDevice.Mouse | PointerDevice.Stylus | PointerDevice.TouchPad
}
@@ -114,27 +139,27 @@ Page {
spacing: Nheko.paddingMedium
anchors.fill: parent
anchors.margins: Nheko.paddingMedium
- anchors.leftMargin: Nheko.paddingMedium + (communitySidebar.collapsed ? 0 : (fontMetrics.lineSpacing * model.depth))
+ anchors.leftMargin: Nheko.paddingMedium + (communitySidebar.collapsed ? 0 : (fontMetrics.lineSpacing * communityItem.depth))
ImageButton {
- visible: !communitySidebar.collapsed && model.collapsible
+ visible: !communitySidebar.collapsed && communityItem.collapsible
Layout.preferredHeight: fontMetrics.lineSpacing
Layout.preferredWidth: fontMetrics.lineSpacing
Layout.alignment: Qt.AlignVCenter
height: fontMetrics.lineSpacing
width: fontMetrics.lineSpacing
- image: model.collapsed ? ":/icons/icons/ui/collapsed.svg" : ":/icons/icons/ui/expanded.svg"
+ image: communityItem.collapsed ? ":/icons/icons/ui/collapsed.svg" : ":/icons/icons/ui/expanded.svg"
ToolTip.visible: hovered
ToolTip.delay: Nheko.tooltipDelay
- ToolTip.text: model.collapsed ? qsTr("Expand") : qsTr("Collapse")
+ ToolTip.text: communityItem.collapsed ? qsTr("Expand") : qsTr("Collapse")
hoverEnabled: true
- onClicked: model.collapsed = !model.collapsed
+ onClicked: communityItem.collapsed = !communityItem.collapsed
}
Item {
Layout.preferredWidth: fontMetrics.lineSpacing
- visible: !communitySidebar.collapsed && !model.collapsible && Communities.containsSubspaces
+ visible: !communitySidebar.collapsed && !communityItem.collapsible && Communities.containsSubspaces
}
Avatar {
@@ -145,14 +170,27 @@ Page {
height: avatarSize
width: avatarSize
url: {
- if (model.avatarUrl.startsWith("mxc://"))
- return model.avatarUrl.replace("mxc://", "image://MxcImage/");
+ if (communityItem.avatarUrl.startsWith("mxc://"))
+ return communityItem.avatarUrl.replace("mxc://", "image://MxcImage/");
else
- return "image://colorimage/" + model.avatarUrl + "?" + communityItem.unimportantText;
+ return "image://colorimage/" + communityItem.avatarUrl + "?" + communityItem.unimportantText;
}
- roomid: model.id
- displayName: model.displayName
+ roomid: communityItem.id
+ displayName: communityItem.displayName
color: communityItem.backgroundColor
+
+ NotificationBubble {
+ notificationCount: communityItem.unreadMessages
+ hasLoudNotification: communityItem.hasLoudNotification
+ bubbleBackgroundColor: communityItem.bubbleBackground
+ bubbleTextColor: communityItem.bubbleText
+ font.pixelSize: fontMetrics.font.pixelSize * 0.6
+ mayBeVisible: communitySidebar.collapsed && !communityItem.muted && Settings.spaceNotifications
+ anchors.right: avatar.right
+ anchors.bottom: avatar.bottom
+ anchors.margins: -Nheko.paddingSmall
+ }
+
}
ElidedLabel {
@@ -161,7 +199,7 @@ Page {
color: communityItem.importantText
Layout.fillWidth: true
elideWidth: width
- fullText: model.displayName
+ fullText: communityItem.displayName
textFormat: Text.PlainText
}
@@ -169,10 +207,20 @@ Page {
Layout.fillWidth: true
}
+ NotificationBubble {
+ notificationCount: communityItem.unreadMessages
+ hasLoudNotification: communityItem.hasLoudNotification
+ bubbleBackgroundColor: communityItem.bubbleBackground
+ bubbleTextColor: communityItem.bubbleText
+ mayBeVisible: !communitySidebar.collapsed && !communityItem.muted && Settings.spaceNotifications
+ Layout.alignment: Qt.AlignRight
+ Layout.leftMargin: Nheko.paddingSmall
+ }
+
}
background: Rectangle {
- color: backgroundColor
+ color: communityItem.backgroundColor
}
}
diff --git a/resources/qml/RoomList.qml b/resources/qml/RoomList.qml
index a86ca725..1e61b68b 100644
--- a/resources/qml/RoomList.qml
+++ b/resources/qml/RoomList.qml
@@ -3,6 +3,7 @@
//
// SPDX-License-Identifier: GPL-3.0-or-later
+import "./components"
import "./dialogs"
import "./ui"
import Qt.labs.platform 1.1 as Platform
@@ -294,9 +295,6 @@ Page {
anchors.margins: Nheko.paddingMedium
Avatar {
- // In the future we could show an online indicator by setting the userid for the avatar
- //userid: Nheko.currentUser.userid
-
id: avatar
enabled: false
@@ -308,33 +306,17 @@ Page {
userid: isDirect ? directChatOtherUserId : ""
roomid: roomId
- Rectangle {
+ NotificationBubble {
id: collapsedNotificationBubble
+ notificationCount: roomItem.notificationCount
+ hasLoudNotification: roomItem.hasLoudNotification
+ bubbleBackgroundColor: roomItem.bubbleBackground
+ bubbleTextColor: roomItem.bubbleText
anchors.right: parent.right
anchors.bottom: parent.bottom
anchors.margins: -Nheko.paddingSmall
- visible: collapsed && notificationCount > 0
- enabled: false
- Layout.alignment: Qt.AlignRight
- height: fontMetrics.averageCharacterWidth * 3
- width: Math.max(collapsedBubbleText.width, height)
- radius: height / 2
- color: hasLoudNotification ? Nheko.theme.red : roomItem.bubbleBackground
-
- Label {
- id: collapsedBubbleText
-
- anchors.centerIn: parent
- horizontalAlignment: Text.AlignHCenter
- verticalAlignment: Text.AlignVCenter
- width: Math.max(implicitWidth + Nheko.paddingMedium, parent.height)
- font.bold: true
- font.pixelSize: fontMetrics.font.pixelSize * 0.8
- color: hasLoudNotification ? "white" : roomItem.bubbleText
- text: notificationCount > 9999 ? "9999+" : notificationCount
- }
-
+ mayBeVisible: collapsed && (isSpace ? Settings.spaceNotifications : true)
}
}
@@ -351,7 +333,24 @@ Page {
height: avatar.height
spacing: Nheko.paddingSmall
+ NotificationBubble {
+ id: notificationBubble
+
+ parent: isSpace ? titleRow : subtextRow
+ notificationCount: roomItem.notificationCount
+ hasLoudNotification: roomItem.hasLoudNotification
+ bubbleBackgroundColor: roomItem.bubbleBackground
+ bubbleTextColor: roomItem.bubbleText
+ Layout.alignment: Qt.AlignRight
+ Layout.leftMargin: Nheko.paddingSmall
+ Layout.preferredWidth: implicitWidth
+ Layout.preferredHeight: implicitHeight
+ mayBeVisible: !collapsed && (isSpace ? Settings.spaceNotifications : true)
+ }
+
RowLayout {
+ id: titleRow
+
Layout.alignment: Qt.AlignTop
Layout.fillWidth: true
spacing: Nheko.paddingSmall
@@ -380,6 +379,8 @@ Page {
}
RowLayout {
+ id: subtextRow
+
Layout.fillWidth: true
spacing: 0
visible: !isSpace
@@ -395,40 +396,6 @@ Page {
Layout.fillWidth: true
}
- Rectangle {
- id: notificationBubble
-
- visible: notificationCount > 0
- Layout.alignment: Qt.AlignRight
- Layout.leftMargin: Nheko.paddingSmall
- height: notificationBubbleText.height + Nheko.paddingMedium
- Layout.preferredWidth: Math.max(notificationBubbleText.width, height)
- radius: height / 2
- color: hasLoudNotification ? Nheko.theme.red : roomItem.bubbleBackground
- ToolTip.text: notificationCount
- ToolTip.delay: Nheko.tooltipDelay
- ToolTip.visible: notificationBubbleHover.hovered && (notificationCount > 9999)
-
- Label {
- id: notificationBubbleText
-
- anchors.centerIn: parent
- horizontalAlignment: Text.AlignHCenter
- verticalAlignment: Text.AlignVCenter
- width: Math.max(implicitWidth + Nheko.paddingMedium, parent.height)
- font.bold: true
- font.pixelSize: fontMetrics.font.pixelSize * 0.8
- color: hasLoudNotification ? "white" : roomItem.bubbleText
- text: notificationCount > 9999 ? "9999+" : notificationCount
-
- HoverHandler {
- id: notificationBubbleHover
- }
-
- }
-
- }
-
}
}
diff --git a/resources/qml/components/NotificationBubble.qml b/resources/qml/components/NotificationBubble.qml
new file mode 100644
index 00000000..ca0ae6cb
--- /dev/null
+++ b/resources/qml/components/NotificationBubble.qml
@@ -0,0 +1,46 @@
+// SPDX-FileCopyrightText: 2022 Nheko Contributors
+//
+// SPDX-License-Identifier: GPL-3.0-or-later
+
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import im.nheko 1.0
+
+Rectangle {
+ id: bubbleRoot
+
+ required property int notificationCount
+ required property bool hasLoudNotification
+ required property color bubbleBackgroundColor
+ required property color bubbleTextColor
+ property bool mayBeVisible: true
+ property alias font: notificationBubbleText.font
+
+ visible: mayBeVisible && notificationCount > 0
+ implicitHeight: notificationBubbleText.height + Nheko.paddingMedium
+ implicitWidth: Math.max(notificationBubbleText.width, height)
+ radius: height / 2
+ color: hasLoudNotification ? Nheko.theme.red : bubbleBackgroundColor
+ ToolTip.text: notificationCount
+ ToolTip.delay: Nheko.tooltipDelay
+ ToolTip.visible: notificationBubbleHover.hovered && (notificationCount > 9999)
+
+ Label {
+ id: notificationBubbleText
+
+ anchors.centerIn: bubbleRoot
+ horizontalAlignment: Text.AlignHCenter
+ verticalAlignment: Text.AlignVCenter
+ width: Math.max(implicitWidth + Nheko.paddingMedium, bubbleRoot.height)
+ font.bold: true
+ font.pixelSize: fontMetrics.font.pixelSize * 0.8
+ color: bubbleRoot.hasLoudNotification ? "white" : bubbleRoot.bubbleTextColor
+ text: bubbleRoot.notificationCount > 9999 ? "9999+" : bubbleRoot.notificationCount
+
+ HoverHandler {
+ id: notificationBubbleHover
+ }
+
+ }
+
+}
diff --git a/resources/res.qrc b/resources/res.qrc
index 3ec24238..7f08c29d 100644
--- a/resources/res.qrc
+++ b/resources/res.qrc
@@ -185,6 +185,7 @@
<file>qml/voip/PlaceCall.qml</file>
<file>qml/voip/ScreenShare.qml</file>
<file>qml/voip/VideoCall.qml</file>
+ <file>qml/components/NotificationBubble.qml</file>
</qresource>
<qresource prefix="/media">
<file>media/ring.ogg</file>
|
