mirror of
https://github.com/penpot/penpot.git
synced 2025-07-25 16:57:20 +02:00
💄 Minor cosmetic improvements on shapes related namespaces.
This commit is contained in:
parent
ba96edc620
commit
8e81d796f0
9 changed files with 29 additions and 37 deletions
|
@ -18,29 +18,19 @@
|
||||||
[uxbox.main.ui.shapes.canvas :as canvas]
|
[uxbox.main.ui.shapes.canvas :as canvas]
|
||||||
[uxbox.main.ui.shapes.text :as text]))
|
[uxbox.main.ui.shapes.text :as text]))
|
||||||
|
|
||||||
(defn render-shape
|
(mf/defc shape-wrapper
|
||||||
[shape]
|
|
||||||
(mf/html
|
|
||||||
(case (:type shape)
|
|
||||||
:canvas [:& canvas/canvas-component {:shape shape}]
|
|
||||||
:curve [:& path/path-component {:shape shape}]
|
|
||||||
:text [:& text/text-component {:shape shape}]
|
|
||||||
:icon [:& icon/icon-component {:shape shape}]
|
|
||||||
:rect [:& rect/rect-component {:shape shape}]
|
|
||||||
:path [:& path/path-component {:shape shape}]
|
|
||||||
:image [:& image/image-component {:shape shape}]
|
|
||||||
:circle [:& circle/circle-component {:shape shape}])))
|
|
||||||
|
|
||||||
(mf/defc render-shape'
|
|
||||||
{:wrap [mf/wrap-memo]}
|
|
||||||
[{:keys [shape] :as props}]
|
|
||||||
(render-shape shape))
|
|
||||||
|
|
||||||
(mf/defc shape-component
|
|
||||||
{:wrap [mf/wrap-memo]}
|
{:wrap [mf/wrap-memo]}
|
||||||
[{:keys [shape] :as props}]
|
[{:keys [shape] :as props}]
|
||||||
(when (and shape (not (:hidden shape)))
|
(when (and shape (not (:hidden shape)))
|
||||||
[:& render-shape' {:shape shape}]))
|
(case (:type shape)
|
||||||
|
:canvas [:& canvas/canvas-wrapper {:shape shape}]
|
||||||
|
:curve [:& path/path-wrapper {:shape shape}]
|
||||||
|
:text [:& text/text-wrapper {:shape shape}]
|
||||||
|
:icon [:& icon/icon-wrapper {:shape shape}]
|
||||||
|
:rect [:& rect/rect-wrapper {:shape shape}]
|
||||||
|
:path [:& path/path-wrapper {:shape shape}]
|
||||||
|
:image [:& image/image-wrapper {:shape shape}]
|
||||||
|
:circle [:& circle/circle-wrapper {:shape shape}])))
|
||||||
|
|
||||||
(mf/defc canvas-and-shapes
|
(mf/defc canvas-and-shapes
|
||||||
{:wrap [mf/wrap-memo]}
|
{:wrap [mf/wrap-memo]}
|
||||||
|
@ -50,8 +40,8 @@
|
||||||
canvas (map #(get shapes-by-id %) (:canvas page []))]
|
canvas (map #(get shapes-by-id %) (:canvas page []))]
|
||||||
[:*
|
[:*
|
||||||
(for [item canvas]
|
(for [item canvas]
|
||||||
[:& shape-component {:shape item :key (:id item)}])
|
[:& shape-wrapper {:shape item :key (:id item)}])
|
||||||
(for [item shapes]
|
(for [item shapes]
|
||||||
[:& shape-component {:shape item :key (:id item)}])]))
|
[:& shape-wrapper {:shape item :key (:id item)}])]))
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -24,7 +24,7 @@
|
||||||
(def canvas-default-props
|
(def canvas-default-props
|
||||||
{:fill-color "#ffffff"})
|
{:fill-color "#ffffff"})
|
||||||
|
|
||||||
(mf/defc canvas-component
|
(mf/defc canvas-wrapper
|
||||||
[{:keys [shape] :as props}]
|
[{:keys [shape] :as props}]
|
||||||
(let [selected (mf/deref refs/selected-shapes)
|
(let [selected (mf/deref refs/selected-shapes)
|
||||||
selected? (contains? selected (:id shape))
|
selected? (contains? selected (:id shape))
|
||||||
|
|
|
@ -15,11 +15,11 @@
|
||||||
[uxbox.util.geom.matrix :as gmt]
|
[uxbox.util.geom.matrix :as gmt]
|
||||||
[uxbox.util.geom.point :as gpt]))
|
[uxbox.util.geom.point :as gpt]))
|
||||||
|
|
||||||
;; --- Circle Component
|
;; --- Circle Wrapper
|
||||||
|
|
||||||
(declare circle-shape)
|
(declare circle-shape)
|
||||||
|
|
||||||
(mf/defc circle-component
|
(mf/defc circle-wrapper
|
||||||
[{:keys [shape] :as props}]
|
[{:keys [shape] :as props}]
|
||||||
(let [selected (mf/deref refs/selected-shapes)
|
(let [selected (mf/deref refs/selected-shapes)
|
||||||
selected? (contains? selected (:id shape))
|
selected? (contains? selected (:id shape))
|
||||||
|
|
|
@ -17,11 +17,11 @@
|
||||||
[uxbox.util.geom.point :as gpt]))
|
[uxbox.util.geom.point :as gpt]))
|
||||||
|
|
||||||
|
|
||||||
;; --- Icon Component
|
;; --- Icon Wrapper
|
||||||
|
|
||||||
(declare icon-shape)
|
(declare icon-shape)
|
||||||
|
|
||||||
(mf/defc icon-component
|
(mf/defc icon-wrapper
|
||||||
[{:keys [shape] :as props}]
|
[{:keys [shape] :as props}]
|
||||||
(let [selected (mf/deref refs/selected-shapes)
|
(let [selected (mf/deref refs/selected-shapes)
|
||||||
selected? (contains? selected (:id shape))
|
selected? (contains? selected (:id shape))
|
||||||
|
|
|
@ -24,11 +24,11 @@
|
||||||
(-> (l/in [:images id])
|
(-> (l/in [:images id])
|
||||||
(l/derive st/state)))
|
(l/derive st/state)))
|
||||||
|
|
||||||
;; --- Image Component
|
;; --- Image Wrapper
|
||||||
|
|
||||||
(declare image-shape)
|
(declare image-shape)
|
||||||
|
|
||||||
(mf/defc image-component
|
(mf/defc image-wrapper
|
||||||
[{:keys [shape] :as props}]
|
[{:keys [shape] :as props}]
|
||||||
(let [selected (mf/deref refs/selected-shapes)
|
(let [selected (mf/deref refs/selected-shapes)
|
||||||
image (mf/deref (image-ref (:image shape)))
|
image (mf/deref (image-ref (:image shape)))
|
||||||
|
|
|
@ -17,11 +17,11 @@
|
||||||
[uxbox.util.data :refer [classnames normalize-props]]
|
[uxbox.util.data :refer [classnames normalize-props]]
|
||||||
[uxbox.util.geom.matrix :as gmt]))
|
[uxbox.util.geom.matrix :as gmt]))
|
||||||
|
|
||||||
;; --- Path Component
|
;; --- Path Wrapper
|
||||||
|
|
||||||
(declare path-shape)
|
(declare path-shape)
|
||||||
|
|
||||||
(mf/defc path-component
|
(mf/defc path-wrapper
|
||||||
[{:keys [shape] :as props}]
|
[{:keys [shape] :as props}]
|
||||||
(let [selected (mf/deref refs/selected-shapes)
|
(let [selected (mf/deref refs/selected-shapes)
|
||||||
selected? (contains? selected (:id shape))]
|
selected? (contains? selected (:id shape))]
|
||||||
|
|
|
@ -16,11 +16,11 @@
|
||||||
[uxbox.util.geom.matrix :as gmt]
|
[uxbox.util.geom.matrix :as gmt]
|
||||||
[uxbox.util.geom.point :as gpt]))
|
[uxbox.util.geom.point :as gpt]))
|
||||||
|
|
||||||
;; --- Rect Component
|
;; --- Rect Wrapper
|
||||||
|
|
||||||
(declare rect-shape)
|
(declare rect-shape)
|
||||||
|
|
||||||
(mf/defc rect-component
|
(mf/defc rect-wrapper
|
||||||
[{:keys [shape] :as props}]
|
[{:keys [shape] :as props}]
|
||||||
(let [selected (mf/deref refs/selected-shapes)
|
(let [selected (mf/deref refs/selected-shapes)
|
||||||
selected? (contains? selected (:id shape))
|
selected? (contains? selected (:id shape))
|
||||||
|
|
|
@ -23,6 +23,8 @@
|
||||||
[uxbox.util.dom :as dom]
|
[uxbox.util.dom :as dom]
|
||||||
[uxbox.util.geom.matrix :as gmt]))
|
[uxbox.util.geom.matrix :as gmt]))
|
||||||
|
|
||||||
|
;; TODO: this code need a good refactor
|
||||||
|
|
||||||
;; --- Events
|
;; --- Events
|
||||||
|
|
||||||
(defn handle-mouse-down
|
(defn handle-mouse-down
|
||||||
|
@ -33,13 +35,13 @@
|
||||||
(dom/stop-propagation event)
|
(dom/stop-propagation event)
|
||||||
(common/on-mouse-down event shape selected)))
|
(common/on-mouse-down event shape selected)))
|
||||||
|
|
||||||
;; --- Text Component
|
;; --- Text Wrapper
|
||||||
|
|
||||||
(declare text-shape-html)
|
(declare text-shape-html)
|
||||||
(declare text-shape-wrapper)
|
(declare text-shape-wrapper)
|
||||||
(declare text-shape-edit)
|
(declare text-shape-edit)
|
||||||
|
|
||||||
(mf/defc text-component
|
(mf/defc text-wrapper
|
||||||
[{:keys [shape] :as props}]
|
[{:keys [shape] :as props}]
|
||||||
(let [{:keys [id x1 y1 content group]} shape
|
(let [{:keys [id x1 y1 content group]} shape
|
||||||
selected (mf/deref refs/selected-shapes)
|
selected (mf/deref refs/selected-shapes)
|
||||||
|
|
|
@ -325,7 +325,7 @@
|
||||||
[{:keys [shape zoom]}]
|
[{:keys [shape zoom]}]
|
||||||
(let [{:keys [x1 y1 width height]} (geom/selection-rect shape)]
|
(let [{:keys [x1 y1 width height]} (geom/selection-rect shape)]
|
||||||
[:g
|
[:g
|
||||||
(shapes/render-shape shape)
|
[:& shapes/shape-wrapper {:shape shape}]
|
||||||
[:rect.main {:x x1 :y y1
|
[:rect.main {:x x1 :y y1
|
||||||
:width width
|
:width width
|
||||||
:height height
|
:height height
|
||||||
|
@ -347,7 +347,7 @@
|
||||||
(st/emit! (dw/set-tooltip nil)))]
|
(st/emit! (dw/set-tooltip nil)))]
|
||||||
(when-let [{:keys [x y] :as segment} (first (:segments shape))]
|
(when-let [{:keys [x y] :as segment} (first (:segments shape))]
|
||||||
[:g
|
[:g
|
||||||
(shapes/render-shape shape)
|
[:& shapes/shape-wrapper {:shape shape}]
|
||||||
(when (not= :curve (:type shape))
|
(when (not= :curve (:type shape))
|
||||||
[:circle.close-bezier
|
[:circle.close-bezier
|
||||||
{:cx x
|
{:cx x
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue