From 14a438656188c2023ad5cf3fe21dd993819c0dc2 Mon Sep 17 00:00:00 2001
From: Eva <evauwu@riseup.net>
Date: Tue, 1 Apr 2025 02:36:20 +0200
Subject: [PATCH] client/posts: skip thumbnail placeholder if fullsize image is
 in cache

---
 client/js/controls/post_content_control.js |  9 ++++++---
 client/js/util/misc.js                     | 10 ++++++++++
 client/js/views/home_view.js               |  1 +
 client/js/views/post_main_view.js          |  1 +
 4 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/client/js/controls/post_content_control.js b/client/js/controls/post_content_control.js
index b37d79c8..68951dca 100644
--- a/client/js/controls/post_content_control.js
+++ b/client/js/controls/post_content_control.js
@@ -5,11 +5,12 @@ const views = require("../util/views.js");
 const optimizedResize = require("../util/optimized_resize.js");
 
 class PostContentControl {
-    constructor(hostNode, post, viewportSizeCalculator, fitFunctionOverride) {
+    constructor(hostNode, post, isMediaCached, viewportSizeCalculator, fitFunctionOverride) {
         this._post = post;
         this._viewportSizeCalculator = viewportSizeCalculator;
         this._hostNode = hostNode;
         this._template = views.getTemplate("post-content");
+        this._isMediaCached = isMediaCached;
 
         let fitMode = settings.get().fitMode;
         if (typeof fitFunctionOverride !== "undefined") {
@@ -150,9 +151,11 @@ class PostContentControl {
             newNode.firstElementChild.style.backgroundImage = "";
         }
         if (["image", "flash"].includes(this._post.type)) {
-            newNode.firstElementChild.style.backgroundImage = "url("+this._post.originalThumbnailUrl+")";
+            if (this._post.type !== "image" || !this._isMediaCached) {
+                newNode.firstElementChild.style.backgroundImage = "url("+this._post.originalThumbnailUrl+")";
+            }
         }
-        if (this._post.type == "image") {
+        if (this._post.type == "image" && !this._isMediaCached) {
             newNode.firstElementChild.addEventListener("load", load);
         } else if (settings.get().transparencyGrid) {
             newNode.classList.add("transparency-grid");
diff --git a/client/js/util/misc.js b/client/js/util/misc.js
index 756ad84b..2a71fe10 100644
--- a/client/js/util/misc.js
+++ b/client/js/util/misc.js
@@ -211,6 +211,15 @@ function getPrettyName(tag) {
     return tag;
 }
 
+function isMediaCached(post) {
+    if (post.type !== "image") {
+        return false;
+    }
+    const img = new Image()
+    img.src = post.contentUrl;
+    return img.complete;
+}
+
 module.exports = {
     range: range,
     formatRelativeTime: formatRelativeTime,
@@ -229,4 +238,5 @@ module.exports = {
     escapeSearchTerm: escapeSearchTerm,
     dataURItoBlob: dataURItoBlob,
     getPrettyName: getPrettyName,
+    isMediaCached: isMediaCached,
 };
diff --git a/client/js/views/home_view.js b/client/js/views/home_view.js
index c91363b2..795d6a5a 100644
--- a/client/js/views/home_view.js
+++ b/client/js/views/home_view.js
@@ -62,6 +62,7 @@ class HomeView {
             this._postContentControl = new PostContentControl(
                 this._postContainerNode,
                 postInfo.featuredPost,
+                misc.isMediaCached(postInfo.featuredPost),
                 () => {
                     return [window.innerWidth * 0.8, window.innerHeight * 0.7];
                 },
diff --git a/client/js/views/post_main_view.js b/client/js/views/post_main_view.js
index 5ef7f61e..d5d15c51 100644
--- a/client/js/views/post_main_view.js
+++ b/client/js/views/post_main_view.js
@@ -31,6 +31,7 @@ class PostMainView {
         this._postContentControl = new PostContentControl(
             postContainerNode,
             ctx.post,
+            misc.isMediaCached(ctx.post),
             () => {
                 const margin = sidebarNode.getBoundingClientRect().left;