Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-04-16 08:51:32 -05:00
Code Issues Activity

🐛 Import a file with image background won't show the background

Browse source
This commit is contained in:
Alejandro Alonso 2022-04-01 08:58:41 +02:00 • committed by Alonso Torres
parent e9e5b07bdb
commit 911d4edb9f
2 changed files with 69 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -405,17 +405,31 @@
[props node svg-data]
(let [fill (:fill svg-data)
hide-fill-on-export (get-meta node :hide-fill-on-export str->bool)
fill-color-ref-id (get-meta node :fill-color-ref-id uuid/uuid)
fill-color-ref-file (get-meta node :fill-color-ref-file uuid/uuid)
gradient (when (str/starts-with? fill "url")
(parse-gradient node fill))]
hide-fill-on-export (get-meta node :hide-fill-on-export str->bool)
fill-color-ref-id (get-meta node :fill-color-ref-id uuid/uuid)
fill-color-ref-file (get-meta node :fill-color-ref-file uuid/uuid)
meta-fill-color (get-meta node :fill-color)
meta-fill-opacity (get-meta node :fill-opacity)
meta-fill-color-gradient (if (str/starts-with? meta-fill-color "url")
(parse-gradient node meta-fill-color)
(get-meta node :fill-color-gradient))
gradient (when (str/starts-with? fill "url")
(parse-gradient node fill))]
(cond-> props
:always
(assoc :fill-color nil
:fill-opacity nil)
(some? meta-fill-color)
(assoc :fill-color meta-fill-color
:fill-opacity (d/parse-double meta-fill-opacity))
(some? meta-fill-color-gradient)
(assoc :fill-color-gradient meta-fill-color-gradient
:fill-color nil
:fill-opacity nil)
(some? gradient)
(assoc :fill-color-gradient gradient
:fill-color nil
@ -775,6 +789,7 @@
(-> node
(find-node :defs)
(find-node :pattern)
(find-node :g)
(find-node :image))]
(or (= type :image)
(some? pattern-image))))
@ -789,12 +804,51 @@
(-> node
(find-node :defs)
(find-node :pattern)
(find-node :g)
(find-node :image)
:attrs)
image-data (get-svg-data :image node)
svg-data (or image-data pattern-data)]
(:xlink:href svg-data)))
(defn get-image-fill
[node]
(let [linear-gradient-node (-> node
(find-node :defs)
(find-node :linearGradient))
radial-gradient-node (-> node
(find-node :defs)
(find-node :radialGradient))
gradient-node (or linear-gradient-node radial-gradient-node)
stops (parse-stops gradient-node)
gradient (cond-> {:stops stops}
(some? linear-gradient-node)
(assoc :type :linear
:start-x (-> linear-gradient-node :attrs :x1 d/parse-double)
:start-y (-> linear-gradient-node :attrs :y1 d/parse-double)
:end-x (-> linear-gradient-node :attrs :x2 d/parse-double)
:end-y (-> linear-gradient-node :attrs :y2 d/parse-double)
:width 1)
(some? radial-gradient-node)
(assoc :type :linear
:start-x (get-meta radial-gradient-node :start-x d/parse-double)
:start-y (get-meta radial-gradient-node :start-y d/parse-double)
:end-x (get-meta radial-gradient-node :end-x d/parse-double)
:end-y (get-meta radial-gradient-node :end-y d/parse-double)
:width (get-meta radial-gradient-node :width d/parse-double)))]
(if (some? (or linear-gradient-node radial-gradient-node))
{:fill-color-gradient gradient}
(-> node
(find-node :defs)
(find-node :pattern)
(find-node :g)
(find-node :rect)
:attrs
:style
parse-style))))
(defn parse-data
[type node]

13
frontend/src/app/worker/import.cljs
View file

@ -300,8 +300,9 @@
(if (and (not (cip/close? node))
(cip/has-image? node))
(let [name (cip/get-image-name node)
data-uri (cip/get-image-data node)]
(->> (upload-media-files context file-id name data-uri)
image-data (cip/get-image-data node)
image-fill (cip/get-image-fill node)]
(->> (upload-media-files context file-id name image-data)
(rx/catch #(do (.error js/console "Error uploading media: " name)
(rx/of node)))
(rx/map
@ -310,7 +311,13 @@
(assoc-in [:attrs :penpot:media-id] (:id media))
(assoc-in [:attrs :penpot:media-width] (:width media))
(assoc-in [:attrs :penpot:media-height] (:height media))
(assoc-in [:attrs :penpot:media-mtype] (:mtype media)))))))
(assoc-in [:attrs :penpot:media-mtype] (:mtype media))
(assoc-in [:attrs :penpot:fill-color] (:fill image-fill))
(assoc-in [:attrs :penpot:fill-color-ref-file] (:fill-color-ref-file image-fill))
(assoc-in [:attrs :penpot:fill-color-ref-id] (:fill-color-ref-id image-fill))
(assoc-in [:attrs :penpot:fill-opacity] (:fill-opacity image-fill))
(assoc-in [:attrs :penpot:fill-color-gradient] (:fill-color-gradient image-fill)))))))
;; If the node is not an image just return the node
(->> (rx/of node)