From 390187f35358384af6c4064146585d74961f7f14 Mon Sep 17 00:00:00 2001
From: Dennis Postma <dennis@directonline.io>
Date: Mon, 10 Feb 2025 01:51:45 +0100
Subject: [PATCH] #202 - Enable / disable placed map object preview

---
 .../mapEditor/mapPartials/PlacedMapObjects.vue | 18 ++++++++++--------
 .../gameMaster/mapEditor/partials/Toolbar.vue  |  8 ++------
 2 files changed, 12 insertions(+), 14 deletions(-)

diff --git a/src/components/gameMaster/mapEditor/mapPartials/PlacedMapObjects.vue b/src/components/gameMaster/mapEditor/mapPartials/PlacedMapObjects.vue
index a9f2269..6beb632 100644
--- a/src/components/gameMaster/mapEditor/mapPartials/PlacedMapObjects.vue
+++ b/src/components/gameMaster/mapEditor/mapPartials/PlacedMapObjects.vue
@@ -1,13 +1,13 @@
 <template>
   <SelectedPlacedMapObjectComponent v-if="mapEditor.selectedPlacedObject.value" :key="mapEditor.selectedPlacedObject.value.id" :map :placedMapObject="mapEditor.selectedPlacedObject.value" @move="moveMapObject" @rotate="rotatePlacedMapObject" @delete="deletePlacedMapObject" />
   <PlacedMapObject v-for="placedMapObject in mapEditor.currentMap.value?.placedMapObjects" :tileMap :tileMapLayer :placedMapObject @pointerdown="clickPlacedMapObject(placedMapObject)" />
-  <PlacedMapObject v-if="
-   mapEditor.tool.value === 'pencil' &&
-   mapEditor.drawMode.value === 'map_object' &&
-   mapEditor.isPlacedMapObjectPreviewEnabled.value &&
-   mapEditor.selectedPlacedObject.value && previewPlacedMapObject" :tileMap :tileMapLayer
-   :key="previewPlacedMapObject?.id"
-   :placedMapObject="previewPlacedMapObject" />
+  <PlacedMapObject
+    v-if="mapEditor.tool.value === 'pencil' && mapEditor.drawMode.value === 'map_object' && mapEditor.isPlacedMapObjectPreviewEnabled.value && mapEditor.selectedPlacedObject.value && previewPlacedMapObject"
+    :tileMap
+    :tileMapLayer
+    :key="previewPlacedMapObject?.id"
+    :placedMapObject="previewPlacedMapObject as PlacedMapObjectT"
+  />
 </template>
 
 <script setup lang="ts">
@@ -37,7 +37,9 @@ const props = defineProps<{
 const previewPosition = ref({ x: 0, y: 0 })
 
 const previewPlacedMapObject = computed(() => ({
-  ...mapEditor.selectedPlacedObject.value!,
+  id: uuidv4(),
+  mapObject: mapEditor.selectedMapObject.value?.id,
+  isRotated: false,
   positionX: previewPosition.value.x,
   positionY: previewPosition.value.y
 }))
diff --git a/src/components/gameMaster/mapEditor/partials/Toolbar.vue b/src/components/gameMaster/mapEditor/partials/Toolbar.vue
index 1043afc..78c8e73 100644
--- a/src/components/gameMaster/mapEditor/partials/Toolbar.vue
+++ b/src/components/gameMaster/mapEditor/partials/Toolbar.vue
@@ -93,7 +93,7 @@
         <label for="continuous-drawing" class="text-sm font-medium text-gray-200 cursor-pointer"> Continuous Drawing </label>
       </div>
       <div class="m-4 flex items-center space-x-2">
-        <input id="show-placed-map-object-preview" @change="toggleShowPlacedMapObjectPreview" v-model="isShowPlacedMapObjectPreviewEnabled" type="checkbox" class="h-4 w-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500" />
+        <input id="show-placed-map-object-preview" @change="mapEditor.togglePlacedMapObjectPreview()" v-model="isShowPlacedMapObjectPreviewEnabled" type="checkbox" class="h-4 w-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500" />
         <label for="show-placed-map-object-preview" class="text-sm font-medium text-gray-200 cursor-pointer"> Show placed map object preview </label>
       </div>
     </template>
@@ -116,7 +116,7 @@ const isMapEditorSettingsModalOpen = ref(false)
 const selectPencilOpen = ref(false)
 const selectEraserOpen = ref(false)
 const isContinuousDrawingEnabled = ref<Boolean>(false)
-const isShowPlacedMapObjectPreviewEnabled = ref<Boolean>(false)
+const isShowPlacedMapObjectPreviewEnabled = ref<Boolean>(mapEditor.isPlacedMapObjectPreviewEnabled.value)
 const listOpen = computed(() => mapEditor.tool.value === 'pencil' && (mapEditor.drawMode.value === 'tile' || mapEditor.drawMode.value === 'map_object'))
 
 // drawMode
@@ -141,10 +141,6 @@ function toggleContinuousDrawing() {
   mapEditor.setInputMode(isContinuousDrawingEnabled.value ? 'hold' : 'tap')
 }
 
-function toggleShowPlacedMapObjectPreview() {
-
-}
-
 function handleModeClick(mode: string, type: 'pencil' | 'eraser') {
   setDrawMode(mode)
   type === 'pencil' ? setPencilMode() : setEraserMode()