Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-04-12 15:01:28 -05:00
Code Issues Activity

✨ Renderers for booleans

Browse source
This commit is contained in:
alonso.torres 2021-09-21 12:11:54 +02:00
parent 778a542e1c
commit 75d2d97d8e
6 changed files with 86 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
common/src/app/common/geom/shapes/common.cljc
View file

@ -6,8 +6,8 @@
(ns app.common.geom.shapes.common
(:require
[app.common.geom.point :as gpt]
[app.common.geom.matrix :as gmt]
[app.common.geom.point :as gpt]
[app.common.math :as mth]))
(defn center-rect

8
frontend/src/app/main/data/workspace/booleans.cljs
View file

@ -97,10 +97,10 @@
(ptk/reify ::group-to-bool
ptk/WatchEvent
(watch [_ state _]
(let [objects (wsh/lookup-page-objects state)]
(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})))))))
(let [objects (wsh/lookup-page-objects state)
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]

19
frontend/src/app/main/exports.cljs
View file

@ -14,6 +14,7 @@
[app.common.math :as mth]
[app.common.pages :as cp]
[app.common.uuid :as uuid]
[app.main.ui.shapes.bool :as bool]
[app.main.ui.shapes.circle :as circle]
[app.main.ui.shapes.embed :as embed]
[app.main.ui.shapes.export :as use]
@ -81,6 +82,18 @@
:is-child-selected? true
:childs childs}]))))
(defn bool-wrapper-factory
[objects]
(let [shape-wrapper (shape-wrapper-factory objects)
bool-shape (bool/bool-shape shape-wrapper)]
(mf/fnc bool-wrapper
[{:keys [shape frame] :as props}]
(let [childs (->> (cp/get-children (:id shape) objects)
(select-keys objects))]
[:& bool-shape {:frame frame
:shape shape
:childs childs}]))))
(defn svg-raw-wrapper-factory
[objects]
(let [shape-wrapper (shape-wrapper-factory objects)
@ -104,9 +117,10 @@
[objects]
(mf/fnc shape-wrapper
[{:keys [frame shape] :as props}]
(let [group-wrapper (mf/use-memo (mf/deps objects) #(group-wrapper-factory objects))
(let [group-wrapper (mf/use-memo (mf/deps objects) #(group-wrapper-factory objects))
svg-raw-wrapper (mf/use-memo (mf/deps objects) #(svg-raw-wrapper-factory objects))
frame-wrapper (mf/use-memo (mf/deps objects) #(frame-wrapper-factory objects))]
bool-wrapper (mf/use-memo (mf/deps objects) #(bool-wrapper-factory objects))
frame-wrapper (mf/use-memo (mf/deps objects) #(frame-wrapper-factory objects))]
(when (and shape (not (:hidden shape)))
(let [shape (-> (gsh/transform-shape shape)
(gsh/translate-to-frame frame))
@ -122,6 +136,7 @@
:circle [:> circle/circle-shape opts]
:frame [:> frame-wrapper {:shape shape}]
:group [:> group-wrapper {:shape shape :frame frame}]
:bool [:> bool-wrapper {:shape shape :frame frame}]
nil)]
;; Don't wrap svg elements inside a <g> otherwise some can break

1
frontend/src/app/main/ui/shapes/bool.cljs
View file

@ -32,6 +32,7 @@
(let [childs (d/mapm #(gsh/transform-shape %2) childs)]
(->> (:shapes shape)
(map #(get childs %))
(filter #(not (:hidden %)))
(map #(stp/convert-to-path % childs))
(mapv :content)
(pb/content-bool (:bool-type shape))))))]

37
frontend/src/app/main/ui/viewer/handoff/render.cljs
View file

@ -8,8 +8,10 @@
"The main container for a frame in handoff mode"
(:require
[app.common.geom.shapes :as geom]
[app.common.pages :as cp]
[app.main.data.viewer :as dv]
[app.main.store :as st]
[app.main.ui.shapes.bool :as bool]
[app.main.ui.shapes.circle :as circle]
[app.main.ui.shapes.frame :as frame]
[app.main.ui.shapes.group :as group]
@ -106,6 +108,22 @@
(obj/merge! #js {:childs childs}))]
[:> group-wrapper props]))))
(defn bool-container-factory
[objects]
(let [shape-container (shape-container-factory objects)
bool-shape (bool/bool-shape shape-container)
bool-wrapper (shape-wrapper-factory bool-shape)]
(mf/fnc bool-container
{::mf/wrap-props false}
[props]
(let [shape (unchecked-get props "shape")
children-ids (cp/get-children (:id shape) objects)
childs (select-keys objects children-ids)
props (-> (obj/new)
(obj/merge! props)
(obj/merge! #js {:childs childs}))]
[:> bool-wrapper props]))))
(defn svg-raw-container-factory
[objects]
(let [shape-container (shape-container-factory objects)
@ -133,12 +151,18 @@
[props]
(let [shape (unchecked-get props "shape")
frame (unchecked-get props "frame")
group-container (mf/use-memo
(mf/deps objects)
#(group-container-factory objects))
svg-raw-container (mf/use-memo
(mf/deps objects)
#(svg-raw-container-factory objects))]
group-container
(mf/use-memo (mf/deps objects)
#(group-container-factory objects))
bool-container
(mf/use-memo (mf/deps objects)
#(bool-container-factory objects))
svg-raw-container
(mf/use-memo (mf/deps objects)
#(svg-raw-container-factory objects))]
(when (and shape (not (:hidden shape)))
(let [shape (-> (geom/transform-shape shape)
(geom/translate-to-frame frame))
@ -151,6 +175,7 @@
:image [:> image-wrapper opts]
:circle [:> circle-wrapper opts]
:group [:> group-container opts]
:bool [:> bool-container opts]
:svg-raw [:> svg-raw-container opts])))))))
(mf/defc render-frame-svg

38
frontend/src/app/main/ui/viewer/shapes.cljs
View file

@ -15,6 +15,7 @@
[app.common.types.interactions :as cti]
[app.main.data.viewer :as dv]
[app.main.store :as st]
[app.main.ui.shapes.bool :as bool]
[app.main.ui.shapes.circle :as circle]
[app.main.ui.shapes.frame :as frame]
[app.main.ui.shapes.group :as group]
@ -229,6 +230,10 @@
[shape-container show-interactions?]
(generic-wrapper-factory (group/group-shape shape-container) show-interactions?))
(defn bool-wrapper
[shape-container show-interactions?]
(generic-wrapper-factory (bool/bool-shape shape-container) show-interactions?))
(defn svg-raw-wrapper
[shape-container show-interactions?]
(generic-wrapper-factory (svg-raw/svg-raw-shape shape-container) show-interactions?))
@ -287,6 +292,21 @@
:show-interactions? show-interactions?})]
[:> group-wrapper props]))))
(defn bool-container-factory
[objects show-interactions?]
(let [shape-container (shape-container-factory objects show-interactions?)
bool-wrapper (bool-wrapper shape-container show-interactions?)]
(mf/fnc bool-container
{::mf/wrap-props false}
[props]
(let [shape (unchecked-get props "shape")
childs (select-keys objects (cp/get-children (:id shape) objects))
props (obj/merge! #js {} props
#js {:childs childs
:objects objects
:show-interactions? show-interactions?})]
[:> bool-wrapper props]))))
(defn svg-raw-container-factory
[objects show-interactions?]
(let [shape-container (shape-container-factory objects show-interactions?)
@ -312,12 +332,17 @@
(mf/fnc shape-container
{::mf/wrap-props false}
[props]
(let [group-container (mf/use-memo
(mf/deps objects)
#(group-container-factory objects show-interactions?))
svg-raw-container (mf/use-memo
(mf/deps objects)
#(svg-raw-container-factory objects show-interactions?))
(let [group-container
(mf/use-memo (mf/deps objects)
#(group-container-factory objects show-interactions?))
bool-container
(mf/use-memo (mf/deps objects)
#(bool-container-factory objects show-interactions?))
svg-raw-container
(mf/use-memo (mf/deps objects)
#(svg-raw-container-factory objects show-interactions?))
shape (unchecked-get props "shape")
frame (unchecked-get props "frame")]
(when (and shape (not (:hidden shape)))
@ -333,6 +358,7 @@
:image [:> image-wrapper opts]
:circle [:> circle-wrapper opts]
:group [:> group-container {:shape shape :frame frame :objects objects}]
:bool [:> bool-container {:shape shape :frame frame :objects objects}]
:svg-raw [:> svg-raw-container {:shape shape :frame frame :objects objects}])))))))
(mf/defc frame-svg