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

Depth sort fix attempt

Browse Source
This commit is contained in:
Dennis Postma 2025-02-13 14:50:46 +01:00
parent 16720777c9
commit ddc26a021b
3 changed files with 33 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
package-lock.json generated
View File

@ -1781,9 +1781,9 @@
}
},
"node_modules/@types/node": {
"version": "20.17.17",
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.17.17.tgz",
"integrity": "sha512-/WndGO4kIfMicEQLTi/mDANUu/iVUhT7KboZPdEqqHQ4aTS+3qT3U5gIqWDFV+XouorjfgGqvKILJeHhuQgFYg==",
"version": "20.17.18",
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.17.18.tgz",
"integrity": "sha512-9kS0opXVV3dJ+C7HPhXfDlOdMu4cjJSZhlSxlDK39IxVRxBbuiYjCkLYSO9d5UYqTd4DApxRK9T1xJiTAkfA0w==",
"devOptional": true,
"license": "MIT",
"dependencies": {
@ -2880,9 +2880,9 @@
}
},
"node_modules/electron-to-chromium": {
"version": "1.5.97",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.97.tgz",
"integrity": "sha512-HKLtaH02augM7ZOdYRuO19rWDeY+QSJ1VxnXFa/XDFLf07HvM90pALIJFgrO+UVaajI3+aJMMpojoUTLZyQ7JQ==",
"version": "1.5.98",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.98.tgz",
"integrity": "sha512-bI/LbtRBxU2GzK7KK5xxFd2y9Lf9XguHooPYbcXWy6wUoT8NMnffsvRhPmSeUHLSDKAEtKuTaEtK4Ms15zkIEA==",
"dev": true,
"license": "ISC"
},

2
src/components/game/map/partials/PlacedMapObject.vue
View File

@ -61,7 +61,7 @@ function calculateObjectPlacement(mapObj: PlacedMapObject): { x: number; y: numb
const imageProps = computed(() => ({
alpha: mapEditor.movingPlacedObject.value?.id == props.placedMapObject.id || mapEditor.selectedMapObject.value?.id == props.placedMapObject.id ? 0.5 : 1,
tint: mapEditor.selectedPlacedObject.value?.id == props.placedMapObject.id ? 0x00ff00 : 0xffffff,
depth: calculateIsometricDepth(props.placedMapObject.positionX, props.placedMapObject.positionY, mapObject.value!.frameWidth, mapObject.value!.frameHeight),
depth: calculateIsometricDepth(props.placedMapObject.positionX, props.placedMapObject.positionY, mapObject.value!.frameWidth, mapObject.value!.frameHeight, mapObject.value!.originX, mapObject.value!.originY),
...calculateObjectPlacement(props.placedMapObject),
flipX: props.placedMapObject.isRotated,
texture: mapObject.value!.id,

32
src/services/mapService.ts
View File

@ -62,14 +62,34 @@ export function createTileArray(width: number, height: number, tile: string = 'b
return Array.from({ length: height }, () => Array.from({ length: width }, () => tile))
}
export const calculateIsometricDepth = (positionX: number, positionY: number, width: number = 0, height: number = 0, isCharacter: boolean = false) => {
const baseDepth = positionX + positionY
if (isCharacter) {
return baseDepth
}
return baseDepth + (width + height) / (2 * config.tile_size.width)
export const calculateIsometricDepth = (
positionX: number,
positionY: number,
width: number = 0,
height: number = 0,
originX: number = 0,
originY: number = 0
) => {
// Base depth calculation using isometric coordinates
// We multiply by a large number to ensure enough space between layers
const baseDepth = (positionY + positionX) * 1000
// Calculate the object's bottom-most point considering its dimensions and origin
const bottomY = positionY + height - (height * originY)
const rightX = positionX + width - (width * originX)
// Add position-based offset to ensure objects further down and right appear on top
const positionOffset = (bottomY + rightX) * 10
// For regular objects, consider their size
// Larger objects should generally appear behind smaller ones at the same position
const sizeOffset = (width + height) * 5
// Final depth combines all factors
return baseDepth + positionOffset - sizeOffset
}
async function loadTileTextures(tiles: TileT[], scene: Phaser.Scene) {
// Load each tile into the scene
for (let tile of tiles) {