From a3d212fa7fb63e6c028b924b3fdf80a88c5d7a54 Mon Sep 17 00:00:00 2001
From: Black Hat <bhat@encom.eu.org>
Date: Wed, 1 May 2019 10:59:09 +0800
Subject: [PATCH] Improve ImageDelegate.

---
 .../Spectral/Component/FullScreenImage.qml    | 24 +++++---
 .../Component/Timeline/FileDelegate.qml       |  2 +-
 .../Component/Timeline/ImageDelegate.qml      | 59 +++++++++++++++----
 3 files changed, 63 insertions(+), 22 deletions(-)

diff --git a/imports/Spectral/Component/FullScreenImage.qml b/imports/Spectral/Component/FullScreenImage.qml
index c96046b..0fb9a31 100644
--- a/imports/Spectral/Component/FullScreenImage.qml
+++ b/imports/Spectral/Component/FullScreenImage.qml
@@ -2,9 +2,8 @@ import QtQuick 2.12
 import QtQuick.Controls 2.12
 
 ApplicationWindow {
-    property url imageUrl
-    property int sourceWidth
-    property int sourceHeight
+    property string eventId
+    property url localPath
 
     id: root
 
@@ -12,16 +11,25 @@ ApplicationWindow {
     visible: true
     visibility: Qt.WindowFullScreen
 
-    title: "Image View - " + imageUrl
+    title: "Image View - " + eventId
 
     color: "#BB000000"
 
-    Image {
+    Shortcut {
+        sequence: "Escape"
+        onActivated: root.destroy()
+    }
+
+    AnimatedImage {
         anchors.centerIn: parent
 
-        sourceSize.width: root.sourceWidth
-        sourceSize.height: root.sourceHeight
-        source: imageUrl
+        width: Math.min(sourceSize.width, root.width)
+        height: Math.min(sourceSize.height, root.height)
+
+        fillMode: Image.PreserveAspectFit
+        cache: false
+
+        source: localPath
     }
 
     ItemDelegate {
diff --git a/imports/Spectral/Component/Timeline/FileDelegate.qml b/imports/Spectral/Component/Timeline/FileDelegate.qml
index 539fceb..c138500 100644
--- a/imports/Spectral/Component/Timeline/FileDelegate.qml
+++ b/imports/Spectral/Component/Timeline/FileDelegate.qml
@@ -186,7 +186,7 @@ ColumnLayout {
         else
         {
             openOnFinished = true
-            currentRoom.downloadFile(eventId, Platform.StandardPaths.writableLocation(Platform.StandardPaths.CacheLocation) + "/" + eventId.replace(":", "_") + (message || ".tmp"))
+            currentRoom.downloadFile(eventId, Platform.StandardPaths.writableLocation(Platform.StandardPaths.CacheLocation) + "/" + eventId.replace(":", "_").replace("/", "_").replace("+", "_") + (message || ".tmp"))
         }
     }
 
diff --git a/imports/Spectral/Component/Timeline/ImageDelegate.qml b/imports/Spectral/Component/Timeline/ImageDelegate.qml
index 4afc1a9..0ece8ce 100644
--- a/imports/Spectral/Component/Timeline/ImageDelegate.qml
+++ b/imports/Spectral/Component/Timeline/ImageDelegate.qml
@@ -19,13 +19,17 @@ ColumnLayout {
     readonly property bool sentByMe: author === currentRoom.localUser
 
     property bool openOnFinished: false
+    property bool showOnFinished: false
     readonly property bool downloaded: progressInfo && progressInfo.completed
 
     id: root
 
     spacing: 0
 
-    onDownloadedChanged: if (downloaded && openOnFinished) openSavedFile()
+    onDownloadedChanged: {
+        if (downloaded && showOnFinished) showSavedFile()
+        if (downloaded && openOnFinished) openSavedFile()
+    }
 
     Label {
         Layout.leftMargin: 48
@@ -116,16 +120,6 @@ ColumnLayout {
                 }
             }
 
-            Component {
-                id: fullScreenImage
-
-                FullScreenImage {
-                    imageUrl: "image://mxc/" + content.mediaId
-                    sourceWidth: content.info.w
-                    sourceHeight: content.info.h
-                }
-            }
-
             Rectangle {
                 anchors.fill: parent
 
@@ -137,12 +131,30 @@ ColumnLayout {
                 border.color: MPalette.banner
             }
 
+            Rectangle {
+                anchors.fill: parent
+
+                visible: progressInfo.active && !downloaded
+
+                color: "#BB000000"
+
+                ProgressBar {
+                    anchors.centerIn: parent
+
+                    width: parent.width * 0.8
+
+                    from: 0
+                    to: progressInfo.total
+                    value: progressInfo.progress
+                }
+            }
+
             RippleEffect {
                 anchors.fill: parent
 
                 id: messageMouseArea
 
-                onPrimaryClicked: fullScreenImage.createObject().show()
+                onPrimaryClicked: downloadAndShow()
 
                 onSecondaryClicked: {
                     var contextMenu = imageDelegateContextMenu.createObject(ApplicationWindow.overlay)
@@ -181,6 +193,12 @@ ColumnLayout {
 
                     FileDelegateContextMenu {}
                 }
+
+                Component {
+                    id: fullScreenImage
+
+                    FullScreenImage {}
+                }
             }
         }
     }
@@ -197,13 +215,28 @@ ColumnLayout {
         fileDialog.open()
     }
 
+    function downloadAndShow()
+    {
+        if (downloaded) showSavedFile()
+        else
+        {
+            showOnFinished = true
+            currentRoom.downloadFile(eventId, Platform.StandardPaths.writableLocation(Platform.StandardPaths.CacheLocation) + "/" + eventId.replace(":", "_").replace("/", "_").replace("+", "_") + (message || ".tmp"))
+        }
+    }
+
+    function showSavedFile()
+    {
+        fullScreenImage.createObject(parent, {"eventId": eventId, "localPath": progressInfo.localPath}).show()
+    }
+
     function downloadAndOpen()
     {
         if (downloaded) openSavedFile()
         else
         {
             openOnFinished = true
-            currentRoom.downloadFile(eventId, Platform.StandardPaths.writableLocation(Platform.StandardPaths.CacheLocation) + "/" + eventId.replace(":", "_") + (message || ".tmp"))
+            currentRoom.downloadFile(eventId, Platform.StandardPaths.writableLocation(Platform.StandardPaths.CacheLocation) + "/" + eventId.replace(":", "_").replace("/", "_").replace("+", "_") + (message || ".tmp"))
         }
     }