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

✨ Plugins create svg shapes

Browse source
This commit is contained in:
alonso.torres 2024-04-29 15:43:48 +02:00
parent 21d38a058b
commit 67d48435e7
6 changed files with 128 additions and 103 deletions
Download patch file Download diff file Expand all files Collapse all files

15
common/src/app/common/svg/shapes_builder.cljc
View file

@ -22,6 +22,7 @@
[app.common.svg :as csvg]
[app.common.svg.path :as path]
[app.common.types.shape :as cts]
[app.common.uuid :as uuid]
[cuerdas.core :as str]))
(def default-rect
@ -78,10 +79,11 @@
(declare parse-svg-element)
(defn create-svg-shapes
[svg-data {:keys [x y]} objects frame-id parent-id selected center?]
([svg-data pos objects frame-id parent-id selected center?]
(create-svg-shapes (uuid/next) svg-data pos objects frame-id parent-id selected center?))
([id svg-data {:keys [x y]} objects frame-id parent-id selected center?]
(let [[vb-x vb-y vb-width vb-height] (svg-dimensions svg-data)
unames (cfh/get-used-names objects)
svg-name (str/replace (:name svg-data) ".svg" "")
@ -125,7 +127,7 @@
(assoc :defs def-nodes)
(assoc :content (into [background] (:content svg-data))))
root-shape (create-svg-root frame-id parent-id svg-data)
root-shape (create-svg-root id frame-id parent-id svg-data)
root-id (:id root-shape)
;; Create the root shape
@ -138,7 +140,7 @@
(d/enumerate (->> (:content svg-data)
(mapv #(csvg/inherit-attributes root-attrs %)))))]
[root-shape children]))
[root-shape children])))
(defn create-raw-svg
[name frame-id {:keys [x y width height offset-x offset-y]} {:keys [attrs] :as data}]
@ -157,12 +159,13 @@
:svg-viewbox vbox})))
(defn create-svg-root
[frame-id parent-id {:keys [name x y width height offset-x offset-y attrs]}]
[id frame-id parent-id {:keys [name x y width height offset-x offset-y attrs]}]
(let [props (-> (dissoc attrs :viewBox :view-box :xmlns)
(d/without-keys csvg/inheritable-props)
(csvg/attrs->props))]
(cts/setup-shape
{:type :group
{:id id
:type :group
:name name
:frame-id frame-id
:parent-id parent-id

2
frontend/src/app/main/data/workspace/groups.cljs
View file

@ -203,7 +203,7 @@
ptk/WatchEvent
(watch [_ state _]
(let [selected (wsh/lookup-selected state)]
(rx/of group-shapes nil selected)))))
(rx/of (group-shapes nil selected))))))
(defn ungroup-shapes
[ids & {:keys [change-selection?] :or {change-selection? false}}]

9
frontend/src/app/main/data/workspace/media.cljs
View file

@ -459,3 +459,12 @@
(rx/tap on-success)
(rx/catch on-error)
(rx/finalize #(st/emit! (msg/hide-tag :media-loading)))))))))
(defn create-svg-shape
[id name svg-string position]
(ptk/reify ::create-svg-shape
ptk/WatchEvent
(watch [_ _ _]
(->> (svg->clj [name svg-string])
(rx/take 1)
(rx/map #(svg/add-svg-shapes id % position {:change-selection? false}))))))

17
frontend/src/app/main/data/workspace/svg_upload.cljs
View file

@ -13,6 +13,7 @@
[app.common.svg :as csvg]
[app.common.svg.shapes-builder :as csvg.shapes-builder]
[app.common.types.shape-tree :as ctst]
[app.common.uuid :as uuid]
[app.main.data.workspace.changes :as dch]
[app.main.data.workspace.selection :as dws]
[app.main.data.workspace.state-helpers :as wsh]
@ -60,12 +61,16 @@
(rx/reduce conj {})))
(defn add-svg-shapes
[svg-data position]
([svg-data position]
(add-svg-shapes nil svg-data position nil))
([id svg-data position {:keys [change-selection?] :or {change-selection? false}}]
(ptk/reify ::add-svg-shapes
ptk/WatchEvent
(watch [it state _]
(try
(let [page-id (:current-page-id state)
(let [id (d/nilv id (uuid/next))
page-id (:current-page-id state)
objects (wsh/lookup-page-objects state page-id)
frame-id (ctst/top-nested-frame objects position)
selected (wsh/lookup-selected state)
@ -80,7 +85,7 @@
(:parent-id base))
[new-shape new-children]
(csvg.shapes-builder/create-svg-shapes svg-data position objects frame-id parent-id selected true)
(csvg.shapes-builder/create-svg-shapes id svg-data position objects frame-id parent-id selected true)
changes (-> (pcb/empty-changes it page-id)
(pcb/with-objects objects)
@ -101,11 +106,13 @@
(rx/of (dwu/start-undo-transaction undo-id)
(dch/commit-changes changes)
(dws/select-shapes (d/ordered-set (:id new-shape)))
(when change-selection?
(dws/select-shapes (d/ordered-set (:id new-shape))))
(ptk/data-event :layout/update {:ids [(:id new-shape)]})
(dwu/commit-undo-transaction undo-id)))
(catch :default cause
(js/console.log (.-stack cause))
(rx/throw {:type :svg-parser
:data cause}))))))
:data cause})))))))

10
frontend/src/app/plugins/api.cljs
View file

@ -9,6 +9,7 @@
(:require
[app.common.data.macros :as dm]
[app.common.files.changes-builder :as cb]
[app.common.geom.point :as gpt]
[app.common.record :as cr]
[app.common.types.shape :as cts]
[app.common.uuid :as uuid]
@ -127,7 +128,14 @@
(createRectangle
[_]
(create-shape :rect))
)
(createShapeFromSvg
[_ svg-string]
(let [id (uuid/next)
page-id (:current-page-id @st/state)]
(st/emit! (dwm/create-svg-shape id "svg" svg-string (gpt/point 0 0)))
(shape/data->shape-proxy
(dm/get-in @st/state [:workspace-data :pages-index page-id :objects id])))))
(defn create-context
[]

10
frontend/src/app/plugins/shape.cljs
View file

@ -67,12 +67,12 @@
(appendChild [self child]
(let [parent-id (get-data self :id)
child-id (uuid/uuid (obj/get child "id"))]
(st/emit! (udw/relocate-shapes #{ child-id } parent-id 0))))
(st/emit! (udw/relocate-shapes #{child-id} parent-id 0))))
(insertChild [self index child]
(let [parent-id (get-data self :id)
child-id (uuid/uuid (obj/get child "id"))]
(st/emit! (udw/relocate-shapes #{ child-id } parent-id index)))))
(st/emit! (udw/relocate-shapes #{child-id} parent-id index)))))
(crc/define-properties!
ShapeProxy
@ -124,16 +124,14 @@
:set (fn [self value]
(let [id (get-data self :id)
value (mapv #(utils/from-js %) value)]
(st/emit! (dwc/update-shapes [id] #(assoc % :fills value)))))
}
(st/emit! (dwc/update-shapes [id] #(assoc % :fills value)))))}
{:name "strokes"
:get #(get-state % :strokes make-strokes)
:set (fn [self value]
(let [id (get-data self :id)
value (mapv #(utils/from-js %) value)]
(st/emit! (dwc/update-shapes [id] #(assoc % :strokes value)))))
})
(st/emit! (dwc/update-shapes [id] #(assoc % :strokes value)))))})
(cond-> (or (cfh/frame-shape? data) (cfh/group-shape? data) (cfh/svg-raw-shape? data) (cfh/bool-shape? data))
(crc/add-properties!