Restored placed map object selection and implemented object snapping to tile coordinates

src/composables/mapComposable.ts

@@ -1,7 +1,7 @@
-import config from '@/application/config'
-import type { HttpResponse, TextureData, Tile as TileT, UUID } from '@/application/types'
-import { unduplicateArray } from '@/application/utilities'
-import { loadTexture } from '@/composables/gameComposable'
+import config from '@/application/config';
+import type { Map as MapT, TextureData, Tile as TileT, UUID } from '@/application/types';
+import { unduplicateArray } from '@/application/utilities';
+import { loadTexture } from '@/composables/gameComposable';
 import { MapStorage, TileStorage } from '@/storage/storages'
 
 import Tilemap = Phaser.Tilemaps.Tilemap
@@ -114,3 +114,33 @@ export async function loadAllTilesIntoScene(scene: Phaser.Scene) {
 
   await getTiles(tiles, scene)
 }
+
+export function createTileMap(scene: Phaser.Scene, map: MapT) {
+  const mapConfig = new Phaser.Tilemaps.MapData({
+    width: map.width,
+    height: map.height,
+    tileWidth: config.tile_size.width,
+    tileHeight: config.tile_size.height,
+    orientation: Phaser.Tilemaps.Orientation.ISOMETRIC,
+    format: Phaser.Tilemaps.Formats.ARRAY_2D
+  })
+
+  return new Phaser.Tilemaps.Tilemap(scene, mapConfig)
+}
+
+export function createTileLayer(currentTileMap: Phaser.Tilemaps.Tilemap, mapData: any) {
+  const tilesArray = unduplicateArray(mapData?.tiles.flat())
+
+  const tilesetImages = tilesArray.map((tile: string, index: number) => {
+    return currentTileMap.addTilesetImage(tile, tile, config.tile_size.width, config.tile_size.height, 1, 2, index + 1, { x: 0, y: -config.tile_size.height })
+  })
+
+  // Add blank tile
+  tilesetImages.push(currentTileMap.addTilesetImage('blank_tile', 'blank_tile', config.tile_size.width, config.tile_size.height, 1, 2, 0, { x: 0, y: -config.tile_size.height }))
+
+  const layer = currentTileMap.createBlankLayer('tiles', tilesetImages as Tileset[], 0, config.tile_size.height) as Phaser.Tilemaps.TilemapLayer
+
+  layer.setDepth(0)
+  layer.setCullPadding(2, 2)
+  return layer
+}

src/composables/useMapEditorComposable.ts

@@ -1,4 +1,4 @@
-import type { Map, MapObject } from '@/application/types'
+import type { Map, MapObject, PlacedMapObject, UUID } from '@/application/types'
 import { ref } from 'vue'
 
 export type TeleportSettings = {
@@ -15,6 +15,8 @@ const drawMode = ref('tile')
 const inputMode = ref('tap')
 const selectedTile = ref('')
 const selectedMapObject = ref<MapObject | null>(null)
+const movingPlacedObject = ref<PlacedMapObject | null>(null)
+const selectedPlacedObject = ref<PlacedMapObject | null>(null)
 const shouldClearTiles = ref(false)
 const teleportSettings = ref<TeleportSettings>({
   toMapId: '',
@@ -96,6 +98,8 @@ export function useMapEditorComposable() {
     inputMode,
     selectedTile,
     selectedMapObject,
+    movingPlacedObject,
+    selectedPlacedObject,
     shouldClearTiles,
     teleportSettings,