🐛 Fix corrupted thumbnail rendering

This commit is contained in:
Aitor 2023-11-20 10:00:25 +01:00
parent 0eb66464ab
commit 3cbb60620a
2 changed files with 27 additions and 30 deletions

View file

@ -192,8 +192,8 @@
(rx/map wapi/create-uri) (rx/map wapi/create-uri)
(rx/mapcat (fn [uri] (rx/mapcat (fn [uri]
(->> (create-image uri) (->> (create-image uri)
(rx/mapcat #(wapi/create-image-bitmap % #js {:resizeWidth width (rx/mapcat #(wapi/create-image-bitmap-with-workaround % #js {:resizeWidth width
:resizeQuality quality})) :resizeQuality quality}))
(rx/tap #(wapi/revoke-uri uri)))))))) (rx/tap #(wapi/revoke-uri uri))))))))
(defn- render-blob (defn- render-blob

View file

@ -10,9 +10,7 @@
[app.common.data :as d] [app.common.data :as d]
[app.common.exceptions :as ex] [app.common.exceptions :as ex]
[app.common.logging :as log] [app.common.logging :as log]
[app.config :as cf]
[app.util.object :as obj] [app.util.object :as obj]
[app.util.thumbnails :as th]
[beicon.core :as rx] [beicon.core :as rx]
[cuerdas.core :as str] [cuerdas.core :as str]
[promesa.core :as p])) [promesa.core :as p]))
@ -57,6 +55,14 @@
([content mtype] ([content mtype]
(js/Blob. #js [content] #js {:type mtype}))) (js/Blob. #js [content] #js {:type mtype})))
(defn create-blob-from-canvas
([canvas]
(create-blob-from-canvas canvas nil))
([canvas options]
(if (obj/in? canvas "convertToBlob")
(.convertToBlob canvas options)
(p/create (fn [resolve _] (.toBlob #(resolve %) canvas options))))))
(defn revoke-uri (defn revoke-uri
[url] [url]
(when ^boolean (str/starts-with? url "blob:") (when ^boolean (str/starts-with? url "blob:")
@ -154,15 +160,19 @@
(js/createImageBitmap image options))) (js/createImageBitmap image options)))
(defn create-image (defn create-image
[src width height] ([src]
(p/create (create-image src nil nil))
(fn [resolve reject] ([src width height]
(let [img (.createElement js/document "img")] (p/create
(obj/set! img "width" width) (fn [resolve reject]
(obj/set! img "height" height) (let [img (.createElement js/document "img")]
(obj/set! img "src" src) (when-not (nil? width)
(obj/set! img "onload" #(resolve img)) (obj/set! img "width" width))
(obj/set! img "onerror" reject))))) (when-not (nil? height)
(obj/set! img "height" height))
(obj/set! img "src" src)
(obj/set! img "onload" #(resolve img))
(obj/set! img "onerror" reject))))))
;; Why this? Because as described in https://bugs.chromium.org/p/chromium/issues/detail?id=1463435 ;; Why this? Because as described in https://bugs.chromium.org/p/chromium/issues/detail?id=1463435
;; the createImageBitmap seems to apply premultiplied alpha multiples times on the same image ;; the createImageBitmap seems to apply premultiplied alpha multiples times on the same image
@ -171,23 +181,10 @@
([image] ([image]
(create-image-bitmap-with-workaround image nil)) (create-image-bitmap-with-workaround image nil))
([^js image options] ([^js image options]
(let [width (.-value (.-baseVal (.-width image))) (let [offscreen-canvas (create-offscreen-canvas (.-width image) (.-height image))
height (.-value (.-baseVal (.-height image))) offscreen-context (.getContext offscreen-canvas "2d")]
[width height] (th/get-proportional-size width height) (.drawImage offscreen-context image 0 0)
(create-image-bitmap offscreen-canvas options))))
image-source
(if (cf/check-browser? :safari)
(let [src (.-baseVal (.-href image))]
(create-image src width height))
(p/resolved image))]
(-> image-source
(p/then
(fn [html-img]
(let [offscreen-canvas (create-offscreen-canvas width height)
offscreen-context (.getContext offscreen-canvas "2d")]
(.drawImage offscreen-context html-img 0 0)
(create-image-bitmap offscreen-canvas options))))))))
(defn request-fullscreen (defn request-fullscreen
[el] [el]