diff --git a/package-lock.json b/package-lock.json
index b7be796..fb111c7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3690,9 +3690,9 @@
}
},
"node_modules/es-module-lexer": {
- "version": "1.5.4",
- "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.5.4.tgz",
- "integrity": "sha512-MVNK56NiMrOwitFB7cqDwq0CQutbw+0BvLshJSse0MUNU+y1FC3bUS/AQg7oUng+/wKrrki7JfmwtVHkVfPLlw==",
+ "version": "1.6.0",
+ "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.6.0.tgz",
+ "integrity": "sha512-qqnD1yMU6tk/jnaMosogGySTZP8YtUgAffA9nMN+E/rjxcfRQ6IEk7IiozUjgxKoFHBGjTLnrHB/YC45r/59EQ==",
"dev": true,
"license": "MIT"
},
diff --git a/src/application/types.ts b/src/application/types.ts
index a8a148e..17445e3 100644
--- a/src/application/types.ts
+++ b/src/application/types.ts
@@ -21,7 +21,7 @@ export type AssetDataT = {
frameRate?: number
frameWidth?: number
frameHeight?: number
- frameRate?: number
+ frameCount?: number
}
export type Tile = {
diff --git a/src/components/Effects.vue b/src/components/Effects.vue
index c9c100a..4df3424 100644
--- a/src/components/Effects.vue
+++ b/src/components/Effects.vue
@@ -55,20 +55,23 @@ const initializeEffects = (scene: Phaser.Scene) => {
effects.light.value = scene.add.graphics().setDepth(1000)
// Rain
- effects.rain.value = scene.add.particles(0, 0, 'raindrop', {
- x: { min: 0, max: window.innerWidth },
- y: -50,
- quantity: 5,
- lifespan: 2000,
- speedY: { min: 300, max: 500 },
- scale: { start: 0.005, end: 0.005 },
- alpha: { start: 0.5, end: 0 },
- blendMode: 'ADD'
- }).setDepth(900)
+ effects.rain.value = scene.add
+ .particles(0, 0, 'raindrop', {
+ x: { min: 0, max: window.innerWidth },
+ y: -50,
+ quantity: 5,
+ lifespan: 2000,
+ speedY: { min: 300, max: 500 },
+ scale: { start: 0.005, end: 0.005 },
+ alpha: { start: 0.5, end: 0 },
+ blendMode: 'ADD'
+ })
+ .setDepth(900)
effects.rain.value.stop()
// Fog
- effects.fog.value = scene.add.sprite(window.innerWidth / 2, window.innerHeight / 2, 'fog')
+ effects.fog.value = scene.add
+ .sprite(window.innerWidth / 2, window.innerHeight / 2, 'fog')
.setScale(2)
.setAlpha(0)
.setDepth(950)
@@ -77,10 +80,13 @@ const initializeEffects = (scene: Phaser.Scene) => {
// Effect updates
const updateScene = () => {
const timeBasedLight = calculateLightStrength(gameStore.world.date)
- const zoneEffects = zoneStore.zone?.zoneEffects?.reduce((acc, curr) => ({
- ...acc,
- [curr.effect]: curr.strength
- }), {}) as { [key: string]: number }
+ const zoneEffects = zoneStore.zone?.zoneEffects?.reduce(
+ (acc, curr) => ({
+ ...acc,
+ [curr.effect]: curr.strength
+ }),
+ {}
+ ) as { [key: string]: number }
// Only update effects once zoneEffects are loaded
if (!zoneEffectsReady.value) {
@@ -91,13 +97,14 @@ const updateScene = () => {
}
}
- const finalEffects = zoneEffects && Object.keys(zoneEffects).length
- ? zoneEffects
- : {
- light: timeBasedLight,
- rain: weatherState.value.isRainEnabled ? weatherState.value.rainPercentage : 0,
- fog: weatherState.value.isFogEnabled ? weatherState.value.fogDensity * 100 : 0
- }
+ const finalEffects =
+ zoneEffects && Object.keys(zoneEffects).length
+ ? zoneEffects
+ : {
+ light: timeBasedLight,
+ rain: weatherState.value.isRainEnabled ? weatherState.value.rainPercentage : 0,
+ fog: weatherState.value.isFogEnabled ? weatherState.value.fogDensity * 100 : 0
+ }
applyEffects(finalEffects)
}
@@ -105,16 +112,12 @@ const updateScene = () => {
const applyEffects = (effectValues: any) => {
if (effects.light.value) {
const darkness = 1 - (effectValues.light ?? 100) / 100
- effects.light.value.clear()
- .fillStyle(0x000000, darkness)
- .fillRect(0, 0, window.innerWidth, window.innerHeight)
+ effects.light.value.clear().fillStyle(0x000000, darkness).fillRect(0, 0, window.innerWidth, window.innerHeight)
}
if (effects.rain.value) {
const strength = effectValues.rain ?? 0
- strength > 0
- ? effects.rain.value.start().setQuantity(Math.floor((strength / 100) * 10))
- : effects.rain.value.stop()
+ strength > 0 ? effects.rain.value.start().setQuantity(Math.floor((strength / 100) * 10)) : effects.rain.value.stop()
}
if (effects.fog.value) {
@@ -126,19 +129,14 @@ const calculateLightStrength = (time: Date): number => {
const hour = time.getHours()
const minute = time.getMinutes()
- if (hour >= LIGHT_CONFIG.SUNSET_HOUR || hour < LIGHT_CONFIG.SUNRISE_HOUR)
- return LIGHT_CONFIG.NIGHT_STRENGTH
+ if (hour >= LIGHT_CONFIG.SUNSET_HOUR || hour < LIGHT_CONFIG.SUNRISE_HOUR) return LIGHT_CONFIG.NIGHT_STRENGTH
- if (hour > LIGHT_CONFIG.SUNRISE_HOUR && hour < LIGHT_CONFIG.SUNSET_HOUR - 2)
- return LIGHT_CONFIG.DAY_STRENGTH
+ if (hour > LIGHT_CONFIG.SUNRISE_HOUR && hour < LIGHT_CONFIG.SUNSET_HOUR - 2) return LIGHT_CONFIG.DAY_STRENGTH
- if (hour === LIGHT_CONFIG.SUNRISE_HOUR)
- return LIGHT_CONFIG.NIGHT_STRENGTH +
- ((LIGHT_CONFIG.DAY_STRENGTH - LIGHT_CONFIG.NIGHT_STRENGTH) * minute) / 60
+ if (hour === LIGHT_CONFIG.SUNRISE_HOUR) return LIGHT_CONFIG.NIGHT_STRENGTH + ((LIGHT_CONFIG.DAY_STRENGTH - LIGHT_CONFIG.NIGHT_STRENGTH) * minute) / 60
const totalMinutes = (hour - (LIGHT_CONFIG.SUNSET_HOUR - 2)) * 60 + minute
- return LIGHT_CONFIG.DAY_STRENGTH -
- (LIGHT_CONFIG.DAY_STRENGTH - LIGHT_CONFIG.NIGHT_STRENGTH) * (totalMinutes / 120)
+ return LIGHT_CONFIG.DAY_STRENGTH - (LIGHT_CONFIG.DAY_STRENGTH - LIGHT_CONFIG.NIGHT_STRENGTH) * (totalMinutes / 120)
}
// Socket and window handlers
@@ -157,17 +155,19 @@ const setupSocketListeners = () => {
}
const handleResize = () => {
- if (effects.rain.value)
- effects.rain.value.updateConfig({ x: { min: 0, max: window.innerWidth } })
- if (effects.fog.value)
- effects.fog.value.setPosition(window.innerWidth / 2, window.innerHeight / 2)
+ if (effects.rain.value) effects.rain.value.updateConfig({ x: { min: 0, max: window.innerWidth } })
+ if (effects.fog.value) effects.fog.value.setPosition(window.innerWidth / 2, window.innerHeight / 2)
}
// Lifecycle
-watch(() => zoneStore.zone, () => {
- zoneEffectsReady.value = false
- updateScene()
-}, { deep: true })
+watch(
+ () => zoneStore.zone,
+ () => {
+ zoneEffectsReady.value = false
+ updateScene()
+ },
+ { deep: true }
+)
onMounted(() => window.addEventListener('resize', handleResize))
@@ -176,4 +176,4 @@ onBeforeUnmount(() => {
if (sceneRef.value) sceneRef.value.scene.remove('effects')
gameStore.connection?.off('weather')
})
-</script>
\ No newline at end of file
+</script>
diff --git a/src/components/game/character/Character.vue b/src/components/game/character/Character.vue
index 38e4e04..f1a467f 100644
--- a/src/components/game/character/Character.vue
+++ b/src/components/game/character/Character.vue
@@ -3,7 +3,7 @@
<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" />-->
+ <!-- <CharacterChest :zoneCharacter="props.zoneCharacter" :currentX="currentX" :currentY="currentY" />-->
<Sprite ref="charSprite" :origin-y="1" :flipX="isFlippedX" />
</Container>
</template>
diff --git a/src/components/game/character/partials/CharacterChest.vue b/src/components/game/character/partials/CharacterChest.vue
index b64e942..238b6e4 100644
--- a/src/components/game/character/partials/CharacterChest.vue
+++ b/src/components/game/character/partials/CharacterChest.vue
@@ -31,16 +31,14 @@ const isFlippedX = computed(() => [6, 4].includes(props.zoneCharacter.character.
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
- )
+ 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,
+ texture: texture.value
// y: props.zoneCharacter.isMoving ? Math.floor(Date.now() / 250) % 2 : 0
}
})
diff --git a/src/components/game/character/partials/CharacterHair.vue b/src/components/game/character/partials/CharacterHair.vue
index b8e25b6..0036ba8 100644
--- a/src/components/game/character/partials/CharacterHair.vue
+++ b/src/components/game/character/partials/CharacterHair.vue
@@ -31,9 +31,7 @@ const isFlippedX = computed(() => [6, 4].includes(props.zoneCharacter.character.
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
- )
+ const spriteAction = props.zoneCharacter.character.characterHair?.sprite?.spriteActions?.find((spriteAction) => spriteAction.action === direction)
return {
depth: 1,
diff --git a/src/components/game/zone/Zone.vue b/src/components/game/zone/Zone.vue
index 27370a4..eac611e 100644
--- a/src/components/game/zone/Zone.vue
+++ b/src/components/game/zone/Zone.vue
@@ -51,7 +51,7 @@ gameStore.connection!.on('zone:character:leave', (characterId: number) => {
zoneStore.removeCharacter(characterId)
})
-gameStore.connection!.on('character:move', (data: { id: number, positionX: number, positionY: number, rotation: number, isMoving: boolean }) => {
+gameStore.connection!.on('character:move', (data: { id: number; positionX: number; positionY: number; rotation: number; isMoving: boolean }) => {
zoneStore.updateCharacterPosition(data)
})
diff --git a/src/components/gameMaster/assetManager/partials/characterHair/CharacterHairList.vue b/src/components/gameMaster/assetManager/partials/characterHair/CharacterHairList.vue
index a40a022..c9b2e7b 100644
--- a/src/components/gameMaster/assetManager/partials/characterHair/CharacterHairList.vue
+++ b/src/components/gameMaster/assetManager/partials/characterHair/CharacterHairList.vue
@@ -11,7 +11,13 @@
</div>
<div v-bind="containerProps" class="overflow-y-auto relative p-2.5 rounded-md default-border bg-gray" @scroll="onScroll">
<div v-bind="wrapperProps" ref="elementToScroll">
- <a v-for="{ data: characterHair } in list" :key="characterHair.id" class="relative p-2.5 cursor-pointer block rounded hover:bg-cyan group" :class="{ 'bg-cyan': assetManagerStore.selectedCharacterHair?.id === characterHair.id }" @click="assetManagerStore.setSelectedCharacterHair(characterHair as CharacterHair)">
+ <a
+ v-for="{ data: characterHair } in list"
+ :key="characterHair.id"
+ class="relative p-2.5 cursor-pointer block rounded hover:bg-cyan group"
+ :class="{ 'bg-cyan': assetManagerStore.selectedCharacterHair?.id === characterHair.id }"
+ @click="assetManagerStore.setSelectedCharacterHair(characterHair as CharacterHair)"
+ >
<div class="flex items-center gap-2.5">
<span class="group-hover:text-white" :class="{ 'text-white': assetManagerStore.selectedCharacterHair?.id === characterHair.id }">{{ characterHair.name }}</span>
</div>
diff --git a/src/components/gameMaster/assetManager/partials/characterType/CharacterTypeList.vue b/src/components/gameMaster/assetManager/partials/characterType/CharacterTypeList.vue
index ada453d..6809725 100644
--- a/src/components/gameMaster/assetManager/partials/characterType/CharacterTypeList.vue
+++ b/src/components/gameMaster/assetManager/partials/characterType/CharacterTypeList.vue
@@ -11,7 +11,13 @@
</div>
<div v-bind="containerProps" class="overflow-y-auto relative p-2.5 rounded-md default-border bg-gray" @scroll="onScroll">
<div v-bind="wrapperProps" ref="elementToScroll">
- <a v-for="{ data: characterType } in list" :key="characterType.id" class="relative p-2.5 cursor-pointer block rounded hover:bg-cyan group" :class="{ 'bg-cyan': assetManagerStore.selectedCharacterType?.id === characterType.id }" @click="assetManagerStore.setSelectedCharacterType(characterType as CharacterType)">
+ <a
+ v-for="{ data: characterType } in list"
+ :key="characterType.id"
+ class="relative p-2.5 cursor-pointer block rounded hover:bg-cyan group"
+ :class="{ 'bg-cyan': assetManagerStore.selectedCharacterType?.id === characterType.id }"
+ @click="assetManagerStore.setSelectedCharacterType(characterType as CharacterType)"
+ >
<div class="flex items-center gap-2.5">
<span class="group-hover:text-white" :class="{ 'text-white': assetManagerStore.selectedCharacterType?.id === characterType.id }">{{ characterType.name }}</span>
</div>
diff --git a/src/components/gameMaster/assetManager/partials/item/itemDetails.vue b/src/components/gameMaster/assetManager/partials/item/itemDetails.vue
index 3415aa0..e1ca767 100644
--- a/src/components/gameMaster/assetManager/partials/item/itemDetails.vue
+++ b/src/components/gameMaster/assetManager/partials/item/itemDetails.vue
@@ -140,4 +140,4 @@ onMounted(() => {
onBeforeUnmount(() => {
assetManagerStore.setSelectedItem(null)
})
-</script>
\ No newline at end of file
+</script>
diff --git a/src/components/gameMaster/assetManager/partials/item/itemList.vue b/src/components/gameMaster/assetManager/partials/item/itemList.vue
index a741333..2cdcc43 100644
--- a/src/components/gameMaster/assetManager/partials/item/itemList.vue
+++ b/src/components/gameMaster/assetManager/partials/item/itemList.vue
@@ -64,10 +64,7 @@ const filteredItems = computed(() => {
if (!searchQuery.value) {
return assetManagerStore.itemList
}
- return assetManagerStore.itemList.filter((item) =>
- item.name.toLowerCase().includes(searchQuery.value.toLowerCase()) ||
- item.itemType.toLowerCase().includes(searchQuery.value.toLowerCase())
- )
+ return assetManagerStore.itemList.filter((item) => item.name.toLowerCase().includes(searchQuery.value.toLowerCase()) || item.itemType.toLowerCase().includes(searchQuery.value.toLowerCase()))
})
const { list, containerProps, wrapperProps, scrollTo } = useVirtualList(filteredItems, {
@@ -95,4 +92,4 @@ onMounted(() => {
assetManagerStore.setItemList(response)
})
})
-</script>
\ No newline at end of file
+</script>
diff --git a/src/components/login/LoginForm.vue b/src/components/login/LoginForm.vue
index 58d9e46..d95eb50 100644
--- a/src/components/login/LoginForm.vue
+++ b/src/components/login/LoginForm.vue
@@ -1,5 +1,5 @@
<template>
- <form @submit.prevent="loginFunc" class="relative px-6 py-11">
+ <form @submit.prevent="submit" class="relative px-6 py-11">
<div class="flex flex-col gap-5 p-2 mb-8 relative">
<div class="w-full grid gap-3 relative">
<input class="input-field xs:min-w-[350px] min-w-64" id="username-login" v-model="username" type="text" name="username" placeholder="Username" required autofocus />
@@ -7,7 +7,7 @@
<input class="input-field xs:min-w-[350px] min-w-64" id="password-login" v-model="password" :type="showPassword ? 'text' : 'password'" name="password" placeholder="Password" required />
<button type="button" @click.prevent="showPassword = !showPassword" :class="{ 'eye-open': showPassword }" class="bg-[url('/assets/icons/eye.svg')] p-0 absolute right-3 w-5 h-4 top-1/2 -translate-y-1/2 bg-no-repeat bg-center"></button>
</div>
- <span v-if="loginError" class="text-red-200 text-xs absolute top-full mt-1">{{ loginError }}</span>
+ <span v-if="formError" class="text-red-200 text-xs absolute top-full mt-1">{{ formError }}</span>
</div>
<button @click.stop="() => emit('openResetPasswordModal')" type="button" class="inline-flex self-end p-0 text-cyan-300 text-base">Forgot password?</button>
<button class="btn-cyan px-0 xs:w-full" type="submit">Play now</button>
@@ -36,7 +36,7 @@ const emit = defineEmits(['openResetPasswordModal', 'switchToRegister'])
const gameStore = useGameStore()
const username = ref('')
const password = ref('')
-const loginError = ref('')
+const formError = ref('')
const showPassword = ref(false)
// automatic login because of development
@@ -48,10 +48,10 @@ onMounted(async () => {
}
})
-async function loginFunc() {
+async function submit() {
// check if username and password are valid
if (username.value === '' || password.value === '') {
- loginError.value = 'Please enter a valid username and password'
+ formError.value = 'Please enter a valid username and password'
return
}
@@ -59,7 +59,7 @@ async function loginFunc() {
const response = await login(username.value, password.value)
if (response.success === undefined) {
- loginError.value = response.error
+ formError.value = response.error
return
}
gameStore.setToken(response.token)
diff --git a/src/components/login/RegisterForm.vue b/src/components/login/RegisterForm.vue
index 206c086..46506c2 100644
--- a/src/components/login/RegisterForm.vue
+++ b/src/components/login/RegisterForm.vue
@@ -1,5 +1,5 @@
<template>
- <form @submit.prevent="registerFunc" class="relative px-6 py-11">
+ <form @submit.prevent="submit" class="relative px-6 py-11">
<div class="flex flex-col gap-5 p-2 mb-8 relative">
<div class="w-full grid gap-3 relative">
<input class="input-field xs:min-w-[350px] min-w-64" id="username-register" v-model="username" type="text" name="username" placeholder="Username" required autofocus />
@@ -8,7 +8,7 @@
<input class="input-field xs:min-w-[350px] min-w-64" id="password-register" v-model="password" :type="showPassword ? 'text' : 'password'" name="password" placeholder="Password" required />
<button type="button" @click.prevent="showPassword = !showPassword" :class="{ 'eye-open': showPassword }" class="bg-[url('/assets/icons/eye.svg')] p-0 absolute right-3 w-4 h-3 top-1/2 -translate-y-1/2 bg-no-repeat"></button>
</div>
- <span v-if="loginError" class="text-red-200 text-xs -mt-2">{{ loginError }}</span>
+ <span v-if="formError" class="text-red-200 text-xs -mt-2">{{ formError }}</span>
</div>
<button class="btn-cyan xs:w-full" type="submit">Register now</button>
@@ -37,7 +37,7 @@ const gameStore = useGameStore()
const username = ref('')
const password = ref('')
const email = ref('')
-const loginError = ref('')
+const formError = ref('')
const showPassword = ref(false)
// automatic login because of development
@@ -49,34 +49,15 @@ onMounted(async () => {
}
})
-async function loginFunc() {
- // check if username and password are valid
- if (username.value === '' || password.value === '') {
- loginError.value = 'Please enter a valid username and password'
- return
- }
-
- // send login event to server
- const response = await login(username.value, password.value)
-
- if (response.success === undefined) {
- loginError.value = response.error
- return
- }
- gameStore.setToken(response.token)
- gameStore.initConnection()
- return true // Indicate success
-}
-
-async function registerFunc() {
+async function submit() {
// check if username and password are valid
if (username.value === '' || email.value === '' || password.value === '') {
- loginError.value = 'Please enter a valid username, email, and password'
+ formError.value = 'Please enter a valid username, email, and password'
return
}
if (email.value === '') {
- loginError.value = 'Please enter an email'
+ formError.value = 'Please enter an email'
return
}
@@ -84,14 +65,18 @@ async function registerFunc() {
const response = await register(username.value, email.value, password.value)
if (response.success === undefined) {
- loginError.value = response.error
+ formError.value = response.error
return
}
- const loginSuccess = await loginFunc()
- if (!loginSuccess) {
- loginError.value = 'Login after registration failed. Please try logging in manually.'
+ const loginResponse = await login(username.value, password.value)
+
+ if (!loginResponse) {
+ formError.value = 'Login after registration failed. Please try logging in manually.'
return
}
+
+ gameStore.setToken(loginResponse.token)
+ gameStore.initConnection()
}
</script>
diff --git a/src/components/screens/Characters.vue b/src/components/screens/Characters.vue
index e2c12f4..7ec391a 100644
--- a/src/components/screens/Characters.vue
+++ b/src/components/screens/Characters.vue
@@ -16,12 +16,7 @@
<div class="flex w-full max-lg:flex-col lg:h-[400px] default-border rounded-md rounded-tl-none bg-gray">
<div class="lg:min-w-[285px] max-lg:min-h-[383px] lg:w-1/3 h-full bg-[url('/assets/ui-texture.png')] bg-no-repeat bg-cover bg-center border-0 max-lg:border-b lg:border-r border-solid border-gray-500 max-lg:rounded-tr-md lg:rounded-bl-md relative">
<div class="absolute right-full -top-px flex gap-1 flex-col">
- <div
- v-for="character in characters"
- :key="character.id"
- class="character relative rounded-l default-border w-9 h-[50px] bg-[url('/assets/ui-texture.png')] after:absolute after:w-full after:h-px after:bg-gray-500"
- :class="{ active: selectedCharacterId === character.id }"
- >
+ <div v-for="character in characters" :key="character.id" class="character relative rounded-l default-border w-9 h-[50px] bg-[url('/assets/ui-texture.png')] after:absolute after:w-full after:h-px after:bg-gray-500" :class="{ active: selectedCharacterId === character.id }">
<img src="/assets/placeholders/head.png" class="w-9 h-9 object-contain absolute top-1/2 -translate-y-1/2" alt="Player head" />
<input class="h-full w-full absolute m-0 z-10 hover:cursor-pointer focus-visible:outline-offset-0" type="radio" name="character" :value="character.id" v-model="selectedCharacterId" />
</div>
@@ -33,13 +28,14 @@
</div>
<div class="py-6 px-8 h-[calc(100%_-_48px)] flex flex-col items-center gap-6 justify-center" v-if="selectedCharacterId">
<input class="input-field w-[158px]" type="text" name="name" :placeholder="characters.find((c) => c.id == selectedCharacterId)?.name" />
- <div class="flex flex-col gap-4 items-center">s
+ <div class="flex flex-col gap-4 items-center">
+ s
<div class="flex flex-col gap-3">
<div class="bg-[url('/assets/ui-elements/character-select-ui-shape.svg')] w-[190px] h-52 bg-no-repeat bg-center flex items-center justify-between">
<button class="ml-6 w-4 h-8 p-0">
<img src="/assets/icons/triangle-icon.svg" class="w-3 h-3.5 m-auto" alt="Arrow left" />
</button>
- <img class="w-24 object-contain mb-3.5" alt="Player avatar" :src="config.server_endpoint + '/avatar/s/' + characters.find(c => c.id === selectedCharacterId)?.characterType?.id + '/' + (selectedHairId ?? 'default')" />
+ <img class="w-24 object-contain mb-3.5" alt="Player avatar" :src="config.server_endpoint + '/avatar/s/' + characters.find((c) => c.id === selectedCharacterId)?.characterType?.id + '/' + (selectedHairId ?? 'default')" />
<button class="mr-6 w-4 h-8 p-0">
<img src="/assets/icons/triangle-icon.svg" class="w-3 h-3.5 -scale-x-100" alt="Arrow right" />
</button>
diff --git a/src/components/screens/Login.vue b/src/components/screens/Login.vue
index 188bdad..9391586 100644
--- a/src/components/screens/Login.vue
+++ b/src/components/screens/Login.vue
@@ -6,7 +6,7 @@
<div class="bg-[url('/assets/login/login-bg.png')] w-full lg:w-1/2 h-[35dvh] lg:h-dvh absolute left-0 max-lg:bottom-0 lg:top-0 bg-no-repeat bg-cover bg-center"></div>
<div class="bg-gray-900 z-20 w-full lg:w-1/2 h-[65dvh] lg:h-dvh relative">
<div class="h-dvh flex items-center lg:justify-center flex-col px-8 max-lg:pt-20">
-<!-- <img src="/assets/tlogo.png" class="mb-10 w-52" alt="Noxious logo" />-->
+ <!-- <img src="/assets/tlogo.png" class="mb-10 w-52" alt="Noxious logo" />-->
<div class="relative">
<img src="/assets/ui-elements/login-ui-box-outer.svg" class="absolute w-full h-full" alt="UI box outer" />
<img src="/assets/ui-elements/login-ui-box-inner.svg" class="absolute left-2 top-2 w-[calc(100%_-_16px)] h-[calc(100%_-_16px)] max-lg:hidden" alt="UI box inner" />
diff --git a/src/components/utilities/Controls.vue b/src/components/utilities/Controls.vue
index 83a3345..b924bfc 100644
--- a/src/components/utilities/Controls.vue
+++ b/src/components/utilities/Controls.vue
@@ -32,21 +32,13 @@ const { setupPointerHandlers, cleanupPointerHandlers } = usePointerHandlers(scen
function handleScrollZoom(pointer: Phaser.Input.Pointer) {
if (!(pointer.event instanceof WheelEvent && pointer.event.shiftKey)) return
- const zoomLevel = Phaser.Math.Clamp(
- camera.zoom - pointer.event.deltaY * ZOOM_SETTINGS.WHEEL_FACTOR,
- ZOOM_SETTINGS.MIN,
- ZOOM_SETTINGS.MAX
- )
+ const zoomLevel = Phaser.Math.Clamp(camera.zoom - pointer.event.deltaY * ZOOM_SETTINGS.WHEEL_FACTOR, ZOOM_SETTINGS.MIN, ZOOM_SETTINGS.MAX)
camera.setZoom(zoomLevel)
}
function handleKeyComboZoom(event: { keyCodes: number[] }) {
const deltaY = event.keyCodes[1] === 38 ? 1 : -1 // 38 is Up, 40 is Down
- const zoomLevel = Phaser.Math.Clamp(
- camera.zoom + deltaY * ZOOM_SETTINGS.KEY_FACTOR,
- ZOOM_SETTINGS.MIN,
- ZOOM_SETTINGS.MAX
- )
+ const zoomLevel = Phaser.Math.Clamp(camera.zoom + deltaY * ZOOM_SETTINGS.KEY_FACTOR, ZOOM_SETTINGS.MIN, ZOOM_SETTINGS.MAX)
camera.setZoom(zoomLevel)
}
@@ -63,4 +55,4 @@ onBeforeUnmount(() => {
scene.input.keyboard?.off('keycombomatch')
scene.input.off(Phaser.Input.Events.POINTER_WHEEL, handleScrollZoom)
})
-</script>
\ No newline at end of file
+</script>
diff --git a/src/composables/gameComposable.ts b/src/composables/gameComposable.ts
index f5f5787..fcfe1c8 100644
--- a/src/composables/gameComposable.ts
+++ b/src/composables/gameComposable.ts
@@ -61,8 +61,9 @@ export async function loadSpriteTextures(scene: Phaser.Scene, sprite: Sprite) {
// @TODO: Fix this
const sprite_actions: HttpResponse<any[]> = await fetch(config.server_endpoint + '/assets/list_sprite_actions/' + sprite?.id).then((response) => response.json())
-
+
for await (const sprite_action of sprite_actions.data ?? []) {
+ console.log(sprite_action)
await loadTexture(scene, {
key: sprite_action.key,
data: sprite_action.data,
@@ -73,7 +74,7 @@ export async function loadSpriteTextures(scene: Phaser.Scene, sprite: Sprite) {
isAnimated: sprite_action.isAnimated,
frameWidth: sprite_action.frameWidth,
frameHeight: sprite_action.frameHeight,
- frameRate: sprite_action.frameRate,
+ frameRate: sprite_action.frameRate
} as AssetDataT)
// If the sprite is not animated, skip
@@ -88,7 +89,7 @@ export async function loadSpriteTextures(scene: Phaser.Scene, sprite: Sprite) {
scene.anims.create({
key: sprite_action.key,
frameRate: sprite_action.frameRate,
- frames: scene.anims.generateFrameNumbers(sprite_action.key, { start: 0, end: sprite_action.frameRate! - 1 }),
+ frames: scene.anims.generateFrameNumbers(sprite_action.key, { start: 0, end: sprite_action.frameCount! - 1 }),
repeat: -1
})
}
diff --git a/src/services/authentication.ts b/src/services/authentication.ts
index 2ed37a7..035d761 100644
--- a/src/services/authentication.ts
+++ b/src/services/authentication.ts
@@ -6,8 +6,10 @@ import { getDomain } from '@/application/utilities'
export async function register(username: string, email: string, password: string) {
try {
const response = await axios.post(`${config.server_endpoint}/register`, { username, email, password })
- useCookies().set('token', response.data.data.token as string)
- return { success: true, token: response.data.data.token }
+ if (response.status === 200) {
+ return { success: true }
+ }
+ return { error: response.data.message }
} catch (error: any) {
if (typeof error.response?.data === 'undefined') {
return { error: 'Could not connect to server' }
diff --git a/src/storage/assetStorage.ts b/src/storage/assetStorage.ts
index afe2095..54b4304 100644
--- a/src/storage/assetStorage.ts
+++ b/src/storage/assetStorage.ts
@@ -33,9 +33,10 @@ export class AssetStorage {
originX: asset.originX,
originY: asset.originY,
isAnimated: asset.isAnimated,
+ frameRate: asset.frameRate,
frameWidth: asset.frameWidth,
frameHeight: asset.frameHeight,
- frameRate: asset.frameRate
+ frameCount: asset.frameCount
})
} catch (error) {
console.error(`Failed to add asset ${asset.key}:`, error)
diff --git a/src/stores/zoneStore.ts b/src/stores/zoneStore.ts
index 67552e7..ce66218 100644
--- a/src/stores/zoneStore.ts
+++ b/src/stores/zoneStore.ts
@@ -40,10 +40,10 @@ export const useZoneStore = defineStore('zone', {
setCharacterLoaded(loaded: boolean) {
this.characterLoaded = loaded
},
- updateCharacterPosition(data: { id: number, positionX: number, positionY: number, rotation: number, isMoving: boolean }) {
- const character = this.characters.find(char => char.character.id === data.id)
+ updateCharacterPosition(data: { id: number; positionX: number; positionY: number; rotation: number; isMoving: boolean }) {
+ const character = this.characters.find((char) => char.character.id === data.id)
if (character) {
- character.character.positionX= data.positionX
+ character.character.positionX = data.positionX
character.character.positionY = data.positionY
character.character.rotation = data.rotation
character.isMoving = data.isMoving