diff --git a/CHANGES.md b/CHANGES.md index b0bf82c882..891612f908 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -58,6 +58,7 @@ - Fix problem when importing SVG's with uses with overriding properties [#Taiga 2884](https://tree.taiga.io/project/penpot/issue/2884) - Fix inconsistency with radius in SVG an CSS [#1587](https://github.com/penpot/penpot/issues/1587) - Fix clickable area in layers [#1680](https://github.com/penpot/penpot/issues/1680) +- Fix problems with trackpad zoom and scroll in MacOS [#1161](https://github.com/penpot/penpot/issues/1161) ### :arrow_up: Deps updates ### :heart: Community contributions by (Thank you!) diff --git a/frontend/src/app/main/data/workspace.cljs b/frontend/src/app/main/data/workspace.cljs index eda428e300..214e274f54 100644 --- a/frontend/src/app/main/data/workspace.cljs +++ b/frontend/src/app/main/data/workspace.cljs @@ -1750,3 +1750,4 @@ (dm/export dwz/zoom-to-fit-all) (dm/export dwz/decrease-zoom) (dm/export dwz/increase-zoom) +(dm/export dwz/set-zoom) diff --git a/frontend/src/app/main/ui/workspace/viewport/actions.cljs b/frontend/src/app/main/ui/workspace/viewport/actions.cljs index 871ebf04e4..66d978f98c 100644 --- a/frontend/src/app/main/ui/workspace/viewport/actions.cljs +++ b/frontend/src/app/main/ui/workspace/viewport/actions.cljs @@ -7,6 +7,7 @@ (ns app.main.ui.workspace.viewport.actions (:require [app.common.geom.point :as gpt] + [app.common.math :as mth] [app.common.uuid :as uuid] [app.config :as cfg] [app.main.data.workspace :as dw] @@ -362,27 +363,19 @@ (mf/use-callback (mf/deps zoom) (fn [event] - (let [event (.getBrowserEvent ^js event) - raw-pt (dom/get-client-position event) - viewport (mf/ref-val viewport-ref) - pt (utils/translate-point-to-viewport viewport zoom raw-pt) - - ctrl? (kbd/ctrl? event) - meta? (kbd/meta? event) + (let [viewport (mf/ref-val viewport-ref) + event (.getBrowserEvent ^js event) target (dom/get-target event)] - (cond - (or ctrl? meta?) - (do - (dom/prevent-default event) - (dom/stop-propagation event) - (let [delta (+ (.-deltaY ^js event) - (.-deltaX ^js event))] - (if (pos? delta) - (st/emit! (dw/decrease-zoom pt)) - (st/emit! (dw/increase-zoom pt))))) + (when (.contains ^js viewport target) + (dom/prevent-default event) + (dom/stop-propagation event) + (let [pt (->> (dom/get-client-position event) + (utils/translate-point-to-viewport viewport zoom)) - (.contains ^js viewport target) - (let [delta-mode (.-deltaMode ^js event) + ctrl? (kbd/ctrl? event) + meta? (kbd/meta? event) + + delta-mode (.-deltaMode ^js event) unit (cond (= delta-mode WheelEvent.DeltaMode.PIXEL) 1 @@ -396,13 +389,16 @@ delta-x (-> (.-deltaX ^js event) (* unit) (/ zoom))] - (dom/prevent-default event) - (dom/stop-propagation event) - (if (and (not (cfg/check-platform? :macos)) ;; macos sends delta-x automatically, don't need to do it - (kbd/shift? event)) - (st/emit! (dw/update-viewport-position {:x #(+ % delta-y)})) - (st/emit! (dw/update-viewport-position {:x #(+ % delta-x) - :y #(+ % delta-y)}))))))))) + (if (or ctrl? meta?) + (let [delta (* -1 (+ (.-deltaY ^js event) (.-deltaX ^js event))) + scale (-> (+ 1 (/ delta 100)) (mth/clamp 0.77 1.3))] + (st/emit! (dw/set-zoom pt scale))) + (if (and (not (cfg/check-platform? :macos)) + ;; macos sends delta-x automatically, don't need to do it + (kbd/shift? event)) + (st/emit! (dw/update-viewport-position {:x #(+ % delta-y)})) + (st/emit! (dw/update-viewport-position {:x #(+ % delta-x) + :y #(+ % delta-y)})))))))))) (defn on-drag-enter [] (mf/use-callback