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

npm update, mobile scroll fix, zone editor object refactor work, removed redundant div

Browse Source
This commit is contained in:
Dennis Postma 2024-10-18 00:20:30 +02:00
parent 774871510e
commit aff32c33c7
6 changed files with 54 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<link rel="icon" href="/favicon.ico"> <link rel="icon" href="/favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"/> <meta name="viewport" content="width=device-width">
<title>Sylvan Quest - Play</title> <title>Sylvan Quest - Play</title>
</head> </head>
<body> <body>

6
package-lock.json generated
View File

@ -3642,9 +3642,9 @@
} }
}, },
"node_modules/electron-to-chromium": { "node_modules/electron-to-chromium": {
"version": "1.5.40", "version": "1.5.41",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.40.tgz", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.41.tgz",
"integrity": "sha512-LYm78o6if4zTasnYclgQzxEcgMoIcybWOhkATWepN95uwVVWV0/IW10v+2sIeHE+bIYWipLneTftVyQm45UY7g==", "integrity": "sha512-dfdv/2xNjX0P8Vzme4cfzHqnPm5xsZXwsolTYr0eyW18IUmNyG08vL+fttvinTfhKfIKdRoqkDIC9e9iWQCNYQ==",
"dev": true, "dev": true,
"license": "ISC" "license": "ISC"
}, },

2
src/App.vue
View File

@ -1,8 +1,6 @@
<template> <template>
<div class="overflow-hidden">
<Notifications /> <Notifications />
<component :is="currentScreen" /> <component :is="currentScreen" />
</div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">

2
src/assets/scss/main.scss
View File

@ -12,7 +12,7 @@
//Globals //Globals
body { body {
@apply bg-black m-0 select-none overscroll-none overflow-hidden; @apply bg-black m-0 select-none;
-ms-overflow-style: none; -ms-overflow-style: none;
scrollbar-width: none; scrollbar-width: none;

49
src/components/gameMaster/zoneEditor/Objects.vue
View File

@ -1,6 +1,10 @@
<template> <template>
<SelectedZoneObject v-if="selectedZoneObject" :zoneObject="selectedZoneObject" /> <SelectedZoneObject v-if="selectedZoneObject" :zoneObject="selectedZoneObject" />
<Image v-for="object in zoneEditorStore.zone?.zoneObjects" :key="object.id" v-bind="getObjectImageProps(object)" /> <Image
v-for="object in zoneEditorStore.zone?.zoneObjects"
v-bind="getObjectImageProps(object)"
@pointerup="() => selectedZoneObject = object"
/>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
@ -10,7 +14,7 @@ import { Image, useScene } from 'phavuer'
import { useZoneEditorStore } from '@/stores/zoneEditorStore' import { useZoneEditorStore } from '@/stores/zoneEditorStore'
import type { ZoneObject } from '@/types' import type { ZoneObject } from '@/types'
import SelectedZoneObject from '@/components/gameMaster/zoneEditor/partials/SelectedZoneObject.vue' import SelectedZoneObject from '@/components/gameMaster/zoneEditor/partials/SelectedZoneObject.vue'
import { onBeforeMount, onBeforeUnmount, ref } from 'vue' import { onBeforeMount, onBeforeUnmount, ref, watch } from 'vue'
const scene = useScene() const scene = useScene()
const zoneEditorStore = useZoneEditorStore() const zoneEditorStore = useZoneEditorStore()
@ -24,9 +28,10 @@ function getObjectImageProps(object: ZoneObject) {
return { return {
// alpha: object.id === movingZoneObject.value?.id ? .5 : 1, // alpha: object.id === movingZoneObject.value?.id ? .5 : 1,
depth: calculateIsometricDepth(object.positionX, object.positionY, object.object.frameWidth, object.object.frameHeight), depth: calculateIsometricDepth(object.positionX, object.positionY, object.object.frameWidth, object.object.frameHeight),
tint: selectedZoneObject?.id === object.id ? 0x00ff00 : 0xffffff, tint: selectedZoneObject.value?.id === object.id ? 0x00ff00 : 0xffffff,
x: tileToWorldX(props.tilemap as any, object.positionX, object.positionY), x: tileToWorldX(props.tilemap as any, object.positionX, object.positionY),
y: tileToWorldY(props.tilemap as any, object.positionX, object.positionY), y: tileToWorldY(props.tilemap as any, object.positionX, object.positionY),
flipX: object.isRotated,
texture: object.object.id, texture: object.object.id,
originY: Number(object.object.originX), originY: Number(object.object.originX),
originX: Number(object.object.originY) originX: Number(object.object.originY)
@ -80,4 +85,42 @@ onBeforeUnmount(() => {
scene.input.off(Phaser.Input.Events.POINTER_DOWN, addZoneObject) scene.input.off(Phaser.Input.Events.POINTER_DOWN, addZoneObject)
scene.input.off(Phaser.Input.Events.POINTER_MOVE, addZoneObject) scene.input.off(Phaser.Input.Events.POINTER_MOVE, addZoneObject)
}) })
// watch zoneEditorStore.objectList and update originX and originY of objects in zoneObjects
watch(
zoneEditorStore.objectList,
(newObjects) => {
// Check if zoneEditorStore.zone is set
if (!zoneEditorStore.zone) return
// Update zoneObjects
zoneEditorStore.zone.zoneObjects = zoneEditorStore.zone.zoneObjects.map((zoneObject) => {
const updatedObject = newObjects.find((obj) => obj.id === zoneObject.objectId)
if (updatedObject) {
return {
...zoneObject,
object: {
...zoneObject.object,
originX: updatedObject.originX,
originY: updatedObject.originY
}
}
}
return zoneObject
})
// Update selectedObject if it's set
if (zoneEditorStore.selectedObject) {
const updatedObject = newObjects.find((obj) => obj.id === zoneEditorStore.selectedObject?.id)
if (updatedObject) {
zoneEditorStore.setSelectedObject({
...zoneEditorStore.selectedObject,
originX: updatedObject.originX,
originY: updatedObject.originY
})
}
}
},
{ deep: true }
)
</script> </script>

3
src/components/zone/Objects.vue
View File

@ -1,6 +1,5 @@
<template> <template>
<Image v-for="object in zoneStore.zone?.zoneObjects" :key="object.id" v-bind="getObjectImageProps(object)" /> <Image v-for="object in zoneStore.zone?.zoneObjects" v-bind="getObjectImageProps(object)" />
<!-- <Text v-for="object in zoneStore.zone?.zoneObjects" :key="object.id" :depth="99999" :text="Math.ceil(calculateIsometricDepth(object.positionX, object.positionY, object.object.frameWidth, object.object.frameHeight))" v-bind="getObjectProps(object)" />-->
</template> </template>
<script setup lang="ts"> <script setup lang="ts">