mirror of
https://github.com/penpot/penpot.git
synced 2025-05-22 23:16:10 +02:00
🐛 Fix problem with absolutes inside grid
This commit is contained in:
parent
f8dd86da34
commit
52c849ce4b
10 changed files with 57 additions and 46 deletions
|
@ -358,13 +358,13 @@
|
||||||
|
|
||||||
(defn changed-attrs
|
(defn changed-attrs
|
||||||
"Returns the list of attributes that will change when `update-fn` is applied"
|
"Returns the list of attributes that will change when `update-fn` is applied"
|
||||||
[object update-fn {:keys [attrs]}]
|
[object objects update-fn {:keys [attrs]}]
|
||||||
(let [changed?
|
(let [changed?
|
||||||
(fn [old new attr]
|
(fn [old new attr]
|
||||||
(let [old-val (get old attr)
|
(let [old-val (get old attr)
|
||||||
new-val (get new attr)]
|
new-val (get new attr)]
|
||||||
(not= old-val new-val)))
|
(not= old-val new-val)))
|
||||||
new-obj (update-fn object)]
|
new-obj (update-fn object objects)]
|
||||||
(when-not (= object new-obj)
|
(when-not (= object new-obj)
|
||||||
(let [attrs (or attrs (d/concat-set (keys object) (keys new-obj)))]
|
(let [attrs (or attrs (d/concat-set (keys object) (keys new-obj)))]
|
||||||
(filter (partial changed? object new-obj) attrs)))))
|
(filter (partial changed? object new-obj) attrs)))))
|
||||||
|
@ -412,7 +412,7 @@
|
||||||
update-shape
|
update-shape
|
||||||
(fn [changes id]
|
(fn [changes id]
|
||||||
(let [old-obj (get objects id)
|
(let [old-obj (get objects id)
|
||||||
new-obj (update-fn old-obj)]
|
new-obj (update-fn old-obj objects)]
|
||||||
(if (= old-obj new-obj)
|
(if (= old-obj new-obj)
|
||||||
changes
|
changes
|
||||||
(let [[rops uops] (-> (or attrs (d/concat-set (keys old-obj) (keys new-obj)))
|
(let [[rops uops] (-> (or attrs (d/concat-set (keys old-obj) (keys new-obj)))
|
||||||
|
|
|
@ -676,7 +676,7 @@
|
||||||
[id cell])))
|
[id cell])))
|
||||||
|
|
||||||
(defn remove-grid-column
|
(defn remove-grid-column
|
||||||
[parent index]
|
[parent index objects]
|
||||||
|
|
||||||
(let [track-num (inc index)
|
(let [track-num (inc index)
|
||||||
|
|
||||||
|
@ -692,10 +692,10 @@
|
||||||
(-> parent
|
(-> parent
|
||||||
(update :layout-grid-columns d/remove-at-index index)
|
(update :layout-grid-columns d/remove-at-index index)
|
||||||
(update :layout-grid-cells update-cells)
|
(update :layout-grid-cells update-cells)
|
||||||
(assign-cells))))
|
(assign-cells objects))))
|
||||||
|
|
||||||
(defn remove-grid-row
|
(defn remove-grid-row
|
||||||
[parent index]
|
[parent index objects]
|
||||||
(let [track-num (inc index)
|
(let [track-num (inc index)
|
||||||
|
|
||||||
decrease-track-num (make-decrease-track-num :row :row-span track-num)
|
decrease-track-num (make-decrease-track-num :row :row-span track-num)
|
||||||
|
@ -710,7 +710,7 @@
|
||||||
(-> parent
|
(-> parent
|
||||||
(update :layout-grid-rows d/remove-at-index index)
|
(update :layout-grid-rows d/remove-at-index index)
|
||||||
(update :layout-grid-cells update-cells)
|
(update :layout-grid-cells update-cells)
|
||||||
(assign-cells))))
|
(assign-cells objects))))
|
||||||
|
|
||||||
(defn- reorder-grid-tracks
|
(defn- reorder-grid-tracks
|
||||||
"Swap the positions of the tracks info"
|
"Swap the positions of the tracks info"
|
||||||
|
@ -781,6 +781,7 @@
|
||||||
|
|
||||||
parent
|
parent
|
||||||
(reorder-grid-tracks parent tracks-props from-index to-index)]
|
(reorder-grid-tracks parent tracks-props from-index to-index)]
|
||||||
|
|
||||||
(cond-> parent
|
(cond-> parent
|
||||||
move-content?
|
move-content?
|
||||||
(swap-track-content prop from-track to-track))))
|
(swap-track-content prop from-track to-track))))
|
||||||
|
@ -828,14 +829,24 @@
|
||||||
|
|
||||||
(defn check-deassigned-cells
|
(defn check-deassigned-cells
|
||||||
"Clean the cells whith shapes that are no longer in the layout"
|
"Clean the cells whith shapes that are no longer in the layout"
|
||||||
[parent]
|
[parent objects]
|
||||||
|
|
||||||
(let [child? (set (:shapes parent))
|
(let [child-set (set (:shapes parent))
|
||||||
cells (update-vals
|
|
||||||
|
assigned?
|
||||||
|
(fn [id]
|
||||||
|
(and (contains? child-set id)
|
||||||
|
(not (position-absolute? objects id))))
|
||||||
|
|
||||||
|
cells
|
||||||
|
(update-vals
|
||||||
(:layout-grid-cells parent)
|
(:layout-grid-cells parent)
|
||||||
(fn [cell] (update cell :shapes #(filterv child? %))))]
|
(fn [cell]
|
||||||
|
(-> cell
|
||||||
|
(update :shapes #(filterv assigned? %)))))]
|
||||||
|
|
||||||
(assoc parent :layout-grid-cells cells)))
|
(-> parent
|
||||||
|
(assoc :layout-grid-cells cells))))
|
||||||
|
|
||||||
(defn overlapping-cells
|
(defn overlapping-cells
|
||||||
"Find overlapping cells"
|
"Find overlapping cells"
|
||||||
|
@ -902,12 +913,12 @@
|
||||||
;; - Shape duplication
|
;; - Shape duplication
|
||||||
;; - (maybe) create group/frames. This case will assigna a cell that had one of its children
|
;; - (maybe) create group/frames. This case will assigna a cell that had one of its children
|
||||||
(defn assign-cells
|
(defn assign-cells
|
||||||
[parent]
|
[parent objects]
|
||||||
(let [;; TODO: Remove this, shouldn't be happening
|
(let [;; TODO: Remove this, shouldn't be happening
|
||||||
;;overlaps (overlapping-cells parent)
|
;;overlaps (overlapping-cells parent)
|
||||||
;;_ (when (not (empty? overlaps))
|
;;_ (when (not (empty? overlaps))
|
||||||
;; (.warn js/console "OVERLAPS" overlaps))
|
;; (.warn js/console "OVERLAPS" overlaps))
|
||||||
parent (cond-> (check-deassigned-cells parent)
|
parent (cond-> (check-deassigned-cells parent objects)
|
||||||
#_(d/not-empty? overlaps)
|
#_(d/not-empty? overlaps)
|
||||||
#_(fix-overlaps overlaps))
|
#_(fix-overlaps overlaps))
|
||||||
|
|
||||||
|
@ -915,7 +926,9 @@
|
||||||
(into #{} (mapcat (comp :shapes second)) (:layout-grid-cells parent))
|
(into #{} (mapcat (comp :shapes second)) (:layout-grid-cells parent))
|
||||||
|
|
||||||
no-cell-shapes
|
no-cell-shapes
|
||||||
(->> (:shapes parent) (remove shape-has-cell?))
|
(->> (:shapes parent)
|
||||||
|
(remove shape-has-cell?)
|
||||||
|
(remove (partial position-absolute? objects)))
|
||||||
|
|
||||||
parent (position-auto-shapes parent)]
|
parent (position-auto-shapes parent)]
|
||||||
|
|
||||||
|
@ -1174,7 +1187,7 @@
|
||||||
(let [;; Temporary remove the children when moving them
|
(let [;; Temporary remove the children when moving them
|
||||||
frame (-> frame
|
frame (-> frame
|
||||||
(update :shapes #(d/removev children %))
|
(update :shapes #(d/removev children %))
|
||||||
(assign-cells))
|
(assign-cells objects))
|
||||||
|
|
||||||
children (->> children (remove #(position-absolute? objects %)))]
|
children (->> children (remove #(position-absolute? objects %)))]
|
||||||
|
|
||||||
|
@ -1182,7 +1195,7 @@
|
||||||
(update :shapes d/concat-vec children)
|
(update :shapes d/concat-vec children)
|
||||||
(cond-> (some? cell)
|
(cond-> (some? cell)
|
||||||
(push-into-cell children row column))
|
(push-into-cell children row column))
|
||||||
(assign-cells))))
|
(assign-cells objects))))
|
||||||
|
|
||||||
(defn add-children-to-index
|
(defn add-children-to-index
|
||||||
[parent ids objects to-index]
|
[parent ids objects to-index]
|
||||||
|
|
|
@ -872,10 +872,10 @@
|
||||||
(pcb/update-shapes [parent-id] #(ctl/add-children-to-index % ids objects to-index)))
|
(pcb/update-shapes [parent-id] #(ctl/add-children-to-index % ids objects to-index)))
|
||||||
|
|
||||||
(pcb/update-shapes parents
|
(pcb/update-shapes parents
|
||||||
(fn [parent]
|
(fn [parent objects]
|
||||||
(cond-> parent
|
(cond-> parent
|
||||||
(ctl/grid-layout? parent)
|
(ctl/grid-layout? parent)
|
||||||
(ctl/assign-cells))))
|
(ctl/assign-cells objects))))
|
||||||
|
|
||||||
(pcb/reorder-grid-children parents)
|
(pcb/reorder-grid-children parents)
|
||||||
|
|
||||||
|
|
|
@ -70,7 +70,7 @@
|
||||||
update-layout-ids
|
update-layout-ids
|
||||||
(->> ids
|
(->> ids
|
||||||
(map (d/getf objects))
|
(map (d/getf objects))
|
||||||
(filter #(some update-layout-attr? (pcb/changed-attrs % update-fn {:attrs attrs})))
|
(filter #(some update-layout-attr? (pcb/changed-attrs % objects update-fn {:attrs attrs})))
|
||||||
(map :id))
|
(map :id))
|
||||||
|
|
||||||
changes (reduce
|
changes (reduce
|
||||||
|
|
|
@ -182,10 +182,10 @@
|
||||||
(-> changes
|
(-> changes
|
||||||
(pcb/update-shapes
|
(pcb/update-shapes
|
||||||
[(:parent-id first-shape)]
|
[(:parent-id first-shape)]
|
||||||
(fn [shape]
|
(fn [shape objects]
|
||||||
(-> shape
|
(-> shape
|
||||||
(ctl/push-into-cell [(:id first-shape)] row column)
|
(ctl/push-into-cell [(:id first-shape)] row column)
|
||||||
(ctl/assign-cells))))
|
(ctl/assign-cells objects))))
|
||||||
(pcb/reorder-grid-children [(:parent-id first-shape)])))
|
(pcb/reorder-grid-children [(:parent-id first-shape)])))
|
||||||
changes)
|
changes)
|
||||||
|
|
||||||
|
|
|
@ -191,14 +191,14 @@
|
||||||
;; Temporary remove the children when moving them
|
;; Temporary remove the children when moving them
|
||||||
frame (-> frame
|
frame (-> frame
|
||||||
(update :shapes #(d/removev ids %))
|
(update :shapes #(d/removev ids %))
|
||||||
(ctl/assign-cells))
|
(ctl/assign-cells objects))
|
||||||
|
|
||||||
ids (->> ids (remove #(ctl/position-absolute? objects %)))
|
ids (->> ids (remove #(ctl/position-absolute? objects %)))
|
||||||
frame (-> frame
|
frame (-> frame
|
||||||
(update :shapes d/concat-vec ids)
|
(update :shapes d/concat-vec ids)
|
||||||
(cond-> (some? cell)
|
(cond-> (some? cell)
|
||||||
(ctl/push-into-cell ids row column))
|
(ctl/push-into-cell ids row column))
|
||||||
(ctl/assign-cells))]
|
(ctl/assign-cells objects))]
|
||||||
|
|
||||||
(-> modifiers
|
(-> modifiers
|
||||||
(ctm/change-property :layout-grid-rows (:layout-grid-rows frame))
|
(ctm/change-property :layout-grid-rows (:layout-grid-rows frame))
|
||||||
|
|
|
@ -498,7 +498,8 @@
|
||||||
changes (-> (pcb/add-object changes new-obj {:ignore-touched (and duplicating-component? child?)})
|
changes (-> (pcb/add-object changes new-obj {:ignore-touched (and duplicating-component? child?)})
|
||||||
(pcb/amend-last-change #(assoc % :old-id (:id obj)))
|
(pcb/amend-last-change #(assoc % :old-id (:id obj)))
|
||||||
(cond-> (ctl/grid-layout? objects (:parent-id obj))
|
(cond-> (ctl/grid-layout? objects (:parent-id obj))
|
||||||
(-> (pcb/update-shapes [(:parent-id obj)] (fn [shape] (-> shape ctl/assign-cells ctl/check-deassigned-cells)))
|
(-> (pcb/update-shapes [(:parent-id obj)] ctl/assign-cells)
|
||||||
|
(pcb/update-shapes [(:parent-id obj)] ctl/check-deassigned-cells)
|
||||||
(pcb/reorder-grid-children [(:parent-id obj)]))))
|
(pcb/reorder-grid-children [(:parent-id obj)]))))
|
||||||
|
|
||||||
changes (cond-> changes
|
changes (cond-> changes
|
||||||
|
|
|
@ -79,16 +79,13 @@
|
||||||
(-> shape
|
(-> shape
|
||||||
(merge initial-layout-data)
|
(merge initial-layout-data)
|
||||||
|
|
||||||
;; (cond-> (= type :grid) (-> ctl/assign-cells ctl/reorder-grid-children))
|
|
||||||
;; If the original shape is not a frame we set clip content and show-viewer to false
|
;; If the original shape is not a frame we set clip content and show-viewer to false
|
||||||
(cond-> (not from-frame?)
|
(cond-> (not from-frame?)
|
||||||
(assoc :show-content true :hide-in-viewer true)))
|
(assoc :show-content true :hide-in-viewer true)))
|
||||||
|
|
||||||
params (calculate-params objects (cfh/get-immediate-children objects (:id shape)) shape)]
|
params (calculate-params objects (cfh/get-immediate-children objects (:id shape)) shape)]
|
||||||
|
|
||||||
(cond-> (merge shape params)
|
(cond-> (merge shape params)
|
||||||
(= type :grid) (-> ctl/assign-cells ctl/reorder-grid-children)))
|
(= type :grid) (-> (ctl/assign-cells objects) ctl/reorder-grid-children))))))
|
||||||
)))
|
|
||||||
|
|
||||||
;; Never call this directly but through the data-event `:layout/update`
|
;; Never call this directly but through the data-event `:layout/update`
|
||||||
;; Otherwise a lot of cycle dependencies could be generated
|
;; Otherwise a lot of cycle dependencies could be generated
|
||||||
|
@ -277,10 +274,10 @@
|
||||||
(rx/of (dwu/start-undo-transaction undo-id)
|
(rx/of (dwu/start-undo-transaction undo-id)
|
||||||
(dwc/update-shapes
|
(dwc/update-shapes
|
||||||
ids
|
ids
|
||||||
(fn [shape]
|
(fn [shape objects]
|
||||||
(case type
|
(case type
|
||||||
:row (ctl/remove-grid-row shape index)
|
:row (ctl/remove-grid-row shape index objects)
|
||||||
:column (ctl/remove-grid-column shape index))))
|
:column (ctl/remove-grid-column shape index objects))))
|
||||||
(ptk/data-event :layout/update ids)
|
(ptk/data-event :layout/update ids)
|
||||||
(dwu/commit-undo-transaction undo-id))))))
|
(dwu/commit-undo-transaction undo-id))))))
|
||||||
|
|
||||||
|
@ -435,11 +432,11 @@
|
||||||
(dwc/update-shapes children-ids (partial fix-child-sizing objects changes))
|
(dwc/update-shapes children-ids (partial fix-child-sizing objects changes))
|
||||||
(dwc/update-shapes
|
(dwc/update-shapes
|
||||||
parent-ids
|
parent-ids
|
||||||
(fn [parent]
|
(fn [parent objects]
|
||||||
(-> parent
|
(-> parent
|
||||||
(fix-parent-sizing objects (set ids) changes)
|
(fix-parent-sizing objects (set ids) changes)
|
||||||
(cond-> (ctl/grid-layout? parent)
|
(cond-> (ctl/grid-layout? parent)
|
||||||
(ctl/assign-cells)))))
|
(ctl/assign-cells objects)))))
|
||||||
(ptk/data-event :layout/update ids)
|
(ptk/data-event :layout/update ids)
|
||||||
(dwu/commit-undo-transaction undo-id))))))
|
(dwu/commit-undo-transaction undo-id))))))
|
||||||
|
|
||||||
|
@ -475,10 +472,9 @@
|
||||||
(let [undo-id (js/Symbol)]
|
(let [undo-id (js/Symbol)]
|
||||||
(rx/of
|
(rx/of
|
||||||
(dwu/start-undo-transaction undo-id)
|
(dwu/start-undo-transaction undo-id)
|
||||||
|
|
||||||
(dwc/update-shapes
|
(dwc/update-shapes
|
||||||
[layout-id]
|
[layout-id]
|
||||||
(fn [shape]
|
(fn [shape objects]
|
||||||
(case mode
|
(case mode
|
||||||
:auto
|
:auto
|
||||||
;; change the manual cells and move to auto
|
;; change the manual cells and move to auto
|
||||||
|
@ -492,7 +488,7 @@
|
||||||
(> (:column-span cell) 1))
|
(> (:column-span cell) 1))
|
||||||
(-> (d/update-in-when [:layout-grid-cells cell-id] assoc :shapes [] :position :auto)
|
(-> (d/update-in-when [:layout-grid-cells cell-id] assoc :shapes [] :position :auto)
|
||||||
(ctl/resize-cell-area (:row cell) (:column cell) (:row cell) (:column cell) 1 1)
|
(ctl/resize-cell-area (:row cell) (:column cell) (:row cell) (:column cell) 1 1)
|
||||||
(ctl/assign-cells)))))
|
(ctl/assign-cells objects)))))
|
||||||
shape))
|
shape))
|
||||||
|
|
||||||
:manual
|
:manual
|
||||||
|
@ -503,7 +499,7 @@
|
||||||
(cond-> shape
|
(cond-> shape
|
||||||
(contains? #{:area :auto} (:position cell))
|
(contains? #{:area :auto} (:position cell))
|
||||||
(-> (d/assoc-in-when [:layout-grid-cells cell-id :position] :manual)
|
(-> (d/assoc-in-when [:layout-grid-cells cell-id :position] :manual)
|
||||||
(ctl/assign-cells)))))
|
(ctl/assign-cells objects)))))
|
||||||
shape))
|
shape))
|
||||||
|
|
||||||
:area
|
:area
|
||||||
|
@ -522,7 +518,7 @@
|
||||||
first-column
|
first-column
|
||||||
(inc (- last-row first-row))
|
(inc (- last-row first-row))
|
||||||
(inc (- last-column first-column)))
|
(inc (- last-column first-column)))
|
||||||
(ctl/assign-cells))]
|
(ctl/assign-cells objects))]
|
||||||
|
|
||||||
(-> shape
|
(-> shape
|
||||||
(d/update-in-when [:layout-grid-cells (:id target-cell)] assoc :position :area))))))
|
(d/update-in-when [:layout-grid-cells (:id target-cell)] assoc :position :area))))))
|
||||||
|
@ -535,8 +531,9 @@
|
||||||
|
|
||||||
(ptk/reify ::update-grid-cell-position
|
(ptk/reify ::update-grid-cell-position
|
||||||
ptk/WatchEvent
|
ptk/WatchEvent
|
||||||
(watch [_ _ _]
|
(watch [_ state _]
|
||||||
(let [undo-id (js/Symbol)]
|
(let [objects (wsh/lookup-page-objects state)
|
||||||
|
undo-id (js/Symbol)]
|
||||||
(rx/of
|
(rx/of
|
||||||
(dwu/start-undo-transaction undo-id)
|
(dwu/start-undo-transaction undo-id)
|
||||||
(dwc/update-shapes
|
(dwc/update-shapes
|
||||||
|
@ -550,6 +547,6 @@
|
||||||
(ctl/resize-cell-area (:row prev-data) (:column prev-data)
|
(ctl/resize-cell-area (:row prev-data) (:column prev-data)
|
||||||
(:row new-data) (:column new-data)
|
(:row new-data) (:column new-data)
|
||||||
(:row-span new-data) (:column-span new-data))
|
(:row-span new-data) (:column-span new-data))
|
||||||
(ctl/assign-cells)))))
|
(ctl/assign-cells objects)))))
|
||||||
(ptk/data-event :layout/update [layout-id])
|
(ptk/data-event :layout/update [layout-id])
|
||||||
(dwu/commit-undo-transaction undo-id))))))
|
(dwu/commit-undo-transaction undo-id))))))
|
||||||
|
|
|
@ -629,7 +629,7 @@
|
||||||
(-> changes
|
(-> changes
|
||||||
(pcb/update-shapes [(:id parent)] (fn [shape] (-> shape
|
(pcb/update-shapes [(:id parent)] (fn [shape] (-> shape
|
||||||
(assoc :layout-grid-cells layout-grid-cells)
|
(assoc :layout-grid-cells layout-grid-cells)
|
||||||
(ctl/assign-cells))))
|
(ctl/assign-cells objects))))
|
||||||
(pcb/reorder-grid-children [(:id parent)]))))
|
(pcb/reorder-grid-children [(:id parent)]))))
|
||||||
|
|
||||||
changes
|
changes
|
||||||
|
|
|
@ -196,13 +196,13 @@
|
||||||
{::mf/wrap-props false}
|
{::mf/wrap-props false}
|
||||||
[props]
|
[props]
|
||||||
(let [shape (unchecked-get props "shape")
|
(let [shape (unchecked-get props "shape")
|
||||||
|
|
||||||
x (unchecked-get props "x")
|
x (unchecked-get props "x")
|
||||||
y (unchecked-get props "y")
|
y (unchecked-get props "y")
|
||||||
width (unchecked-get props "width")
|
width (unchecked-get props "width")
|
||||||
height (unchecked-get props "height")
|
height (unchecked-get props "height")
|
||||||
handler (unchecked-get props "handler")
|
handler (unchecked-get props "handler")
|
||||||
|
|
||||||
|
objects (mf/deref refs/workspace-page-objects)
|
||||||
{cell-id :id} (unchecked-get props "cell")
|
{cell-id :id} (unchecked-get props "cell")
|
||||||
{:keys [row column row-span column-span]} (get-in shape [:layout-grid-cells cell-id])
|
{:keys [row column row-span column-span]} (get-in shape [:layout-grid-cells cell-id])
|
||||||
|
|
||||||
|
@ -237,7 +237,7 @@
|
||||||
|
|
||||||
shape
|
shape
|
||||||
(-> (ctl/resize-cell-area shape row column new-row new-column new-row-span new-column-span)
|
(-> (ctl/resize-cell-area shape row column new-row new-column new-row-span new-column-span)
|
||||||
(ctl/assign-cells))
|
(ctl/assign-cells objects))
|
||||||
|
|
||||||
modifiers
|
modifiers
|
||||||
(-> (ctm/empty)
|
(-> (ctm/empty)
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue