Merge pull request #301 from kamathmanu/issue266-filenameOnHover

Display filename on mouse hover

1 files changed, 30 insertions, 1 deletions

diff --git a/resources/qml/delegates/ImageMessage.qml b/resources/qml/delegates/ImageMessage.qml

index e2c78fbe..6ac5ee15 100644
--- a/resources/qml/delegates/ImageMessage.qml
+++ b/resources/qml/delegates/ImageMessage.qml
@@ -31,11 +31,40 @@ Item {
         fillMode: Image.PreserveAspectFit
 
         MouseArea {
+            id: mouseArea
             enabled: model.data.type == MtxEvent.ImageMessage && img.status == Image.Ready
+            hoverEnabled: true
             anchors.fill: parent
             onClicked: TimelineManager.openImageOverlay(model.data.url, model.data.id)
         }
 
-    }
+        Item {
+            id: overlay
+        
+            anchors.fill: parent
+            visible: mouseArea.containsMouse
+
+            Rectangle {
+                id: container
+                
+                width: parent.width
+                implicitHeight: imgcaption.implicitHeight
+                anchors.bottom: overlay.bottom 
+                color: colors.window
+                opacity: 0.75
+            }
 
+            Text {
+                id: imgcaption
+                
+                anchors.fill: container
+                elide: Text.ElideMiddle
+                horizontalAlignment: Text.AlignHCenter
+                verticalAlignment: Text.AlignVCenter
+                // See this MSC: https://github.com/matrix-org/matrix-doc/pull/2530
+                text: model.data.filename ? model.data.filename : model.data.body
+                color: colors.text
+            }
+        }
+    }
 }