Skip to content

Commit

Permalink
Merge pull request #1062 from Nheko-Reborn/perSpaceNotifs
Browse files Browse the repository at this point in the history
Per-space notification bubbles
  • Loading branch information
deepbluev7 authored Jul 16, 2022
2 parents 4b68fc9 + 7b33d14 commit f62cb77
Show file tree
Hide file tree
Showing 13 changed files with 421 additions and 124 deletions.
48 changes: 43 additions & 5 deletions resources/qml/CommunitiesList.qml
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down Expand Up @@ -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)
}

Expand All @@ -57,6 +71,7 @@ Page {
property color unimportantText: Nheko.colors.buttonText
property color bubbleBackground: Nheko.colors.highlight
property color bubbleText: Nheko.colors.highlightedText
required property var model

height: avatarSize + 2 * Nheko.paddingMedium
width: ListView.view.width
Expand All @@ -65,11 +80,11 @@ Page {
ToolTip.text: model.tooltip
ToolTip.delay: Nheko.tooltipDelay
onClicked: Communities.setCurrentTagId(model.id)
onPressAndHold: communityContextMenu.show(model.id)
onPressAndHold: communityContextMenu.show(model.id, model.hidden, model.muted)
states: [
State {
name: "highlight"
when: (communityItem.hovered || model.hidden) && !(Communities.currentTagId == model.id)
when: (communityItem.hovered || model.hidden) && !(Communities.currentTagId === model.id)

PropertyChanges {
target: communityItem
Expand Down Expand Up @@ -102,7 +117,7 @@ Page {

TapHandler {
acceptedButtons: Qt.RightButton
onSingleTapped: communityContextMenu.show(model.id)
onSingleTapped: communityContextMenu.show(model.id, model.hidden, model.muted)
gesturePolicy: TapHandler.ReleaseWithinBounds
acceptedDevices: PointerDevice.Mouse | PointerDevice.Stylus | PointerDevice.TouchPad
}
Expand Down Expand Up @@ -153,6 +168,19 @@ Page {
roomid: model.id
displayName: model.displayName
color: communityItem.backgroundColor

NotificationBubble {
notificationCount: model.unreadMessages
hasLoudNotification: model.hasLoudNotification
bubbleBackgroundColor: communityItem.bubbleBackground
bubbleTextColor: communityItem.bubbleText
font.pixelSize: fontMetrics.font.pixelSize * 0.6
mayBeVisible: communitySidebar.collapsed && !model.muted && Settings.spaceNotifications
anchors.right: avatar.right
anchors.bottom: avatar.bottom
anchors.margins: -Nheko.paddingSmall
}

}

ElidedLabel {
Expand All @@ -169,10 +197,20 @@ Page {
Layout.fillWidth: true
}

NotificationBubble {
notificationCount: model.unreadMessages
hasLoudNotification: model.hasLoudNotification
bubbleBackgroundColor: communityItem.bubbleBackground
bubbleTextColor: communityItem.bubbleText
mayBeVisible: !communitySidebar.collapsed && !model.muted && Settings.spaceNotifications
Layout.alignment: Qt.AlignRight
Layout.leftMargin: Nheko.paddingSmall
}

}

background: Rectangle {
color: backgroundColor
color: communityItem.backgroundColor
}

}
Expand Down
85 changes: 26 additions & 59 deletions resources/qml/RoomList.qml
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down Expand Up @@ -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
Expand All @@ -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)
}

}
Expand All @@ -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
Expand Down Expand Up @@ -380,6 +379,8 @@ Page {
}

RowLayout {
id: subtextRow

Layout.fillWidth: true
spacing: 0
visible: !isSpace
Expand All @@ -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
}

}

}

}

}
Expand Down
46 changes: 46 additions & 0 deletions resources/qml/components/NotificationBubble.qml
Original file line number Diff line number Diff line change
@@ -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
}

}

}
1 change: 1 addition & 0 deletions resources/res.qrc
Original file line number Diff line number Diff line change
Expand Up @@ -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>
Expand Down
Loading

0 comments on commit f62cb77

Please sign in to comment.