3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-06-12 18:41:38 +02:00
Code Issues Projects Releases Packages Wiki Activity

🔧 Refactor calculation of multi selection attributes

Browse source
This commit is contained in:
Andrés Moya 2022-02-15 09:55:06 +01:00 • committed by Alonso Torres
parent 809d7ab7f4
commit b9e3426532
4 changed files with 327 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

1
common/src/app/common/attrs.cljc
View file

@ -36,7 +36,6 @@
;; :rx nil ;; :rx nil
;; :ry nil} ;; :ry nil}
;; ;;
(defn get-attrs-multi (defn get-attrs-multi
([objs attrs] ([objs attrs]
(get-attrs-multi objs attrs = identity)) (get-attrs-multi objs attrs = identity))

317
common/src/app/common/pages/common.cljc
View file

@ -65,3 +65,320 @@
:constraints-v :constraints-group :constraints-v :constraints-group
:fixed-scroll :constraints-group}) :fixed-scroll :constraints-group})
;; Attributes that may directly be edited by the user with forms
(def editable-attrs
{:frame #{:proportion-lock
:width :height
:x :y
:selrect
:opacity
:blend-mode
:blocked
:hidden
:fills
:fill-color
:fill-opacity
:fill-color-ref-id
:fill-color-ref-file
:fill-color-gradient
:hide-fill-on-export}
:group #{:proportion-lock
:width :height
:x :y
:selrect
:constraints-h
:constraints-v
:fixed-scroll
:parent-id
:frame-id
:opacity
:blend-mode
:blocked
:hidden
:shadow
:blur}
:rect #{:proportion-lock
:width :height
:x :y
:rotation
:rx :ry
:r1 :r2 :r3 :r4
:selrect
:constraints-h
:constraints-v
:fixed-scroll
:parent-id
:frame-id
:opacity
:blend-mode
:blocked
:hidden
:fills
:fill-color
:fill-opacity
:fill-color-ref-id
:fill-color-ref-file
:fill-color-gradient
:stroke-style
:stroke-alignment
:stroke-width
:stroke-color
:stroke-color-ref-id
:stroke-color-ref-file
:stroke-opacity
:stroke-color-gradient
:stroke-cap-start
:stroke-cap-end
:shadow
:blur}
:circle #{:proportion-lock
:width :height
:x :y
:rotation
:selrect
:constraints-h
:constraints-v
:fixed-scroll
:parent-id
:frame-id
:opacity
:blend-mode
:blocked
:hidden
:fills
:fill-color
:fill-opacity
:fill-color-ref-id
:fill-color-ref-file
:fill-color-gradient
:stroke-style
:stroke-alignment
:stroke-width
:stroke-color
:stroke-color-ref-id
:stroke-color-ref-file
:stroke-opacity
:stroke-color-gradient
:stroke-cap-start
:stroke-cap-end
:shadow
:blur}
:path #{:proportion-lock
:width :height
:x :y
:rotation
:selrect
:constraints-h
:constraints-v
:fixed-scroll
:parent-id
:frame-id
:opacity
:blend-mode
:blocked
:hidden
:fills
:fill-color
:fill-opacity
:fill-color-ref-id
:fill-color-ref-file
:fill-color-gradient
:stroke-style
:stroke-alignment
:stroke-width
:stroke-color
:stroke-color-ref-id
:stroke-color-ref-file
:stroke-opacity
:stroke-color-gradient
:stroke-cap-start
:stroke-cap-end
:shadow
:blur}
:text #{:proportion-lock
:width :height
:x :y
:rotation
:rx :ry
:r1 :r2 :r3 :r4
:selrect
:constraints-h
:constraints-v
:fixed-scroll
:parent-id
:frame-id
:opacity
:blend-mode
:blocked
:hidden
:fill-color
:fill-opacity
:fill-color-ref-id
:fill-color-ref-file
:fill-color-gradient
:shadow
:blur
:typography-ref-id
:typography-ref-file
:font-id
:font-family
:font-variant-id
:font-size
:font-weight
:font-style
:text-align
:text-direction
:line-height
:letter-spacing
:vertical-align
:text-decoration
:text-transform
:grow-type}
:image #{:proportion-lock
:width :height
:x :y
:rotation
:rx :ry
:r1 :r2 :r3 :r4
:selrect
:constraints-h
:constraints-v
:fixed-scroll
:parent-id
:frame-id
:opacity
:blend-mode
:blocked
:hidden
:shadow
:blur}
:svg-raw #{:proportion-lock
:width :height
:x :y
:rotation
:rx :ry
:r1 :r2 :r3 :r4
:selrect
:constraints-h
:constraints-v
:fixed-scroll
:parent-id
:frame-id
:opacity
:blend-mode
:blocked
:hidden
:fills
:fill-color
:fill-opacity
:fill-color-ref-id
:fill-color-ref-file
:fill-color-gradient
:stroke-style
:stroke-alignment
:stroke-width
:stroke-color
:stroke-color-ref-id
:stroke-color-ref-file
:stroke-opacity
:stroke-color-gradient
:stroke-cap-start
:stroke-cap-end
:shadow
:blur}
:bool #{:proportion-lock
:width :height
:x :y
:rotation
:rx :ry
:r1 :r2 :r3 :r4
:selrect
:constraints-h
:constraints-v
:fixed-scroll
:parent-id
:frame-id
:opacity
:blend-mode
:blocked
:hidden
:fill-color
:fill-opacity
:fill-color-ref-id
:fill-color-ref-file
:fill-color-gradient
:stroke-style
:stroke-alignment
:stroke-width
:stroke-color
:stroke-color-ref-id
:stroke-color-ref-file
:stroke-opacity
:stroke-color-gradient
:stroke-cap-start
:stroke-cap-end
:shadow
:blur}})

