npm update, npm run format
This commit is contained in:
parent
fc34a488d9
commit
0d5acd48ce
6
package-lock.json
generated
6
package-lock.json
generated
@ -1998,9 +1998,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@types/node": {
|
||||
"version": "20.17.24",
|
||||
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.17.24.tgz",
|
||||
"integrity": "sha512-d7fGCyB96w9BnWQrOsJtpyiSaBcAYYr75bnK6ZRjDbql2cGLj/3GsL5OYmLPNq76l7Gf2q4Rv9J2o6h5CrD9sA==",
|
||||
"version": "20.17.25",
|
||||
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.17.25.tgz",
|
||||
"integrity": "sha512-bT+r2haIlplJUYtlZrEanFHdPIZTeiMeh/fSOEbOOfWf9uTn+lg8g0KU6Q3iMgjd9FLuuMAgfCNSkjUbxL6E3Q==",
|
||||
"devOptional": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
|
||||
@ -56,7 +56,7 @@ onPreUpdate(() => {
|
||||
orderedImages.forEach((child, index) => {
|
||||
const image = child as Phaser.GameObjects.Image
|
||||
if (image && props.obj) {
|
||||
image.flipX = props.obj.isRotated;
|
||||
image.flipX = props.obj.isRotated
|
||||
|
||||
if (props.obj.isRotated) {
|
||||
var offsetNum = props.mapObj!.depthOffsets.length
|
||||
@ -64,15 +64,13 @@ onPreUpdate(() => {
|
||||
//Could break in case of images with odd partion number
|
||||
//Shifts image over so that it becomes aligned again after flipping
|
||||
if (index < offsetNum / 2) {
|
||||
image.x = props.x! - (props.mapObj!.frameWidth/offsetNum)
|
||||
}
|
||||
else {
|
||||
image.x = props.x! + (props.mapObj!.frameWidth/offsetNum)
|
||||
image.x = props.x! - props.mapObj!.frameWidth / offsetNum
|
||||
} else {
|
||||
image.x = props.x! + props.mapObj!.frameWidth / offsetNum
|
||||
}
|
||||
|
||||
image.setDepth(baseDepth - props.mapObj!.depthOffsets[index])
|
||||
}
|
||||
else {
|
||||
} else {
|
||||
image.x = props.x!
|
||||
image.setDepth(baseDepth + props.mapObj!.depthOffsets[index])
|
||||
}
|
||||
@ -80,7 +78,6 @@ onPreUpdate(() => {
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
// Initial setup
|
||||
if (props.mapObj && props.x && props.y) {
|
||||
baseDepth = calculateIsometricDepth(props.obj!.positionX, props.obj!.positionY)
|
||||
@ -88,7 +85,7 @@ if (props.mapObj && props.x && props.y) {
|
||||
group.setXY(props.x, props.y)
|
||||
group.setOrigin(props.mapObj.originX, props.mapObj.originY)
|
||||
|
||||
let sliceCount = props.mapObj.depthOffsets.length;
|
||||
let sliceCount = props.mapObj.depthOffsets.length
|
||||
for (let j = 1; j <= sliceCount; j++) {
|
||||
partitionPoints.push(j * (props.mapObj.frameWidth / sliceCount))
|
||||
}
|
||||
|
||||
@ -3,26 +3,22 @@
|
||||
<div class="relative p-2.5 flex flex-col items-center justify-center h-72 rounded-md default-border bg-gray">
|
||||
<div class="grid grid-cols-[160px_auto_max-content] gap-12">
|
||||
<div>
|
||||
<input type="checkbox" checked v-model="showOrigin"><label>Show Origin</label>
|
||||
<br>
|
||||
<input type="checkbox" checked v-model="showPartitionOverlay"><label>Show Partitions</label>
|
||||
<input type="checkbox" checked v-model="showOrigin" /><label>Show Origin</label>
|
||||
<br />
|
||||
<input type="checkbox" checked v-model="showPartitionOverlay" /><label>Show Partitions</label>
|
||||
</div>
|
||||
<div class="relative w-fit h-fit">
|
||||
<img class="max-h-56" :src="`${config.server_endpoint}/textures/map_objects/${selectedMapObject?.id}.png`" :alt="'Object ' + selectedMapObject?.id" ref="imageRef" />
|
||||
<svg ref="svg" class="absolute top-0 left-0 w-full h-full inline-block pointer-events-none">
|
||||
<circle v-if="showOrigin && svg" r="4" :cx="mapObjectOriginX * width" :cy="mapObjectOriginY * height" stroke="white" stroke-width="2" />
|
||||
<rect v-if="showPartitionOverlay && svg" v-for="(offset, index) in mapObjectDepthOffsets" style="opacity:0.5" stroke="red"
|
||||
:x="index*(width/mapObjectDepthOffsets.length)"
|
||||
:width="width/mapObjectDepthOffsets.length"
|
||||
:y="0"
|
||||
:height="height"/>
|
||||
<rect v-if="showPartitionOverlay && svg" v-for="(offset, index) in mapObjectDepthOffsets" style="opacity: 0.5" stroke="red" :x="index * (width / mapObjectDepthOffsets.length)" :width="width / mapObjectDepthOffsets.length" :y="0" :height="height" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<button class="btn-cyan px-4 py-1.5 min-w-24" @click="mapObjectDepthOffsets.push(0)">Add Partition</button>
|
||||
<p>Depth Offset</p>
|
||||
<div class="text-white grid grid-cols-[120px_80px_auto] items-baseline gap-2" v-for="(offset, index) in mapObjectDepthOffsets">
|
||||
<input class="input-field max-h-4 mt-2" type="number" :value="offset" @change="setPartitionDepth($event, index)">
|
||||
<input class="input-field max-h-4 mt-2" type="number" :value="offset" @change="setPartitionDepth($event, index)" />
|
||||
<button @click="mapObjectDepthOffsets.splice(index, 1)">Remove</button>
|
||||
</div>
|
||||
</div>
|
||||
@ -77,9 +73,9 @@ import ChipsInput from '@/components/forms/ChipsInput.vue'
|
||||
import { socketManager } from '@/managers/SocketManager'
|
||||
import { MapObjectStorage } from '@/storage/storages'
|
||||
import { useAssetManagerStore } from '@/stores/assetManagerStore'
|
||||
import { computed, onBeforeUnmount, onMounted, ref, useTemplateRef, watch } from 'vue'
|
||||
import { Rectangle } from 'phavuer'
|
||||
import { useElementSize } from '@vueuse/core'
|
||||
import { Rectangle } from 'phavuer'
|
||||
import { computed, onBeforeUnmount, onMounted, ref, useTemplateRef, watch } from 'vue'
|
||||
|
||||
const assetManagerStore = useAssetManagerStore()
|
||||
|
||||
@ -96,8 +92,8 @@ const mapObjectFrameRate = ref(0)
|
||||
const mapObjectFrameWidth = ref(0)
|
||||
const mapObjectFrameHeight = ref(0)
|
||||
const imageRef = ref<HTMLImageElement | null>(null)
|
||||
const showOrigin = ref(true);
|
||||
const showPartitionOverlay = ref(true);
|
||||
const showOrigin = ref(true)
|
||||
const showPartitionOverlay = ref(true)
|
||||
|
||||
if (!selectedMapObject.value) {
|
||||
console.error('No map mapObject selected')
|
||||
@ -114,7 +110,7 @@ if (selectedMapObject.value) {
|
||||
mapObjectFrameHeight.value = selectedMapObject.value.frameHeight
|
||||
}
|
||||
|
||||
const setPartitionDepth = (event: any, idx: number) => mapObjectDepthOffsets.value[idx] = Number.parseInt(event.target.value)
|
||||
const setPartitionDepth = (event: any, idx: number) => (mapObjectDepthOffsets.value[idx] = Number.parseInt(event.target.value))
|
||||
|
||||
async function removeObject() {
|
||||
if (!selectedMapObject.value) return
|
||||
|
||||
@ -7,14 +7,7 @@
|
||||
:placedMapObject="previewPlacedMapObject as PlacedMapObjectT"
|
||||
/>
|
||||
<SelectedPlacedMapObjectComponent v-if="mapEditor.selectedPlacedObject.value" :key="mapEditor.selectedPlacedObject.value.id" :map :placedMapObject="mapEditor.selectedPlacedObject.value" @move="moveMapObject" @rotate="rotatePlacedMapObject" @delete="deletePlacedMapObject" />
|
||||
<PlacedMapObject
|
||||
v-for="placedMapObject in mapEditor.currentMap.value?.placedMapObjects"
|
||||
:tileMap
|
||||
:tileMapLayer
|
||||
:placedMapObject
|
||||
@pointerdown="clickPlacedMapObject(placedMapObject)"
|
||||
:key="`${placedMapObject.id}-${placedMapObjectKey}`"
|
||||
/>
|
||||
<PlacedMapObject v-for="placedMapObject in mapEditor.currentMap.value?.placedMapObjects" :tileMap :tileMapLayer :placedMapObject @pointerdown="clickPlacedMapObject(placedMapObject)" :key="`${placedMapObject.id}-${placedMapObjectKey}`" />
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user