Add an option to hide images and videos by default

Implements #658

src/timeline/ImageComponent.qml

@@ -74,7 +74,7 @@ Item {
 
         anchors.fill: parent
 
-        active: !root.mediaInfo.animated
+        active: !root.mediaInfo.animated && !_private.hideImage
         sourceComponent: Image {
             source: root.mediaInfo.source
             sourceSize.width: mediaSizeHelper.currentSize.width * Screen.devicePixelRatio
@@ -89,7 +89,7 @@ Item {
 
         anchors.fill: parent
 
-        active: root?.mediaInfo.animated ?? false
+        active: (root?.mediaInfo.animated ?? false) && !_private.hideImage
         sourceComponent: AnimatedImage {
             source: root.mediaInfo.source
 
@@ -101,8 +101,8 @@ Item {
 
     Image {
         anchors.fill: parent
-        source: root?.mediaInfo.tempInfo.source ?? ""
-        visible: _private.imageItem.status !== Image.Ready
+        source: visible ? (root?.mediaInfo.tempInfo.source ?? "") : ""
+        visible: _private.imageItem && _private.imageItem.status !== Image.Ready && !_private.hideImage
     }
 
     QQC2.ToolTip.text: root.display
@@ -124,11 +124,23 @@ Item {
             anchors.centerIn: parent
 
             width: parent.width * 0.8
+            visible: !_private.hideImage
 
             from: 0
             to: 1.0
             value: _private.imageItem.progress
         }
+
+    }
+
+    QQC2.Button {
+        anchors.centerIn: parent
+        text: i18nc("@action:button", "Show Image")
+        visible: _private.hideImage
+        onClicked: {
+            _private.hideImage = false;
+            Controller.markImageShown(root.eventId);
+        }
     }
 
     TapHandler {
@@ -180,5 +192,7 @@ Item {
 
         // The space available for the component after taking away the border
         readonly property real downloaded: root.fileTransferInfo && root.fileTransferInfo.completed
+
+        property bool hideImage: NeoChatConfig.hideImages && !Controller.isImageShown(root.eventId)
     }
 }

src/timeline/VideoComponent.qml

@@ -93,6 +93,12 @@ Video {
     fillMode: VideoOutput.PreserveAspectFit
 
     Component.onDestruction: root.stop()
+    Component.onCompleted: {
+        console.warn("state", root.state)
+        if (NeoChatConfig.hideImages && !Controller.isImageShown(root.eventId)) {
+            root.state = "hidden";
+        }
+    }
 
     states: [
         State {
@@ -167,6 +173,21 @@ Video {
                     root.play();
                 }
             }
+        },
+        State {
+            name: "hidden"
+            PropertyChanges {
+                target: mediaThumbnail
+                visible: false
+            }
+            PropertyChanges {
+                target: videoControls
+                visible: false
+            }
+            PropertyChanges {
+                target: hidden
+                visible: true
+            }
         }
     ]
 
@@ -184,7 +205,7 @@ Video {
         anchors.fill: parent
         visible: false
 
-        source: root.mediaInfo.tempInfo.source
+        source: visible ? root.mediaInfo.tempInfo.source : ""
         fillMode: Image.PreserveAspectFit
     }
 
@@ -225,6 +246,23 @@ Video {
         }
     }
 
+    Rectangle {
+        id: hidden
+        anchors.fill: parent
+
+        visible: false
+        color: "#BB000000"
+
+        QQC2.Button {
+            anchors.centerIn: parent
+            text: i18nc("@action:button", "Show Video")
+            onClicked: {
+                root.state = "notDownloaded";
+                Controller.markImageShown(root.eventId);
+            }
+        }
+    }
+
     QQC2.Control {
         id: videoControls
         property bool stateVisible: false