From 7eede9d23683bb1cce8495cb5ad65ccd6708114b Mon Sep 17 00:00:00 2001 From: Ben Richards Date: Mon, 26 Feb 2024 16:19:24 +1300 Subject: [PATCH] Standardise texture update in `Shader.initSampler2D`. --- changelog/3.90/CHANGELOG-v3.90.md | 6 +++ src/gameobjects/shader/Shader.js | 41 ++++--------------- src/renderer/webgl/WebGLRenderer.js | 4 +- .../webgl/wrappers/WebGLTextureWrapper.js | 6 ++- 4 files changed, 20 insertions(+), 37 deletions(-) diff --git a/changelog/3.90/CHANGELOG-v3.90.md b/changelog/3.90/CHANGELOG-v3.90.md index 02ec1e3e8..41a8674db 100644 --- a/changelog/3.90/CHANGELOG-v3.90.md +++ b/changelog/3.90/CHANGELOG-v3.90.md @@ -2,6 +2,12 @@ # New Features +# WebGL Rendering Updates + +* `WebGLTextureWrapper.update` expanded: + * `source` parameter is now type `?object`, so it can be used for anything that is valid in the constructor. + * New `format` parameter can update the texture format. + # Updates # Bug Fixes diff --git a/src/gameobjects/shader/Shader.js b/src/gameobjects/shader/Shader.js index b870ba942..41e9b835d 100644 --- a/src/gameobjects/shader/Shader.js +++ b/src/gameobjects/shader/Shader.js @@ -942,17 +942,13 @@ var Shader = new Class({ return; } - var gl = this.gl; - - gl.activeTexture(gl.TEXTURE0 + this._textureCount); - gl.bindTexture(gl.TEXTURE_2D, uniform.value.webGLTexture); - // Extended texture data var data = uniform.textureData; if (data && !uniform.value.isRenderTexture) { + var gl = this.gl; var wrapper = uniform.value; // https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texImage2D @@ -966,6 +962,10 @@ var Shader = new Class({ var wrapS = gl[GetFastValue(data, 'wrapS', 'repeat').toUpperCase()]; var wrapT = gl[GetFastValue(data, 'wrapT', 'repeat').toUpperCase()]; var format = gl[GetFastValue(data, 'format', 'rgba').toUpperCase()]; + var flipY = GetFastValue(data, 'flipY', false); + var width = GetFastValue(data, 'width', wrapper.width); + var height = GetFastValue(data, 'height', wrapper.height); + var source = GetFastValue(data, 'source', wrapper.pixels); if (data.repeat) { @@ -973,38 +973,13 @@ var Shader = new Class({ wrapT = gl.REPEAT; } - gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY); - if (data.width) { - var width = GetFastValue(data, 'width', 512); - var height = GetFastValue(data, 'height', 2); - var border = GetFastValue(data, 'border', 0); - - // texImage2D(GLenum target, GLint level, GLenum internalformat, GLsizei width, GLsizei height, GLint border, GLenum format, GLenum type, ArrayBufferView? pixels) - gl.texImage2D(gl.TEXTURE_2D, 0, format, width, height, border, format, gl.UNSIGNED_BYTE, null); - wrapper.width = width; - wrapper.height = height; - } - else - { - // texImage2D(GLenum target, GLint level, GLenum internalformat, GLenum format, GLenum type, ImageData? pixels) - gl.texImage2D(gl.TEXTURE_2D, 0, format, gl.RGBA, gl.UNSIGNED_BYTE, uniform.source); + // If the uniform has resolution, use a blank texture. + source = null; } - gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, magFilter); - gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, minFilter); - gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, wrapS); - gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, wrapT); - - // Update texture wrapper. - wrapper.magFilter = magFilter; - wrapper.minFilter = minFilter; - wrapper.wrapS = wrapS; - wrapper.wrapT = wrapT; - wrapper.format = format; - wrapper.flipY = !!data.flipY; - wrapper.pixels = uniform.source; + wrapper.update(source, width, height, flipY, wrapS, wrapT, minFilter, magFilter, format); } this.renderer.setProgram(this.program); diff --git a/src/renderer/webgl/WebGLRenderer.js b/src/renderer/webgl/WebGLRenderer.js index 2858b4d4c..b92e11e1f 100644 --- a/src/renderer/webgl/WebGLRenderer.js +++ b/src/renderer/webgl/WebGLRenderer.js @@ -2980,7 +2980,7 @@ var WebGLRenderer = new Class({ } else { - dstTexture.update(srcCanvas, width, height, flipY, wrapping, wrapping, minFilter, magFilter); + dstTexture.update(srcCanvas, width, height, flipY, wrapping, wrapping, minFilter, magFilter, dstTexture.format); return dstTexture; } @@ -3075,7 +3075,7 @@ var WebGLRenderer = new Class({ } else { - dstTexture.update(srcVideo, width, height, flipY, wrapping, wrapping, minFilter, magFilter); + dstTexture.update(srcVideo, width, height, flipY, wrapping, wrapping, minFilter, magFilter, dstTexture.format); return dstTexture; } diff --git a/src/renderer/webgl/wrappers/WebGLTextureWrapper.js b/src/renderer/webgl/wrappers/WebGLTextureWrapper.js index 034ea083a..82520c01a 100644 --- a/src/renderer/webgl/wrappers/WebGLTextureWrapper.js +++ b/src/renderer/webgl/wrappers/WebGLTextureWrapper.js @@ -246,7 +246,7 @@ var WebGLTextureWrapper = new Class({ * @method Phaser.Renderer.WebGL.Wrappers.WebGLTextureWrapper#update * @since 3.80.0 * - * @param {HTMLCanvasElement|HTMLVideoElement} source - The source to update the WebGLTexture with. + * @param {?object} source - The source to update the WebGLTexture with. * @param {number} width - The new width of the WebGLTexture. * @param {number} height - The new height of the WebGLTexture. * @param {boolean} flipY - Should the WebGLTexture set `UNPACK_MULTIPLY_FLIP_Y`? @@ -254,8 +254,9 @@ var WebGLTextureWrapper = new Class({ * @param {number} wrapT - The new wrapping mode for the WebGLTexture. * @param {number} minFilter - The new minification filter for the WebGLTexture. * @param {number} magFilter - The new magnification filter for the WebGLTexture. + * @param {number} format - The new format for the WebGLTexture. */ - update: function (source, width, height, flipY, wrapS, wrapT, minFilter, magFilter) + update: function (source, width, height, flipY, wrapS, wrapT, minFilter, magFilter, format) { if (width === 0 || height === 0) { @@ -271,6 +272,7 @@ var WebGLTextureWrapper = new Class({ this.wrapT = wrapT; this.minFilter = minFilter; this.magFilter = magFilter; + this.format = format; var gl = this.gl;