noxious/client
6
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

npm run format

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/gameMaster/zoneEditor/partials/TeleportModal.vue
View File

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

106
src/components/gui/Chat.vue
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')
})

33
src/components/sprites/Character.vue
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>