diff --git a/frontend/src/app/main/data/workspace/selection.cljs b/frontend/src/app/main/data/workspace/selection.cljs index a47d625921..e70e5d08d6 100644 --- a/frontend/src/app/main/data/workspace/selection.cljs +++ b/frontend/src/app/main/data/workspace/selection.cljs @@ -511,14 +511,14 @@ (map #(vector (:old-id %) (get-in % [:obj :id])))) id-duplicated (first new-selected)] - ;; Warning: This order is important for the focus mode. + + ;; Warning: This order is important for the focus mode. (rx/merge (->> (rx/from dup-frames) (rx/map (fn [[old-id new-id]] (dwt/duplicate-thumbnail old-id new-id)))) (rx/of (dch/commit-changes changes) (select-shapes new-selected) - (memorize-duplicated id-original id-duplicated)) - )))))))) + (memorize-duplicated id-original id-duplicated)))))))))) (defn change-hover-state [id value] diff --git a/frontend/src/app/main/data/workspace/thumbnails.cljs b/frontend/src/app/main/data/workspace/thumbnails.cljs index 78b860e3ee..d12ab34a05 100644 --- a/frontend/src/app/main/data/workspace/thumbnails.cljs +++ b/frontend/src/app/main/data/workspace/thumbnails.cljs @@ -15,7 +15,9 @@ [beicon.core :as rx] [potok.core :as ptk])) -(defn force-render-stream [id] +(defn force-render-stream + "Stream that will inform the frame-wrapper to mount into memory" + [id] (->> st/stream (rx/filter (ptk/type? ::force-render)) (rx/map deref) @@ -23,6 +25,7 @@ (rx/take 1))) (defn update-thumbnail + "Updates the thumbnail information for the given frame `id`" [id data] (let [lock (uuid/next)] (ptk/reify ::update-thumbnail @@ -42,6 +45,8 @@ (let [stopper (->> stream (rx/filter (ptk/type? :app.main.data.workspace/finalize))) params {:file-id (:current-file-id state) :object-id id}] + ;; Sends the first event and debounce the rest. Will only make one update once + ;; the 2 second debounce is finished (rx/merge (->> stream (rx/take-until stopper) @@ -123,7 +128,10 @@ (->> changes (every? is-thumbnail-change?)))) -(defn watch-state-changes [] +(defn watch-state-changes + "Watch the state for changes inside frames. If a change is detected will force a rendering + of the frame data so the thumbnail can be updated." + [] (ptk/reify ::watch-state-changes ptk/WatchEvent (watch [_ _ stream] diff --git a/frontend/src/app/main/ui/workspace/shapes/frame/thumbnail_render.cljs b/frontend/src/app/main/ui/workspace/shapes/frame/thumbnail_render.cljs index 0fd75996f0..f16584ca64 100644 --- a/frontend/src/app/main/ui/workspace/shapes/frame/thumbnail_render.cljs +++ b/frontend/src/app/main/ui/workspace/shapes/frame/thumbnail_render.cljs @@ -23,7 +23,7 @@ canvas-height (.-height canvas-node)] (.clearRect canvas-context 0 0 canvas-width canvas-height) (.drawImage canvas-context img-node 0 0 canvas-width canvas-height) - (.toDataURL canvas-node "image/jpg" 1))) + (.toDataURL canvas-node "image/webp" 0.75))) (defn use-render-thumbnail "Hook that will create the thumbnail thata"