mirror of
https://github.com/penpot/penpot.git
synced 2025-01-10 17:00:36 -05:00
✨ Fix style for bool shapes
This commit is contained in:
parent
c3520cf606
commit
8c25ee7796
3 changed files with 98 additions and 37 deletions
|
@ -7,6 +7,7 @@
|
|||
(ns app.common.pages.changes-builder
|
||||
(:require
|
||||
[app.common.data :as d]
|
||||
[app.common.pages :as cp]
|
||||
[app.common.pages.helpers :as h]))
|
||||
|
||||
;; Auxiliary functions to help create a set of changes (undo + redo)
|
||||
|
@ -25,28 +26,34 @@
|
|||
(assoc ::objects objects))))
|
||||
|
||||
(defn add-obj
|
||||
[changes obj]
|
||||
(let [add-change
|
||||
{:type :add-obj
|
||||
:id (:id obj)
|
||||
:page-id (::page-id (meta changes))
|
||||
:parent-id (:parent-id obj)
|
||||
:frame-id (:frame-id obj)
|
||||
:index (::index obj)
|
||||
:obj (dissoc obj ::index :parent-id)}
|
||||
([changes obj index]
|
||||
(add-obj changes (assoc obj ::index index)))
|
||||
|
||||
del-change
|
||||
{:type :del-obj
|
||||
:id (:id obj)
|
||||
:page-id (::page-id (meta changes))}]
|
||||
([changes obj]
|
||||
(let [add-change
|
||||
{:type :add-obj
|
||||
:id (:id obj)
|
||||
:page-id (::page-id (meta changes))
|
||||
:parent-id (:parent-id obj)
|
||||
:frame-id (:frame-id obj)
|
||||
:index (::index obj)
|
||||
:obj (dissoc obj ::index :parent-id)}
|
||||
|
||||
(-> changes
|
||||
(update :redo-changes conj add-change)
|
||||
(update :undo-changes d/preconj del-change))))
|
||||
del-change
|
||||
{:type :del-obj
|
||||
:id (:id obj)
|
||||
:page-id (::page-id (meta changes))}]
|
||||
|
||||
(-> changes
|
||||
(update :redo-changes conj add-change)
|
||||
(update :undo-changes d/preconj del-change)))))
|
||||
|
||||
(defn change-parent
|
||||
[changes parent-id shapes]
|
||||
(let [set-parent-change
|
||||
(assert (contains? (meta changes) ::objects) "Call (with-objects) first to use this function")
|
||||
|
||||
(let [objects (::objects (meta changes))
|
||||
set-parent-change
|
||||
{:type :mov-objects
|
||||
:parent-id parent-id
|
||||
:page-id (::page-id (meta changes))
|
||||
|
@ -60,7 +67,7 @@
|
|||
:page-id (::page-id (meta changes))
|
||||
:parent-id (:parent-id shape)
|
||||
:shapes [(:id shape)]
|
||||
:index (::index shape)}))]
|
||||
:index (cp/position-on-parent (:id shape) objects)}))]
|
||||
|
||||
(-> changes
|
||||
(update :redo-changes conj set-parent-change)
|
||||
|
|
|
@ -30,20 +30,20 @@
|
|||
(sort-by ::index))))
|
||||
|
||||
(defn create-bool-data
|
||||
[type name shapes objects]
|
||||
[bool-type name shapes objects]
|
||||
(let [shapes (mapv #(stp/convert-to-path % objects) shapes)
|
||||
head (first shapes)
|
||||
head (if (= bool-type :difference) (first shapes) (last shapes))
|
||||
head-data (select-keys head stp/style-properties)]
|
||||
(-> {:id (uuid/next)
|
||||
:type :bool
|
||||
:bool-type type
|
||||
:frame-id (:frame-id head)
|
||||
:parent-id (:parent-id head)
|
||||
:name name
|
||||
::index (::index head)
|
||||
:shapes []}
|
||||
(merge head-data)
|
||||
(gsh/update-bool-selrect shapes objects))))
|
||||
[(-> {:id (uuid/next)
|
||||
:type :bool
|
||||
:bool-type bool-type
|
||||
:frame-id (:frame-id head)
|
||||
:parent-id (:parent-id head)
|
||||
:name name
|
||||
:shapes []}
|
||||
(merge head-data)
|
||||
(gsh/update-bool-selrect shapes objects))
|
||||
(cp/position-on-parent (:id head) objects)]))
|
||||
|
||||
(defn group->bool
|
||||
[group bool-type objects]
|
||||
|
@ -84,10 +84,11 @@
|
|||
shapes (selected-shapes state)]
|
||||
|
||||
(when-not (empty? shapes)
|
||||
(let [boolean-data (create-bool-data bool-type name shapes objects)
|
||||
(let [[boolean-data index] (create-bool-data bool-type name shapes objects)
|
||||
shape-id (:id boolean-data)
|
||||
changes (-> (cb/empty-changes it page-id)
|
||||
(cb/add-obj boolean-data)
|
||||
(cb/with-objects objects)
|
||||
(cb/add-obj boolean-data index)
|
||||
(cb/change-parent shape-id shapes))]
|
||||
(rx/of (dch/commit-changes changes)
|
||||
(dwc/select-shapes (d/ordered-set shape-id)))))))))
|
||||
|
|
|
@ -25,6 +25,23 @@
|
|||
|
||||
childs (use-equal-memo childs)
|
||||
|
||||
;;[content-a content-b]
|
||||
;;(mf/use-memo
|
||||
;; (mf/deps shape childs)
|
||||
;; (fn []
|
||||
;; (let [childs (d/mapm #(gsh/transform-shape %2) childs)
|
||||
;; [content-a content-b]
|
||||
;; (->> (:shapes shape)
|
||||
;; (map #(get childs %))
|
||||
;; (filter #(not (:hidden %)))
|
||||
;; (map #(stp/convert-to-path % childs))
|
||||
;; (mapv :content)
|
||||
;; (mapv pb/add-previous))]
|
||||
;; (pb/content-intersect-split content-a content-b))))
|
||||
|
||||
;;_ (.log js/console "content-a" (clj->js content-a))
|
||||
;;_ (.log js/console "content-b" (clj->js content-b))
|
||||
|
||||
bool-content
|
||||
(mf/use-memo
|
||||
(mf/deps shape childs)
|
||||
|
@ -35,9 +52,45 @@
|
|||
(filter #(not (:hidden %)))
|
||||
(map #(stp/convert-to-path % childs))
|
||||
(mapv :content)
|
||||
(pb/content-bool (:bool-type shape))))))]
|
||||
(pb/content-bool (:bool-type shape))))))
|
||||
]
|
||||
|
||||
[:& shape-wrapper {:shape (-> shape
|
||||
(assoc :type :path)
|
||||
(assoc :content bool-content))
|
||||
:frame frame}])))
|
||||
[:*
|
||||
[:& shape-wrapper {:shape (-> shape
|
||||
(assoc :type :path)
|
||||
(assoc :content bool-content))
|
||||
:frame frame}]
|
||||
|
||||
|
||||
#_[:*
|
||||
[:g
|
||||
[:& shape-wrapper {:shape (-> shape
|
||||
(assoc :type :path)
|
||||
(assoc :stroke-color "blue")
|
||||
(assoc :stroke-opacity 1)
|
||||
(assoc :stroke-width 0.5)
|
||||
(assoc :stroke-style :solid)
|
||||
(dissoc :fill-color :fill-opacity)
|
||||
(assoc :content content-b))
|
||||
:frame frame}]
|
||||
(for [{:keys [x y]} (app.common.geom.shapes.path/content->points content-b)]
|
||||
[:circle {:cx x
|
||||
:cy y
|
||||
:r 2.5
|
||||
:style {:fill "blue"}}])]
|
||||
|
||||
[:g
|
||||
[:& shape-wrapper {:shape (-> shape
|
||||
(assoc :type :path)
|
||||
(assoc :stroke-color "red")
|
||||
(assoc :stroke-opacity 1)
|
||||
(assoc :stroke-width 0.5)
|
||||
(assoc :stroke-style :solid)
|
||||
(dissoc :fill-color :fill-opacity)
|
||||
(assoc :content content-a))
|
||||
:frame frame}]
|
||||
(for [{:keys [x y]} (app.common.geom.shapes.path/content->points content-a)]
|
||||
[:circle {:cx x
|
||||
:cy y
|
||||
:r 1.25
|
||||
:style {:fill "red"}}])]]])))
|
||||
|
|
Loading…
Reference in a new issue