Show presence and set custom status messages

2 files changed, 31 insertions, 1 deletions

diff --git a/resources/qml/Avatar.qml b/resources/qml/Avatar.qml
index 465a8e1c..9ac7b562 100644
--- a/resources/qml/Avatar.qml
+++ b/resources/qml/Avatar.qml
@@ -9,6 +9,7 @@ Rectangle {
 	radius: settings.avatarCircles ? height/2 : 3
 
 	property alias url: img.source
+	property string userid
 	property string displayName
 
 	Label {
@@ -42,6 +43,23 @@ Rectangle {
 				radius: settings.avatarCircles ? height/2 : 3
 			}
 		}
+
+	}
+
+	Rectangle {
+		anchors.bottom: avatar.bottom
+		anchors.right: avatar.right
+
+		height: avatar.height / 6
+		width: height
+		radius: settings.avatarCircles ? height / 2 : height / 4
+		color: switch (timelineManager.userPresence(userid)) {
+			case "online": return "#00cc66"
+			case "unavailable": return "#ff9933"
+			case "offline": return "#a82353"
+			default: "transparent"
+		}
 	}
+
 	color: colors.base
 }
diff --git a/resources/qml/TimelineView.qml b/resources/qml/TimelineView.qml
index 08130033..ea6bf093 100644
--- a/resources/qml/TimelineView.qml
+++ b/resources/qml/TimelineView.qml
@@ -152,6 +152,8 @@ Page {
 
 			onCountChanged: if (atYEnd) model.currentIndex = 0 // Mark last event as read, since we are at the bottom
 
+			property int delegateMaxWidth: (settings.timelineMaxWidth > 100 && (parent.width - settings.timelineMaxWidth) > 32) ? settings.timelineMaxWidth : (parent.width - 32)
+
 			delegate: Rectangle {
 				// This would normally be previousSection, but our model's order is inverted.
 				property bool sectionBoundary: (ListView.nextSection != "" && ListView.nextSection !== ListView.section) || model.index === chat.count - 1
@@ -159,7 +161,7 @@ Page {
 				id: wrapper
 				property Item section
 				anchors.horizontalCenter: parent.horizontalCenter
-				width: (settings.timelineMaxWidth > 100 && (parent.width - settings.timelineMaxWidth) > 32) ? settings.timelineMaxWidth : (parent.width - 32)
+				width: chat.delegateMaxWidth
 				height: section ? section.height + timelinerow.height : timelinerow.height
 				color: "transparent"
 
@@ -236,6 +238,7 @@ Page {
 							height: avatarSize
 							url: chat.model.avatarUrl(modelData.userId).replace("mxc://", "image://MxcImage/")
 							displayName: modelData.userName
+							userid: modelData.userId
 
 							MouseArea {
 								anchors.fill: parent
@@ -258,6 +261,15 @@ Page {
 								propagateComposedEvents: true
 							}
 						}
+
+						Label {
+							color: colors.buttonText
+							text: timelineManager.userStatus(modelData.userId)
+							textFormat: Text.PlainText
+							elide: Text.ElideRight
+							width: chat.delegateMaxWidth - parent.spacing*2 - userName.implicitWidth - avatarSize
+							font.italic: true
+						}
 					}
 				}
 			}