diff --git a/frontend/src/app/main/ui/workspace/colorpicker.cljs b/frontend/src/app/main/ui/workspace/colorpicker.cljs index 9328a11446..dbd0da26a9 100644 --- a/frontend/src/app/main/ui/workspace/colorpicker.cljs +++ b/frontend/src/app/main/ui/workspace/colorpicker.cljs @@ -268,16 +268,17 @@ (when (:image current-color) [:img {:src uri}])] - [:div {:class (stl/css :checkbox-option)} - [:label {:for "keep-aspect-ratio" - :class (stl/css-case :global/checked keep-aspect-ratio?)} - [:span {:class (stl/css-case :global/checked keep-aspect-ratio?)} - (when keep-aspect-ratio? i/status-tick-refactor)] - (tr "media.keep-aspect-ratio") - [:input {:type "checkbox" - :id "keep-aspect-ratio" - :checked keep-aspect-ratio? - :on-change handle-change-keep-aspect-ratio}]]] + (when (some? (:image current-color)) + [:div {:class (stl/css :checkbox-option)} + [:label {:for "keep-aspect-ratio" + :class (stl/css-case :global/checked keep-aspect-ratio?)} + [:span {:class (stl/css-case :global/checked keep-aspect-ratio?)} + (when keep-aspect-ratio? i/status-tick-refactor)] + (tr "media.keep-aspect-ratio") + [:input {:type "checkbox" + :id "keep-aspect-ratio" + :checked keep-aspect-ratio? + :on-change handle-change-keep-aspect-ratio}]]]) [:button {:class (stl/css :choose-image) :title (tr "media.choose-image") diff --git a/frontend/src/app/worker/import.cljs b/frontend/src/app/worker/import.cljs index f43df1cf24..2130ff4147 100644 --- a/frontend/src/app/worker/import.cljs +++ b/frontend/src/app/worker/import.cljs @@ -347,7 +347,12 @@ (->> (upload-media-files context file-id name (:href image-data)) (rx/catch #(do (.error js/console "Error uploading media: " name) (rx/of node))) - (rx/map #(vector (:id image-data) %))))) + (rx/map (fn [data] + (let [data + (cond-> data + (some? (:keep-aspect-ratio image-data)) + (assoc :keep-aspect-ratio (:keep-aspect-ratio image-data)))] + [(:id image-data) data])))))) (rx/reduce (fn [acc [id data]] (assoc acc id data)) {}) (rx/map (fn [images] @@ -360,7 +365,8 @@ (assoc-in [:attrs :penpot:media-width] (:width media)) (assoc-in [:attrs :penpot:media-height] (:height media)) (assoc-in [:attrs :penpot:media-mtype] (:mtype media)) - + (cond-> (some? (:keep-aspect-ratio media)) + (assoc-in [:attrs :penpot:media-keep-aspect-ratio] (:keep-aspect-ratio 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)) diff --git a/frontend/src/app/worker/import/parser.cljs b/frontend/src/app/worker/import/parser.cljs index 90ba834afa..017a87710a 100644 --- a/frontend/src/app/worker/import/parser.cljs +++ b/frontend/src/app/worker/import/parser.cljs @@ -195,15 +195,22 @@ (d/deep-mapm (fn [pair] (->> pair (mapv convert))))))) -(def search-data-node? #{:rect :image :path :circle}) +(def search-data-node? #{:rect :path :circle}) (defn get-svg-data [type node] - (let [node-attrs (add-attrs {} (:attrs node))] (cond (search-data-node? type) - (let [data-tags #{:ellipse :rect :path :text :foreignObject :image}] + (let [data-tags #{:ellipse :rect :path :text :foreignObject}] + (->> node + (node-seq) + (filter #(contains? data-tags (:tag %))) + (map #(:attrs %)) + (reduce add-attrs node-attrs))) + + (= type :image) + (let [data-tags #{:rect :image}] (->> node (node-seq) (filter #(contains? data-tags (:tag %))) @@ -523,7 +530,8 @@ (let [metadata {:id (get-meta node :media-id) :width (get-meta node :media-width) :height (get-meta node :media-height) - :mtype (get-meta node :media-mtype)}] + :mtype (get-meta node :media-mtype) + :keep-aspect-ratio (get-meta node :media-keep-aspect-ratio str->bool)}] (cond-> props (= type :image) (assoc :metadata metadata) @@ -881,7 +889,8 @@ (let [id (get-in fill-node [:attrs :penpot:fill-image-id]) image-node (->> node (node-seq) (find-node-by-id id))] {:id id - :href (get-in image-node [:attrs :href])}))) + :href (get-in image-node [:attrs :href]) + :keep-aspect-ratio (not= (get-in image-node [:attrs :preserveAspectRatio]) "none")}))) (filterv #(some? (:id %)))))) (defn has-fill-images?