npm run format

This commit is contained in:
Dennis Postma 2024-09-28 02:17:51 +02:00
parent 1105a53feb
commit 130df8f144
7 changed files with 79 additions and 73 deletions

View File

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

View File

@ -59,61 +59,61 @@ const scrollToBottom = () => {
})
}
gameStore.connection?.on('chat:message', (data: ChatMessage) => {
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)
})
gameStore.connection?.on('chat:message', (data: ChatMessage) => {
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()
onBeforeUnmount(() => {
gameStore.connection?.off('chat:message')
})

View File

@ -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);
return;
charSprite.value!.anims.play(charTexture.value, true)
return
}
charSprite.value!.anims.stop();
charSprite.value!.setFrame(0);
charSprite.value!.setTexture(charTexture.value);
charSprite.value!.anims.stop()
charSprite.value!.setFrame(0)
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) => {
if (!newChar) return
watch(
() => props.character,
(newChar, oldChar) => {
if (!newChar) return
if (!oldChar || newChar.positionX !== oldChar.positionX || newChar.positionY !== oldChar.positionY) {
const direction = !oldChar ? Direction.POSITIVE : calcDirection(oldChar.positionX, oldChar.positionY, newChar.positionX, newChar.positionY)
updatePosition(newChar.positionX, newChar.positionY, direction)
if (!oldChar || newChar.positionX !== oldChar.positionX || newChar.positionY !== oldChar.positionY) {
const direction = !oldChar ? Direction.POSITIVE : calcDirection(oldChar.positionX, oldChar.positionY, newChar.positionX, newChar.positionY)
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>

View File

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

View File

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

View File

@ -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);
}
)

View File

@ -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.characterLoaded = false
;(this.characters = []), (this.characterLoaded = false)
}
}
})