diff --git a/src/components/zone/Zone.vue b/src/components/zone/Zone.vue index c4b171d..a658291 100644 --- a/src/components/zone/Zone.vue +++ b/src/components/zone/Zone.vue @@ -32,7 +32,7 @@ gameStore.connection?.on('zone:character:load_assets', async (zoneId: number) => await assetStore.fetchAssetsByZoneId(zoneId) }) -gameStore.connection?.emit('zone:character:join', { zoneId: gameStore.character?.zoneId }, (response: zoneLoadData) => { +gameStore.connection?.emit('zone:character:join', { zoneId: gameStore.character!.zoneId }, (response: zoneLoadData) => { zoneStore.setZone(response.zone) zoneStore.setCharacters(response.characters) }) @@ -61,6 +61,7 @@ onBeforeMount(() => {}) onBeforeUnmount(() => { zoneStore.reset() + gameStore.connection?.off('zone:character:load_assets') gameStore.connection?.off('zone:teleport') gameStore.connection?.off('zone:character:join') gameStore.connection?.off('zone:character:leave') diff --git a/src/screens/Game.vue b/src/screens/Game.vue index c38a28c..70ec812 100644 --- a/src/screens/Game.vue +++ b/src/screens/Game.vue @@ -38,7 +38,6 @@ import config from '@/config' import 'phaser' import { watch, ref, onBeforeUnmount, onMounted } from 'vue' -import { storeToRefs } from 'pinia' import { Game, Scene } from 'phavuer' import { useGameStore } from '@/stores/game' import { useZoneEditorStore } from '@/stores/zoneEditor' @@ -58,7 +57,6 @@ const zoneEditorStore = useZoneEditorStore() const assetStore = useAssetStore() const isLoaded = ref(false) const assetsLoaded = ref(false) -const { assets } = storeToRefs(assetStore) const gameConfig = { name: 'New Quest', @@ -79,6 +77,7 @@ const gameConfig = { antialias: true, roundPixels: true }, + resolution: 5, pixelArt: true } @@ -144,11 +143,12 @@ const preloadScene = (scene: Phaser.Scene) => { } const createScene = (scene: Phaser.Scene) => { - assets.value.forEach((asset) => { + assetStore.assets.forEach((asset) => { if (asset.group !== 'sprite_animations') return scene.anims.create({ key: asset.key, frameRate: 7, + /** @TODO: Fix end, which is total amount of frames */ frames: scene.anims.generateFrameNumbers(asset.key, { start: 0, end: 4 }), repeat: -1 }) @@ -157,7 +157,7 @@ const createScene = (scene: Phaser.Scene) => { /** * Watch for changes in assets and reload them */ - watch(assets, (newAssets) => { + watch(assetStore.assets, (newAssets) => { newAssets.forEach(() => { loadAssets(scene) }) @@ -167,12 +167,9 @@ const createScene = (scene: Phaser.Scene) => { } const loadAssets = (scene: Phaser.Scene) => { - assets.value.forEach((asset) => { + assetStore.assets.forEach((asset) => { if (asset.group === 'sprite_animations') { - if (!asset.frameWidth || !asset.frameHeight) { - console.error('Frame width and height must be defined for spritesheets', asset) - } - scene.load.spritesheet(asset.key, config.server_endpoint + asset.url, { frameWidth: asset.frameWidth, frameHeight: asset.frameHeight }) + scene.load.spritesheet(asset.key, config.server_endpoint + asset.url, { frameWidth: asset.frameWidth ?? 0, frameHeight: asset.frameHeight ?? 0 }) } else { scene.load.image(asset.key, config.server_endpoint + asset.url) } @@ -180,7 +177,7 @@ const loadAssets = (scene: Phaser.Scene) => { } onMounted(async () => { - await assetStore.fetchAssetsByZoneId(gameStore.character?.zoneId) + await assetStore.fetchAssetsByZoneId(gameStore.character!.zoneId) assetsLoaded.value = true }) diff --git a/src/stores/assets.ts b/src/stores/assets.ts index cea33bb..60a3980 100644 --- a/src/stores/assets.ts +++ b/src/stores/assets.ts @@ -22,20 +22,6 @@ export const useAssetStore = defineStore('assets', { return false }) }, - fetchAssetsByZoneId2(zoneId: number, successCallback, errorCallback) { - fetch(config.server_endpoint + '/assets/' + zoneId) - .then((response) => response.json()) - .then((assets) => { - this.setAssets(assets) - successCallback() - return true - }) - .catch((error) => { - errorCallback() - console.error('Error fetching assets:', error) - return false - }) - }, async fetchAssetsByZoneId(zoneId: number) { return fetch(config.server_endpoint + '/assets/' + zoneId) .then((response) => response.json())