2
frontend/src/app/main/ui/workspace/sidebar/options/menus/fill.cljs
View file

@ -44,7 +44,7 @@
:file-id (:fill-color-ref-file values) :file-id (:fill-color-ref-file values)
:gradient (:fill-color-gradient values)} :gradient (:fill-color-gradient values)}
hide-fill-on-export? (:hide-fill-on-export values false) hide-fill-on-export? (:hide-fill-on-export values)
checkbox-ref (mf/use-ref) checkbox-ref (mf/use-ref)

18
frontend/src/app/main/ui/workspace/sidebar/options/shapes/multiple.cljs
View file

@ -8,6 +8,7 @@
(:require (:require
[app.common.attrs :as attrs] [app.common.attrs :as attrs]
[app.common.data :as d] [app.common.data :as d]
[app.common.pages.common :as cpc]
[app.common.text :as txt] [app.common.text :as txt]
[app.main.ui.hooks :as hooks] [app.main.ui.hooks :as hooks]
[app.main.ui.workspace.sidebar.options.menus.blur :refer [blur-attrs blur-menu]] [app.main.ui.workspace.sidebar.options.menus.blur :refer [blur-attrs blur-menu]]
@ -20,8 +21,11 @@
[app.main.ui.workspace.sidebar.options.menus.text :as ot] [app.main.ui.workspace.sidebar.options.menus.text :as ot]
[rumext.alpha :as mf])) [rumext.alpha :as mf]))
;; We define a map that goes from type to ;; Define how to read each kind of attribute depending on the shape type:
;; attribute and how to handle them ;; - shape: read the attribute directly from the shape.
;; - children: read it from all the children, and then merging it.
;; - ignore: do not read this attribute from this shape.
;; - text: read it from all the content nodes, and then merging it.
(def type->props (def type->props
{:frame {:frame
{:measure :shape {:measure :shape
@ -151,9 +155,6 @@
[v] [v]
(when v (select-keys v blur-keys))) (when v (select-keys v blur-keys)))
(defn empty-map [keys]
(into {} (map #(hash-map % nil)) keys))
(defn get-attrs* (defn get-attrs*
"Given a `type` of options that we want to extract and the shapes to extract them from "Given a `type` of options that we want to extract and the shapes to extract them from
returns a list of tuples [id, values] with the extracted properties for the shapes that returns a list of tuples [id, values] with the extracted properties for the shapes that
@ -172,10 +173,9 @@
(let [props (get-in type->props [type attr-type])] (let [props (get-in type->props [type attr-type])]
(case props (case props
:ignore [ids values] :ignore [ids values]
:shape [(conj ids id) :shape (let [editable-attrs (filter (get cpc/editable-attrs (:type shape)) attrs)]
(merge-attrs values (merge [(conj ids id)
(empty-map attrs) (merge-attrs values (select-keys shape editable-attrs))])
(select-keys shape attrs)))]
:text [(conj ids id) :text [(conj ids id)
(-> values (-> values
(merge-attrs (select-keys shape attrs)) (merge-attrs (select-keys shape attrs))