From 47a4c6b0c11c974db0ecfbdd6f4cace9adfdff24 Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Wed, 24 Jan 2024 12:22:12 +0100 Subject: [PATCH 1/9] :bug: Fix problem uploading svg files into assets --- .../src/app/main/data/workspace/media.cljs | 36 ++++++++++++++++--- 1 file changed, 32 insertions(+), 4 deletions(-) diff --git a/frontend/src/app/main/data/workspace/media.cljs b/frontend/src/app/main/data/workspace/media.cljs index d3b18e1a63..58b8c7736b 100644 --- a/frontend/src/app/main/data/workspace/media.cljs +++ b/frontend/src/app/main/data/workspace/media.cljs @@ -6,6 +6,7 @@ (ns app.main.data.workspace.media (:require + [app.common.data :as d] [app.common.data.macros :as dm] [app.common.exceptions :as ex] [app.common.files.builder :as fb] @@ -308,9 +309,37 @@ process-svg (fn [svg-data] - (let [[shape children] - (csvg.shapes-builder/create-svg-shapes svg-data pos objects uuid/zero nil #{} false)] - [shape children]))] + (let [[root-svg-shape children] + (csvg.shapes-builder/create-svg-shapes svg-data pos objects uuid/zero nil #{} false) + + frame-shape + (cts/setup-shape + {:type :frame + :x (:x pos) + :y (:y pos) + :width (-> root-svg-shape :selrect :width) + :height (-> root-svg-shape :selrect :height) + :name (:name root-svg-shape) + :frame-id uuid/zero + :parent-id uuid/zero + :fills []}) + + root-svg-shape + (-> root-svg-shape + (assoc :frame-id (:id frame-shape) :parent-id (:id frame-shape))) + + shapes + (->> children + (filter #(= (:parent-id %) (:id root-svg-shape))) + (mapv :id)) + + root-svg-shape + (assoc root-svg-shape :shapes shapes) + + children (->> children (mapv #(assoc % :frame-id (:id frame-shape)))) + children (d/concat-vec [root-svg-shape] children)] + + [frame-shape children]))] (->> (upload-images svg-data) (rx/map process-svg)))) @@ -427,4 +456,3 @@ (rx/tap on-success) (rx/catch on-error) (rx/finalize #(st/emit! (msg/hide-tag :media-loading))))))))) - From 582ae6a85065e98a1d8df08302c45c8d9ea43a48 Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Wed, 24 Jan 2024 13:23:34 +0100 Subject: [PATCH 2/9] :bug: Fix problem with menu and proportional scaling --- frontend/src/app/main/ui/workspace/left_header.cljs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/app/main/ui/workspace/left_header.cljs b/frontend/src/app/main/ui/workspace/left_header.cljs index c5d57c29dc..f8c1bf53ce 100644 --- a/frontend/src/app/main/ui/workspace/left_header.cljs +++ b/frontend/src/app/main/ui/workspace/left_header.cljs @@ -179,7 +179,7 @@ :on-key-down (fn [event] (when (kbd/enter? event) (toggle-flag event))) - :data-test "scale.-text" + :data-test "scale-text" :id "file-menu-scale-text"} [:span {:class (stl/css :item-name)} (if (contains? layout :scale-text) From a0426d14cc9a0c9aceac66058b4ee9f7d1456fd5 Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Wed, 24 Jan 2024 13:26:04 +0100 Subject: [PATCH 3/9] :lipstick: Remove red debug background --- frontend/resources/styles/debug.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/frontend/resources/styles/debug.scss b/frontend/resources/styles/debug.scss index dda48e1fc0..53abcb8ebf 100644 --- a/frontend/resources/styles/debug.scss +++ b/frontend/resources/styles/debug.scss @@ -10,6 +10,5 @@ // debugging. body { - background-color: red; color: yellow; } From 7ddfdb1e15e4001b7d28a3e5c8c94fa3efefbac4 Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Wed, 24 Jan 2024 13:36:02 +0100 Subject: [PATCH 4/9] :bug: Fix grid layout controls being clipped by scroll --- .../src/app/main/ui/workspace/viewport.cljs | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/frontend/src/app/main/ui/workspace/viewport.cljs b/frontend/src/app/main/ui/workspace/viewport.cljs index 23c5714e81..41cb816869 100644 --- a/frontend/src/app/main/ui/workspace/viewport.cljs +++ b/frontend/src/app/main/ui/workspace/viewport.cljs @@ -377,8 +377,8 @@ [:clipPath {:id "clip-handlers"} [:rect {:x (+ (:x vbox) rule-area-size) :y (+ (:y vbox) rule-area-size) - :width (max 0 (- (:width vbox) (* rule-area-size 2))) - :height (max 0 (- (:height vbox) (* rule-area-size 2)))}]]] + :width (max 0 (- (:width vbox) rule-area-size)) + :height (max 0 (- (:height vbox) rule-area-size))}]]] [:g {:style {:pointer-events (if disable-events? "none" "auto")}} (when show-text-editor? @@ -539,12 +539,6 @@ [:& presence/active-cursors {:page-id page-id}]) - [:& scroll-bars/viewport-scrollbars - {:objects base-objects - :zoom zoom - :vbox vbox - :bottom-padding (when palete-size (+ palete-size 8))}] - (when-not hide-ui? [:& rules/rules {:zoom zoom @@ -637,4 +631,10 @@ :objects base-objects :modifiers modifiers :shape frame - :view-only true}]))]]]])) + :view-only true}])) + + [:& scroll-bars/viewport-scrollbars + {:objects base-objects + :zoom zoom + :vbox vbox + :bottom-padding (when palete-size (+ palete-size 8))}]]]]])) From 46b767ab0b5534ed577595674a8af1cb4acc3efc Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Wed, 24 Jan 2024 14:29:36 +0100 Subject: [PATCH 5/9] :bug: Fix fast moving drawing and snap interaction --- frontend/src/app/main/data/workspace/drawing/box.cljs | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/frontend/src/app/main/data/workspace/drawing/box.cljs b/frontend/src/app/main/data/workspace/drawing/box.cljs index 1823ebd223..6eab07265d 100644 --- a/frontend/src/app/main/data/workspace/drawing/box.cljs +++ b/frontend/src/app/main/data/workspace/drawing/box.cljs @@ -129,6 +129,9 @@ (->> ms/mouse-position (rx/filter #(> (gpt/distance % initial) (/ 2 zoom))) + ;; Take until before the snap calculation otherwise we could cancel the snap in the worker + ;; and its a problem for fast moving drawing + (rx/take-until stoper) (rx/with-latest-from ms/mouse-position-shift ms/mouse-position-mod) (rx/switch-map (fn [[point :as current]] @@ -136,8 +139,7 @@ (rx/map (partial array/conj current))))) (rx/map (fn [[_ shift? mod? point]] - #(update-drawing % initial (cond-> point snap-pixel? (gpt/round-step snap-prec)) shift? mod?))))) - (rx/take-until stoper)) + #(update-drawing % initial (cond-> point snap-pixel? (gpt/round-step snap-prec)) shift? mod?)))))) (->> (rx/of (common/handle-finish-drawing)) (rx/delay 100))))))) From 50774bebb390fdb1eb4d33307830a1f219a67f22 Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Wed, 24 Jan 2024 14:44:48 +0100 Subject: [PATCH 6/9] :bug: Fix problem with gradient and rotations in booleans --- frontend/src/app/main/ui/shapes/bool.cljs | 15 +++++++-------- frontend/src/app/main/ui/shapes/fills.cljs | 2 +- 2 files changed, 8 insertions(+), 9 deletions(-) diff --git a/frontend/src/app/main/ui/shapes/bool.cljs b/frontend/src/app/main/ui/shapes/bool.cljs index 7f378244f1..29308eebab 100644 --- a/frontend/src/app/main/ui/shapes/bool.cljs +++ b/frontend/src/app/main/ui/shapes/bool.cljs @@ -18,19 +18,19 @@ (mf/fnc bool-shape {::mf/wrap-props false} [props] - (let [shape (unchecked-get props "shape") - children (unchecked-get props "childs") - children (h/use-equal-memo children) + (let [shape (unchecked-get props "shape") + child-objs (unchecked-get props "childs") + child-objs (h/use-equal-memo child-objs) metadata? (mf/use-ctx use/include-metadata-ctx) - content (mf/with-memo [shape children] + content (mf/with-memo [shape child-objs] (let [content (:bool-content shape)] (cond (some? content) content - (some? children) - (gsh/calc-bool-content shape children)))) + (some? child-objs) + (gsh/calc-bool-content shape child-objs)))) shape (mf/with-memo [shape content] (assoc shape :content content))] @@ -40,9 +40,8 @@ [:& path-shape {:shape shape}]) (when metadata? - ;; FIXME: get children looks wrong [:> "penpot:bool" {} - (for [item (map #(get children %) (:shapes shape))] + (for [item (map #(get child-objs %) (:shapes shape))] [:& shape-wrapper {:shape item :key (dm/str (dm/get-prop item :id))}])])]))) diff --git a/frontend/src/app/main/ui/shapes/fills.cljs b/frontend/src/app/main/ui/shapes/fills.cljs index 0abc32400e..518222bcff 100644 --- a/frontend/src/app/main/ui/shapes/fills.cljs +++ b/frontend/src/app/main/ui/shapes/fills.cljs @@ -58,7 +58,7 @@ :width width :height height} - pat-props (if (= :path type) + pat-props (if (or (= :path type) (= :bool type)) (obj/set! pat-props "patternTransform" transform) pat-props)] From c8593b1c18ce38092f17bee102a94e2475ec1ca6 Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Wed, 24 Jan 2024 16:38:01 +0100 Subject: [PATCH 7/9] :bug: Fix get name from file when importing --- backend/src/app/rpc/commands/binfile.clj | 11 ++++++++--- frontend/src/app/worker/import.cljs | 5 ++++- 2 files changed, 12 insertions(+), 4 deletions(-) diff --git a/backend/src/app/rpc/commands/binfile.clj b/backend/src/app/rpc/commands/binfile.clj index ebebbc42f8..206b8931a3 100644 --- a/backend/src/app/rpc/commands/binfile.clj +++ b/backend/src/app/rpc/commands/binfile.clj @@ -728,10 +728,11 @@ (defmethod read-section :v1/files - [{:keys [::db/conn ::input ::project-id ::enabled-features ::timestamp ::overwrite?] :as system}] + [{:keys [::db/conn ::input ::project-id ::enabled-features ::timestamp ::overwrite? ::name] :as system}] - (doseq [expected-file-id (-> *state* deref :files)] + (doseq [[idx expected-file-id] (d/enumerate (-> *state* deref :files))] (let [file (read-obj! input) + media (read-obj! input) file-id (:id file) @@ -770,6 +771,8 @@ (let [file (-> file (assoc :id file-id') + (cond-> (and (= idx 0) (some? name)) + (assoc :name name)) (process-file)) ;; All features that are enabled and requires explicit migration are @@ -1105,6 +1108,7 @@ schema:import-binfile (sm/define [:map {:title "import-binfile"} + [:name :string] [:project-id ::sm/uuid] [:file ::media/upload]])) @@ -1116,12 +1120,13 @@ ::webhooks/event? true ::sse/stream? true ::sm/params schema:import-binfile} - [{:keys [::db/pool] :as cfg} {:keys [::rpc/profile-id project-id file] :as params}] + [{:keys [::db/pool] :as cfg} {:keys [::rpc/profile-id name project-id file] :as params}] (projects/check-read-permissions! pool profile-id project-id) (let [params (-> cfg (assoc ::input (:path file)) (assoc ::project-id project-id) (assoc ::profile-id profile-id) + (assoc ::name name) (assoc ::ignore-index-errors? true))] (with-meta (sse/response #(import-binfile params)) diff --git a/frontend/src/app/worker/import.cljs b/frontend/src/app/worker/import.cljs index b1db05f9d1..daea0c2419 100644 --- a/frontend/src/app/worker/import.cljs +++ b/frontend/src/app/worker/import.cljs @@ -728,7 +728,10 @@ :method :get}) (rx/map :body) (rx/mapcat (fn [file] - (->> (rp/cmd! ::sse/import-binfile {:file file :project-id project-id}) + (->> (rp/cmd! ::sse/import-binfile + {:name (str/replace (:name data) #".penpot$" "") + :file file + :project-id project-id}) (rx/tap (fn [event] (let [payload (sse/get-payload event) type (sse/get-type event)] From 919f6d246bc8be79efe5eb5b24570e5c220b0fad Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Thu, 25 Jan 2024 12:14:49 +0100 Subject: [PATCH 8/9] :bug: Fix problem with offset colorpicker in Safari --- .../src/app/main/ui/workspace/viewport/pixel_overlay.cljs | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs b/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs index 1a1b0a9a60..b600551632 100644 --- a/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs +++ b/frontend/src/app/main/ui/workspace/viewport/pixel_overlay.cljs @@ -7,6 +7,7 @@ (ns app.main.ui.workspace.viewport.pixel-overlay (:require [app.common.math :as mth] + [app.config :as cfg] [app.main.data.modal :as modal] [app.main.data.workspace.colors :as dwc] [app.main.data.workspace.undo :as dwu] @@ -99,7 +100,9 @@ ;; I don't know why, but the zoom view is offset by 24px ;; instead of 25. sx (- x 32) - sy (- y 17) + + ;; Safari has a different offset fro the y coord + sy (if (cfg/check-browser? :safari) y (- y 17)) sw 65 sh 35 dx 0 From 9965fbc92bcb3675d3065ecb211b9b70eb1e8471 Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Thu, 25 Jan 2024 17:15:38 +0100 Subject: [PATCH 9/9] :bug: Fix text editor for Safari 17 --- frontend/src/app/config.cljs | 22 +++++++++----- .../main/ui/workspace/shapes/text/editor.cljs | 29 ++++++++++--------- 2 files changed, 29 insertions(+), 22 deletions(-) diff --git a/frontend/src/app/config.cljs b/frontend/src/app/config.cljs index 784386a0bf..c95f72e1a0 100644 --- a/frontend/src/app/config.cljs +++ b/frontend/src/app/config.cljs @@ -22,7 +22,7 @@ ;; --- Auxiliar Functions (def valid-browsers - #{:chrome :firefox :safari :edge :other}) + #{:chrome :firefox :safari :safari-16 :safari-17 :edge :other}) (def valid-platforms #{:windows :linux :macos :other}) @@ -33,13 +33,17 @@ check-chrome? (fn [] (str/includes? user-agent "chrom")) check-firefox? (fn [] (str/includes? user-agent "firefox")) check-edge? (fn [] (str/includes? user-agent "edg")) - check-safari? (fn [] (str/includes? user-agent "safari"))] + check-safari? (fn [] (str/includes? user-agent "safari")) + check-safari-16? (fn [] (and (check-safari?) (str/includes? user-agent "version/16"))) + check-safari-17? (fn [] (and (check-safari?) (str/includes? user-agent "version/17")))] (cond - (check-edge?) :edge - (check-chrome?) :chrome - (check-firefox?) :firefox - (check-safari?) :safari - :else :other))) + (check-edge?) :edge + (check-chrome?) :chrome + (check-firefox?) :firefox + (check-safari-16?) :safari-16 + (check-safari-17?) :safari-17 + (check-safari?) :safari + :else :other))) (defn- parse-platform [] @@ -130,7 +134,9 @@ (defn ^boolean check-browser? [candidate] (dm/assert! (contains? valid-browsers candidate)) - (= candidate browser)) + (if (= candidate :safari) + (contains? #{:safari :safari-16 :safari-17} browser) + (= candidate browser))) (defn ^boolean check-platform? [candidate] (dm/assert! (contains? valid-platforms candidate)) diff --git a/frontend/src/app/main/ui/workspace/shapes/text/editor.cljs b/frontend/src/app/main/ui/workspace/shapes/text/editor.cljs index c229993fda..60e1e0ad91 100644 --- a/frontend/src/app/main/ui/workspace/shapes/text/editor.cljs +++ b/frontend/src/app/main/ui/workspace/shapes/text/editor.cljs @@ -281,7 +281,7 @@ ;; NOTE: this teoretically breaks hooks rules, but in practice ;; it is imposible to really break it maybe-zoom - (when (cf/check-browser? :safari) + (when (cf/check-browser? :safari-16) (mf/deref refs/selected-zoom)) shape (cond-> shape @@ -300,26 +300,27 @@ width (mth/max (dm/get-prop bounds :width) (dm/get-prop shape :width)) height (mth/max (dm/get-prop bounds :height) - (dm/get-prop shape :height))] + (dm/get-prop shape :height)) + + style + (cond-> #js {:pointer-events "all"} + (cf/check-browser? :safari-16) + (obj/merge! + #js {:position "fixed" + :left 0 + :top (- (dm/get-prop shape :y) y) + :transform-origin "top left" + :transform (when (some? maybe-zoom) + (dm/fmt "scale(%)" maybe-zoom))}))] [:g.text-editor {:clip-path (dm/fmt "url(#%)" clip-id) :transform (dm/str (gsh/transform-matrix shape))} [:defs [:clipPath {:id clip-id} - [:rect {:x x - :y y - :width width - :height height - :fill "red"}]]] + [:rect {:x x :y y :width width :height height}]]] [:foreignObject {:x x :y y :width width :height height} - [:div {:style {:position "fixed" - :left 0 - :top (- (dm/get-prop shape :y) y) - :pointer-events "all" - :transform-origin "top left" - :transform (when (some? maybe-zoom) - (dm/fmt "scale(%)" maybe-zoom))}} + [:div {:style style} [:& text-shape-edit-html {:shape shape :key (dm/str shape-id)}]]]]))