refactoring pointer events and input handling improvements

src/composables/pointerHandlers/useMapEditorPointerHandlers.ts

@@ -28,7 +28,7 @@ export function useMapEditorPointerHandlers(scene: Phaser.Scene, layer: Phaser.T
   }
 
   function handlePointerDown(pointer: Phaser.Input.Pointer) {
-    pointerStartPosition.value = pointer.position
+    pointerStartPosition.value = { x: pointer.x, y: pointer.y }
     if (isMoveTool.value || pointer.event.shiftKey) {
       gameStore.setPlayerDraggingCamera(true)
     }
@@ -37,9 +37,11 @@ export function useMapEditorPointerHandlers(scene: Phaser.Scene, layer: Phaser.T
   function dragMap(pointer: Phaser.Input.Pointer) {
     if (!gameStore.game.isPlayerDraggingCamera) return
 
+    const distance = Phaser.Math.Distance.Between(pointerStartPosition.value.x, pointerStartPosition.value.y, pointer.x, pointer.y)
+
     // If the distance is less than the drag threshold, return
     // We do this to prevent the camera from scrolling too quickly
-    const distance = Phaser.Math.Distance.Between(pointerStartPosition.value.x, pointerStartPosition.value.y, pointer.x, pointer.y)
+
     if (distance <= dragThreshold) return
 
     camera.setScroll(camera.scrollX - (pointer.x - pointer.prevPosition.x) / camera.zoom, camera.scrollY - (pointer.y - pointer.prevPosition.y) / camera.zoom)

src/composables/useMapEditorComposable.ts

@@ -12,14 +12,8 @@ const currentMap = ref<Map | null>(null)
 const active = ref(false)
 const tool = ref('move')
 const drawMode = ref('tile')
-const eraserMode = ref('tile')
 const selectedTile = ref('')
 const selectedMapObject = ref<MapObject | null>(null)
-const isTileListModalShown = ref(false)
-const isMapObjectListModalShown = ref(false)
-const isMapListModalShown = ref(false)
-const isCreateMapModalShown = ref(false)
-const isSettingsModalShown = ref(false)
 const shouldClearTiles = ref(false)
 const teleportSettings = ref<TeleportSettings>({
   toMapId: '',
@@ -59,10 +53,6 @@ export function useMapEditorComposable() {
     drawMode.value = mode
   }
 
-  const setEraserMode = (mode: string) => {
-    eraserMode.value = mode
-  }
-
   const setSelectedTile = (tile: string) => {
     selectedTile.value = tile
   }
@@ -71,19 +61,6 @@ export function useMapEditorComposable() {
     selectedMapObject.value = object
   }
 
-  const toggleSettingsModal = () => {
-    isSettingsModalShown.value = !isSettingsModalShown.value
-  }
-
-  const toggleMapListModal = () => {
-    isMapListModalShown.value = !isMapListModalShown.value
-    isCreateMapModalShown.value = false
-  }
-
-  const toggleCreateMapModal = () => {
-    isCreateMapModalShown.value = !isCreateMapModalShown.value
-  }
-
   const setTeleportSettings = (settings: TeleportSettings) => {
     teleportSettings.value = settings
   }
@@ -101,11 +78,6 @@ export function useMapEditorComposable() {
     drawMode.value = 'tile'
     selectedTile.value = ''
     selectedMapObject.value = null
-    isTileListModalShown.value = false
-    isMapObjectListModalShown.value = false
-    isSettingsModalShown.value = false
-    isMapListModalShown.value = false
-    isCreateMapModalShown.value = false
     shouldClearTiles.value = false
   }
 
@@ -115,14 +87,8 @@ export function useMapEditorComposable() {
     active,
     tool,
     drawMode,
-    eraserMode,
     selectedTile,
     selectedMapObject,
-    isTileListModalShown,
-    isMapObjectListModalShown,
-    isMapListModalShown,
-    isCreateMapModalShown,
-    isSettingsModalShown,
     shouldClearTiles,
     teleportSettings,
 
@@ -133,12 +99,8 @@ export function useMapEditorComposable() {
     toggleActive,
     setTool,
     setDrawMode,
-    setEraserMode,
     setSelectedTile,
     setSelectedMapObject,
-    toggleSettingsModal,
-    toggleMapListModal,
-    toggleCreateMapModal,
     setTeleportSettings,
     triggerClearTiles,
     resetClearTilesFlag,