mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-02-07 00:20:07 +00:00
[backport core/1.30] fix minimap navigation on touch devices (#6736)
Backport of #6580 to `core/1.30` Automatically created by backport workflow. ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-6736-backport-core-1-30-fix-minimap-navigation-on-touch-devices-2af6d73d3650813e80a5f5d3fa6b7269) by [Unito](https://www.unito.io) Co-authored-by: Christian Byrne <cbyrne@comfy.org> Co-authored-by: Alexander Brown <drjkl@comfy.org>
This commit is contained in:
@@ -61,11 +61,12 @@
|
||||
<div class="minimap-viewport" :style="viewportStyles" />
|
||||
|
||||
<div
|
||||
class="absolute inset-0"
|
||||
class="absolute inset-0 touch-none"
|
||||
@pointerdown="handlePointerDown"
|
||||
@pointermove="handlePointerMove"
|
||||
@pointerup="handlePointerUp"
|
||||
@pointerleave="handlePointerUp"
|
||||
@pointercancel="handlePointerCancel"
|
||||
@wheel="handleWheel"
|
||||
/>
|
||||
</div>
|
||||
@@ -105,6 +106,7 @@ const {
|
||||
handlePointerDown,
|
||||
handlePointerMove,
|
||||
handlePointerUp,
|
||||
handlePointerCancel,
|
||||
handleWheel,
|
||||
setMinimapRef
|
||||
} = useMinimap()
|
||||
|
||||
@@ -244,6 +244,7 @@ export function useMinimap() {
|
||||
handlePointerDown: interaction.handlePointerDown,
|
||||
handlePointerMove: interaction.handlePointerMove,
|
||||
handlePointerUp: interaction.handlePointerUp,
|
||||
handlePointerCancel: interaction.handlePointerCancel,
|
||||
handleWheel: interaction.handleWheel,
|
||||
setMinimapRef,
|
||||
updateOption
|
||||
|
||||
@@ -35,6 +35,10 @@ export function useMinimapInteraction(
|
||||
const handlePointerDown = (e: PointerEvent) => {
|
||||
isDragging.value = true
|
||||
updateContainerRect()
|
||||
const target = e.currentTarget
|
||||
if (target instanceof HTMLElement) {
|
||||
target.setPointerCapture(e.pointerId)
|
||||
}
|
||||
handlePointerMove(e)
|
||||
}
|
||||
|
||||
@@ -53,10 +57,23 @@ export function useMinimapInteraction(
|
||||
centerViewOn(worldX, worldY)
|
||||
}
|
||||
|
||||
const handlePointerUp = () => {
|
||||
const releasePointer = (e?: PointerEvent) => {
|
||||
isDragging.value = false
|
||||
if (!e) return
|
||||
|
||||
const target = e.currentTarget
|
||||
if (
|
||||
target instanceof HTMLElement &&
|
||||
target.hasPointerCapture(e.pointerId)
|
||||
) {
|
||||
target.releasePointerCapture(e.pointerId)
|
||||
}
|
||||
}
|
||||
|
||||
const handlePointerUp = releasePointer
|
||||
|
||||
const handlePointerCancel = releasePointer
|
||||
|
||||
const handleWheel = (e: WheelEvent) => {
|
||||
e.preventDefault()
|
||||
|
||||
@@ -102,6 +119,7 @@ export function useMinimapInteraction(
|
||||
handlePointerDown,
|
||||
handlePointerMove,
|
||||
handlePointerUp,
|
||||
handlePointerCancel,
|
||||
handleWheel
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user