From 5c60fadaa30e7533d600a1392dc7e861d254cff5 Mon Sep 17 00:00:00 2001
From: Dennis Postma <dennis@directonline.io>
Date: Sat, 1 Jun 2024 15:01:05 +0200
Subject: [PATCH] npm update, modal bug fix
---
package-lock.json | 18 +++++++++---------
src/components/World.vue | 4 ++--
.../{player/Player.vue => Character.vue} | 17 +++++++++++++++--
src/components/utilities/Modal.vue | 6 +++++-
4 files changed, 31 insertions(+), 14 deletions(-)
rename src/components/sprites/{player/Player.vue => Character.vue} (82%)
diff --git a/package-lock.json b/package-lock.json
index 0ffb734..1715833 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1765,9 +1765,9 @@
"license": "MIT"
},
"node_modules/@types/node": {
- "version": "20.12.13",
- "resolved": "https://registry.npmjs.org/@types/node/-/node-20.12.13.tgz",
- "integrity": "sha512-gBGeanV41c1L171rR7wjbMiEpEI/l5XFQdLLfhr/REwpgDy/4U8y89+i8kRiLzDyZdOkXh+cRaTetUnCYutoXA==",
+ "version": "20.13.0",
+ "resolved": "https://registry.npmjs.org/@types/node/-/node-20.13.0.tgz",
+ "integrity": "sha512-FM6AOb3khNkNIXPnHFDYaHerSv8uN22C91z098AnGccVu+Pcdhi+pNUFDi0iLmPIsVE0JBD0KVS7mzUYt4nRzQ==",
"dev": true,
"license": "MIT",
"dependencies": {
@@ -3401,9 +3401,9 @@
}
},
"node_modules/electron-to-chromium": {
- "version": "1.4.787",
- "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.787.tgz",
- "integrity": "sha512-d0EFmtLPjctczO3LogReyM2pbBiiZbnsKnGF+cdZhsYzHm/A0GV7W94kqzLD8SN4O3f3iHlgLUChqghgyznvCQ==",
+ "version": "1.4.788",
+ "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.788.tgz",
+ "integrity": "sha512-ubp5+Ev/VV8KuRoWnfP2QF2Bg+O2ZFdb49DiiNbz2VmgkIqrnyYaqIOqj8A6K/3p1xV0QcU5hBQ1+BmB6ot1OA==",
"dev": true,
"license": "ISC"
},
@@ -6845,9 +6845,9 @@
"license": "MIT"
},
"node_modules/vue-eslint-parser": {
- "version": "9.4.2",
- "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-9.4.2.tgz",
- "integrity": "sha512-Ry9oiGmCAK91HrKMtCrKFWmSFWvYkpGglCeFAIqDdr9zdXmMMpJOmUJS7WWsW7fX81h6mwHmUZCQQ1E0PkSwYQ==",
+ "version": "9.4.3",
+ "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-9.4.3.tgz",
+ "integrity": "sha512-2rYRLWlIpaiN8xbPiDyXZXRgLGOtWxERV7ND5fFAv5qo1D2N9Fu9MNajBNc6o13lZ+24DAWCkQCvj4klgmcITg==",
"dev": true,
"license": "MIT",
"dependencies": {
diff --git a/src/components/World.vue b/src/components/World.vue
index 17e1056..304dd6d 100644
--- a/src/components/World.vue
+++ b/src/components/World.vue
@@ -3,13 +3,13 @@
<Controls :layer="layer" />
<Player :layer="layer" />
<Container v-if="zoneStore.isLoaded && zoneStore.getPlayers.length > 0">
- <Player :layer="layer" v-for="player in zoneStore.getPlayers" :key="player.id" :player="player" />
+ <Character :layer="layer" v-for="player in zoneStore.getPlayers" :key="player.id" :player="player" />
</Container>
</template>
<script setup lang="ts">
import { Container, refObj, TilemapLayer, useScene } from 'phavuer'
-import Player from '@/components/sprites/player/Player.vue'
+import Character from '@/components/sprites/Character.vue'
import config from '@/config'
import { onBeforeMount, onMounted, reactive, ref, type Ref, toRaw, watch } from 'vue'
import Tileset = Phaser.Tilemaps.Tileset
diff --git a/src/components/sprites/player/Player.vue b/src/components/sprites/Character.vue
similarity index 82%
rename from src/components/sprites/player/Player.vue
rename to src/components/sprites/Character.vue
index 46f3044..428a210 100644
--- a/src/components/sprites/player/Player.vue
+++ b/src/components/sprites/Character.vue
@@ -1,9 +1,22 @@
<template>
- <Sprite ref="sprite" texture="player" :x="position.x" :y="position.y" />
+
+ <Container>
+ <Text
+ :text="'Hello world'"
+ :style="{
+ fontFamily: 'Helvetica, Arial',
+ color: '#42B883',
+ fontSize: '26px',
+ fontStyle: 'bold',
+ strokeThickness: 8,
+ stroke: '#213547'
+ }" />
+ <Sprite ref="sprite" texture="player" :x="position.x" :y="position.y" />
+ </Container>
</template>
<script lang="ts" setup>
-import { onPostUpdate, onPreUpdate, Sprite, useScene } from 'phavuer'
+import { Container, onPostUpdate, onPreUpdate, Sprite, Text, useScene } from 'phavuer'
import { reactive, type Ref, ref } from 'vue'
import config from '@/config'
import { useSocketStore } from '@/stores/socket'
diff --git a/src/components/utilities/Modal.vue b/src/components/utilities/Modal.vue
index 2aa21f9..b53b002 100644
--- a/src/components/utilities/Modal.vue
+++ b/src/components/utilities/Modal.vue
@@ -13,7 +13,7 @@
</template>
<script setup lang="ts">
-import { defineEmits, onMounted, onUnmounted, ref } from 'vue'
+import { defineEmits, onMounted, onUnmounted, ref, watch } from 'vue'
const properties = defineProps({
isModalOpen: {
@@ -22,6 +22,10 @@ const properties = defineProps({
}
});
+watch(() => properties.isModalOpen, (value) => {
+ isModalOpen.value = value;
+});
+
const isModalOpen = ref(properties.isModalOpen);
const emit = defineEmits(["modal:close", "character:create"]);