From 5ea3201e31aec8da4ff7696093e25a7508d90063 Mon Sep 17 00:00:00 2001 From: simoleo89 Date: Mon, 11 May 2026 21:09:59 +0200 Subject: [PATCH] Align with Pixi v8: Filter[] union, WebGLRenderer narrow, ImageLike MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Four sites where Pixi v8's stricter typing tripped tsgo: - AvatarImage: container.filters is typed as 'readonly Filter[] | null' in v8 (no longer a single-Filter union). The old fallback branch 'else container.filters = [container.filters, …]' tried to treat a readonly array as a single Filter; collapsed to the array-spread path which now covers both undefined and non-empty cases. Added Filter to the pixi.js import. - FurnitureBadgeDisplayVisualization.updateSprite() had a 4-arg override (sprite, asset, scale, layerId) of the parent's 2-arg signature (scale, layerId). The sprite/asset were never used from the parameters — the body only mutated 'sprite'. Refactored to fetch the sprite via this.getSprite(layerId) inside the override body so the signature matches the base. - ExtendedSprite: 'renderer.gl' / 'glRenderTarget.resolveTargetFramebuffer' exist only on WebGLRenderer / GlRenderTarget (not the WebGPU variants). The runtime check 'renderer.type === RendererType.WEBGL' guarantees this; cast at the boundary to satisfy the typechecker. - TextureUtils.generateImage: Pixi v8's Extractor.image() returns the union ImageLike (HTMLCanvasElement | HTMLImageElement); the public signature promises HTMLImageElement. Cast at return — the Pixi default backend returns HTMLImageElement here. --- packages/avatar/src/AvatarImage.ts | 13 +++++-------- .../furniture/FurnitureBadgeDisplayVisualization.ts | 8 ++++++-- packages/room/src/renderer/utils/ExtendedSprite.ts | 9 +++++---- packages/utils/src/TextureUtils.ts | 2 +- 4 files changed, 17 insertions(+), 15 deletions(-) diff --git a/packages/avatar/src/AvatarImage.ts b/packages/avatar/src/AvatarImage.ts index b34d1e5..5d23c84 100644 --- a/packages/avatar/src/AvatarImage.ts +++ b/packages/avatar/src/AvatarImage.ts @@ -1,6 +1,6 @@ -import { AvatarAction, AvatarDirectionAngle, AvatarScaleType, AvatarSetType, IActiveActionData, IAnimationLayerData, IAvatarDataContainer, IAvatarEffectListener, IAvatarFigureContainer, IAvatarImage, IPartColor, ISpriteDataContainer } from '@nitrots/api'; +import { AvatarAction, AvatarDirectionAngle, AvatarScaleType, AvatarSetType, IActiveActionData, IAnimationLayerData, IAvatarDataContainer, IAvatarEffectListener, IAvatarFigureContainer, IAvatarImage, IGraphicAsset, IPartColor, ISpriteDataContainer } from '@nitrots/api'; import { GetRenderer, GetTexturePool, GetTickerTime, PaletteMapFilter, TextureUtils } from '@nitrots/utils'; -import { ColorMatrixFilter, Container, RenderTexture, Sprite, Texture } from 'pixi.js'; +import { ColorMatrixFilter, Container, Filter, RenderTexture, Sprite, Texture } from 'pixi.js'; import { AvatarFigureContainer } from './AvatarFigureContainer'; import { AvatarStructure } from './AvatarStructure'; import { EffectAssetDownloadManager } from './EffectAssetDownloadManager'; @@ -243,8 +243,7 @@ export class AvatarImage implements IAvatarImage, IAvatarEffectListener if(this._avatarSpriteData.colorTransform) { if(container.filters === undefined || container.filters === null) container.filters = [ this._avatarSpriteData.colorTransform ]; - else if(Array.isArray(container.filters)) container.filters = [ ...container.filters, this._avatarSpriteData.colorTransform ]; - else container.filters = [ container.filters, this._avatarSpriteData.colorTransform ]; + else container.filters = [ ...(container.filters as readonly Filter[]), this._avatarSpriteData.colorTransform ]; } if(this._avatarSpriteData.paletteIsGrayscale) @@ -257,8 +256,7 @@ export class AvatarImage implements IAvatarImage, IAvatarEffectListener }); if(container.filters === undefined || container.filters === null) container.filters = [ paletteMapFilter ]; - else if(Array.isArray(container.filters)) container.filters = [ ...container.filters, paletteMapFilter ]; - else container.filters = [ container.filters, paletteMapFilter ]; + else container.filters = [ ...(container.filters as readonly Filter[]), paletteMapFilter ]; } } @@ -766,8 +764,7 @@ export class AvatarImage implements IAvatarImage, IAvatarEffectListener ]; if(container.filters === undefined || container.filters === null) container.filters = [ filter ]; - else if(Array.isArray(container.filters)) container.filters = [ ...container.filters, filter ]; - else container.filters = [ container.filters, filter ]; + else container.filters = [ ...(container.filters as readonly Filter[]), filter ]; return container; } diff --git a/packages/room/src/object/visualization/furniture/FurnitureBadgeDisplayVisualization.ts b/packages/room/src/object/visualization/furniture/FurnitureBadgeDisplayVisualization.ts index 7e344e8..87c6e2e 100644 --- a/packages/room/src/object/visualization/furniture/FurnitureBadgeDisplayVisualization.ts +++ b/packages/room/src/object/visualization/furniture/FurnitureBadgeDisplayVisualization.ts @@ -170,14 +170,18 @@ export class FurnitureBadgeDisplayVisualization extends FurnitureAnimatedVisuali return assetName; } - protected updateSprite(sprite: IRoomObjectSprite, asset: IGraphicAsset, scale: number, layerId: number): void + protected updateSprite(scale: number, layerId: number): void { - super.updateSprite(sprite, asset, scale, layerId); + super.updateSprite(scale, layerId); const tag = this.getLayerTag(scale, this.direction, layerId); if(tag === FurnitureBadgeDisplayVisualization.BADGE_TAG) { + const sprite = this.getSprite(layerId); + + if(!sprite) return; + sprite.visible = true; sprite.alpha = 255; sprite.color = 0xFFFFFF; diff --git a/packages/room/src/renderer/utils/ExtendedSprite.ts b/packages/room/src/renderer/utils/ExtendedSprite.ts index f3b08be..3c08ae0 100644 --- a/packages/room/src/renderer/utils/ExtendedSprite.ts +++ b/packages/room/src/renderer/utils/ExtendedSprite.ts @@ -1,6 +1,6 @@ import { AlphaTolerance } from '@nitrots/api'; import { GetRenderer, TextureUtils } from '@nitrots/utils'; -import { Point, RendererType, Sprite, Texture, TextureSource, WebGPURenderer } from 'pixi.js'; +import { GlRenderTarget, Point, RendererType, Sprite, Texture, TextureSource, WebGLRenderer, WebGPURenderer } from 'pixi.js'; const BYTES_PER_PIXEL = 4; @@ -97,10 +97,11 @@ export class ExtendedSprite extends Sprite { pixels = new Uint8ClampedArray(BYTES_PER_PIXEL * width * height); - const renderTarget = renderer.renderTarget.getRenderTarget(textureSource); - const glRenderTarget = renderer.renderTarget.getGpuRenderTarget(renderTarget); + const webglRenderer = renderer as WebGLRenderer; + const renderTarget = webglRenderer.renderTarget.getRenderTarget(textureSource); + const glRenderTarget = webglRenderer.renderTarget.getGpuRenderTarget(renderTarget) as GlRenderTarget; - const gl = renderer.gl; + const gl = webglRenderer.gl; gl.bindFramebuffer(gl.FRAMEBUFFER, glRenderTarget.resolveTargetFramebuffer); diff --git a/packages/utils/src/TextureUtils.ts b/packages/utils/src/TextureUtils.ts index 0b12996..4af952c 100644 --- a/packages/utils/src/TextureUtils.ts +++ b/packages/utils/src/TextureUtils.ts @@ -28,7 +28,7 @@ export class TextureUtils try { - return await this.getExtractor().image(options); + return await this.getExtractor().image(options) as HTMLImageElement; } catch(e) {