npm run format

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

@@ -79,4 +79,4 @@ function updateTeleportSettings() {
     toZoneId: toZoneId.value
   })
 }
-</script>
+</script>

src/components/gui/Chat.vue

@@ -59,61 +59,61 @@ const scrollToBottom = () => {
   })
 }
 
-  gameStore.connection?.on('chat:message', (data: ChatMessage) => {
+gameStore.connection?.on('chat:message', (data: ChatMessage) => {
-    chats.value.push(data)
+  chats.value.push(data)
-    scrollToBottom()
-
-    if (!zoneStore.characterLoaded) return
-
-    const charChatContainer = scene.children.getByName(data.character.name + '_chatContainer') as Phaser.GameObjects.Container
-    if (!charChatContainer) return
-
-    const chatBubble = charChatContainer.getByName(data.character.name + '_chatBubble') as Phaser.GameObjects.Container
-    const chatText = charChatContainer.getByName(data.character.name + '_chatText') as Phaser.GameObjects.Text
-    if (!chatText || !chatBubble) return
-
-    function calculateTextWidth(text: string, font: string, fontSize: number): number {
-      // Create a canvas element
-      const canvas = document.createElement('canvas');
-      const context = canvas.getContext('2d');
-
-      if (!context) {
-        throw new Error('Unable to create canvas context');
-      }
-
-      // Set the font
-      context.font = `${fontSize}px ${font}`;
-
-      // Measure the text width
-      const metrics = context.measureText(text);
-
-      return metrics.width;
-    }
-
-    chatBubble.width = calculateTextWidth(data.message, 'Arial', 13) + 10
-    chatText.setText(data.message)
-
-    charChatContainer.setVisible(true)
-
-    /**
-     * Hide chat bubble after a few seconds
-     */
-
-    // Clear any existing hide timer
-    if (charChatContainer.getData('hideTimer')) {
-      clearTimeout(charChatContainer.getData('hideTimer'))
-    }
-
-    // Set a new hide timer
-    const hideTimer = setTimeout(() => {
-      charChatContainer.setVisible(false)
-    }, 3000)
-
-    // Store the timer on the container itself
-    charChatContainer.setData('hideTimer', hideTimer)
-  })
   scrollToBottom()
 
+  if (!zoneStore.characterLoaded) return
+
+  const charChatContainer = scene.children.getByName(data.character.name + '_chatContainer') as Phaser.GameObjects.Container
+  if (!charChatContainer) return
+
+  const chatBubble = charChatContainer.getByName(data.character.name + '_chatBubble') as Phaser.GameObjects.Container
+  const chatText = charChatContainer.getByName(data.character.name + '_chatText') as Phaser.GameObjects.Text
+  if (!chatText || !chatBubble) return
+
+  function calculateTextWidth(text: string, font: string, fontSize: number): number {
+    // Create a canvas element
+    const canvas = document.createElement('canvas')
+    const context = canvas.getContext('2d')
+
+    if (!context) {
+      throw new Error('Unable to create canvas context')
+    }
+
+    // Set the font
+    context.font = `${fontSize}px ${font}`
+
+    // Measure the text width
+    const metrics = context.measureText(text)
+
+    return metrics.width
+  }
+
+  chatBubble.width = calculateTextWidth(data.message, 'Arial', 13) + 10
+  chatText.setText(data.message)
+
+  charChatContainer.setVisible(true)
+
+  /**
+   * Hide chat bubble after a few seconds
+   */
+
+  // Clear any existing hide timer
+  if (charChatContainer.getData('hideTimer')) {
+    clearTimeout(charChatContainer.getData('hideTimer'))
+  }
+
+  // Set a new hide timer
+  const hideTimer = setTimeout(() => {
+    charChatContainer.setVisible(false)
+  }, 3000)
+
+  // Store the timer on the container itself
+  charChatContainer.setData('hideTimer', hideTimer)
+})
+scrollToBottom()
+
 onBeforeUnmount(() => {
   gameStore.connection?.off('chat:message')
 })

src/components/sprites/Character.vue

