Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-04-13 07:21:40 -05:00
Code Issues Activity

Merge pull request #391 from penpot/737/add-or-remove-shapes-to-components

Browse source 
✨ Synchronize add/delete/move shapes in componentes
This commit is contained in:
Andrey Antukh 2020-11-25 14:09:54 +01:00 • committed by GitHub
commit 7ceb9b4009
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 801 additions and 455 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
backend/src/app/services/mutations/files.clj
View file

@ -251,7 +251,8 @@
:add-media :mod-media :del-media
:add-component :mod-component :del-component
:add-typography :mod-typography :del-typography} (:type change))
(and (= (:type change) :mod-obj)
(and (#{:add-obj :mod-obj :del-obj
:reg-objects :mov-objects} (:type change))
(some? (:component-id change)))))
(declare update-file)

140
common/app/common/pages.cljc
View file

@ -340,6 +340,7 @@
:rx :radius-group
:ry :radius-group
:masked-group? :mask-group})
;; shapes-group is handled differently
(s/def ::minimal-shape
(s/keys :req-un [::type ::name]
@ -435,6 +436,14 @@
:internal.file/recent-colors
:internal.file/media]))
(s/def :internal.container/type #{:page :component})
(s/def ::container
(s/keys :req-un [:internal.container/type
::id
::name
:internal.page/objects]))
(defmulti operation-spec :type)
(s/def :internal.operations.set/attr keyword?)
@ -460,29 +469,52 @@
(s/def :internal.changes.add-obj/obj ::shape)
(defn- valid-container-id-frame?
[o]
(or (and (contains? o :page-id)
(not (contains? o :component-id))
(some? (:frame-id o)))
(and (contains? o :component-id)
(not (contains? o :page-id))
(nil? (:frame-id o)))))
(defn- valid-container-id?
[o]
(or (and (contains? o :page-id)
(not (contains? o :component-id)))
(and (contains? o :component-id)
(not (contains? o :page-id)))))
(defmethod change-spec :add-obj [_]
(s/keys :req-un [::id ::page-id ::frame-id
:internal.changes.add-obj/obj]
:opt-un [::parent-id]))
(s/and (s/keys :req-un [::id :internal.changes.add-obj/obj]
:opt-un [::page-id ::component-id ::parent-id ::frame-id])
valid-container-id-frame?))
(s/def ::operation (s/multi-spec operation-spec :type))
(s/def ::operations (s/coll-of ::operation))
(defmethod change-spec :mod-obj [_]
(s/keys :req-un [::id (or ::page-id ::component-id) ::operations]))
(s/and (s/keys :req-un [::id ::operations]
:opt-un [::page-id ::component-id])
valid-container-id?))
(defmethod change-spec :del-obj [_]
(s/keys :req-un [::id ::page-id]))
(s/and (s/keys :req-un [::id]
:opt-un [::page-id ::component-id])
valid-container-id?))
(s/def :internal.changes.reg-objects/shapes
(s/coll-of uuid? :kind vector?))
(defmethod change-spec :reg-objects [_]
(s/keys :req-un [::page-id :internal.changes.reg-objects/shapes]))
(s/and (s/keys :req-un [:internal.changes.reg-objects/shapes]
:opt-un [::page-id ::component-id])
valid-container-id?))
(defmethod change-spec :mov-objects [_]
(s/keys :req-un [::page-id ::parent-id :internal.shape/shapes]
:opt-un [::index]))
(s/and (s/keys :req-un [::parent-id :internal.shape/shapes]
:opt-un [::page-id ::component-id ::index])
valid-container-id?))
(defmethod change-spec :add-page [_]
(s/or :empty (s/keys :req-un [::id ::name])
@ -701,26 +733,33 @@
(assoc data :options (d/dissoc-in (:options data) path)))))))
(defmethod process-change :add-obj
[data {:keys [id obj page-id frame-id parent-id index] :as change}]
(d/update-in-when data [:pages-index page-id]
(fn [data]
(let [parent-id (or parent-id frame-id)
objects (:objects data)]
(when (and (contains? objects parent-id)
(contains? objects frame-id))
(let [obj (assoc obj
:frame-id frame-id
:parent-id parent-id
:id id)]
(-> data
(update :objects assoc id obj)
(update-in [:objects parent-id :shapes]
(fn [shapes]
(let [shapes (or shapes [])]
(cond
(some #{id} shapes) shapes
(nil? index) (conj shapes id)
:else (cph/insert-at-index shapes index [id]))))))))))))
[data {:keys [id obj page-id component-id frame-id parent-id
index ignore-touched] :as change}]
(let [update-fn (fn [data]
(let [parent-id (or parent-id frame-id)
objects (:objects data)]
(let [obj (assoc obj
:frame-id frame-id
:parent-id parent-id
:id id)]
(-> data
(update :objects assoc id obj)
(update-in [:objects parent-id :shapes]
(fn [shapes]
(let [shapes (or shapes [])]
(cond
(some #{id} shapes) shapes
(nil? index) (conj shapes id)
:else (cph/insert-at-index shapes index [id])))))
(cond->
(and (:shape-ref (get-in data [:objects parent-id]))
(not= parent-id frame-id)
(not ignore-touched))
(update-in [:objects parent-id :touched]
cph/set-touched-group :shapes-group))))))]
(if page-id
(d/update-in-when data [:pages-index page-id] update-fn)
(d/update-in-when data [:components component-id] update-fn))))
(defmethod process-change :mod-obj
[data {:keys [id page-id component-id operations] :as change}]
@ -733,8 +772,8 @@
(d/update-in-when data [:components component-id :objects] update-fn))))
(defmethod process-change :del-obj
[data {:keys [page-id id] :as change}]
(letfn [(delete-object [objects id]
[data {:keys [page-id component-id id ignore-touched] :as change}]
(letfn [(delete-object [objects]
(if-let [target (get objects id)]
(let [parent-id (cph/get-parent id objects)
frame-id (:frame-id target)
@ -745,6 +784,9 @@
(= :group (:type parent)))
(update-in [parent-id :shapes] (fn [s] (filterv #(not= % id) s)))
(and (:shape-ref parent) (not ignore-touched))
(update-in [parent-id :touched] cph/set-touched-group :shapes-group)
(contains? objects frame-id)
(update-in [frame-id :shapes] (fn [s] (filterv #(not= % id) s)))
@ -752,7 +794,9 @@
; dependend objects
(as-> $ (reduce delete-object $ (:shapes target)))))
objects))]
(d/update-in-when data [:pages-index page-id :objects] delete-object id)))
(if page-id
(d/update-in-when data [:pages-index page-id :objects] delete-object)
(d/update-in-when data [:components component-id :objects] delete-object))))
(defn rotation-modifiers
[center shape angle]
@ -765,7 +809,7 @@
;; reg-objects operation "regenerates" the values for the parent groups
(defmethod process-change :reg-objects
[data {:keys [page-id shapes]}]
[data {:keys [page-id component-id shapes]}]
(letfn [(reg-objects [objects]
(reduce #(update %1 %2 update-group %1) objects
(sequence (comp
@ -797,10 +841,12 @@
(assoc-in [:modifiers :rotation] (:rotation group 0))
(geom/transform-shape))))]
(d/update-in-when data [:pages-index page-id :objects] reg-objects)))
(if page-id
(d/update-in-when data [:pages-index page-id :objects] reg-objects)
(d/update-in-when data [:components component-id :objects] reg-objects))))
(defmethod process-change :mov-objects
[data {:keys [parent-id shapes index page-id] :as change}]
[data {:keys [parent-id shapes index page-id component-id ignore-touched] :as change}]
(letfn [(is-valid-move? [objects shape-id]
(let [invalid-targets (cph/calculate-invalid-targets shape-id objects)]
(and (not (invalid-targets parent-id))
@ -827,6 +873,14 @@
(strip-id [coll id]
(filterv #(not= % id) coll))
(add-to-parent [parent index shapes]
(cond-> parent
true
(update :shapes check-insert-items parent index shapes)
(and (:shape-ref parent) (= (:type parent) :group) (not ignore-touched))
(update :touched cph/set-touched-group :shapes-group)))
(remove-from-old-parent [cpindex objects shape-id]
(let [prev-parent-id (get cpindex shape-id)]
;; Do nothing if the parent id of the shape is the same as
@ -843,7 +897,15 @@
(recur pid
(:parent-id obj)
(dissoc objects pid))
(update-in objects [pid :shapes] strip-id sid)))))))
(cond-> objects
true
(update-in [pid :shapes] strip-id sid)
(and (:shape-ref obj)
(= (:type obj) :group)
(not ignore-touched))
(update-in [pid :touched]
cph/set-touched-group :shapes-group))))))))
(update-parent-id [objects id]
(update objects id assoc :parent-id parent-id))
@ -875,13 +937,15 @@
(if valid?
(as-> objects $
(update-in $ [parent-id :shapes] check-insert-items parent index shapes)
(update $ parent-id #(add-to-parent % index shapes))
(reduce update-parent-id $ shapes)
(reduce (partial remove-from-old-parent cpindex) $ shapes)
(reduce (partial update-frame-ids frm-id) $ (get-in $ [parent-id :shapes])))
objects)))]
(d/update-in-when data [:pages-index page-id :objects] move-objects)))
(if page-id
(d/update-in-when data [:pages-index page-id :objects] move-objects)
(d/update-in-when data [:components component-id :objects] move-objects))))
(defmethod process-change :add-page
[data {:keys [id name page]}]
@ -1001,7 +1065,7 @@
(cond-> shape
(and shape-ref group (not ignore) (not= val (get shape attr)))
(update :touched #(conj (or % #{}) group))
(update :touched cph/set-touched-group group)
(nil? val)
(dissoc attr)

56
common/app/common/pages_helpers.cljc
View file

@ -42,11 +42,26 @@
objects)
nil)))
(defn make-container
[page-or-component type]
(assoc page-or-component
:type type))
(defn page?
[container]
(assert (some? (:type container)))
(= (:type container) :page))
(defn component?
[container]
(= (:type container) :component))
(defn get-container
[page-id component-id local-file]
(if (some? page-id)
(get-in local-file [:pages-index page-id])
(get-in local-file [:components component-id])))
[id type local-file]
(-> (if (= type :page)
(get-in local-file [:pages-index id])
(get-in local-file [:components id]))
(assoc :type type)))
(defn get-shape
[container shape-id]
@ -59,6 +74,12 @@
(get-in libraries [file-id :data]))]
(get-in file [:components component-id])))
(defn is-master-of
[shape-master shape-inst]
(and (:shape-ref shape-inst)
(or (= (:shape-ref shape-inst) (:id shape-master))
(= (:shape-ref shape-inst) (:shape-ref shape-master)))))
(defn get-component-root
[component]
(get-in component [:objects (:id component)]))
@ -75,12 +96,12 @@
(defn get-children-objects
"Retrieve all children objects recursively for a given object"
[id objects]
(map #(get objects %) (get-children id objects)))
(mapv #(get objects %) (get-children id objects)))
(defn get-object-with-children
"Retrieve a list with an object and all of its children"
"Retrieve a vector with an object and all of its children"
[id objects]
(map #(get objects %) (cons id (get-children id objects))))
(mapv #(get objects %) (cons id (get-children id objects))))
(defn is-shape-grouped
"Checks if a shape is inside a group"
@ -210,17 +231,17 @@
:parent-id parent-id)
(some? (:shapes object))
(assoc :shapes (map :id new-direct-children)))
(assoc :shapes (mapv :id new-direct-children)))
new-object (update-new-object new-object object)
new-objects (concat [new-object] new-children)
new-objects (d/concat [new-object] new-children)
updated-object (update-original-object object new-object)
updated-objects (if (identical? object updated-object)
updated-children
(concat [updated-object] updated-children))]
(d/concat [updated-object] updated-children))]
[new-object new-objects updated-objects])
@ -232,9 +253,9 @@
(recur
(next child-ids)
(concat new-direct-children [new-child])
(concat new-children new-child-objects)
(concat updated-children updated-child-objects))))))))
(d/concat new-direct-children [new-child])
(d/concat new-children new-child-objects)
(d/concat updated-children updated-child-objects))))))))
(defn indexed-shapes
@ -277,3 +298,12 @@
(d/seek #(gsh/has-point? % position))
:id)
uuid/zero)))
(defn set-touched-group
[touched group]
(conj (or touched #{}) group))
(defn touched-group?
[shape group]
((or (:touched shape) #{}) group))

9
frontend/src/app/main/data/workspace.cljs
View file

@ -711,6 +711,7 @@
(reduce (fn [res id]
(let [children (cph/get-children id objects)
parents (cph/get-parents id objects)
parent (get objects (first parents))
add-change (fn [id]
(let [item (get objects id)]
{:type :add-obj
@ -726,7 +727,13 @@
(map add-change children)
[{:type :reg-objects
:page-id page-id
:shapes (vec parents)}])))
:shapes (vec parents)}]
(when (some? parent)
[{:type :mod-obj
:page-id page-id
:id (:id parent)
:operations [{:type :set-touched
:touched (:touched parent)}]}]))))
[]
ids)
(map #(array-map

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

@ -32,6 +32,7 @@
[cljs.spec.alpha :as s]
[potok.core :as ptk]))
;; Change this to :info :debug or :trace to debug this module
(log/set-level! :warn)
(declare sync-file)
@ -397,13 +398,15 @@
:page-id page-id
:frame-id (:frame-id obj)
:parent-id (:parent-id obj)
:ignore-touched true
:obj obj})
new-shapes)
uchanges (map (fn [obj]
{:type :del-obj
:id (:id obj)
:page-id page-id})
:page-id page-id
:ignore-touched true})
new-shapes)]
(rx/of (dwc/commit-changes rchanges uchanges {:commit-local? true})
@ -493,16 +496,18 @@
(ptk/reify ::reset-component
ptk/WatchEvent
(watch [_ state stream]
;; ===== Uncomment this to debug =====
(log/info :msg "RESET-COMPONENT of shape" :id (str id))
(let [[rchanges uchanges]
(dwlh/generate-sync-shape-and-children-components (get state :current-page-id)
nil
id
(get state :workspace-data)
(get state :workspace-libraries)
true)]
;; ===== Uncomment this to debug =====
(let [local-file (get state :workspace-data)
libraries (get state :workspace-libraries)
container (cph/get-container (get state :current-page-id)
:page
local-file)
[rchanges uchanges]
(dwlh/generate-sync-shape-direct container
id
local-file
libraries
true)]
(log/debug :msg "RESET-COMPONENT finished" :js/rchanges rchanges)
(rx/of (dwc/commit-changes rchanges uchanges {:commit-local? true}))))))
@ -516,7 +521,6 @@
(ptk/reify ::update-component
ptk/WatchEvent
(watch [_ state stream]
;; ===== Uncomment this to debug =====
(log/info :msg "UPDATE-COMPONENT of shape" :id (str id))
(let [page-id (:current-page-id state)
objects (dwc/lookup-page-objects state page-id)
@ -529,7 +533,6 @@
(get state :workspace-data)
(get state :workspace-libraries))]
;; ===== Uncomment this to debug =====
(log/debug :msg "UPDATE-COMPONENT finished" :js/rchanges rchanges)
(rx/of (dwc/commit-changes rchanges uchanges {:commit-local? true}))))))
@ -552,7 +555,6 @@
ptk/WatchEvent
(watch [_ state stream]
;; ===== Uncomment this to debug =====
(log/info :msg "SYNC-FILE" :file (str (or file-id "local")))
(let [library-changes [(dwlh/generate-sync-library :components file-id state)
(dwlh/generate-sync-library :colors file-id state)
@ -566,7 +568,6 @@
uchanges (d/concat []
(->> library-changes (remove nil?) (map second) (flatten))
(->> file-changes (remove nil?) (map second) (flatten)))]
;; ===== Uncomment this to debug =====
(log/debug :msg "SYNC-FILE finished" :js/rchanges rchanges)
(rx/concat
(rx/of (dm/hide-tag :sync-dialog))
@ -593,14 +594,12 @@
(ptk/reify ::sync-file-2nd-stage
ptk/WatchEvent
(watch [_ state stream]
;; ===== Uncomment this to debug =====
(log/info :msg "SYNC-FILE (2nd stage)" :file (str (or file-id "local")))
(let [[rchanges1 uchanges1] (dwlh/generate-sync-file :components nil state)
[rchanges2 uchanges2] (dwlh/generate-sync-library :components file-id state)
rchanges (d/concat rchanges1 rchanges2)
uchanges (d/concat uchanges1 uchanges2)]
(when rchanges
;; ===== Uncomment this to debug =====
(log/debug :msg "SYNC-FILE (2nd stage) finished" :js/rchanges rchanges)
(rx/of (dwc/commit-changes rchanges uchanges {:commit-local? true})))))))

1016
frontend/src/app/main/data/workspace/libraries_helpers.cljs
View file

File diff suppressed because it is too large Load diff

1
frontend/src/app/main/data/workspace/selection.cljs
View file

@ -330,6 +330,7 @@
:old-id (:id obj)
:frame-id frame-id
:parent-id parent-id
:ignore-touched true
:obj (dissoc reframed-obj :shapes)}]
children-changes)))