From bea96cb5865380be77be7199f571c42258859346 Mon Sep 17 00:00:00 2001 From: Eva Date: Tue, 20 Sep 2022 14:43:00 +0200 Subject: [PATCH 1/8] :bug: Fix recent colors --- frontend/src/app/main/ui/workspace/colorpalette.cljs | 4 +++- frontend/src/app/main/ui/workspace/colorpicker/harmony.cljs | 1 + frontend/src/app/main/ui/workspace/colorpicker/ramp.cljs | 1 + .../app/main/ui/workspace/colorpicker/slider_selector.cljs | 1 + 4 files changed, 6 insertions(+), 1 deletion(-) diff --git a/frontend/src/app/main/ui/workspace/colorpalette.cljs b/frontend/src/app/main/ui/workspace/colorpalette.cljs index 39b0e17bbb..6ebb2bd65c 100644 --- a/frontend/src/app/main/ui/workspace/colorpalette.cljs +++ b/frontend/src/app/main/ui/workspace/colorpalette.cljs @@ -36,7 +36,9 @@ (mf/defc palette [{:keys [current-colors recent-colors file-colors shared-libs selected on-select]}] - (let [state (mf/use-state {:show-menu false}) + (let [;; We had to do this due to a bug that leave some bugged colors + current-colors (filter #(some? (:color %)) current-colors) + state (mf/use-state {:show-menu false}) width (:width @state 0) visible (/ width 66) diff --git a/frontend/src/app/main/ui/workspace/colorpicker/harmony.cljs b/frontend/src/app/main/ui/workspace/colorpicker/harmony.cljs index b73e85843a..3c6323a5bb 100644 --- a/frontend/src/app/main/ui/workspace/colorpicker/harmony.cljs +++ b/frontend/src/app/main/ui/workspace/colorpicker/harmony.cljs @@ -131,6 +131,7 @@ :width canvas-side :height canvas-side :on-pointer-down handle-start-drag + :on-pointer-up handle-stop-drag :on-lost-pointer-capture handle-stop-drag :on-click calculate-pos :on-mouse-move #(when @dragging? (calculate-pos %))}] diff --git a/frontend/src/app/main/ui/workspace/colorpicker/ramp.cljs b/frontend/src/app/main/ui/workspace/colorpicker/ramp.cljs index 09a8cfa419..7684b00795 100644 --- a/frontend/src/app/main/ui/workspace/colorpicker/ramp.cljs +++ b/frontend/src/app/main/ui/workspace/colorpicker/ramp.cljs @@ -41,6 +41,7 @@ ] [:div.value-saturation-selector {:on-pointer-down handle-start-drag + :on-pointer-up handle-stop-drag :on-lost-pointer-capture handle-stop-drag :on-click calculate-pos :on-mouse-move #(when @dragging? (calculate-pos %))} 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 9c47681d26..e6dafa65f4 100644 --- a/frontend/src/app/main/ui/workspace/colorpicker/slider_selector.cljs +++ b/frontend/src/app/main/ui/workspace/colorpicker/slider_selector.cljs @@ -52,6 +52,7 @@ [:div.slider-selector {:class (str (if vertical? "vertical " "") class) :on-pointer-down handle-start-drag + :on-pointer-up handle-stop-drag :on-lost-pointer-capture handle-stop-drag :on-click calculate-pos :on-mouse-move #(when @dragging? (calculate-pos %))} From f444d3d01d104ed8f791663a97bbb3a7cfbf896d Mon Sep 17 00:00:00 2001 From: Eva Date: Tue, 20 Sep 2022 15:42:57 +0200 Subject: [PATCH 2/8] :bug: Fix opacity in color picker --- frontend/src/app/main/ui/workspace/colorpicker.cljs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/app/main/ui/workspace/colorpicker.cljs b/frontend/src/app/main/ui/workspace/colorpicker.cljs index c7024ec615..bf15bcb364 100644 --- a/frontend/src/app/main/ui/workspace/colorpicker.cljs +++ b/frontend/src/app/main/ui/workspace/colorpicker.cljs @@ -67,7 +67,7 @@ (mf/use-fn (mf/deps @drag?) (fn [color] - (let [recent-color (merge color) + (let [recent-color (merge current-color color) recent-color (dc/materialize-color-components recent-color)] (when (not @drag?) (st/emit! (dwl/add-recent-color recent-color))) From 199142045f0ea232fb4b22b84acb51f32817e2f1 Mon Sep 17 00:00:00 2001 From: Eva Date: Wed, 21 Sep 2022 13:20:09 +0200 Subject: [PATCH 3/8] :bug: Remove bugged colors from recents --- frontend/src/app/main/ui/workspace/colorpalette.cljs | 2 +- frontend/src/app/main/ui/workspace/colorpicker/libraries.cljs | 1 + 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/frontend/src/app/main/ui/workspace/colorpalette.cljs b/frontend/src/app/main/ui/workspace/colorpalette.cljs index 6ebb2bd65c..501278cdc8 100644 --- a/frontend/src/app/main/ui/workspace/colorpalette.cljs +++ b/frontend/src/app/main/ui/workspace/colorpalette.cljs @@ -37,7 +37,7 @@ (mf/defc palette [{:keys [current-colors recent-colors file-colors shared-libs selected on-select]}] (let [;; We had to do this due to a bug that leave some bugged colors - current-colors (filter #(some? (:color %)) current-colors) + current-colors (filter #(or (:gradient %) (:color %)) current-colors) state (mf/use-state {:show-menu false}) width (:width @state 0) diff --git a/frontend/src/app/main/ui/workspace/colorpicker/libraries.cljs b/frontend/src/app/main/ui/workspace/colorpicker/libraries.cljs index 8e3b6e3925..9825d5da65 100644 --- a/frontend/src/app/main/ui/workspace/colorpicker/libraries.cljs +++ b/frontend/src/app/main/ui/workspace/colorpicker/libraries.cljs @@ -25,6 +25,7 @@ shared-libs (mf/deref refs/workspace-libraries) file-colors (mf/deref refs/workspace-file-colors) recent-colors (mf/deref refs/workspace-recent-colors) + recent-colors (filter #(or (:gradient %) (:color %)) recent-colors) on-library-change (mf/use-fn From 4961991e18c021f337f3f6d3d075c885828fdd8a Mon Sep 17 00:00:00 2001 From: Eva Date: Wed, 21 Sep 2022 13:20:39 +0200 Subject: [PATCH 4/8] :bug: Fix gradient colors in recents --- frontend/src/app/main/data/workspace/colors.cljs | 10 ++++++++-- frontend/src/app/main/ui/workspace/colorpicker.cljs | 4 +--- 2 files changed, 9 insertions(+), 5 deletions(-) diff --git a/frontend/src/app/main/data/workspace/colors.cljs b/frontend/src/app/main/data/workspace/colors.cljs index e6915bf1d0..2205673073 100644 --- a/frontend/src/app/main/data/workspace/colors.cljs +++ b/frontend/src/app/main/data/workspace/colors.cljs @@ -13,6 +13,7 @@ [app.main.data.modal :as md] [app.main.data.workspace.changes :as dch] [app.main.data.workspace.layout :as layout] + [app.main.data.workspace.libraries :as dwl] [app.main.data.workspace.state-helpers :as wsh] [app.main.data.workspace.texts :as dwt] [app.util.color :as uc] @@ -487,7 +488,7 @@ (dissoc :stops))))))))) (defn update-colorpicker-color - [changes] + [changes add-recent?] (ptk/reify ::update-colorpicker-color ptk/UpdateEvent (update [_ state] @@ -502,7 +503,12 @@ (materialize-color-components)))) (-> state (assoc :type :color) - (dissoc :gradient :stops :editing-stop))))))))) + (dissoc :gradient :stops :editing-stop))))))) + ptk/WatchEvent + (watch [_ state _] + (when add-recent? + (let [formated-color (get-color-from-colorpicker-state (:colorpicker state))] + (rx/of (dwl/add-recent-color formated-color))))))) (defn update-colorpicker-gradient [changes] diff --git a/frontend/src/app/main/ui/workspace/colorpicker.cljs b/frontend/src/app/main/ui/workspace/colorpicker.cljs index bf15bcb364..54d69318e5 100644 --- a/frontend/src/app/main/ui/workspace/colorpicker.cljs +++ b/frontend/src/app/main/ui/workspace/colorpicker.cljs @@ -69,9 +69,7 @@ (fn [color] (let [recent-color (merge current-color color) recent-color (dc/materialize-color-components recent-color)] - (when (not @drag?) - (st/emit! (dwl/add-recent-color recent-color))) - (st/emit! (dc/update-colorpicker-color color))))) + (st/emit! (dc/update-colorpicker-color recent-color (not @drag?)))))) handle-click-picker (mf/use-fn From aed065eec18a943d3f042e70ca2d70797d5d338a Mon Sep 17 00:00:00 2001 From: Alejandro Alonso Date: Wed, 21 Sep 2022 08:43:21 +0200 Subject: [PATCH 5/8] :bug: Fix using gradient for shadow fill --- frontend/src/app/main/data/workspace/colors.cljs | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/frontend/src/app/main/data/workspace/colors.cljs b/frontend/src/app/main/data/workspace/colors.cljs index 2205673073..f40a5e1c5a 100644 --- a/frontend/src/app/main/data/workspace/colors.cljs +++ b/frontend/src/app/main/data/workspace/colors.cljs @@ -243,7 +243,10 @@ ptk/WatchEvent (watch [_ _ _] (rx/of (dch/update-shapes ids (fn [shape] - (let [new-attrs (merge (get-in shape [:shadow index :color]) attrs)] + (let [;; If we try to set a gradient to a shadow (for example using the color selection from multiple shapes) let's use the first stop color + attrs (cond-> attrs + (:gradient attrs) (get-in [:gradient :stops 0])) + new-attrs (merge (get-in shape [:shadow index :color]) attrs)] (assoc-in shape [:shadow index :color] new-attrs)))))))) (defn add-stroke From 3063725a62067f59b8b02e3d70a61e40a3836b47 Mon Sep 17 00:00:00 2001 From: Alejandro Alonso Date: Wed, 21 Sep 2022 11:58:41 +0200 Subject: [PATCH 6/8] :bug: Fix color type icon doesn't change --- frontend/src/app/main/data/workspace/colors.cljs | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/frontend/src/app/main/data/workspace/colors.cljs b/frontend/src/app/main/data/workspace/colors.cljs index f40a5e1c5a..18d8884e2a 100644 --- a/frontend/src/app/main/data/workspace/colors.cljs +++ b/frontend/src/app/main/data/workspace/colors.cljs @@ -499,7 +499,10 @@ (fn [state] (let [state (-> state (update :current-color merge changes) - (update :current-color materialize-color-components))] + (update :current-color materialize-color-components) + ;; current color can be a library one I'm changing via colorpicker + (d/dissoc-in [:current-color :id]) + (d/dissoc-in [:current-color :file-id]))] (if-let [stop (:editing-stop state)] (update-in state [:stops stop] (fn [data] (->> changes (merge data) From 726baefa251419c38b44acd2ca2f703678b7d68c Mon Sep 17 00:00:00 2001 From: Alejandro Alonso Date: Wed, 21 Sep 2022 12:21:58 +0200 Subject: [PATCH 7/8] :bug: Fix add to recent colors when changing fill or opacity manually --- .../sidebar/options/rows/color_row.cljs | 20 ++++++++++++------- 1 file changed, 13 insertions(+), 7 deletions(-) diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs b/frontend/src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs index 3f2200139a..c16d88a27a 100644 --- a/frontend/src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs +++ b/frontend/src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs @@ -10,7 +10,9 @@ [app.common.data.macros :as dm] [app.common.pages :as cp] [app.main.data.modal :as modal] + [app.main.data.workspace.libraries :as dwl] [app.main.refs :as refs] + [app.main.store :as st] [app.main.ui.components.color-bullet :as cb] [app.main.ui.components.color-input :refer [color-input]] [app.main.ui.components.numeric-input :refer [numeric-input]] @@ -73,18 +75,22 @@ (mf/use-fn (mf/deps color on-change) (fn [new-value] - (on-change (-> color - (assoc :color new-value) - (dissoc :gradient))))) + (let [color (-> color + (assoc :color new-value) + (dissoc :gradient))] + (st/emit! (dwl/add-recent-color color) + (on-change color))))) handle-opacity-change (mf/use-fn (mf/deps color on-change) (fn [value] - (on-change (assoc color - :opacity (/ value 100) - :id nil - :file-id nil)))) + (let [color (assoc color + :opacity (/ value 100) + :id nil + :file-id nil)] + (st/emit! (dwl/add-recent-color color) + (on-change color))))) handle-click-color (mf/use-fn From dfc1b03a602946aa93c248fe733c61bdbf6f3f68 Mon Sep 17 00:00:00 2001 From: Alejandro Alonso Date: Wed, 21 Sep 2022 13:59:12 +0200 Subject: [PATCH 8/8] :paperclip: Update CHANGES.md file --- CHANGES.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/CHANGES.md b/CHANGES.md index 063ae3ec4e..1108ac03ec 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -11,6 +11,11 @@ - Fix problem with snap to grids [#2221](https://github.com/penpot/penpot/issues/2221) - Fix issue when scaling to value 0 [#2252](https://github.com/penpot/penpot/issues/2252) - Fix problem when moving shapes inside nested frames [Taiga #4113](https://tree.taiga.io/project/penpot/issue/4113) +- Fix color type icon does not change [Taiga #4133](https://tree.taiga.io/project/penpot/issue/4133) +- Fix recent colors are not working [Taiga #4153](https://tree.taiga.io/project/penpot/issue/4153) +- Fix change opacity in colorpicker cause bugged color [Taiga #4154](https://tree.taiga.io/project/penpot/issue/4154) +- Fix gradient colors don't arrive in recent colors palette (https://tree.taiga.io/project/penpot/issue/4155) +- Fix selected colors allow gradients in shadows [Taiga #4156](https://tree.taiga.io/project/penpot/issue/4156) ## 1.15.3-beta