Merge pull request #502 from penpot/fixes/bugfixing

Bugfixing
This commit is contained in:
Andrey Antukh 2021-01-29 22:52:51 +01:00 committed by GitHub
commit 60ba3eaf03
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 63 additions and 45 deletions

View file

@ -4410,5 +4410,12 @@
"es" : "Pulsar para cerrar la ruta" "es" : "Pulsar para cerrar la ruta"
}, },
"unused" : true "unused" : true
} },
"workspace.options.export.suffix": {
"translations" : {
"en" : "Suffix",
"es" : "Sufijo"
}
}
} }

View file

@ -18,6 +18,7 @@
[app.common.geom.shapes :as geom] [app.common.geom.shapes :as geom]
[app.common.geom.point :as gpt] [app.common.geom.point :as gpt]
[app.common.geom.matrix :as gmt] [app.common.geom.matrix :as gmt]
[app.main.ui.context :as muc]
[app.main.exports :as exports] [app.main.exports :as exports]
[app.main.repo :as repo])) [app.main.repo :as repo]))
@ -65,17 +66,18 @@
#(exports/shape-wrapper-factory objects)) #(exports/shape-wrapper-factory objects))
] ]
[:svg {:id "screenshot" [:& (mf/provider muc/embed-ctx) {:value true}
:view-box vbox [:svg {:id "screenshot"
:width width :view-box vbox
:height height :width width
:version "1.1" :height height
:xmlnsXlink "http://www.w3.org/1999/xlink" :version "1.1"
:xmlns "http://www.w3.org/2000/svg"} :xmlnsXlink "http://www.w3.org/1999/xlink"
(case (:type object) :xmlns "http://www.w3.org/2000/svg"}
:frame [:& frame-wrapper {:shape object :view-box vbox}] (case (:type object)
:group [:& group-wrapper {:shape object}] :frame [:& frame-wrapper {:shape object :view-box vbox}]
[:& shape-wrapper {:shape object}])])) :group [:& group-wrapper {:shape object}]
[:& shape-wrapper {:shape object}])]]))
(defn- adapt-root-frame (defn- adapt-root-frame
[objects object-id] [objects object-id]

View file

@ -63,15 +63,15 @@
(= stroke-position :outer) (= stroke-position :outer)
(let [stroke-mask-id (str "mask-" @stroke-id) (let [stroke-mask-id (str "mask-" @stroke-id)
stroke-width (.-strokeWidth ^js base-props) stroke-width (or (.-strokeWidth ^js base-props) 0)
mask-props1 (-> (obj/merge! #js {} base-props) mask-props1 (-> (obj/merge! #js {} base-props)
(obj/merge! #js {:stroke "white" (obj/merge! #js {:stroke "white"
:strokeWidth (* stroke-width 2) :strokeWidth (* stroke-width 2)
:strokeOpacity 1 :strokeOpacity 1
:strokeDasharray nil :strokeDasharray nil
:fill "white" :fill "white"
:fillOpacity 1 :fillOpacity 1
:transform nil})) :transform nil}))
mask-props2 (-> (obj/merge! #js {} base-props) mask-props2 (-> (obj/merge! #js {} base-props)
(obj/merge! #js {:stroke nil (obj/merge! #js {:stroke nil
:strokeWidth nil :strokeWidth nil

View file

@ -57,13 +57,13 @@
(mf/defc pixel-overlay (mf/defc pixel-overlay
{::mf/wrap-props false} {::mf/wrap-props false}
[props] [props]
(let [vport (unchecked-get props "vport") (let [vport (unchecked-get props "vport")
vbox (unchecked-get props "vbox") vbox (unchecked-get props "vbox")
viewport-ref (unchecked-get props "viewport-ref") viewport-node (unchecked-get props "viewport")
options (unchecked-get props "options") options (unchecked-get props "options")
svg-ref (mf/use-ref nil) svg-ref (mf/use-ref nil)
canvas-ref (mf/use-ref nil) canvas-ref (mf/use-ref nil)
img-ref (mf/use-ref nil) img-ref (mf/use-ref nil)
update-str (rx/subject) update-str (rx/subject)
@ -78,11 +78,10 @@
handle-mouse-move-picker handle-mouse-move-picker
(mf/use-callback (mf/use-callback
(mf/deps viewport-ref) (mf/deps viewport-node)
(fn [event] (fn [event]
(when-let [zoom-view-node (.getElementById js/document "picker-detail")] (when-let [zoom-view-node (.getElementById js/document "picker-detail")]
(let [viewport-node (mf/ref-val viewport-ref) (let [canvas-node (mf/ref-val canvas-ref)
canvas-node (mf/ref-val canvas-ref)
{brx :left bry :top} (dom/get-bounding-rect viewport-node) {brx :left bry :top} (dom/get-bounding-rect viewport-node)
x (- (.-clientX event) brx) x (- (.-clientX event) brx)

View file

@ -146,6 +146,7 @@
[:option {:value "4"} "4x"] [:option {:value "4"} "4x"]
[:option {:value "6"} "6x"]] [:option {:value "6"} "6x"]]
[:input.input-text {:value (:suffix export) [:input.input-text {:value (:suffix export)
:placeholder (tr "workspace.options.export.suffix")
:on-change (partial on-suffix-change index)}] :on-change (partial on-suffix-change index)}]
[:select.input-select {:value (name (:type export)) [:select.input-select {:value (name (:type export))
:on-change (partial on-type-change index)} :on-change (partial on-type-change index)}

View file

@ -151,13 +151,12 @@
{::mf/wrap-props false} {::mf/wrap-props false}
[props] [props]
(let [cursor (unchecked-get props "cursor") (let [cursor (unchecked-get props "cursor")
viewport-ref (unchecked-get props "viewport") viewport (unchecked-get props "viewport")
visible? (mf/use-state true) visible? (mf/use-state true)
in-viewport? (mf/use-state true) in-viewport? (mf/use-state true)
cursor-ref (mf/use-ref nil) cursor-ref (mf/use-ref nil)
viewport (mf/ref-val viewport-ref)
node (mf/ref-val cursor-ref) node (mf/ref-val cursor-ref)
@ -184,8 +183,8 @@
#(let [style (obj/get node "style")] #(let [style (obj/get node "style")]
(obj/set! style "transform" (str "translate(" x "px, " y "px)")))))))] (obj/set! style "transform" (str "translate(" x "px, " y "px)")))))))]
(mf/use-effect (mf/use-layout-effect
(mf/deps viewport on-mouse-move) (mf/deps on-mouse-move)
(fn [] (fn []
(when viewport (when viewport
(let [{:keys [left top]} (dom/get-bounding-rect viewport) (let [{:keys [left top]} (dom/get-bounding-rect viewport)
@ -328,11 +327,15 @@
alt? (mf/use-state false) alt? (mf/use-state false)
cursor (mf/use-state (get-cursor :pointer-inner)) cursor (mf/use-state (get-cursor :pointer-inner))
viewport-ref (mf/use-ref nil) viewport-ref (mf/use-ref nil)
viewport-node (mf/use-state nil)
zoom-view-ref (mf/use-ref nil) zoom-view-ref (mf/use-ref nil)
last-position (mf/use-var nil) last-position (mf/use-var nil)
disable-paste (mf/use-var false) disable-paste (mf/use-var false)
in-viewport? (mf/use-var false) in-viewport? (mf/use-var false)
drawing (mf/deref refs/workspace-drawing) drawing (mf/deref refs/workspace-drawing)
drawing-tool (:tool drawing) drawing-tool (:tool drawing)
drawing-obj (:object drawing) drawing-obj (:object drawing)
@ -703,7 +706,7 @@
(when picking-color? (when picking-color?
[:& pixel-overlay {:vport vport [:& pixel-overlay {:vport vport
:vbox vbox :vbox vbox
:viewport-ref viewport-ref :viewport @viewport-node
:options options :options options
:layout layout}]) :layout layout}])
@ -716,7 +719,7 @@
:file-id (:id file)}]) :file-id (:id file)}])
(when-not css-mouse? (when-not css-mouse?
[:& render-cursor {:viewport viewport-ref [:& render-cursor {:viewport @viewport-node
:cursor @cursor}]) :cursor @cursor}])
[:svg.viewport [:svg.viewport
@ -727,7 +730,8 @@
:width (:width vport 0) :width (:width vport 0)
:height (:height vport 0) :height (:height vport 0)
:view-box (format-viewbox vbox) :view-box (format-viewbox vbox)
:ref viewport-ref :ref #(do (mf/set-ref-val! viewport-ref %)
(reset! viewport-node %))
:class (when drawing-tool "drawing") :class (when drawing-tool "drawing")
:style {:cursor (when css-mouse? @cursor) :style {:cursor (when css-mouse? @cursor)
:background-color (get options :background "#E8E9EA")} :background-color (get options :background "#E8E9EA")}

View file

@ -30,11 +30,13 @@
(defn format-stroke [_ shape] (defn format-stroke [_ shape]
(let [width (:stroke-width shape) (let [width (:stroke-width shape)
style (name (:stroke-style shape)) style (let [style (:stroke-style shape)]
(when (keyword? style) (name style)))
color {:color (:stroke-color shape) color {:color (:stroke-color shape)
:opacity (:stroke-opacity shape) :opacity (:stroke-opacity shape)
:gradient (:stroke-color-gradient shape)}] :gradient (:stroke-color-gradient shape)}]
(str/format "%spx %s %s" width style (uc/color->background color)))) (if-not (= :none (:stroke-style shape))
(str/format "%spx %s %s" width style (uc/color->background color)))))
(def styles-data (def styles-data
{:layout {:props [:width :height :x :y :radius :rx] {:layout {:props [:width :height :x :y :radius :rx]
@ -43,9 +45,9 @@
:fill {:props [:fill-color :fill-color-gradient] :fill {:props [:fill-color :fill-color-gradient]
:to-prop {:fill-color "background" :fill-color-gradient "background"} :to-prop {:fill-color "background" :fill-color-gradient "background"}
:format {:fill-color format-fill-color :fill-color-gradient format-fill-color}} :format {:fill-color format-fill-color :fill-color-gradient format-fill-color}}
:stroke {:props [:stroke-color] :stroke {:props [:stroke-style]
:to-prop {:stroke-color "border"} :to-prop {:stroke-style "border"}
:format {:stroke-color format-stroke}} :format {:stroke-style format-stroke}}
:shadow {:props [:shadow] :shadow {:props [:shadow]
:to-prop {:shadow :box-shadow} :to-prop {:shadow :box-shadow}
:format {:shadow #(str/join ", " (map shadow->css %1))}} :format {:shadow #(str/join ", " (map shadow->css %1))}}
@ -95,15 +97,18 @@
default-format (fn [value] (str (mth/precision value 2) "px")) default-format (fn [value] (str (mth/precision value 2) "px"))
format-property (fn [prop] format-property (fn [prop]
(let [css-prop (or (prop to-prop) (name prop)) (let [css-prop (or (prop to-prop) (name prop))
format-fn (or (prop format) default-format)] format-fn (or (prop format) default-format)
(str css-val (format-fn (prop values) values)]
(str/repeat " " tab-size) (when css-val
(str/fmt "%s: %s;" css-prop (format-fn (prop values) values)))))] (str
(str/repeat " " tab-size)
(str/fmt "%s: %s;" css-prop css-val)))))]
(->> properties (->> properties
(remove #(let [value (get values %)] (remove #(let [value (get values %)]
(or (nil? value) (= value 0)))) (or (nil? value) (= value 0))))
(map format-property) (map format-property)
(filter (comp not nil?))
(str/join "\n"))))) (str/join "\n")))))
(defn shape->properties [shape] (defn shape->properties [shape]