mirror of
https://github.com/penpot/penpot.git
synced 2025-05-23 19:26:11 +02:00
✨ Clip boolean selrects
This commit is contained in:
alonso.torres
parent
c56f024a86
commit
56e2db22eb
8 changed files with 120 additions and 91 deletions
|
|
@ -98,7 +98,9 @@
|
|||
ptk/WatchEvent
|
||||
(watch [_ state _]
|
||||
(let [objects (wsh/lookup-page-objects state)]
|
||||
(rx/of (dch/update-shapes [shape-id] #(group->bool % bool-type objects)))))))
|
||||
(let [change-to-bool
|
||||
(fn [shape] (group->bool shape bool-type objects))]
|
||||
(rx/of (dch/update-shapes [shape-id] change-to-bool {:reg-objects? true})))))))
|
||||
|
||||
(defn bool-to-group
|
||||
[shape-id]
|
||||
|
|
@ -106,7 +108,9 @@
|
|||
ptk/WatchEvent
|
||||
(watch [_ state _]
|
||||
(let [objects (wsh/lookup-page-objects state)]
|
||||
(rx/of (dch/update-shapes [shape-id] #(bool->group % objects)))))))
|
||||
(let [change-to-group
|
||||
(fn [shape] (bool->group shape objects))]
|
||||
(rx/of (dch/update-shapes [shape-id] change-to-group {:reg-objects? true})))))))
|
||||
|
||||
|
||||
(defn change-bool-type
|
||||
|
|
@ -114,6 +118,6 @@
|
|||
(ptk/reify ::change-bool-type
|
||||
ptk/WatchEvent
|
||||
(watch [_ _ _]
|
||||
(rx/of (dch/update-shapes
|
||||
[shape-id]
|
||||
#(assoc % :bool-type bool-type))))))
|
||||
(let [change-type
|
||||
(fn [shape] (assoc shape :bool-type bool-type))]
|
||||
(rx/of (dch/update-shapes [shape-id] change-type {:reg-objects? true}))))))
|
||||
|
|
|
|||
|
|
@ -27,7 +27,7 @@
|
|||
|
||||
bool-content
|
||||
(mf/use-memo
|
||||
(mf/deps childs)
|
||||
(mf/deps shape childs)
|
||||
(fn []
|
||||
(let [childs (d/mapm #(gsh/transform-shape %2) childs)]
|
||||
(->> (:shapes shape)
|
||||
|
|
@ -40,6 +40,3 @@
|
|||
(assoc :type :path)
|
||||
(assoc :content bool-content))
|
||||
:frame frame}])))
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -92,6 +92,7 @@
|
|||
(defn setup-hover-shapes [page-id move-stream objects transform selected ctrl? hover hover-ids hover-disabled? zoom]
|
||||
(let [;; We use ref so we don't recreate the stream on a change
|
||||
zoom-ref (mf/use-ref zoom)
|
||||
ctrl-ref (mf/use-ref @ctrl?)
|
||||
transform-ref (mf/use-ref nil)
|
||||
selected-ref (mf/use-ref selected)
|
||||
hover-disabled-ref (mf/use-ref hover-disabled?)
|
||||
|
|
@ -101,6 +102,7 @@
|
|||
(mf/deps page-id)
|
||||
(fn [point]
|
||||
(let [zoom (mf/ref-val zoom-ref)
|
||||
ctrl? (mf/ref-val ctrl-ref)
|
||||
rect (gsh/center->rect point (/ 5 zoom) (/ 5 zoom))]
|
||||
(if (mf/ref-val hover-disabled-ref)
|
||||
(rx/of nil)
|
||||
|
|
@ -109,6 +111,7 @@
|
|||
:page-id page-id
|
||||
:rect rect
|
||||
:include-frames? true
|
||||
:clip-children? (not ctrl?)
|
||||
:reverse? true}))))) ;; we want the topmost shape to be selected first
|
||||
|
||||
over-shapes-stream
|
||||
|
|
@ -120,7 +123,6 @@
|
|||
(rx/switch-map query-point))))]
|
||||
|
||||
;; Refresh the refs on a value change
|
||||
|
||||
(mf/use-effect
|
||||
(mf/deps transform)
|
||||
#(mf/set-ref-val! transform-ref transform))
|
||||
|
|
@ -129,6 +131,10 @@
|
|||
(mf/deps zoom)
|
||||
#(mf/set-ref-val! zoom-ref zoom))
|
||||
|
||||
(mf/use-effect
|
||||
(mf/deps @ctrl?)
|
||||
#(mf/set-ref-val! ctrl-ref @ctrl?))
|
||||
|
||||
(mf/use-effect
|
||||
(mf/deps selected)
|
||||
#(mf/set-ref-val! selected-ref selected))
|
||||
|
|
@ -143,11 +149,15 @@
|
|||
(fn [ids]
|
||||
(let [selected (mf/ref-val selected-ref)
|
||||
remove-id? (into #{} (mapcat #(cp/get-parents % objects)) selected)
|
||||
remove-id? (if @ctrl?
|
||||
(d/concat remove-id?
|
||||
(->> ids
|
||||
(filterv #(= :group (get-in objects [% :type])))))
|
||||
remove-id?)
|
||||
|
||||
is-group?
|
||||
(fn [id]
|
||||
(contains? #{:group :bool} (get-in objects [id :type])))
|
||||
|
||||
remove-id?
|
||||
(if @ctrl?
|
||||
(d/concat remove-id? (filterv is-group? ids))
|
||||
remove-id?)
|
||||
ids (->> ids (filterv (comp not remove-id?)))]
|
||||
(reset! hover (get objects (first ids)))
|
||||
(reset! hover-ids ids))))))
|
||||
|
|
|
|||
|
|
@ -18,13 +18,13 @@
|
|||
(defonce state (l/atom {}))
|
||||
|
||||
(defn index-shape
|
||||
[objects parents-index masks-index]
|
||||
[objects parents-index clip-parents-index]
|
||||
(fn [index shape]
|
||||
(let [{:keys [x y width height]} (gsh/points->selrect (:points shape))
|
||||
shape-bound #js {:x x :y y :width width :height height}
|
||||
|
||||
parents (get parents-index (:id shape))
|
||||
masks (get masks-index (:id shape))
|
||||
parents (get parents-index (:id shape))
|
||||
clip-parents (get clip-parents-index (:id shape))
|
||||
|
||||
frame (when (and (not= :frame (:type shape))
|
||||
(not= (:frame-id shape) uuid/zero))
|
||||
|
|
@ -32,19 +32,22 @@
|
|||
(qdt/insert index
|
||||
(:id shape)
|
||||
shape-bound
|
||||
(assoc shape :frame frame :masks masks :parents parents)))))
|
||||
(assoc shape
|
||||
:frame frame
|
||||
:clip-parents clip-parents
|
||||
:parents parents)))))
|
||||
|
||||
(defn- create-index
|
||||
[objects]
|
||||
(let [shapes (-> objects (dissoc uuid/zero) (vals))
|
||||
parents-index (cp/generate-child-all-parents-index objects)
|
||||
masks-index (cp/create-mask-index objects parents-index)
|
||||
(let [shapes (-> objects (dissoc uuid/zero) (vals))
|
||||
parents-index (cp/generate-child-all-parents-index objects)
|
||||
clip-parents-index (cp/create-clip-index objects parents-index)
|
||||
bounds #js {:x (int -0.5e7)
|
||||
:y (int -0.5e7)
|
||||
:width (int 1e7)
|
||||
:height (int 1e7)}
|
||||
|
||||
index (reduce (index-shape objects parents-index masks-index)
|
||||
index (reduce (index-shape objects parents-index clip-parents-index)
|
||||
(qdt/create bounds)
|
||||
shapes)
|
||||
|
||||
|
|
@ -66,13 +69,13 @@
|
|||
(set/union (set (keys old-objects))
|
||||
(set (keys new-objects))))
|
||||
|
||||
shapes (->> changed-ids (mapv #(get new-objects %)) (filterv (comp not nil?)))
|
||||
parents-index (cp/generate-child-all-parents-index new-objects shapes)
|
||||
masks-index (cp/create-mask-index new-objects parents-index)
|
||||
shapes (->> changed-ids (mapv #(get new-objects %)) (filterv (comp not nil?)))
|
||||
parents-index (cp/generate-child-all-parents-index new-objects shapes)
|
||||
clip-parents-index (cp/create-clip-index new-objects parents-index)
|
||||
|
||||
new-index (qdt/remove-all index changed-ids)
|
||||
|
||||
index (reduce (index-shape new-objects parents-index masks-index)
|
||||
index (reduce (index-shape new-objects parents-index clip-parents-index)
|
||||
new-index
|
||||
shapes)
|
||||
|
||||
|
|
@ -84,7 +87,7 @@
|
|||
(create-index new-objects)))
|
||||
|
||||
(defn- query-index
|
||||
[{index :index z-index :z-index} rect frame-id include-frames? full-frame? include-groups? reverse?]
|
||||
[{index :index z-index :z-index} rect frame-id full-frame? include-frames? clip-children? reverse?]
|
||||
(let [result (-> (qdt/search index (clj->js rect))
|
||||
(es6-iterator-seq))
|
||||
|
||||
|
|
@ -96,7 +99,6 @@
|
|||
(or (not frame-id) (= frame-id (:frame-id shape)))
|
||||
(case (:type shape)
|
||||
:frame include-frames?
|
||||
:group include-groups?
|
||||
true)
|
||||
|
||||
(or (not full-frame?)
|
||||
|
|
@ -107,11 +109,9 @@
|
|||
(fn [shape]
|
||||
(gsh/overlaps? shape rect))
|
||||
|
||||
overlaps-masks?
|
||||
(fn [masks]
|
||||
(->> masks
|
||||
(some (comp not overlaps?))
|
||||
not))
|
||||
overlaps-parent?
|
||||
(fn [clip-parents]
|
||||
(->> clip-parents (some (comp not overlaps?)) not))
|
||||
|
||||
add-z-index
|
||||
(fn [{:keys [id frame-id] :as shape}]
|
||||
|
|
@ -125,7 +125,9 @@
|
|||
(filter match-criteria?)
|
||||
(filter overlaps?)
|
||||
(filter (comp overlaps? :frame))
|
||||
(filter (comp overlaps-masks? :masks))
|
||||
(filter (if clip-children?
|
||||
(comp overlaps-parent? :clip-parents)
|
||||
(constantly true)))
|
||||
(map add-z-index))
|
||||
result)
|
||||
|
||||
|
|
@ -155,10 +157,10 @@
|
|||
nil)
|
||||
|
||||
(defmethod impl/handler :selection/query
|
||||
[{:keys [page-id rect frame-id include-frames? full-frame? include-groups? reverse?]
|
||||
:or {include-groups? true reverse? false include-frames? false full-frame? false} :as message}]
|
||||
[{:keys [page-id rect frame-id reverse? full-frame? include-frames? clip-children?]
|
||||
:or {reverse? false full-frame? false include-frames? false include-booleans? true include-groups? true} :as message}]
|
||||
(when-let [index (get @state page-id)]
|
||||
(query-index index rect frame-id include-frames? full-frame? include-groups? reverse?)))
|
||||
(query-index index rect frame-id full-frame? include-frames? clip-children? reverse?)))
|
||||
|
||||
(defmethod impl/handler :selection/query-z-index
|
||||
[{:keys [page-id objects ids]}]
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue