From f56be1f4007c924f4adb1a464aacb36639bab6e1 Mon Sep 17 00:00:00 2001
From: Aevann1 <Aevann3@gmail.com>
Date: Sun, 8 Aug 2021 20:46:27 +0200
Subject: [PATCH] fd

---
 files/templates/default.html              | 28 +----------------------
 files/templates/expanded_video_modal.html | 23 +++++++++++++++++++
 files/templates/submission_listing.html   | 26 +++++++++++----------
 3 files changed, 38 insertions(+), 39 deletions(-)
 create mode 100644 files/templates/expanded_video_modal.html

diff --git a/files/templates/default.html b/files/templates/default.html
index b1be4ede6..276ad50e1 100644
--- a/files/templates/default.html
+++ b/files/templates/default.html
@@ -453,18 +453,6 @@
 
 		// Expand Images on Desktop
 
-		$('.expandable-image').click( function(event) {
-
-			if (event.which != 1) {
-				return
-			}
-			event.preventDefault();
-
-			var url= $(this).data('url');
-
-			expandDesktopImage(url,url);
-			})
-
 		function expandDesktopImage(image, link) {
 
 		// Link text
@@ -482,20 +470,6 @@
 			};
 
 
-		// Expand Videos on Desktop
-
-		$('.expandable-video').click( function(event) {
-
-			if (event.which != 1) {
-				return
-			}
-			event.preventDefault();
-
-			var url= $(this).data('url');
-
-			expandDesktopVideo(url,url);
-		})
-
 		function expandDesktopVideo(video, link) {
 
 			// Link text
@@ -505,7 +479,7 @@
 
 			var inlineVideo = document.getElementById("desktop-expanded-video");
 
-			inlineVideo.src = Video.replace("100w.gif", "giphy.gif");
+			inlineVideo.src = Video + "?controls=0";
 			linkText.href = Video;
 			imgLink.href=Video;
 
diff --git a/files/templates/expanded_video_modal.html b/files/templates/expanded_video_modal.html
new file mode 100644
index 000000000..533e42295
--- /dev/null
+++ b/files/templates/expanded_video_modal.html
@@ -0,0 +1,23 @@
+<!-- Expand Desktop Video Modal -->
+
+<div class="modal desktop-expanded-video-modal" id="expandVideoModal" tabindex="-1" role="dialog" aria-labelledby="expandVideoModalTitle" aria-hidden="true">
+	<div class="modal-dialog modal-xl modal-dialog-centered mx-auto" role="document" style="width: fit-content;">
+		<div class="modal-content bg-transparent shadow-none m-5 m-md-0">
+
+			<div class="modal-body text-center p-0">
+				<div class="d-inline-block position-relative">
+					<a href="" ref="nofollow noopener" target="_blank" id="desktop-expanded-video-wrap-link">
+						<iframe src="" frameborder="0" class="img-fluid rounded" id="desktop-expanded-video" style="min-width: 250px;"></iframe>
+					</a>
+					<div class="position-absolute d-flex justify-content-between align-items-center w-100 mt-1">
+						<a href="" ref="nofollow noopener" target="_blank" class="text-gray-500 font-weight-bold text-left" id="desktop-expanded-video-link">View original</a>
+					</div>
+				</div>
+			</div>
+			
+		</div>
+	</div>
+</div>
+
+
+<div style="padding-top:5px; padding-bottom: 10px;"></div>
\ No newline at end of file
diff --git a/files/templates/submission_listing.html b/files/templates/submission_listing.html
index 5abdc16e2..95a064b6b 100644
--- a/files/templates/submission_listing.html
+++ b/files/templates/submission_listing.html
@@ -65,21 +65,23 @@
 			<div style="z-index: 3;">
 				
 				{% if not p.url %}
-					<a {% if v and v.newtab %}target="_blank"{% endif %} href="{{p.permalink}}" rel="nofollow noopener">
-						<img src="{{p.thumb_url}}" class="post-img">
-					</a>
+				<a {% if v and v.newtab %}target="_blank"{% endif %} href="{{p.permalink}}" rel="nofollow noopener">
+					<img src="{{p.thumb_url}}" class="post-img">
+				</a>
 				{% elif p.is_image %}
-					<a href="javascript:void(0)" rel="nofollow noopener" class="expandable-image" data-toggle="modal" data-target="#expandImageModal" data-url="{{p.realurl(v)}}">
-						<img src="{{p.thumb_url}}" class="post-img">
-					</a>
+				<div class="card-header bg-transparent border-0 d-none d-md-flex flex-row flex-nowrap pl-3 p-0">
+					<a href="{{p.realurl(v)}}" style="height: fit-content;" {% if v and v.newtabexternal %}target="_blank"{% endif %} rel="nofollow" data-toggle="modal" data-target="#expandImageModal" onclick="expandDesktopImage('{{p.realurl(v)}}','{{p.realurl(v)}}')"><img src="{{p.thumb_url}}" class="post-img d-none d-md-block" alt="Unable to load image"></a>
+
+				</div>
 				{% elif "streamable.com" in p.url %}
-					<a href="javascript:void(0)" rel="nofollow noopener" class="expandable-video" data-toggle="modal" data-target="#expandVideoModal" data-url="{{p.realurl(v)}}">
-						<img src="{{p.thumb_url}}" class="post-img">
-					</a>
+				<div class="card-header bg-transparent border-0 d-none d-md-flex flex-row flex-nowrap pl-3 p-0">
+					<a href="{{p.realurl(v)}}" style="height: fit-content;" {% if v and v.newtabexternal %}target="_blank"{% endif %} rel="nofollow" data-toggle="modal" data-target="#expandVideoModal" onclick="expandDesktopVideo('{{p.realurl(v)}}','{{p.realurl(v)}}')"><img src="{{p.thumb_url}}" class="post-img d-none d-md-block" alt="Unable to load video"></a>
+
+				</div>
 				{% else %}
-					<a {% if v and v.newtabexternal %}target="_blank"{% endif %} href="{{p.realurl(v)}}" rel="nofollow noopener">
-						<img src="{{p.thumb_url}}" class="post-img">
-					</a>
+				<a {% if v and v.newtabexternal %}target="_blank"{% endif %} href="{{p.realurl(v)}}" rel="nofollow noopener">
+					<img src="{{p.thumb_url}}" class="post-img">
+				</a>
 				{% endif %}
 				
 			</div>