diff --git a/frontend/src/app/main/ui/workspace/viewport.cljs b/frontend/src/app/main/ui/workspace/viewport.cljs index c989136b5..e5d2cecec 100644 --- a/frontend/src/app/main/ui/workspace/viewport.cljs +++ b/frontend/src/app/main/ui/workspace/viewport.cljs @@ -74,6 +74,7 @@ cursor (mf/use-state (utils/get-cursor :pointer-inner)) hover-ids (mf/use-state nil) hover (mf/use-state nil) + hover-disabled? (mf/use-state false) frame-hover (mf/use-state nil) active-frames (mf/use-state {}) @@ -153,7 +154,7 @@ (hooks/setup-cursor cursor alt? panning drawing-tool drawing-path? node-editing?) (hooks/setup-resize layout viewport-ref) (hooks/setup-keyboard alt? ctrl? space?) - (hooks/setup-hover-shapes page-id move-stream objects transform selected ctrl? hover hover-ids zoom) + (hooks/setup-hover-shapes page-id move-stream objects transform selected ctrl? hover hover-ids @hover-disabled? zoom) (hooks/setup-viewport-modifiers modifiers selected objects render-ref) (hooks/setup-shortcuts node-editing? drawing-path?) (hooks/setup-active-frames objects vbox hover active-frames) @@ -320,7 +321,8 @@ (when show-prototypes? [:& interactions/interactions - {:selected selected}]) + {:selected selected + :hover-disabled? hover-disabled?}]) (when show-selrect? [:& widgets/selection-rect {:data selrect diff --git a/frontend/src/app/main/ui/workspace/viewport/hooks.cljs b/frontend/src/app/main/ui/workspace/viewport/hooks.cljs index 9bebb02bd..754523c73 100644 --- a/frontend/src/app/main/ui/workspace/viewport/hooks.cljs +++ b/frontend/src/app/main/ui/workspace/viewport/hooks.cljs @@ -89,11 +89,12 @@ (hooks/use-stream ms/keyboard-ctrl #(reset! ctrl? %)) (hooks/use-stream ms/keyboard-space #(reset! space? %))) -(defn setup-hover-shapes [page-id move-stream objects transform selected ctrl? hover hover-ids zoom] +(defn setup-hover-shapes [page-id move-stream objects transform selected ctrl? hover hover-ids hover-disabled? zoom] (let [;; We use ref so we don't recreate the stream on a change zoom-ref (mf/use-ref zoom) transform-ref (mf/use-ref nil) selected-ref (mf/use-ref selected) + hover-disabled-ref (mf/use-ref hover-disabled?) query-point (mf/use-callback @@ -101,21 +102,22 @@ (fn [point] (let [zoom (mf/ref-val zoom-ref) rect (gsh/center->rect point (/ 5 zoom) (/ 5 zoom))] - (uw/ask-buffered! - {:cmd :selection/query - :page-id page-id - :rect rect - :include-frames? true - :reverse? true})))) ;; we want the topmost shape to be selected first + (if (mf/ref-val hover-disabled-ref) + (rx/of nil) + (uw/ask-buffered! + {:cmd :selection/query + :page-id page-id + :rect rect + :include-frames? true + :reverse? true}))))) ;; we want the topmost shape to be selected first over-shapes-stream (mf/use-memo - (fn [] - (->> move-stream - ;; When transforming shapes we stop querying the worker - (rx/filter #(not (some? (mf/ref-val transform-ref)))) - (rx/switch-map query-point)))) - ] + (fn [] + (->> move-stream + ;; When transforming shapes we stop querying the worker + (rx/filter #(not (some? (mf/ref-val transform-ref)))) + (rx/switch-map query-point))))] ;; Refresh the refs on a value change @@ -131,6 +133,10 @@ (mf/deps selected) #(mf/set-ref-val! selected-ref selected)) + (mf/use-effect + (mf/deps hover-disabled?) + #(mf/set-ref-val! hover-disabled-ref hover-disabled?)) + (hooks/use-stream over-shapes-stream (mf/deps page-id objects @ctrl?) diff --git a/frontend/src/app/main/ui/workspace/viewport/interactions.cljs b/frontend/src/app/main/ui/workspace/viewport/interactions.cljs index 0695662df..6d8c9f6cf 100644 --- a/frontend/src/app/main/ui/workspace/viewport/interactions.cljs +++ b/frontend/src/app/main/ui/workspace/viewport/interactions.cljs @@ -192,7 +192,7 @@ (mf/defc overlay-marker - [{:keys [index orig-shape dest-shape position objects] :as props}] + [{:keys [index orig-shape dest-shape position objects hover-disabled?] :as props}] (let [start-move-position (fn [_] (st/emit! (dw/start-move-overlay-pos index)))] @@ -203,7 +203,9 @@ marker-y (+ (:y orig-frame) (:y position)) width (:width dest-shape) height (:height dest-shape)] - [:g {:on-mouse-down start-move-position} + [:g {:on-mouse-down start-move-position + :on-mouse-enter #(reset! hover-disabled? true) + :on-mouse-leave #(reset! hover-disabled? false)} [:path {:stroke "#31EFB8" :fill "#000000" :fill-opacity 0.3 @@ -223,7 +225,7 @@ ])))) (mf/defc interactions - [{:keys [selected] :as props}] + [{:keys [selected hover-disabled?] :as props}] (let [local (mf/deref refs/workspace-local) zoom (mf/deref refs/selected-zoom) current-transform (:transform local) @@ -294,13 +296,15 @@ :orig-shape shape :dest-shape dest-shape :position move-overlay-to - :objects objects}] + :objects objects + :hover-disabled? hover-disabled?}] [:& overlay-marker {:key (str "pos" (:id shape) "-" index) :index index :orig-shape shape :dest-shape dest-shape :position (:overlay-position interaction) - :objects objects}]))]))) + :objects objects + :hover-disabled? hover-disabled?}]))]))) (when (not (#{:move :rotate} current-transform)) [:& interaction-handle {:key (:id shape) :index nil