Added characterChest component for chest equipment, moved some files

src/components/game/character/Character.vue

@@ -3,22 +3,24 @@
   <Healthbar :zoneCharacter="props.zoneCharacter" :currentX="currentX" :currentY="currentY" />
   <Container ref="charContainer" :depth="isometricDepth" :x="currentX" :y="currentY">
     <CharacterHair :zoneCharacter="props.zoneCharacter" :currentX="currentX" :currentY="currentY" />
+<!--    <CharacterChest :zoneCharacter="props.zoneCharacter" :currentX="currentX" :currentY="currentY" />-->
     <Sprite ref="charSprite" :origin-y="1" :flipX="isFlippedX" />
   </Container>
 </template>
 
 <script lang="ts" setup>
-import config from '@/config'
-import { type Sprite as SpriteT, type ZoneCharacter } from '@/types'
+import config from '@/application/config'
+import { type Sprite as SpriteT, type ZoneCharacter } from '@/application/types'
 import { useGameStore } from '@/stores/gameStore'
 import { useZoneStore } from '@/stores/zoneStore'
 import { watch, computed, ref, onMounted, onUnmounted } from 'vue'
-import { Container, Image, refObj, RoundRectangle, Sprite, Text, useGame, useScene } from 'phavuer'
+import { Container, refObj, Sprite, useScene } from 'phavuer'
 import { calculateIsometricDepth, tileToWorldX, tileToWorldY } from '@/composables/zoneComposable'
 import { loadSpriteTextures } from '@/composables/gameComposable'
 import ChatBubble from '@/components/game/character/partials/ChatBubble.vue'
 import Healthbar from '@/components/game/character/partials/Healthbar.vue'
 import CharacterHair from '@/components/game/character/partials/CharacterHair.vue'
+// import CharacterChest from '@/components/game/character/partials/CharacterChest.vue'
 
 enum Direction {
   POSITIVE,

src/components/game/character/partials/CharacterChest.vue

@@ -0,0 +1,53 @@
+<template>
+  <Image v-bind="imageProps" v-if="gameStore.getLoadedAsset(texture)" />
+</template>
+
+<script lang="ts" setup>
+import { computed } from 'vue'
+import { Image, useScene } from 'phavuer'
+import type { Sprite as SpriteT, ZoneCharacter } from '@/application/types'
+import { loadSpriteTextures } from '@/composables/gameComposable'
+import { useGameStore } from '@/stores/gameStore'
+
+const props = defineProps<{
+  zoneCharacter: ZoneCharacter
+  currentX: number
+  currentY: number
+}>()
+
+const gameStore = useGameStore()
+const scene = useScene()
+
+const texture = computed(() => {
+  const { rotation, characterHair } = props.zoneCharacter.character
+  const spriteId = characterHair?.sprite?.id
+  const direction = [0, 6].includes(rotation) ? 'back' : 'front'
+
+  return `${spriteId}-${direction}`
+})
+
+const isFlippedX = computed(() => [6, 4].includes(props.zoneCharacter.character.rotation ?? 0))
+
+const imageProps = computed(() => {
+  // Get the current sprite action based on direction
+  const direction = [0, 6].includes(props.zoneCharacter.character.rotation ?? 0) ? 'back' : 'front'
+  const spriteAction = props.zoneCharacter.character.characterHair?.sprite?.spriteActions?.find(
+    spriteAction => spriteAction.action === direction
+  )
+
+  return {
+    depth: 1,
+    originX: Number(spriteAction?.originX) ?? 0,
+    originY: Number(spriteAction?.originY) ?? 0,
+    flipX: isFlippedX.value,
+    texture: texture.value,
+    // y: props.zoneCharacter.isMoving ? Math.floor(Date.now() / 250) % 2 : 0
+  }
+})
+
+loadSpriteTextures(scene, props.zoneCharacter.character.characterHair?.sprite as SpriteT)
+  .then(() => {})
+  .catch((error) => {
+    console.error('Error loading texture:', error)
+  })
+</script>

src/components/game/character/partials/CharacterHair.vue

@@ -5,7 +5,7 @@
 <script lang="ts" setup>
 import { computed } from 'vue'
 import { Image, useScene } from 'phavuer'
-import type { Sprite as SpriteT, ZoneCharacter } from '@/types'
+import type { Sprite as SpriteT, ZoneCharacter } from '@/application/types'
 import { loadSpriteTextures } from '@/composables/gameComposable'
 import { useGameStore } from '@/stores/gameStore'
 

src/components/game/character/partials/ChatBubble.vue

@@ -7,7 +7,7 @@
 
 <script setup lang="ts">
 import { Container, refObj, RoundRectangle, Text, useGame } from 'phavuer'
-import type { ZoneCharacter } from '@/types'
+import type { ZoneCharacter } from '@/application/types'
 import { onMounted } from 'vue'
 
 const props = defineProps<{

src/components/game/character/partials/Healthbar.vue

@@ -8,7 +8,7 @@
 
 <script setup lang="ts">
 import { Container, RoundRectangle, Text, useGame } from 'phavuer'
-import type { ZoneCharacter } from '@/types'
+import type { ZoneCharacter } from '@/application/types'
 
 const props = defineProps<{
   zoneCharacter: ZoneCharacter