forked from noxious/client
npm update, mobile scroll fix, zone editor object refactor work, removed redundant div
This commit is contained in:
parent
774871510e
commit
aff32c33c7
@ -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
6
package-lock.json
generated
@ -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"
|
||||||
},
|
},
|
||||||
|
@ -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">
|
||||||
|
@ -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;
|
||||||
|
|
||||||
|
@ -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>
|
||||||
|
@ -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">
|
||||||
|
Loading…
x
Reference in New Issue
Block a user