Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-03-28 15:41:25 -05:00
Code Issues Activity

✨ Improve grid cell selection

Browse source
This commit is contained in:
alonso.torres 2024-01-03 16:47:14 +01:00
parent 6068ddc0ff
commit 009556b8f7
4 changed files with 59 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -1397,6 +1397,23 @@
(< (inc index) (+ column column-span)))
(= (inc index) column)))))))
(defn cells-in-area
[parent first-row last-row first-column last-column]
(->> (:layout-grid-cells parent)
(vals)
(filter
(fn [{:keys [row column row-span column-span] :as cell}]
(and
(or (<= row first-row (+ row row-span -1))
(<= row last-row (+ row row-span -1))
(<= first-row row last-row)
(<= first-row (+ row row-span -1) last-row))
(or (<= column first-column (+ column column-span -1))
(<= column last-column (+ column column-span -1))
(<= first-column column last-column)
(<= first-column (+ column column-span -1) last-column)))))))
(defn shapes-by-row
([parent index]
(shapes-by-row parent index true))

33
frontend/src/app/main/data/workspace/grid_layout/editor.cljs
View file

@ -6,6 +6,7 @@
(ns app.main.data.workspace.grid-layout.editor
(:require
[app.common.data.macros :as dm]
[app.common.geom.rect :as grc]
[app.common.types.shape.layout :as ctl]
[app.main.data.workspace.state-helpers :as wsh]
@ -25,14 +26,34 @@
(conj hover-set cell-id)
(disj hover-set cell-id))))))))
(defn select-grid-cell
[grid-id cell-id add?]
(ptk/reify ::select-grid-cell
(defn add-to-selection
([grid-id cell-id]
(add-to-selection grid-id cell-id false))
([grid-id cell-id shift?]
(ptk/reify ::add-to-selection
ptk/UpdateEvent
(update [_ state]
(if shift?
(let [objects (wsh/lookup-page-objects state)
grid (get objects grid-id)
selected (or (dm/get-in state [:workspace-grid-edition grid-id :selected]) #{})
selected (into selected [cell-id])
cells (->> selected (map #(dm/get-in grid [:layout-grid-cells %])))
{:keys [first-row last-row first-column last-column]} (ctl/cells-coordinates cells)
new-selected
(into #{}
(map :id)
(ctl/cells-in-area grid first-row last-row first-column last-column))]
(assoc-in state [:workspace-grid-edition grid-id :selected] new-selected))
(update-in state [:workspace-grid-edition grid-id :selected] (fnil conj #{}) cell-id))))))
(defn set-selection
[grid-id cell-id]
(ptk/reify ::set-selection
ptk/UpdateEvent
(update [_ state]
(if add?
(update-in state [:workspace-grid-edition grid-id :selected] (fnil conj #{}) cell-id)
(assoc-in state [:workspace-grid-edition grid-id :selected] #{cell-id})))))
(assoc-in state [:workspace-grid-edition grid-id :selected] #{cell-id}))))
(defn remove-selection
[grid-id cell-id]

4
frontend/src/app/main/ui/workspace/context_menu.cljs
View file

@ -576,6 +576,7 @@
(let [{:keys [grid cells]} mdata
single? (= (count cells) 1)
can-merge?
(mf/use-memo
(mf/deps cells)
@ -603,7 +604,8 @@
:on-click do-merge-cells}])
[:& menu-entry {:title (tr "workspace.context-menu.grid-cells.create-board")
:on-click do-create-board}]]))
:on-click do-create-board
:disabled (and (not single?) (not can-merge?))}]]))
(mf/defc context-menu

15
frontend/src/app/main/ui/workspace/viewport/grid_layout_editor.cljs
View file

@ -337,10 +337,19 @@
(mf/use-callback
(mf/deps (:id shape) (:id cell) selected?)
(fn [event]
(when (or (dom/left-mouse? event) (not selected?))
(if (and (kbd/shift? event) selected?)
(when (dom/left-mouse? event)
(cond
(and selected? (or (kbd/mod? event) (kbd/shift? event)))
(st/emit! (dwge/remove-selection (:id shape) (:id cell)))
(st/emit! (dwge/select-grid-cell (:id shape) (:id cell) (kbd/shift? event)))))))
(and (not selected?) (kbd/mod? event))
(st/emit! (dwge/add-to-selection (:id shape) (:id cell)))
(and (not selected?) (kbd/shift? event))
(st/emit! (dwge/add-to-selection (:id shape) (:id cell) true))
:else
(st/emit! (dwge/set-selection (:id shape) (:id cell)))))))
handle-context-menu
(mf/use-callback