3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-07-31 22:28:30 +02:00
Code Issues Projects Releases Packages Wiki Activity

🎉 Allow to edit options of grouped objects

Browse source
This commit is contained in:
Andrés Moya 2020-06-30 15:22:30 +02:00
parent 76178b4e71
commit b640bc06ab
13 changed files with 122 additions and 41 deletions
Download patch file Download diff file Expand all files Collapse all files

4
frontend/src/uxbox/main/refs.cljs
View file

@ -124,8 +124,8 @@
(let [selected (get-in state [:workspace-local :selected])
page-id (get-in state [:workspace-page :id])
objects (get-in state [:workspace-data page-id :objects])]
(->> selected (map #(get objects %)))))]
(l/derived selector st/state)))
(->> selected (mapv #(get objects %)))))]
(l/derived selector st/state =)))
(def selected-shapes-with-children
(letfn [(selector [state]

11
frontend/src/uxbox/main/ui/workspace/sidebar/options/circle.cljs
View file

@ -17,9 +17,14 @@
(mf/defc options
[{:keys [shape] :as props}]
(let [ids [(:id shape)]
type (:type shape)
stroke-values (select-keys shape stroke-attrs)]
[:div
[:*
[:& measures-menu {:shape shape
:options #{:size :position :rotation}}]
[:& fill-menu {:ids [(:id shape)] :values (select-keys shape fill-attrs)}]
[:& stroke-menu {:ids ids :values stroke-values}]]))
[:& fill-menu {:ids ids
:type type
:values (select-keys shape fill-attrs)}]
[:& stroke-menu {:ids ids
:type type
:values stroke-values}]]))

8
frontend/src/uxbox/main/ui/workspace/sidebar/options/fill.cljs
View file

@ -32,8 +32,12 @@
(mf/defc fill-menu
{::mf/wrap [#(mf/memo' % fill-menu-memo-equals?)]}
[{:keys [ids values] :as props}]
[{:keys [ids type values] :as props}]
(let [locale (i18n/use-locale)
label (case type
:multiple (t locale "workspace.options.selection-fill")
:group (t locale "workspace.options.group-fill")
(t locale "workspace.options.fill"))
color {:value (:fill-color values)
:opacity (:fill-opacity values)}
handle-change-color (fn [value opacity]
@ -42,7 +46,7 @@
opacity (assoc :fill-opacity opacity))]
(st/emit! (dwc/update-shapes ids change))))]
[:div.element-set
[:div.element-set-title (t locale "workspace.options.fill")]
[:div.element-set-title label]
[:div.element-set-content
[:& color-row {:color color
:on-change handle-change-color}]]]))

11
frontend/src/uxbox/main/ui/workspace/sidebar/options/frame.cljs
View file

@ -201,10 +201,15 @@
(mf/defc options
[{:keys [shape] :as props}]
(let [ids [(:id shape)]
type (:type shape)
stroke-values (select-keys shape stroke-attrs)]
[:div
[:*
[:& measures-menu {:shape shape}]
[:& fill-menu {:ids [(:id shape)] :values (select-keys shape fill-attrs)}]
[:& stroke-menu {:ids ids :values stroke-values}]
[:& fill-menu {:ids ids
:type type
:values (select-keys shape fill-attrs)}]
[:& stroke-menu {:ids ids
:type type
:values stroke-values}]
[:& frame-grid {:shape shape}]]))

24
frontend/src/uxbox/main/ui/workspace/sidebar/options/group.cljs
View file

@ -11,11 +11,27 @@
(ns uxbox.main.ui.workspace.sidebar.options.group
(:require
[rumext.alpha :as mf]
[uxbox.main.ui.workspace.sidebar.options.measures :refer [measures-menu]]))
[uxbox.main.refs :as refs]
[uxbox.main.ui.workspace.sidebar.options.measures :refer [measures-menu]]
[uxbox.main.ui.workspace.sidebar.options.multiple :refer [get-multi]]
[uxbox.main.ui.workspace.sidebar.options.fill :refer [fill-attrs fill-menu]]
[uxbox.main.ui.workspace.sidebar.options.stroke :refer [stroke-attrs stroke-menu]]))
(mf/defc options
[{:keys [shape] :as props}]
[:div
[:& measures-menu {:options #{:position :rotation}
:shape shape}]])
(let [child-ids (:shapes shape)
children (mf/deref (refs/objects-by-id child-ids))
type (:type shape)
fill-values (get-multi children fill-attrs)
stroke-values (get-multi children stroke-attrs)]
[:*
[:& measures-menu {:options #{:position :rotation}
:shape shape}]
[:& fill-menu {:ids child-ids
:type type
:values fill-values}]
[:& stroke-menu {:ids child-ids
:type type
:values stroke-values}]]))

11
frontend/src/uxbox/main/ui/workspace/sidebar/options/icon.cljs
View file

@ -17,8 +17,13 @@
(mf/defc options
[{:keys [shape] :as props}]
(let [ids [(:id shape)]
type (:type shape)
stroke-values (select-keys shape stroke-attrs)]
[:div
[:*
[:& measures-menu {:shape shape}]
[:& fill-menu {:ids [(:id shape)] :values (select-keys shape fill-attrs)}]
[:& stroke-menu {:ids ids :values stroke-values}]]))
[:& fill-menu {:ids ids
:type type
:values (select-keys shape fill-attrs)}]
[:& stroke-menu {:ids ids
:type type
:values stroke-values}]]))

