[ts] Player, mipmaps and anisotropic if available, otherwise use linear.

This commit is contained in:
Nathan Sweet 2021-06-22 18:09:37 -04:00
parent e6e2c95b2c
commit 66951cb1d8
13 changed files with 159 additions and 23 deletions

View File

@ -1289,6 +1289,7 @@ declare module spine.canvas {
declare module spine.webgl {
class AssetManager extends spine.AssetManager {
constructor(context: ManagedWebGLRenderingContext | WebGLRenderingContext, pathPrefix?: string, downloader?: Downloader);
protected createTexture(context: ManagedWebGLRenderingContext | WebGLRenderingContext, image: HTMLImageElement | ImageBitmap): Texture;
}
}
declare module spine.webgl {
@ -1314,7 +1315,7 @@ declare module spine.webgl {
}
declare module spine.webgl {
class GLTexture extends Texture implements Disposable, Restorable {
private context;
context: ManagedWebGLRenderingContext;
private texture;
private boundUnit;
private useMipMaps;
@ -1822,6 +1823,7 @@ declare module spine {
width: number;
height: number;
};
mipmaps: true;
controlBones: string[];
success: (player: SpinePlayer) => void;
error: (player: SpinePlayer, msg: string) => void;

View File

@ -9241,10 +9241,12 @@ var spine;
function AssetManager(context, pathPrefix, downloader) {
if (pathPrefix === void 0) { pathPrefix = ""; }
if (downloader === void 0) { downloader = null; }
return _super.call(this, function (image) {
return new spine.webgl.GLTexture(context, image);
}, pathPrefix, downloader) || this;
var _this = _super.call(this, function (image) { return _this.createTexture(context, image); }, pathPrefix, downloader) || this;
return _this;
}
AssetManager.prototype.createTexture = function (context, image) {
return new spine.webgl.GLTexture(context, image);
};
return AssetManager;
}(spine.AssetManager));
webgl.AssetManager = AssetManager;
@ -12373,7 +12375,51 @@ var spine;
catch (e) {
this.showError("Sorry, your browser does not support WebGL.\nPlease use the latest version of Firefox, Chrome, Edge, or Safari.", e);
}
this.assetManager = new spine.webgl.AssetManager(this.context, "", config.downloader);
this.assetManager = new (function (_super) {
__extends(class_1, _super);
function class_1() {
return _super !== null && _super.apply(this, arguments) || this;
}
class_1.prototype.createTexture = function (context, image) {
return new (function (_super) {
__extends(class_2, _super);
function class_2() {
return _super !== null && _super.apply(this, arguments) || this;
}
class_2.prototype.setFilters = function (minFilter, magFilter) {
if (config.mipmaps) {
minFilter = spine.TextureFilter.MipMapLinearLinear;
magFilter = spine.TextureFilter.Linear;
}
var mipmaps = false;
switch (minFilter) {
case spine.TextureFilter.MipMap:
case spine.TextureFilter.MipMapLinearLinear:
case spine.TextureFilter.MipMapLinearNearest:
case spine.TextureFilter.MipMapNearestLinear:
case spine.TextureFilter.MipMapNearestNearest:
if (config.mipmaps) {
var gl = this.context.gl;
var ext = gl.getExtension("EXT_texture_filter_anisotropic");
if (ext) {
gl.texParameterf(gl.TEXTURE_2D, ext.TEXTURE_MAX_ANISOTROPY_EXT, 8);
mipmaps = true;
}
else
minFilter = spine.TextureFilter.Linear;
}
else
mipmaps = true;
}
_super.prototype.setFilters.call(this, minFilter, magFilter);
if (mipmaps)
this.update(true);
};
return class_2;
}(spine.webgl.GLTexture))(context, image);
};
return class_1;
}(spine.webgl.AssetManager))(this.context, "", config.downloader);
if (config.rawDataURIs) {
for (var path in config.rawDataURIs)
this.assetManager.setRawDataURI(path, config.rawDataURIs[path]);

File diff suppressed because one or more lines are too long

View File

@ -1258,6 +1258,7 @@ declare module spine {
declare module spine.webgl {
class AssetManager extends spine.AssetManager {
constructor(context: ManagedWebGLRenderingContext | WebGLRenderingContext, pathPrefix?: string, downloader?: Downloader);
protected createTexture(context: ManagedWebGLRenderingContext | WebGLRenderingContext, image: HTMLImageElement | ImageBitmap): Texture;
}
}
declare module spine.webgl {
@ -1283,7 +1284,7 @@ declare module spine.webgl {
}
declare module spine.webgl {
class GLTexture extends Texture implements Disposable, Restorable {
private context;
context: ManagedWebGLRenderingContext;
private texture;
private boundUnit;
private useMipMaps;
@ -1726,6 +1727,7 @@ declare module spine {
width: number;
height: number;
};
mipmaps: true;
controlBones: string[];
success: (player: SpinePlayer) => void;
error: (player: SpinePlayer, msg: string) => void;

View File

@ -8991,10 +8991,12 @@ var spine;
function AssetManager(context, pathPrefix, downloader) {
if (pathPrefix === void 0) { pathPrefix = ""; }
if (downloader === void 0) { downloader = null; }
return _super.call(this, function (image) {
return new spine.webgl.GLTexture(context, image);
}, pathPrefix, downloader) || this;
var _this = _super.call(this, function (image) { return _this.createTexture(context, image); }, pathPrefix, downloader) || this;
return _this;
}
AssetManager.prototype.createTexture = function (context, image) {
return new spine.webgl.GLTexture(context, image);
};
return AssetManager;
}(spine.AssetManager));
webgl.AssetManager = AssetManager;
@ -11696,7 +11698,51 @@ var spine;
catch (e) {
this.showError("Sorry, your browser does not support WebGL.\nPlease use the latest version of Firefox, Chrome, Edge, or Safari.", e);
}
this.assetManager = new spine.webgl.AssetManager(this.context, "", config.downloader);
this.assetManager = new (function (_super) {
__extends(class_1, _super);
function class_1() {
return _super !== null && _super.apply(this, arguments) || this;
}
class_1.prototype.createTexture = function (context, image) {
return new (function (_super) {
__extends(class_2, _super);
function class_2() {
return _super !== null && _super.apply(this, arguments) || this;
}
class_2.prototype.setFilters = function (minFilter, magFilter) {
if (config.mipmaps) {
minFilter = spine.TextureFilter.MipMapLinearLinear;
magFilter = spine.TextureFilter.Linear;
}
var mipmaps = false;
switch (minFilter) {
case spine.TextureFilter.MipMap:
case spine.TextureFilter.MipMapLinearLinear:
case spine.TextureFilter.MipMapLinearNearest:
case spine.TextureFilter.MipMapNearestLinear:
case spine.TextureFilter.MipMapNearestNearest:
if (config.mipmaps) {
var gl = this.context.gl;
var ext = gl.getExtension("EXT_texture_filter_anisotropic");
if (ext) {
gl.texParameterf(gl.TEXTURE_2D, ext.TEXTURE_MAX_ANISOTROPY_EXT, 8);
mipmaps = true;
}
else
minFilter = spine.TextureFilter.Linear;
}
else
mipmaps = true;
}
_super.prototype.setFilters.call(this, minFilter, magFilter);
if (mipmaps)
this.update(true);
};
return class_2;
}(spine.webgl.GLTexture))(context, image);
};
return class_1;
}(spine.webgl.AssetManager))(this.context, "", config.downloader);
if (config.rawDataURIs) {
for (var path in config.rawDataURIs)
this.assetManager.setRawDataURI(path, config.rawDataURIs[path]);

File diff suppressed because one or more lines are too long

View File

@ -1258,6 +1258,7 @@ declare module spine {
declare module spine.webgl {
class AssetManager extends spine.AssetManager {
constructor(context: ManagedWebGLRenderingContext | WebGLRenderingContext, pathPrefix?: string, downloader?: Downloader);
protected createTexture(context: ManagedWebGLRenderingContext | WebGLRenderingContext, image: HTMLImageElement | ImageBitmap): Texture;
}
}
declare module spine.webgl {
@ -1283,7 +1284,7 @@ declare module spine.webgl {
}
declare module spine.webgl {
class GLTexture extends Texture implements Disposable, Restorable {
private context;
context: ManagedWebGLRenderingContext;
private texture;
private boundUnit;
private useMipMaps;

View File

@ -8991,10 +8991,12 @@ var spine;
function AssetManager(context, pathPrefix, downloader) {
if (pathPrefix === void 0) { pathPrefix = ""; }
if (downloader === void 0) { downloader = null; }
return _super.call(this, function (image) {
return new spine.webgl.GLTexture(context, image);
}, pathPrefix, downloader) || this;
var _this = _super.call(this, function (image) { return _this.createTexture(context, image); }, pathPrefix, downloader) || this;
return _this;
}
AssetManager.prototype.createTexture = function (context, image) {
return new spine.webgl.GLTexture(context, image);
};
return AssetManager;
}(spine.AssetManager));
webgl.AssetManager = AssetManager;

File diff suppressed because one or more lines are too long

View File

@ -1,6 +1,6 @@
spineboy-pma.png
size: 1024, 256
filter: Linear, Linear
filter: MipMapLinearLinear,Linear
pma: true
crosshair
bounds: 813, 160, 45, 45

View File

@ -130,6 +130,10 @@ module spine {
height: number
}
/* Optional: Whether mipmapping and anisotropic filtering are used for highest quality scaling when available, otherwise the
filter settings from the texture atlas are used. Default: true */
mipmaps: true
/* Optional: List of bone names that the user can drag to position. Default: none */
controlBones: string[]
@ -287,7 +291,38 @@ module spine {
}
// Load the assets.
this.assetManager = new spine.webgl.AssetManager(this.context, "", config.downloader);
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);
if (config.rawDataURIs) {
for (let path in config.rawDataURIs)
this.assetManager.setRawDataURI(path, config.rawDataURIs[path]);

View File

@ -30,9 +30,11 @@
module spine.webgl {
export class AssetManager extends spine.AssetManager {
constructor (context: ManagedWebGLRenderingContext | WebGLRenderingContext, pathPrefix: string = "", downloader: Downloader = null) {
super((image: HTMLImageElement | ImageBitmap) => {
return new spine.webgl.GLTexture(context, image);
}, pathPrefix, downloader);
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);
}
}
}

View File

@ -29,7 +29,7 @@
module spine.webgl {
export class GLTexture extends Texture implements Disposable, Restorable {
private context: ManagedWebGLRenderingContext;
context: ManagedWebGLRenderingContext;
private texture: WebGLTexture = null;
private boundUnit = 0;
private useMipMaps = false;