From 286552b8fae5eb89223bf6dfee246a8fe0455262 Mon Sep 17 00:00:00 2001 From: Nathan Sweet Date: Tue, 22 Jun 2021 21:36:43 -0400 Subject: [PATCH] [ts] Player, simplified config.mipmaps. --- spine-ts/core/src/AssetManager.ts | 6 ++-- spine-ts/player/example/example.html | 2 +- spine-ts/player/src/Player.ts | 53 +++++++++++----------------- spine-ts/threejs/src/MeshBatcher.ts | 2 +- spine-ts/webgl/src/AssetManager.ts | 8 ++--- 5 files changed, 27 insertions(+), 44 deletions(-) diff --git a/spine-ts/core/src/AssetManager.ts b/spine-ts/core/src/AssetManager.ts index 208445164..ffe9e914d 100644 --- a/spine-ts/core/src/AssetManager.ts +++ b/spine-ts/core/src/AssetManager.ts @@ -154,10 +154,8 @@ module spine { } }, (imagePath: string, message: string) => { - if (!abort) { - abort = true; - this.error(error, path, `Couldn't load texture atlas ${path} page ${imagePath}: ${message}`); - } + if (!abort) this.error(error, path, `Couldn't load texture atlas ${path} page ${imagePath}: ${message}`); + abort = true; } ); } diff --git a/spine-ts/player/example/example.html b/spine-ts/player/example/example.html index b8e48331c..57e925ec8 100644 --- a/spine-ts/player/example/example.html +++ b/spine-ts/player/example/example.html @@ -15,7 +15,7 @@ body { -
+
diff --git a/spine-ts/player/src/Player.ts b/spine-ts/player/src/Player.ts index 209e8c481..ce935d287 100644 --- a/spine-ts/player/src/Player.ts +++ b/spine-ts/player/src/Player.ts @@ -239,6 +239,7 @@ module spine { if (!config.fullScreenBackgroundColor) config.fullScreenBackgroundColor = config.backgroundColor; if (config.backgroundImage && !config.backgroundImage.url) config.backgroundImage = null; if (config.premultipliedAlpha === undefined) config.premultipliedAlpha = true; + if (config.mipmaps === undefined) config.mipmaps = true; if (!config.debug) config.debug = {} as any; if (config.animations && config.animation && config.animations.indexOf(config.animation) < 0) throw new Error("Animation '" + config.animation + "' is not in the config animation list: " + toString(config.animations)); @@ -291,38 +292,7 @@ module spine { } // Load the assets. - this.assetManager = new class extends spine.webgl.AssetManager { - protected createTexture (context: spine.webgl.ManagedWebGLRenderingContext | WebGLRenderingContext, image: HTMLImageElement | ImageBitmap): Texture { - return new class extends spine.webgl.GLTexture { - setFilters (minFilter: TextureFilter, magFilter: TextureFilter) { - if (config.mipmaps) { - minFilter = TextureFilter.MipMapLinearLinear; - magFilter = TextureFilter.Linear; - } - var mipmaps = false; - switch (minFilter) { - case TextureFilter.MipMap: - case TextureFilter.MipMapLinearLinear: - case TextureFilter.MipMapLinearNearest: - case TextureFilter.MipMapNearestLinear: - case TextureFilter.MipMapNearestNearest: - if (config.mipmaps) { - let gl = this.context.gl; - let ext = gl.getExtension("EXT_texture_filter_anisotropic"); - if (ext) { - gl.texParameterf(gl.TEXTURE_2D, ext.TEXTURE_MAX_ANISOTROPY_EXT, 8); - mipmaps = true; - } else - minFilter = TextureFilter.Linear; // Don't use mipmaps without anisotropic. - } else - mipmaps = true; - } - super.setFilters(minFilter, magFilter); - if (mipmaps) this.update(true); - } - }(context, image); - } - }(this.context, "", config.downloader); + this.assetManager = new spine.webgl.AssetManager(this.context, "", config.downloader); if (config.rawDataURIs) { for (let path in config.rawDataURIs) this.assetManager.setRawDataURI(path, config.rawDataURIs[path]); @@ -418,7 +388,24 @@ module spine { this.showError("Error: Assets could not be loaded.\n" + toString(this.assetManager.getErrors())); let config = this.config; + + // Configure filtering. let atlas = this.assetManager.get(config.atlasUrl); + let gl = this.context.gl, anisotropic = gl.getExtension("EXT_texture_filter_anisotropic"); + for (let page of atlas.pages) { + var minFilter = page.minFilter; + if (config.mipmaps) { + if (anisotropic) { + gl.texParameterf(gl.TEXTURE_2D, anisotropic.TEXTURE_MAX_ANISOTROPY_EXT, 8); + minFilter = TextureFilter.MipMapLinearLinear; + } else + minFilter = TextureFilter.Linear; // Don't use mipmaps without anisotropic. + page.texture.setFilters(minFilter, TextureFilter.Nearest); + } + if (minFilter != TextureFilter.Nearest && minFilter != TextureFilter.Linear) page.texture.update(true); + } + + // Load skeleton data. let skeletonData: SkeletonData; if (config.jsonUrl) { try { @@ -447,7 +434,7 @@ module spine { stateData.defaultMix = config.defaultMix; this.animationState = new AnimationState(stateData); - // Check if all controllable bones are in the skeleton + // Check if all control bones are in the skeleton config.controlBones.forEach(bone => { if (!skeletonData.findBone(bone)) this.showError(`Error: Control bone does not exist in skeleton: ${bone}`); }) diff --git a/spine-ts/threejs/src/MeshBatcher.ts b/spine-ts/threejs/src/MeshBatcher.ts index ac0957495..9b8802ec3 100644 --- a/spine-ts/threejs/src/MeshBatcher.ts +++ b/spine-ts/threejs/src/MeshBatcher.ts @@ -48,7 +48,7 @@ module spine.threejs { geo.setAttribute("color", new THREE.InterleavedBufferAttribute(vertexBuffer, 4, 3, false)); geo.setAttribute("uv", new THREE.InterleavedBufferAttribute(vertexBuffer, 2, 7, false)); geo.setIndex(new THREE.BufferAttribute(indices, 1)); - geo.getIndex().usage = WebGLRenderingContext.DYNAMIC_DRAW;; + geo.getIndex().usage = WebGLRenderingContext.DYNAMIC_DRAW; geo.drawRange.start = 0; geo.drawRange.count = 0; this.geometry = geo; diff --git a/spine-ts/webgl/src/AssetManager.ts b/spine-ts/webgl/src/AssetManager.ts index 8ff51b968..2c3a433c2 100644 --- a/spine-ts/webgl/src/AssetManager.ts +++ b/spine-ts/webgl/src/AssetManager.ts @@ -30,11 +30,9 @@ module spine.webgl { export class AssetManager extends spine.AssetManager { constructor (context: ManagedWebGLRenderingContext | WebGLRenderingContext, pathPrefix: string = "", downloader: Downloader = null) { - super((image: HTMLImageElement | ImageBitmap) => this.createTexture(context, image), pathPrefix, downloader); - } - - protected createTexture (context: ManagedWebGLRenderingContext | WebGLRenderingContext, image: HTMLImageElement | ImageBitmap): Texture { - return new spine.webgl.GLTexture(context, image); + super((image: HTMLImageElement | ImageBitmap) => { + return new spine.webgl.GLTexture(context, image); + }, pathPrefix, downloader); } } }