Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-03-13 00:01:51 -05:00
Code Issues Activity

🎉 Update relative position of shapes inside component

Browse source
This commit is contained in:
Andrés Moya 2020-09-16 11:37:54 +02:00
parent 47a8da43dc
commit 63c9e80ed4
1 changed files with 57 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

89
frontend/src/app/main/data/workspace/libraries.cljs
View file

@ -353,6 +353,7 @@
(declare remove-ref) (declare remove-ref)
(declare update-attrs) (declare update-attrs)
(declare sync-attrs) (declare sync-attrs)
(declare calc-new-pos)
(defn reset-component (defn reset-component
[id] [id]
@ -465,7 +466,8 @@
[root-shape page components] [root-shape page components]
(let [objects (get page :objects) (let [objects (get page :objects)
all-shapes (cph/get-object-with-children (:id root-shape) objects) all-shapes (cph/get-object-with-children (:id root-shape) objects)
component (get components (:component-id root-shape))] component (get components (:component-id root-shape))
root-component (get-in component [:objects (:shape-ref root-shape)])]
(loop [shapes (seq all-shapes) (loop [shapes (seq all-shapes)
rchanges [] rchanges []
uchanges []] uchanges []]
@ -473,19 +475,19 @@
(if (nil? shape) (if (nil? shape)
[rchanges uchanges] [rchanges uchanges]
(let [[shape-rchanges shape-uchanges] (let [[shape-rchanges shape-uchanges]
(generate-sync-shape shape page component)] (generate-sync-shape shape root-shape root-component page component)]
(recur (next shapes) (recur (next shapes)
(concat rchanges shape-rchanges) (concat rchanges shape-rchanges)
(concat uchanges shape-uchanges)))))))) (concat uchanges shape-uchanges))))))))
(defn- generate-sync-shape (defn- generate-sync-shape
[shape page component] [shape root-shape root-component page component]
(if (nil? component) (if (nil? component)
(remove-component-and-ref shape page) (remove-component-and-ref shape page)
(let [component-shape (get (:objects component) (:shape-ref shape))] (let [component-shape (get (:objects component) (:shape-ref shape))]
(if (nil? component-shape) (if (nil? component-shape)
(remove-ref shape page) (remove-ref shape page)
(update-attrs shape component-shape page))))) (update-attrs shape component-shape root-shape root-component page)))))
(defn- remove-component-and-ref (defn- remove-component-and-ref
[shape page] [shape page]
@ -530,34 +532,46 @@
:val (:shape-ref shape)}]}]]) :val (:shape-ref shape)}]}]])
(defn- update-attrs (defn- update-attrs
[shape component-shape page] [shape component-shape root-shape root-component page]
(loop [attrs (seq sync-attrs) (let [new-pos (calc-new-pos shape component-shape root-shape root-component)]
roperations [] (loop [attrs (seq sync-attrs)
uoperations []] roperations [{:type :set
(let [attr (first attrs)] :attr :x
(if (nil? attr) :val (:x new-pos)}
(let [rchanges [{:type :mod-obj {:type :set
:page-id (:id page) :attr :y
:id (:id shape) :val (:y new-pos)}]
:operations roperations}] uoperations [{:type :set
uchanges [{:type :mod-obj :attr :x
:page-id (:id page) :val (:x shape)}
:id (:id shape) {:type :set
:operations uoperations}]] :attr :y
[rchanges uchanges]) :val (:y shape)}]]
(if-not (contains? shape attr)
(recur (next attrs) (let [attr (first attrs)]
roperations (if (nil? attr)
uoperations) (let [rchanges [{:type :mod-obj
(let [roperation {:type :set :page-id (:id page)
:attr attr :id (:id shape)
:val (get component-shape attr)} :operations roperations}]
uoperation {:type :set uchanges [{:type :mod-obj
:attr attr :page-id (:id page)
:val (get shape attr)}] :id (:id shape)
:operations uoperations}]]
[rchanges uchanges])
(if-not (contains? shape attr)
(recur (next attrs) (recur (next attrs)
(conj roperations roperation) roperations
(conj uoperations uoperation)))))))) uoperations)
(let [roperation {:type :set
:attr attr
:val (get component-shape attr)}
uoperation {:type :set
:attr attr
:val (get shape attr)}]
(recur (next attrs)
(conj roperations roperation)
(conj uoperations uoperation)))))))))
(def sync-attrs [:content (def sync-attrs [:content
:fill-color :fill-color
@ -584,5 +598,16 @@
:width :width
:height :height
:interactions :interactions
:points]) :points
:transform])
(defn- calc-new-pos
[shape component-shape root-shape root-component]
(let [root-pos (gpt/point (:x root-shape) (:y root-shape))
root-component-pos (gpt/point (:x root-component) (:y root-component))
component-pos (gpt/point (:x component-shape) (:y component-shape))
delta (gpt/subtract component-pos root-component-pos)
shape-pos (gpt/point (:x shape) (:y shape))
new-pos (gpt/add root-pos delta)]
new-pos))