2
frontend/src/uxbox/main/ui/workspace/sidebar/options/image.cljs
View file

@ -14,5 +14,5 @@
(mf/defc options
[{:keys [shape] :as props}]
[:div
[:*
[:& measures-menu {:shape shape}]])

10
frontend/src/uxbox/main/ui/workspace/sidebar/options/multiple.cljs
View file

@ -14,7 +14,7 @@
[uxbox.main.ui.workspace.sidebar.options.fill :refer [fill-attrs fill-menu]]
[uxbox.main.ui.workspace.sidebar.options.stroke :refer [stroke-attrs stroke-menu]]))
(defn- get-multi
(defn get-multi
[shapes attrs]
(let [combine-value #(if (= %1 %2) %1 :multiple)
@ -34,6 +34,10 @@
fill-values (get-multi shapes fill-attrs)
stroke-values (get-multi shapes stroke-attrs)]
[:div
[:& fill-menu {:ids ids :values fill-values}]
[:& stroke-menu {:ids ids :values stroke-values}]]))
[:& fill-menu {:ids ids
:type :multiple
:values fill-values}]
[:& stroke-menu {:ids ids
:type :multiple
:values stroke-values}]]))

11
frontend/src/uxbox/main/ui/workspace/sidebar/options/path.cljs
View file

@ -17,7 +17,12 @@
(mf/defc options
[{:keys [shape] :as props}]
(let [ids [(:id shape)]
type (:type shape)
stroke-values (select-keys shape stroke-attrs)]
[:div
[:& fill-menu {:ids [(:id shape)] :values (select-keys shape fill-attrs)}]
[:& stroke-menu {:ids ids :values stroke-values}]]))
[:*
[:& fill-menu {:ids ids
:type type
:values (select-keys shape fill-attrs)}]
[:& stroke-menu {:ids ids
:type type
:values stroke-values}]]))

11
frontend/src/uxbox/main/ui/workspace/sidebar/options/rect.cljs
View file

@ -18,10 +18,15 @@
{::mf/wrap [mf/memo]}
[{:keys [shape] :as props}]
(let [ids [(:id shape)]
type (:type shape)
fill-values (select-keys shape fill-attrs)
stroke-values (select-keys shape stroke-attrs)]
[:div
[:*
[:& measures-menu {:shape shape}]
[:& fill-menu {:ids ids :values fill-values}]
[:& stroke-menu {:ids ids :values stroke-values}]]))
[:& fill-menu {:ids ids
:type type
:values fill-values}]
[:& stroke-menu {:ids ids
:type type
:values stroke-values}]]))

11
frontend/src/uxbox/main/ui/workspace/sidebar/options/stroke.cljs
View file

@ -58,8 +58,13 @@
(mf/defc stroke-menu
{::mf/wrap [#(mf/memo' % stroke-menu-memo-equals?)]}
[{:keys [ids values] :as props}]
[{:keys [ids type values] :as props}]
(let [locale (i18n/use-locale)
label (case type
:multiple (t locale "workspace.options.selection-stroke")
:group (t locale "workspace.options.group-stroke")
(t locale "workspace.options.stroke"))
show-options (not= (:stroke-style values :none) :none)
current-stroke-color {:value (:stroke-color values)
@ -109,7 +114,7 @@
(if show-options
[:div.element-set
[:div.element-set-title
[:span (t locale "workspace.options.stroke")]
[:span label]
[:div.add-page {:on-click on-del-stroke} i/minus]]
[:div.element-set-content
@ -147,6 +152,6 @@
;; NO STROKE
[:div.element-set
[:div.element-set-title
[:span (t locale "workspace.options.stroke")]
[:span label]
[:div.add-page {:on-click on-add-stroke} i/close]]])))

1
frontend/src/uxbox/main/ui/workspace/sidebar/options/text.cljs
View file

@ -383,7 +383,6 @@
[:div.element-set-content
[:& text-fill-options {:editor editor :shape shape}]]]
[:div.element-set
[:div.element-set-title (t locale "workspace.options.font-options")]
[:div.element-set-content