Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-03-19 19:21:23 -05:00
Code Issues Activity

🐛 Import svg with exterior stroke

Browse source
This commit is contained in:
Alejandro Alonso 2022-04-13 07:22:54 +02:00 • committed by Alonso Torres
parent 9856da4a1f
commit 814042909a
4 changed files with 33 additions and 27 deletions
frontend/src/app
main
data/workspace
svg_upload.cljs
render.cljs
ui/shapes
svg_defs.cljs
render.cljs

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

@ -74,6 +74,7 @@
;; Color present as attribute
(uc/color? (str/trim (get-in shape [:svg-attrs :fill])))
(-> (update :svg-attrs dissoc :fill)
(update-in [:svg-attrs :style] dissoc :fill)
(assoc-in [:fills 0 :fill-color] (-> (get-in shape [:svg-attrs :fill])
(str/trim)
(uc/parse-color))))
@ -81,17 +82,20 @@
;; Color present as style
(uc/color? (str/trim (get-in shape [:svg-attrs :style :fill])))
(-> (update-in [:svg-attrs :style] dissoc :fill)
(update :svg-attrs dissoc :fill)
(assoc-in [:fills 0 :fill-color] (-> (get-in shape [:svg-attrs :style :fill])
(str/trim)
(uc/parse-color))))
(get-in shape [:svg-attrs :fill-opacity])
(-> (update :svg-attrs dissoc :fill-opacity)
(update-in [:svg-attrs :style] dissoc :fill-opacity)
(assoc-in [:fills 0 :fill-opacity] (-> (get-in shape [:svg-attrs :fill-opacity])
(d/parse-double))))
(get-in shape [:svg-attrs :style :fill-opacity])
(-> (update-in [:svg-attrs :style] dissoc :fill-opacity)
(update :svg-attrs dissoc :fill-opacity)
(assoc-in [:fills 0 :fill-opacity] (-> (get-in shape [:svg-attrs :style :fill-opacity])
(d/parse-double))))))

18
frontend/src/app/main/render.cljs
View file

@ -362,19 +362,15 @@
(mf/defc object-svg
{::mf/wrap [mf/memo]}
[{:keys [objects object zoom render-texts? render-embed?]
:or {zoom 1 render-embed? false}
[{:keys [objects object-id render-texts? render-embed?]
:or {render-embed? false}
:as props}]
(let [object (cond-> object
(let [object (get objects object-id)
object (cond-> object
(:hide-fill-on-export object)
(assoc :fills []))
obj-id (:id object)
x (* (:x object) zoom)
y (* (:y object) zoom)
width (* (:width object) zoom)
height (* (:height object) zoom)
{:keys [x y width height]} (get-object-bounds objects object-id)
vbox (dm/str x " " y " " width " " height)
frame-wrapper
@ -393,7 +389,7 @@
render-texts? (and render-texts? (d/seek (comp nil? :position-data) text-shapes))]
[:& (mf/provider embed/context) {:value render-embed?}
[:svg {:id (dm/str "screenshot-" obj-id)
[:svg {:id (dm/str "screenshot-" object-id)
:view-box vbox
:width width
:height height
@ -405,7 +401,7 @@
:style {:-webkit-print-color-adjust :exact}
:fill "none"}
(let [shapes (cph/get-children objects obj-id)]
(let [shapes (cph/get-children objects object-id)]
[:& ff/fontfaces-style {:shapes shapes}])
(case (:type object)

18
frontend/src/app/main/ui/shapes/svg_defs.cljs
View file

@ -6,8 +6,10 @@
(ns app.main.ui.shapes.svg-defs
(:require
[app.common.data :as d]
[app.common.data.macros :as dm]
[app.common.geom.matrix :as gmt]
[app.common.geom.shapes :as gsh]
[app.main.ui.shapes.filters :as f]
[app.util.object :as obj]
[app.util.svg :as usvg]
@ -60,7 +62,8 @@
transform-gradient? (add-matrix :gradientTransform transform)
transform-pattern? (add-matrix :patternTransform transform)
transform-clippath? (add-matrix :transform transform)
(or transform-filter? transform-mask?) (merge bounds)))
(or transform-filter?
transform-mask?) (merge bounds)))
[wrapper wrapper-props] (if (= tag :mask)
["g" #js {:className "svg-mask-wrapper"
@ -75,6 +78,16 @@
:transform transform
:bounds bounds}])]])))
(defn svg-def-bounds [svg-def shape transform]
(let [{:keys [tag]} svg-def]
(if (or (= tag :mask) (contains? usvg/filter-tags tag))
(-> (gsh/make-rect (d/parse-double (get-in svg-def [:attrs :x]))
(d/parse-double (get-in svg-def [:attrs :y]))
(d/parse-double (get-in svg-def [:attrs :width]))
(d/parse-double (get-in svg-def [:attrs :height])))
(gsh/transform-rect transform))
(f/get-filters-bounds shape))))
(mf/defc svg-defs [{:keys [shape render-id]}]
(let [svg-defs (:svg-defs shape)
@ -101,5 +114,4 @@
:node svg-def
:prefix-id prefix-id
:transform transform
:bounds (f/get-filters-bounds shape)}]))))
:bounds (svg-def-bounds svg-def shape transform)}]))))

20
frontend/src/app/render.cljs
View file

@ -112,11 +112,9 @@
(st/emit! (df/fonts-fetched fonts)))))
(rx/map (comp :objects second))
(rx/map (fn [objects]
(let [objects (render/adapt-objects-for-shape objects object-id)
bounds (render/get-object-bounds objects object-id)
object (get objects object-id)]
(let [objects (render/adapt-objects-for-shape objects object-id)]
{:objects objects
:object (merge object bounds)}))))))
:object object-id}))))))
{:keys [objects object]} (use-resource fetch-state)]
@ -132,10 +130,9 @@
(when objects
[:& render/object-svg
{:objects objects
:object object
:object-id object-id
:render-embed? render-embed?
:render-texts? render-texts?
:zoom 1}])))
:render-texts? render-texts?}])))
(mf/defc objects-svg
[{:keys [page-id file-id object-ids render-embed? render-texts?]}]
@ -155,16 +152,13 @@
(when objects
(for [object-id object-ids]
(let [objects (render/adapt-objects-for-shape objects object-id)
bounds (render/get-object-bounds objects object-id)
object (merge (get objects object-id) bounds)]
(let [objects (render/adapt-objects-for-shape objects object-id)]
[:& render/object-svg
{:objects objects
:key (str object-id)
:object object
:object-id object-id
:render-embed? render-embed?
:render-texts? render-texts?
:zoom 1}])))))
:render-texts? render-texts?}])))))
(s/def ::page-id ::us/uuid)
(s/def ::file-id ::us/uuid)