🆙 added Room background colors,so windows and landscapes are now 100%

This commit is contained in:
duckietm
2026-02-05 13:04:44 +01:00
parent 91c20c49e7
commit 17ae1bd644
2 changed files with 129 additions and 21 deletions
@@ -5606,7 +5606,8 @@
"size": 64,
"allLayers": [
{
"color": 8703727
"color": 8703727,
"backgroundColor": "#84C6DF"
},
{
"items": [
@@ -5730,7 +5731,7 @@
{
"materialId": "landscape_64_background_1",
"align": "bottom",
"backgroundColor": "#FEFEFE"
"backgroundColor": "#B85D58"
},
{
"items": [
@@ -5857,7 +5858,8 @@
"allLayers": [
{
"materialId": "landscape_64_background_2",
"align": "bottom"
"align": "bottom",
"backgroundColor": "#58B3B8"
},
{
"items": [
@@ -5984,7 +5986,8 @@
"allLayers": [
{
"materialId": "landscape_64_background_3",
"align": "bottom"
"align": "bottom",
"backgroundColor": "#77B8CB"
},
{
"items": [
@@ -6111,7 +6114,8 @@
"allLayers": [
{
"materialId": "landscape_64_background_4",
"align": "bottom"
"align": "bottom",
"backgroundColor": "#77CBC9"
},
{
"items": [
@@ -6238,7 +6242,8 @@
"allLayers": [
{
"materialId": "landscape_64_background_5",
"align": "bottom"
"align": "bottom",
"backgroundColor": "#475962"
},
{
"items": [
@@ -6365,7 +6370,8 @@
"allLayers": [
{
"materialId": "landscape_64_background_6",
"align": "bottom"
"align": "bottom",
"backgroundColor": "#191E3F"
},
{
"items": [
@@ -6492,7 +6498,8 @@
"allLayers": [
{
"materialId": "landscape_64_background_7",
"align": "bottom"
"align": "bottom",
"backgroundColor": "#FFFF00"
},
{
"items": [
@@ -18,6 +18,7 @@ export class RoomPlane implements IRoomPlane
'64': new RoomGeometry(64, new Vector3d(RoomPlane.HORIZONTAL_ANGLE_DEFAULT, RoomPlane.VERTICAL_ANGLE_DEFAULT), new Vector3d(-10, 0, 0))
};
private static ANIMATION_UPDATE_INTERVAL: number = 500;
private static LANDSCAPE_DEFAULT_BACKGROUND_COLOR: number = 0x84C6DF;
public static TYPE_UNDEFINED: number = 0;
public static TYPE_WALL: number = 1;
@@ -84,6 +85,7 @@ export class RoomPlane implements IRoomPlane
private _landscapeBaseAlignBottom: boolean = false;
private _landscapeForegroundAlignBottom: boolean = false;
private _landscapeBackgroundColor: number = null;
private _lastLandscapeDebugSignature: string = null;
private _hasWindowMask: boolean = false;
private _windowMasks: { leftSideLoc: number; rightSideLoc: number }[] = [];
@@ -295,7 +297,40 @@ export class RoomPlane implements IRoomPlane
const foregroundAlignBottom = materialLayers[1]?.align === 'bottom';
// Parse backgroundColor from the first material layer (background layer)
const backgroundColorStr = materialLayers[0]?.backgroundColor;
const backgroundMaterialId = materialLayers[0]?.materialId;
const hasDirectBackgroundColor = !!materialLayers[0]?.backgroundColor;
let backgroundColorStr = materialLayers[0]?.backgroundColor;
if(!backgroundColorStr && backgroundMaterialId)
{
const findBackgroundColorByMaterial = () =>
{
for(const candidatePlane of planeVisualizationData?.planes ?? [])
{
const candidateVisualizations = [
...(candidatePlane.visualizations ?? []),
...(candidatePlane.animatedVisualization ?? [])
];
for(const candidateVisualization of candidateVisualizations)
{
if(candidateVisualization?.size !== planeGeometry.scale) continue;
const candidateMaterialLayers = (candidateVisualization.allLayers ?? []).filter(layer => (layer as IAssetPlaneVisualizationLayer)?.materialId) as IAssetPlaneVisualizationLayer[];
const candidateBackgroundLayer = candidateMaterialLayers[0];
if(candidateBackgroundLayer?.materialId !== backgroundMaterialId) continue;
if(candidateBackgroundLayer.backgroundColor) return candidateBackgroundLayer.backgroundColor;
}
}
return null;
};
backgroundColorStr = findBackgroundColorByMaterial();
}
let backgroundColor: number = null;
if(backgroundColorStr)
{
@@ -303,6 +338,8 @@ export class RoomPlane implements IRoomPlane
backgroundColor = parseInt(backgroundColorStr.replace('#', ''), 16);
}
const backgroundColorSource = hasDirectBackgroundColor ? 'direct' : (backgroundColor !== null ? 'fallback-material' : 'none');
const selectMaterialMatrixForNormal = (matrices = [], normal = null) =>
{
if(!matrices.length) return null;
@@ -389,7 +426,7 @@ export class RoomPlane implements IRoomPlane
}
}
return { texture, foregroundTexture, color: planeColor, baseAlignBottom, foregroundAlignBottom, animationLayers, backgroundColor };
return { texture, foregroundTexture, color: planeColor, baseAlignBottom, foregroundAlignBottom, animationLayers, backgroundColor, backgroundColorSource };
};
const planeData = getTextureAndColorForPlane(this._id, this._type, normal);
@@ -504,6 +541,22 @@ export class RoomPlane implements IRoomPlane
this._landscapeForegroundAlignBottom = planeData.foregroundAlignBottom ?? false;
this._landscapeBackgroundColor = planeData.backgroundColor ?? null;
const landscapeDebugPayload = {
planeId: this._id,
backgroundColor: this._landscapeBackgroundColor,
backgroundColorSource: planeData.backgroundColorSource,
backgroundTexture: this._landscapeBackgroundTexture?.label ?? this._landscapeBackgroundTexture?.source?.label ?? null,
foregroundTexture: this._landscapeForegroundTexture?.label ?? this._landscapeForegroundTexture?.source?.label ?? null,
hasCloudAnimation: this._isAnimated
};
const landscapeDebugSignature = JSON.stringify(landscapeDebugPayload);
if(this._lastLandscapeDebugSignature !== landscapeDebugSignature)
{
this._lastLandscapeDebugSignature = landscapeDebugSignature;
console.debug('[RoomPlane] Loaded landscape background', landscapeDebugPayload);
}
this._planeSprite = new TilingSprite({
texture: Texture.WHITE,
width,
@@ -563,18 +616,29 @@ export class RoomPlane implements IRoomPlane
if(needsUpdate || animationUpdate)
{
// For landscapes with a custom backgroundColor, render it first
if(this._type === RoomPlane.TYPE_LANDSCAPE && this._landscapeBackgroundColor !== null)
{
this.renderBackgroundColor();
}
const isLandscape = (this._type === RoomPlane.TYPE_LANDSCAPE);
const hasLandscapeLayeredRendering = (isLandscape && (this._landscapeBackgroundTexture !== null || this._landscapeForegroundTexture !== null || this._animationLayers.length > 0 || this._landscapeBackgroundColor !== null));
GetRenderer().render({
target: this._planeTexture,
container: this._planeSprite,
transform: this.getMatrixForDimensions(this._planeSprite.width, this._planeSprite.height),
clear: this._landscapeBackgroundColor === null
});
if(hasLandscapeLayeredRendering)
{
if(this._landscapeBackgroundColor !== null)
{
this.renderBackgroundColor();
}
else
{
this.clearPlaneTexture();
}
}
else
{
GetRenderer().render({
target: this._planeTexture,
container: this._planeSprite,
transform: this.getMatrixForDimensions(this._planeSprite.width, this._planeSprite.height),
clear: true
});
}
// Layer order for landscapes:
// 1. Background color (rendered above)
@@ -752,6 +816,43 @@ export class RoomPlane implements IRoomPlane
colorGraphics.destroy();
}
private clearPlaneTexture(): void
{
if(!this._planeTexture) return;
const canvasWidth = this._landscapeRenderWidth;
const canvasHeight = this._landscapeRenderHeight;
if(canvasWidth <= 0 || canvasHeight <= 0)
{
GetRenderer().render({
target: this._planeTexture,
container: new Container(),
clear: true
});
return;
}
const colorGraphics = new Graphics();
colorGraphics.rect(0, 0, canvasWidth, canvasHeight);
colorGraphics.fill(RoomPlane.LANDSCAPE_DEFAULT_BACKGROUND_COLOR);
const colorContainer = new Container();
colorContainer.addChild(colorGraphics);
const transform = this.getMatrixForDimensions(canvasWidth, canvasHeight);
GetRenderer().render({
target: this._planeTexture,
container: colorContainer,
transform,
clear: true
});
colorGraphics.destroy();
}
private updateCorners(geometry: IRoomGeometry): void
{
this._cornerA.assign(geometry.getScreenPosition(this._location));