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

✨ Reorder grid tracks moving content

Browse source
This commit is contained in:
alonso.torres 2023-12-07 11:53:02 +01:00
parent e75fb67eec
commit 39b41d7037
5 changed files with 88 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

75
common/src/app/common/types/shape/layout.cljc
View file

@ -705,8 +705,9 @@
(update :layout-grid-cells update-cells)
(assign-cells))))
(defn- reorder-grid-track
[prop parent from-index to-index]
(defn- reorder-grid-tracks
"Swap the positions of the tracks info"
[parent prop from-index to-index]
(-> parent
(update
prop
@ -720,13 +721,70 @@
(d/insert-at-index (inc to-index) [[nil tr]])
(d/vec-without-nils))))))))
(defn- swap-track-content
"Swap the shapes contained in the given tracks moves as necessary the others."
[parent prop from-track to-track]
(let [remap-tracks
(cond
(> from-track to-track)
(into {from-track to-track}
(map #(vector % (inc %)))
(range to-track from-track))
(< from-track to-track)
(into {from-track to-track}
(map #(vector % (dec %)))
(range (inc from-track) (inc to-track))))]
(-> parent
(update
:layout-grid-cells
update-vals
(fn [cell] (update cell prop #(get remap-tracks % %)))))))
(declare resize-cell-area)
(declare cells-by-column)
(declare cells-by-row)
(defn- reorder-grid-track
[parent from-index to-index move-content? cells-by tracks-props prop prop-span]
(let [from-track (inc from-index)
to-track (if (< to-index from-index)
(+ to-index 2)
(inc to-index))
move-content?
(and move-content? (not= from-track to-track))
parent
(if move-content?
(->> (concat (cells-by parent (dec from-track))
(cells-by parent (dec to-track)))
(reduce (fn [parent cell]
(cond-> parent
(and (> (get cell prop-span) 1)
(or (> to-track from-track) (not (= to-track (get cell prop))))
(or (< to-track from-track) (not (= to-track (+ (get cell prop) (dec (get cell prop-span)))))))
(resize-cell-area
(:row cell)
(:column cell)
(:row cell)
(:column cell)
(if (= prop :row) 1 (:row-span cell))
(if (= prop :column) 1 (:column-span cell)))))
parent))
parent)
parent
(reorder-grid-tracks parent tracks-props from-index to-index)]
(cond-> parent
move-content?
(swap-track-content prop from-track to-track))))
(defn reorder-grid-column
[parent from-index to-index]
(reorder-grid-track :layout-grid-columns parent from-index to-index))
[parent from-index to-index move-content?]
(reorder-grid-track parent from-index to-index move-content? cells-by-column :layout-grid-columns :column :column-span))
(defn reorder-grid-row
[parent from-index to-index]
(reorder-grid-track :layout-grid-rows parent from-index to-index))
[parent from-index to-index move-content?]
(reorder-grid-track parent from-index to-index move-content? cells-by-row :layout-grid-rows :row :row-span))
(defn cells-seq
[{:keys [layout-grid-cells layout-grid-dir]} & {:keys [sort?] :or {sort? false}}]
@ -992,9 +1050,8 @@
(defn resize-cell-area
"Increases/decreases the cell size"
[parent row column new-row new-column new-row-span new-column-span]
(if (and (>= new-row 0)
(>= new-column 0)
(if (and (>= new-row 1)
(>= new-column 1)
(>= new-row-span 1)
(>= new-column-span 1))
(let [prev-cell (cell-by-row-column parent row column)

6
frontend/src/app/main/data/workspace/shape_layout.cljs
View file

@ -285,7 +285,7 @@
(dwu/commit-undo-transaction undo-id))))))
(defn reorder-layout-track
[ids type from-index to-index]
[ids type from-index to-index move-content?]
(assert (#{:row :column} type))
(ptk/reify ::reorder-layout-track
@ -297,8 +297,8 @@
ids
(fn [shape]
(case type
:row (ctl/reorder-grid-row shape from-index to-index)
:column (ctl/reorder-grid-column shape from-index to-index))))
:row (ctl/reorder-grid-row shape from-index to-index move-content?)
:column (ctl/reorder-grid-column shape from-index to-index move-content?))))
(ptk/data-event :layout/update ids)
(dwu/commit-undo-transaction undo-id))))))

9
frontend/src/app/main/ui/formats.cljs
View file

@ -21,6 +21,15 @@
(let [percent-val (mth/precision (* value 100) precision)]
(dm/str percent-val "%"))))))
(defn format-frs
([value]
(format-frs value nil))
([value {:keys [precision] :or {precision 2}}]
(let [value (if (string? value) (d/parse-double value) value)]
(when (d/num? value)
(let [value (mth/precision value precision)]
(dm/str value "fr"))))))
(defn format-number
([value]
(format-number value nil))

2
frontend/src/app/main/ui/hooks.cljs
View file

@ -171,7 +171,7 @@
(cleanup)
(rx/push! global-drag-end nil)
(when (fn? on-drop)
(on-drop side drop-data))))
(on-drop side drop-data event))))
on-drag-end
(fn [event]

16
frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs
View file

@ -24,10 +24,12 @@
[app.main.ui.components.select :refer [select]]
[app.main.ui.components.title-bar :refer [title-bar]]
[app.main.ui.context :as ctx]
[app.main.ui.formats :as fmt]
[app.main.ui.hooks :as h]
[app.main.ui.icons :as i]
[app.util.dom :as dom]
[app.util.i18n :as i18n :refer [tr]]
[app.util.keyboard :as kbd]
[cuerdas.core :as str]
[rumext.v2 :as mf]))
@ -951,9 +953,9 @@
(defn manage-values [{:keys [value type]}]
(case type
:auto "auto"
:percent (dm/str value "%")
:flex (dm/str value "fr")
:fixed (dm/str value "px")
:percent (fmt/format-percent value)
:flex (fmt/format-frs value)
:fixed (fmt/format-pixels value)
value))
(mf/defc grid-track-info
@ -963,8 +965,8 @@
drop-track
(mf/use-fn
(mf/deps type reorder-track index)
(fn [drop-position data]
(reorder-track type (:index data) (if (= :top drop-position) (dec index) index))))
(fn [drop-position data event]
(reorder-track type (:index data) (if (= :top drop-position) (dec index) index) (kbd/mod? event))))
pointer-enter
(mf/use-fn
@ -1688,8 +1690,8 @@
reorder-track
(mf/use-fn
(mf/deps ids)
(fn [type from-index to-index]
(st/emit! (dwsl/reorder-layout-track ids type from-index to-index))))
(fn [type from-index to-index move-content?]
(st/emit! (dwsl/reorder-layout-track ids type from-index to-index move-content?))))
hover-track
(mf/use-fn