Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-03-13 08:11:30 -05:00
Code Issues Activity

✨ Fix problems with export/import

Browse source
This commit is contained in:
alonso.torres 2022-02-21 11:55:53 +01:00
parent 3228582cbe
commit 82c6b8daae
4 changed files with 68 additions and 53 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
frontend/src/app/main/ui/shapes/export.cljs
View file

@ -109,7 +109,8 @@
(cond-> text?
(-> (add! :grow-type)
(add! :content (comp json/encode uuid->string))))
(add! :content (comp json/encode uuid->string))
(add! :position-data (comp json/encode uuid->string))))
(cond-> mask?
(obj/set! "penpot:masked-group" "true"))
@ -138,19 +139,20 @@
(into {} (map prefix-entry) m)))
(defn- export-grid-data [{:keys [grids]}]
(mf/html
[:> "penpot:grids" #js {}
(for [{:keys [type display params]} grids]
(let [props (->> (dissoc params :color)
(prefix-keys)
(clj->js))]
[:> "penpot:grid"
(-> props
(obj/set! "penpot:color" (get-in params [:color :color]))
(obj/set! "penpot:opacity" (get-in params [:color :opacity]))
(obj/set! "penpot:type" (d/name type))
(cond-> (some? display)
(obj/set! "penpot:display" (str display))))]))]))
(when (d/not-empty? grids)
(mf/html
[:> "penpot:grids" #js {}
(for [{:keys [type display params]} grids]
(let [props (->> (dissoc params :color)
(prefix-keys)
(clj->js))]
[:> "penpot:grid"
(-> props
(obj/set! "penpot:color" (get-in params [:color :color]))
(obj/set! "penpot:opacity" (get-in params [:color :opacity]))
(obj/set! "penpot:type" (d/name type))
(cond-> (some? display)
(obj/set! "penpot:display" (str display))))]))])))
(mf/defc export-flows
[{:keys [flows]}]

42
frontend/src/app/main/ui/shapes/text/svg_text.cljs
View file

@ -23,9 +23,15 @@
[props]
(let [render-id (mf/use-ctx muc/render-ctx)
{:keys [position-data] :as shape} (obj/get props "shape")
{:keys [x y width height position-data] :as shape} (obj/get props "shape")
transform (str (gsh/transform-matrix shape))
group-props (-> #js {:transform transform}
;; These position attributes are not really necesary but they are convenient for for the export
group-props (-> #js {:transform transform
:x x
:y y
:width width
:height height}
(attrs/add-style-attrs shape render-id))
get-gradient-id
(fn [index]
@ -40,21 +46,21 @@
:attr :fill-color-gradient
:shape data}]))])
[:& shape-custom-stroke {:shape shape}
[:> :g group-props
(for [[index data] (d/enumerate position-data)]
(let [props (-> #js {:x (:x data)
:y (:y data)
:dominantBaseline "ideographic"
:style (-> #js {:fontFamily (:font-family data)
:fontSize (:font-size data)
:fontWeight (:font-weight data)
:textTransform (:text-transform data)
:textDecoration (:text-decoration data)
:fontStyle (:font-style data)
:direction (if (:rtl? data) "rtl" "ltr")
:whiteSpace "pre"}
(attrs/add-fill data (get-gradient-id index)))})]
[:> :text props (:text data)]))]]]))
[:> :g group-props
(for [[index data] (d/enumerate position-data)]
(let [props (-> #js {:x (:x data)
:y (:y data)
:dominantBaseline "ideographic"
:style (-> #js {:fontFamily (:font-family data)
:fontSize (:font-size data)
:fontWeight (:font-weight data)
:textTransform (:text-transform data)
:textDecoration (:text-decoration data)
:fontStyle (:font-style data)
:direction (if (:rtl? data) "rtl" "ltr")
:whiteSpace "pre"}
(attrs/add-fill data (get-gradient-id index)))})]
[:& shape-custom-stroke {:shape shape}
[:> :text props (:text data)]]))]]))

35
frontend/src/app/main/ui/workspace/shapes/text.cljs
View file

@ -178,26 +178,25 @@
(mf/use-layout-effect
(mf/deps show-svg-text?)
(fn []
(let []
(when-not show-svg-text?
;; There is no position data we need to calculate it even if no change has happened
;; this usualy happens the first time a text is rendered
(let [update-data
(fn update-data []
(let [node (mf/ref-val node-ref)]
(if (some? node)
(let [position-data (utp/calc-position-data node)]
(reset! local-position-data position-data))
(when-not show-svg-text?
;; There is no position data we need to calculate it even if no change has happened
;; this usualy happens the first time a text is rendered
(let [update-data
(fn update-data []
(let [node (mf/ref-val node-ref)]
(if (some? node)
(let [position-data (utp/calc-position-data node)]
(reset! local-position-data position-data))
;; No node present, we need to keep waiting
(do (when-let [sid (mf/ref-val sid-ref)] (rx/dispose! sid))
(when-not @local-position-data
(mf/set-ref-val! sid-ref (timers/schedule 100 update-data)))))))]
(mf/set-ref-val! sid-ref (timers/schedule 100 update-data))))
;; No node present, we need to keep waiting
(do (when-let [sid (mf/ref-val sid-ref)] (rx/dispose! sid))
(when-not @local-position-data
(mf/set-ref-val! sid-ref (timers/schedule 100 update-data)))))))]
(mf/set-ref-val! sid-ref (timers/schedule 100 update-data))))
(fn []
(when-let [sid (mf/ref-val sid-ref)]
(rx/dispose! sid))))))
(fn []
(when-let [sid (mf/ref-val sid-ref)]
(rx/dispose! sid)))))
[:> shape-container {:shape shape}
;; We keep hidden the shape when we're editing so it keeps track of the size

14
frontend/src/app/util/import/parser.cljs
View file

@ -185,7 +185,7 @@
(d/deep-mapm
(fn [pair] (->> pair (mapv convert)))))))
(def search-data-node? #{:rect :image :path :text :circle})
(def search-data-node? #{:rect :image :path :circle})
(defn get-svg-data
[type node]
@ -200,6 +200,13 @@
(map #(:attrs %))
(reduce add-attrs node-attrs)))
(= type :text)
(->> node
(node-seq)
(filter #(contains? #{:g :foreignObject} (:tag %)))
(map #(:attrs %))
(reduce add-attrs node-attrs))
(= type :frame)
(let [svg-node (->> node :content (d/seek #(= "frame-background" (get-in % [:attrs :class]))))]
(merge (add-attrs {} (:attrs svg-node)) node-attrs))
@ -481,8 +488,9 @@
(defn add-text-data
[props node]
(-> props
(assoc :grow-type (get-meta node :grow-type keyword))
(assoc :content (get-meta node :content (comp string->uuid json/decode)))))
(assoc :grow-type (get-meta node :grow-type keyword))
(assoc :content (get-meta node :content (comp string->uuid json/decode)))
(assoc :position-data (get-meta node :position-data (comp string->uuid json/decode)))))
(defn add-group-data
[props node]