Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-03-12 15:51:37 -05:00
Code Issues Activity

Add basic selection interactions to layers toolbox.

Browse source
This commit is contained in:
Andrey Antukh 2016-01-12 19:55:46 +02:00
parent 29b0036248
commit f39d2d57a8
3 changed files with 26 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/uxbox/ui/workspace.cljs
View file

@ -105,4 +105,3 @@
:transfer-state workspace-transfer-state :transfer-state workspace-transfer-state
:name "workspace" :name "workspace"
:mixins [mx/static rum/reactive wshortcuts/mixin]})) :mixins [mx/static rum/reactive wshortcuts/mixin]}))

2
src/uxbox/ui/workspace/base.cljs
View file

@ -24,7 +24,7 @@
(def ^:static pages-l (def ^:static pages-l
(as-> (ul/getter #(let [pid (get-in % [:workspace :project])] (as-> (ul/getter #(let [pid (get-in % [:workspace :project])]
(dp/project-pages % pid))) $ (dp/project-pages % pid))) $
(l/focus-atom $ st/state))) (l/focus-atom $ st/state)))
(def ^:static workspace-l (def ^:static workspace-l

28
src/uxbox/ui/workspace/toolboxes.cljs
View file

@ -87,13 +87,35 @@
;; Layers ;; Layers
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(defn- select-shape
[selected item event]
(dom/prevent-default event)
(let [id (:id item)]
(cond
(.-ctrlKey event)
(rs/emit! (dw/select-shape id))
(> (count selected) 1)
(rs/emit! (dw/deselect-all)
(dw/select-shape id))
(contains? selected id)
(rs/emit! (dw/select-shape id))
:else
(rs/emit! (dw/deselect-all)
(dw/select-shape id)))))
(defn- layer-element-render (defn- layer-element-render
[own item selected] [own item selected]
(let [selected? (contains? selected (:id item))] (let [selected? (contains? selected (:id item))
select #(select-shape selected item %)]
(html (html
[:li {:key (str (:id item))} [:li {:key (str (:id item))
:on-click select
:class (when selected? "selected")}
[:div.element-actions [:div.element-actions
[:div.toggle-element i/eye] [:div.toggle-element {:class "selected"} i/eye]
[:div.block-element i/lock]] [:div.block-element i/lock]]
[:div.element-icon i/box] [:div.element-icon i/box]
[:span (or (:name item) [:span (or (:name item)