Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-22 23:06:08 -05:00
Code Issues Activity

🐛 Fixes problem with cursor

Browse source
This commit is contained in:
alonso.torres 2021-01-29 21:45:52 +01:00
parent f4bbcdb382
commit 5b7ffac74e
2 changed files with 20 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
frontend/src/app/main/ui/workspace/colorpicker/pixel_overlay.cljs
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)

18
frontend/src/app/main/ui/workspace/viewport.cljs
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")}