From 1705954b07c5427f78ceb632e2fa326de035aa04 Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Tue, 26 Apr 2022 18:27:11 +0200 Subject: [PATCH] :bug: Fix problem with transforms --- common/src/app/common/pages/helpers.cljc | 3 ++- .../app/main/data/workspace/transforms.cljs | 12 ++++----- frontend/src/app/main/ui/shapes/mask.cljs | 12 ++++++--- .../shapes/frame/dynamic_modifiers.cljs | 8 +++--- .../app/main/ui/workspace/viewport/utils.cljs | 25 ++++++++++++++----- 5 files changed, 38 insertions(+), 22 deletions(-) diff --git a/common/src/app/common/pages/helpers.cljc b/common/src/app/common/pages/helpers.cljc index 1059d1435..b768680eb 100644 --- a/common/src/app/common/pages/helpers.cljc +++ b/common/src/app/common/pages/helpers.cljc @@ -7,6 +7,7 @@ (ns app.common.pages.helpers (:require [app.common.data :as d] + [app.common.data.macros :as dm] [app.common.geom.shapes :as gsh] [app.common.spec :as us] [app.common.spec.page :as spec.page] @@ -92,7 +93,7 @@ "Returns a vector of parents of the specified shape." [objects shape-id] (loop [result [] id shape-id] - (if-let [parent-id (get-in objects [id :parent-id])] + (if-let [parent-id (dm/get-in objects [id :parent-id])] (recur (conj result parent-id) parent-id) result))) diff --git a/frontend/src/app/main/data/workspace/transforms.cljs b/frontend/src/app/main/data/workspace/transforms.cljs index f5a593240..8d1be936f 100644 --- a/frontend/src/app/main/data/workspace/transforms.cljs +++ b/frontend/src/app/main/data/workspace/transforms.cljs @@ -378,7 +378,7 @@ (update [_ state] (-> state (dissoc :workspace-modifiers) - (update :workspace-local dissoc :current-move-selected))))) + (dissoc ::current-move-selected))))) ;; -- Resize -------------------------------------------------------- @@ -721,15 +721,15 @@ ptk/UpdateEvent (update [_ state] - (if (nil? (get-in state [:workspace-local :current-move-selected])) + (if (nil? (get state ::current-move-selected)) (-> state (assoc-in [:workspace-local :transform] :move) - (assoc-in [:workspace-local :current-move-selected] same-event)) + (assoc ::current-move-selected same-event)) state)) ptk/WatchEvent (watch [_ state stream] - (if (= same-event (get-in state [:workspace-local :current-move-selected])) + (if (= same-event (get state ::current-move-selected)) (let [selected (wsh/lookup-selected state {:omit-blocked? true}) nudge (get-in state [:profile :props :nudge] {:big 10 :small 1}) move-events (->> stream @@ -744,10 +744,10 @@ (rx/concat (rx/merge (->> move-events - (rx/take-until stopper) (rx/scan #(gpt/add %1 mov-vec) (gpt/point 0 0)) (rx/map #(hash-map :displacement (gmt/translate-matrix %))) - (rx/map (partial set-modifiers selected))) + (rx/map (partial set-modifiers selected)) + (rx/take-until stopper)) (rx/of (move-selected direction shift?))) (rx/of (apply-modifiers selected) diff --git a/frontend/src/app/main/ui/shapes/mask.cljs b/frontend/src/app/main/ui/shapes/mask.cljs index 1d7bfdc7d..5e76d95c3 100644 --- a/frontend/src/app/main/ui/shapes/mask.cljs +++ b/frontend/src/app/main/ui/shapes/mask.cljs @@ -50,9 +50,8 @@ render-id (mf/use-ctx muc/render-ctx) svg-text? (and (= :text (:type mask)) (some? (:position-data mask))) - mask-bb - (-> (gsh/transform-shape mask) - (:points))] + mask-bb (-> (gsh/transform-shape mask) (:points)) + mask-bb-rect (gsh/points->rect mask-bb)] [:defs [:filter {:id (filter-id render-id mask)} [:feFlood {:flood-color "white" @@ -73,7 +72,12 @@ ;; When te shape is a text we pass to the shape the info and disable the filter. ;; There is a bug in Firefox with filters and texts. We change the text to white at shape level [:mask {:class "mask-shape" - :id (mask-id render-id mask)} + :id (mask-id render-id mask) + :x (:x mask-bb-rect) + :y (:y mask-bb-rect) + :width (:width mask-bb-rect) + :height (:height mask-bb-rect) + :mask-units "userSpaceOnUse"} [:g {:filter (when-not svg-text? (filter-url render-id mask))} [:& shape-wrapper {:shape (-> mask (dissoc :shadow :blur) (assoc :is-mask? true))}]]]]))) diff --git a/frontend/src/app/main/ui/workspace/shapes/frame/dynamic_modifiers.cljs b/frontend/src/app/main/ui/workspace/shapes/frame/dynamic_modifiers.cljs index 2fde51491..531113297 100644 --- a/frontend/src/app/main/ui/workspace/shapes/frame/dynamic_modifiers.cljs +++ b/frontend/src/app/main/ui/workspace/shapes/frame/dynamic_modifiers.cljs @@ -38,15 +38,13 @@ (mf/use-layout-effect (mf/deps transforms) (fn [] - (when (and (nil? @prev-transforms) - (some? transforms)) + (when (and (empty? @prev-modifiers) (d/not-empty? modifiers)) (utils/start-transform! node shapes)) - (when (some? modifiers) + (when (d/not-empty? modifiers) (utils/update-transform! node shapes transforms modifiers)) - (when (and (some? @prev-modifiers) - (empty? modifiers)) + (when (and (d/not-empty? @prev-modifiers) (empty? modifiers)) (utils/remove-transform! node @prev-shapes)) (reset! prev-modifiers modifiers) diff --git a/frontend/src/app/main/ui/workspace/viewport/utils.cljs b/frontend/src/app/main/ui/workspace/viewport/utils.cljs index 03ee9365d..0c37143be 100644 --- a/frontend/src/app/main/ui/workspace/viewport/utils.cljs +++ b/frontend/src/app/main/ui/workspace/viewport/utils.cljs @@ -150,10 +150,14 @@ (when (or (= (dom/get-tag-name node) "mask") (= (dom/get-tag-name node) "filter")) - (dom/set-attribute! node "data-old-x" (dom/get-attribute node "x")) - (dom/set-attribute! node "data-old-y" (dom/get-attribute node "y")) - (dom/set-attribute! node "data-old-width" (dom/get-attribute node "width")) - (dom/set-attribute! node "data-old-height" (dom/get-attribute node "height")))))))) + (let [old-x (dom/get-attribute node "x") + old-y (dom/get-attribute node "y") + old-width (dom/get-attribute node "width") + old-height (dom/get-attribute node "height")] + (dom/set-attribute! node "data-old-x" old-x) + (dom/set-attribute! node "data-old-y" old-y) + (dom/set-attribute! node "data-old-width" old-width) + (dom/set-attribute! node "data-old-height" old-height)))))))) (defn set-transform-att! [node att value] @@ -208,10 +212,19 @@ ;; The shape width/height will be automaticaly setup when the modifiers are applied nil + (or (= (dom/get-tag-name node) "mask") + (= (dom/get-tag-name node) "filter")) + (do + (dom/remove-attribute! node "data-old-x") + (dom/remove-attribute! node "data-old-y") + (dom/remove-attribute! node "data-old-width") + (dom/remove-attribute! node "data-old-height")) + :else (let [old-transform (dom/get-attribute node "data-old-transform")] - (when-not (some? old-transform) - (dom/remove-attribute! node "data-old-transform") + (if (some? old-transform) + (do (dom/remove-attribute! node "data-old-transform") + (dom/set-attribute! node "transform" old-transform)) (dom/remove-attribute! node "transform"))))))))) (defn format-viewbox [vbox]