Several map editor improvements

src/components/gameMaster/GmPanel.vue

@@ -7,7 +7,6 @@
         <button @mousedown.stop class="btn-cyan py-1.5 px-4 min-w-24">Chats</button>
         <button @mousedown.stop class="btn-cyan active py-1.5 px-4 min-w-24">Asset manager</button>
         <button class="btn-cyan py-1.5 px-4 min-w-24" type="button" @click="() => zoneEditorStore.toggleActive()">Zone manager</button>
-
       </div>
     </template>
     <template #modalBody>

src/components/gameMaster/zoneEditor/ZoneEditor.vue

@@ -18,7 +18,6 @@ import { onUnmounted, ref } from 'vue'
 import { useGameStore } from '@/stores/gameStore'
 import { useZoneEditorStore } from '@/stores/zoneEditorStore'
 import { type Zone } from '@/types'
-
 // Components
 import Toolbar from '@/components/gameMaster/zoneEditor/partials/Toolbar.vue'
 import TileList from '@/components/gameMaster/zoneEditor/partials/TileList.vue'
@@ -32,6 +31,7 @@ import ZoneEventTiles from '@/components/gameMaster/zoneEditor/zonePartials/Zone
 
 const gameStore = useGameStore()
 const zoneEditorStore = useZoneEditorStore()
+console.log(zoneEditorStore.zone)
 
 const tileMap = ref(null as Phaser.Tilemaps.Tilemap | null)
 
@@ -64,6 +64,7 @@ function save() {
   }
 
   gameStore.connection?.emit('gm:zone_editor:zone:update', data, (response: Zone) => {
+    console.log(response.updatedAt)
     zoneEditorStore.setZone(response)
   })
 }

src/components/gameMaster/zoneEditor/partials/TileList.vue

@@ -223,7 +223,7 @@ function selectTile(tile: string) {
 }
 
 function isActiveTile(tile: Tile): boolean {
-  return zoneEditorStore.selectedTile?.id === tile.id
+  return zoneEditorStore.selectedTile === tile.id
 }
 
 onMounted(async () => {

src/components/gameMaster/zoneEditor/zonePartials/ZoneTiles.vue

@@ -191,7 +191,19 @@ onMounted(() => {
   if (!zoneEditorStore.zone?.tiles) {
     return
   }
-  setLayerTiles(tileMap, tileLayer, zoneEditorStore.zone.tiles)
+
+  // First fill the entire map with blank tiles
+  const blankTiles = createTileArray(tileMap.width, tileMap.height, 'blank_tile')
+
+  // Then overlay the zone tiles on top
+  const zoneTiles = zoneEditorStore.zone.tiles
+  for (let y = 0; y < zoneTiles.length; y++) {
+    for (let x = 0; x < zoneTiles[y].length; x++) {
+      blankTiles[y][x] = zoneTiles[y][x]
+    }
+  }
+
+  setLayerTiles(tileMap, tileLayer, blankTiles)
 
   scene.input.on(Phaser.Input.Events.POINTER_MOVE, pencil)
   scene.input.on(Phaser.Input.Events.POINTER_MOVE, eraser)

src/components/gui/Clock.vue

@@ -18,4 +18,4 @@ gameStore.connection?.on('date', (data: Date) => {
 onUnmounted(() => {
   gameStore.connection?.off('date')
 })
-</script>
+</script>

src/stores/zoneEditorStore.ts

@@ -123,6 +123,8 @@ export const useZoneEditorStore = defineStore('zoneEditor', {
       this.drawMode = 'tile'
       this.selectedTile = ''
       this.selectedObject = null
+      this.isTileListModalShown = false
+      this.isObjectListModalShown = false
       this.isSettingsModalShown = false
       this.isZoneListModalShown = false
       this.isCreateZoneModalShown = false