@@ -22,7 +22,11 @@ import { watch, computed, ref, onMounted, onUnmounted } from 'vue'
 import { Container, refObj, RoundRectangle, Sprite, Text } from 'phavuer'
 import { calculateIsometricDepth, tileToWorldX, tileToWorldY } from '@/composables/zoneComposable'
 
-enum Direction { POSITIVE, NEGATIVE, UNCHANGED }
+enum Direction {
+  POSITIVE,
+  NEGATIVE,
+  UNCHANGED
+}
 
 const props = defineProps<{
   layer: Phaser.Tilemaps.TilemapLayer
@@ -113,13 +117,13 @@ const charTexture = computed(() => {
 
 const updateSprite = () => {
   if (props.character.isMoving) {
-    charSprite.value!.anims.play(charTexture.value, true);
+    charSprite.value!.anims.play(charTexture.value, true)
-    return;
+    return
   }
 
-  charSprite.value!.anims.stop();
+  charSprite.value!.anims.stop()
-  charSprite.value!.setFrame(0);
+  charSprite.value!.setFrame(0)
-  charSprite.value!.setTexture(charTexture.value);
+  charSprite.value!.setTexture(charTexture.value)
 }
 
 const createChatBubble = (container: Phaser.GameObjects.Container) => {
@@ -138,14 +142,17 @@ const createText = (text: Phaser.GameObjects.Text) => {
   text.setFontFamily('Arial')
 }
 
-watch(() => props.character, (newChar, oldChar) => {
+watch(
-  if (!newChar) return
+  () => props.character,
+  (newChar, oldChar) => {
+    if (!newChar) return
 
-  if (!oldChar || newChar.positionX !== oldChar.positionX || newChar.positionY !== oldChar.positionY) {
+    if (!oldChar || newChar.positionX !== oldChar.positionX || newChar.positionY !== oldChar.positionY) {
-    const direction = !oldChar ? Direction.POSITIVE : calcDirection(oldChar.positionX, oldChar.positionY, newChar.positionX, newChar.positionY)
+      const direction = !oldChar ? Direction.POSITIVE : calcDirection(oldChar.positionX, oldChar.positionY, newChar.positionX, newChar.positionY)
-    updatePosition(newChar.positionX, newChar.positionY, direction)
+      updatePosition(newChar.positionX, newChar.positionY, direction)
+    }
   }
-})
+)
 
 watch(() => props.character.isMoving, updateSprite)
 watch(() => props.character.rotation, updateSprite)
@@ -169,4 +176,4 @@ onMounted(() => {
 onUnmounted(() => {
   tween.value?.stop()
 })
-</script>
+</script>

src/composables/pointerHandlers/useGamePointerHandlers.ts

@@ -63,4 +63,4 @@ export function useGamePointerHandlers(scene: Phaser.Scene, layer: Phaser.Tilema
   }
 
   return { setupPointerHandlers, cleanupPointerHandlers }
-}
+}

src/composables/pointerHandlers/useZoneEditorPointerHandlers.ts

@@ -54,4 +54,4 @@ export function useZoneEditorPointerHandlers(scene: Phaser.Scene, layer: Phaser.
   }
 
   return { setupPointerHandlers, cleanupPointerHandlers }
-}
+}

src/composables/useCameraControls.ts

@@ -18,7 +18,7 @@ export function useCameraControls(scene: Phaser.Scene): any {
   watch(
     () => zoneStore.characterLoaded,
     (characterLoaded) => {
-      if(!characterLoaded) return;
+      if (!characterLoaded) return
       // scene.cameras.main.startFollow(scene.children.getByName(gameStore.character!.name) as Phaser.GameObjects.Container);
     }
   )

src/stores/zoneStore.ts

@@ -5,7 +5,7 @@ export const useZoneStore = defineStore('zone', {
   state: () => ({
     zone: null as Zone | null,
     characters: [] as ExtendedCharacter[],
-    characterLoaded: false,
+    characterLoaded: false
   }),
   getters: {
     getCharacterById: (state) => {
@@ -42,8 +42,7 @@ export const useZoneStore = defineStore('zone', {
     },
     reset() {
       this.zone = null
-      this.characters = [],
+      ;(this.characters = []), (this.characterLoaded = false)
-      this.characterLoaded = false
     }
   }
 })