From 6808390827bd19ebde193e04588708e8855f9cf9 Mon Sep 17 00:00:00 2001 From: Alonso Torres Date: Mon, 8 Jun 2026 13:25:45 +0200 Subject: [PATCH] :bug: Fix problem with color picker error (#10056) --- common/src/app/common/math.cljc | 2 +- .../src/app/main/data/workspace/colors.cljs | 3 +-- .../colorpicker/slider_selector.cljs | 6 ++++-- .../ui/workspace/viewport/pixel_overlay.cljs | 19 ++++++++++--------- 4 files changed, 16 insertions(+), 14 deletions(-) diff --git a/common/src/app/common/math.cljc b/common/src/app/common/math.cljc index 13fa601d69..043559e257 100644 --- a/common/src/app/common/math.cljc +++ b/common/src/app/common/math.cljc @@ -183,7 +183,7 @@ :clj (Math/log10 x))) (defn clamp [num from to] - (if (< num from) + (if (or (nan? num) (< num from)) from (if (> num to) to num))) diff --git a/frontend/src/app/main/data/workspace/colors.cljs b/frontend/src/app/main/data/workspace/colors.cljs index ea6cbd4d36..df61a14e5f 100644 --- a/frontend/src/app/main/data/workspace/colors.cljs +++ b/frontend/src/app/main/data/workspace/colors.cljs @@ -738,7 +738,7 @@ [h s v] (clr/hex->hsv value)] (merge data {:hex (or value "000000") - :alpha (or opacity 1) + :alpha (if (d/nan? opacity) 1 (or opacity 1)) :r r :g g :b b :h h :s s :v v}))) @@ -815,7 +815,6 @@ (rx/filter (ptk/type? ::update-colorpicker-add-stop) stream) (rx/filter (ptk/type? ::update-colorpicker-add-auto) stream) (rx/filter (ptk/type? ::remove-gradient-stop) stream)) - (rx/debounce 40) (rx/map (constantly (colorpicker-onchange-runner on-change))) (rx/take-until stopper)))) diff --git a/frontend/src/app/main/ui/workspace/colorpicker/slider_selector.cljs b/frontend/src/app/main/ui/workspace/colorpicker/slider_selector.cljs index 11a73a449d..14c4e1b820 100644 --- a/frontend/src/app/main/ui/workspace/colorpicker/slider_selector.cljs +++ b/frontend/src/app/main/ui/workspace/colorpicker/slider_selector.cljs @@ -42,9 +42,11 @@ (when on-change (let [{:keys [left right top bottom]} (-> ev dom/get-target dom/get-bounding-rect) {:keys [x y]} (-> ev dom/get-client-position) + h-size (- right left) + v-size (- bottom top) unit-value (if is-vertical - (mth/clamp (/ (- bottom y) (- bottom top)) 0 1) - (mth/clamp (/ (- x left) (- right left)) 0 1)) + (if (pos? v-size) (mth/clamp (/ (- bottom y) v-size) 0 1) 0) + (if (pos? h-size) (mth/clamp (/ (- x left) h-size) 0 1) 0)) value (+ min-value (* unit-value (- max-value min-value)))] (on-change value))))] diff --git a/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs b/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs index d27cd2d018..92d2d43040 100644 --- a/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs +++ b/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs @@ -7,6 +7,7 @@ (ns app.main.ui.workspace.viewport.pixel-overlay (:require-macros [app.main.style :as stl]) (:require + [app.common.data :as d] [app.common.data.macros :as dm] [app.common.math :as mth] [app.config :as cfg] @@ -89,10 +90,10 @@ (when (and (>= x 0) (< x img-width) (>= y 0) (< y img-height)) (let [offset (* (+ (* y img-width) x) 4) rgba (unchecked-get image-data "data") - r (obj/get rgba (+ 0 offset)) - g (obj/get rgba (+ 1 offset)) - b (obj/get rgba (+ 2 offset)) - a (obj/get rgba (+ 3 offset)) + r (d/check-num (obj/get rgba (+ 0 offset)) 255) + g (d/check-num (obj/get rgba (+ 1 offset)) 255) + b (d/check-num (obj/get rgba (+ 2 offset)) 255) + a (d/check-num (obj/get rgba (+ 3 offset)) 255) color [r g b a]] ;; Store latest color synchronously so the click handler always reads ;; the correct pixel even before the rAF fires (fixes race condition) @@ -293,13 +294,13 @@ ;; Only pick color when cursor is within canvas bounds to avoid garbage pixels (when (and (>= canvas-x 0) (< canvas-x img-width) (>= canvas-y 0) (< canvas-y img-height)) (let [;; image-data pixels start from the bottom-left corner; invert y accordingly - inverted-y (- img-height canvas-y) + inverted-y (- img-height canvas-y 1) offset (* (+ (* inverted-y img-width) canvas-x) 4) rgba (.-data image-data) - r (obj/get rgba (+ 0 offset)) - g (obj/get rgba (+ 1 offset)) - b (obj/get rgba (+ 2 offset)) - a (obj/get rgba (+ 3 offset)) + r (d/check-num (obj/get rgba (+ 0 offset)) 255) + g (d/check-num (obj/get rgba (+ 1 offset)) 255) + b (d/check-num (obj/get rgba (+ 2 offset)) 255) + a (d/check-num (obj/get rgba (+ 3 offset)) 255) color [r g b a]] ;; Store latest color synchronously so the click handler always reads ;; the correct pixel even before the rAF fires (fixes race condition)