Phaser v3.50.0 Beta 10

Version 3.50.0 - Subaru - in development

WebGL Pipeline Updates

If you use a custom WebGL Pipeline in your game, you must update your code in order to use Phaser 3.50.

Due to the huge amount of work that has taken place in this area, all of the pipelines have been renamed. If you extend any of these pipelines or use them in your game code (referenced by name), then please update accordingly. The name changes are:

• TextureTintPipeline is now called the MultiPipeline.
• TextureTintStripPipeline is now called the RopePipeline.
• ForwardDiffuseLightPipeline is now called the LightPipeline.

There is also the new GraphicsPipeline. Previously, the TextureTintPipeline was responsible for rendering all Sprites, Graphics and Shape objects. Now, it only renders Sprites. All Graphics and Shapes are handled by the new GraphicsPipeline which uses its own shaders. See further below for details about this change.

To match the new pipeline names, the shader source code has also been renamed.

• ForwardDiffuse.frag is now called Light.frag.
• TextureTint.frag is now called Multi.frag.
• TextureTint.vert is now called Multi.vert.

Other pipeline changes are as follows:

• None of the shaders or pipelines use the uViewMatrix and uModelMatrix uniforms any longer. These were always just plain identity matrices, so there is no point spending CPU and GPU time to set them as uniforms, or use them in the shaders. Should you need these uniforms, you can add them to your own custom pipelines.
• Types.Renderer.WebGL.WebGLPipelineConfig is a new TypeDef that helps you easily configure your own Custom Pipeline when using TypeScript and also provides better JSDocs.
• Types.Renderer.WebGL.WebGLPipelineAttributesConfig is a new TypeDef that helps you easily configure the attributes for your own Custom Pipelines when using TypeScript and also provides better JSDocs.
• All pipelines will now work out the renderer property automatically, so it's no longer required in the config.
• All pipelines will now work out the gl property automatically, so it's no longer required in the config.
• All pipelines will now extract the name property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexCapacity property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexSize property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexData property from the config, allowing you to set it externally.
• All pipelines will now extract the attributes property from the config, allowing you to set it externally.
• All pipelines will now extract the topology property from the config, allowing you to set it externally.
• The WebGLPipeline.shouldFlush method now accepts an optional parameter amount. If given, it will return true if when the amount is added to the vertex count it will exceed the vertex capacity. The Multi Pipeline has been updated to now use this method instead of performing the comparison multiple times itself.
• The RopePipeline now extends MultiPipeline and just changes the topolgy, vastly reducing the filesize.
• The WebGLPipeline.flushLocked property has been removed. A pipeline can never flush in the middle of a flush anyway, so it was just wasting CPU cycles being set.
• You can now pass a pipeline instance to the GameObject.setPipeline method, as well as a string.

Pipeline Uniform Changes

Piplines now have a new uniforms array that can be passed in with the config. All default pipelines now set these. The array contains the names, as strings, of all uniforms your pipeline shader uses. Once the pipeline shader has been successfully linked, it will use the array of names to look-up the WebGLUniformLocation of all uniforms specified. These are stored in the new WebGLPipeline.uniforms object. This takes place in the new WebGLPipeline.setUniformLocations method.

When a pipeline is bound, you can now use the new methods (listed below) to set uniform values directly on the pipeline. Previously, calling a method such as setFloat3 on a pipeline would pass that call over to WebGLRenderer. The renderer would first check to see if the pipeline program was current, and if not, make it so, before then looking up the uniform location and finally setting it. This is a lot of steps to take for pipelines that potentially need to change uniforms for every Game Object they render.

Under the new methods, and using the new pre-cached uniform locations, these extra steps are skipped. The uniform value is set directly, no shader binding takes place and no location look-up happens. This dramatically reduces the number of WebGL ops being issued per frame. To clearly differentiate these pipline methods, we have renamed them. The new method names are as follows:

• WebGLPipeline.set1f will set a 1f uniform based on the given name.
• WebGLPipeline.set2f will set a 2f uniform based on the given name.
• WebGLPipeline.set3f will set a 3f uniform based on the given name.
• WebGLPipeline.set4f will set a 4f uniform based on the given name.
• WebGLPipeline.set1fv will set a 1fv uniform based on the given name.
• WebGLPipeline.set2fv will set a 2fv uniform based on the given name.
• WebGLPipeline.set3fv will set a 3fv uniform based on the given name.
• WebGLPipeline.set4fv will set a 4fv uniform based on the given name.
• WebGLPipeline.set1iv will set a 1iv uniform based on the given name.
• WebGLPipeline.set2iv will set a 2iv uniform based on the given name.
• WebGLPipeline.set3iv will set a 3iv uniform based on the given name.
• WebGLPipeline.set4iv will set a 4iv uniform based on the given name.
• WebGLPipeline.set1i will set a 1i uniform based on the given name.
• WebGLPipeline.set2i will set a 2i uniform based on the given name.
• WebGLPipeline.set3i will set a 3i uniform based on the given name.
• WebGLPipeline.set4i will set a 4i uniform based on the given name.
• WebGLPipeline.setMatrix2fv will set a matrix 2fv uniform based on the given name.
• WebGLPipeline.setMatrix3fv will set a matrix 3fv uniform based on the given name.
• WebGLPipeline.setMatrix4fv will set a matrix 4fv uniform based on the given name.

If your code uses any of the old method names, please update them using the list below:

• WebGLPipeline.setFloat1 has been removed. Please use set1f instead.
• WebGLPipeline.setFloat2 has been removed. Please use set2f instead.
• WebGLPipeline.setFloat3 has been removed. Please use set3f instead.
• WebGLPipeline.setFloat4 has been removed. Please use set4f instead.
• WebGLPipeline.setFloat1v has been removed. Please use set1fv instead.
• WebGLPipeline.setFloat2v has been removed. Please use set2fv instead.
• WebGLPipeline.setFloat3v has been removed. Please use set3fv instead.
• WebGLPipeline.setFloat4v has been removed. Please use set4fv instead.
• WebGLPipeline.setInt1 has been removed. Please use set1i instead.
• WebGLPipeline.setInt2 has been removed. Please use set2i instead.
• WebGLPipeline.setInt3 has been removed. Please use set3i instead.
• WebGLPipeline.setInt4 has been removed. Please use set4i instead.
• WebGLPipeline.setMatrix1 has been removed. Please use setMatrix2fv instead.
• WebGLPipeline.setMatrix2 has been removed. Please use setMatrix3fv instead.
• WebGLPipeline.setMatrix3 has been removed. Please use setMatrix4fv instead.

Pipeline Manager

The WebGL.PipelineManager is a new class that is responsbile for managing all of the WebGL Pipelines in Phaser. An instance of the Pipeline Manager is created by the WebGL Renderer and is available under the pipelines property. This means that the WebGL Renderer no longer handles pipelines directly, causing the following API changes:

• WebGLRenderer.pipelines is no longer a plain object containing pipeline instances. It's now an instance of the PipelineManager class. This instance is created during the init and boot phase of the renderer.
• The WebGLRenderer.currentPipeline property no longer exists, instead use PipelineManager.current.
• The WebGLRenderer.previousPipeline property no longer exists, instead use PipelineManager.previous.
• The WebGLRenderer.hasPipeline method no longer exists, instead use PipelineManager.has.
• The WebGLRenderer.getPipeline method no longer exists, instead use PipelineManager.get.
• The WebGLRenderer.removePipeline method no longer exists, instead use PipelineManager.remove.
• The WebGLRenderer.addPipeline method no longer exists, instead use PipelineManager.add.
• The WebGLRenderer.setPipeline method no longer exists, instead use PipelineManager.set.
• The WebGLRenderer.rebindPipeline method no longer exists, instead use PipelineManager.rebind.
• The WebGLRenderer.clearPipeline method no longer exists, instead use PipelineManager.clear.

The Pipeline Manager also offers the following new features:

• The PipelineManager.resize method automatically handles resize events across all pipelines.
• The PipelineManager.preRender method calls the pre-render method of all pipelines.
• The PipelineManager.render method calls the render method of all pipelines.
• The PipelineManager.postRender method calls the post-render method of all pipelines.
• The PipelineManager.setMulti method automatically binds the Multi Texture Pipeline, Phaser's default.
• The PipelineManager.clear method will clear the pipeline, store it in previous and free the renderer.
• The PipelineManager.rebind method will reset the rendering context and restore the previous pipeline, if set.

New constants have been created to help you reference a pipeline without needing to use strings:

• `Phaser.Renderer.WebGL.Pipeli...

Phaser v3.50.0 Beta 9

Version 3.50.0 - Subaru - in development

WebGL Pipeline Updates

If you use a custom WebGL Pipeline in your game, you must update your code in order to use Phaser 3.50.

Due to the huge amount of work that has taken place in this area, all of the pipelines have been renamed. If you extend any of these pipelines or use them in your game code (referenced by name), then please update accordingly. The name changes are:

• TextureTintPipeline is now called the MultiPipeline.
• TextureTintStripPipeline is now called the RopePipeline.
• ForwardDiffuseLightPipeline is now called the LightPipeline.

To match the new pipeline names, the shader source code has also been renamed.

• ForwardDiffuse.frag is now called Light.frag.
• TextureTint.frag is now called Multi.frag.
• TextureTint.vert is now called Multi.vert.

Other pipeline changes are as follows:

• Types.Renderer.WebGL.WebGLPipelineConfig is a new TypeDef that helps you easily configure your own Custom Pipeline when using TypeScript and also provides better JSDocs.
• Types.Renderer.WebGL.WebGLPipelineAttributesConfig is a new TypeDef that helps you easily configure the attributes for your own Custom Pipelines when using TypeScript and also provides better JSDocs.
• All pipelines will now work out the renderer property automatically, so it's no longer required in the config.
• All pipelines will now work out the gl property automatically, so it's no longer required in the config.
• All pipelines will now extract the name property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexCapacity property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexSize property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexData property from the config, allowing you to set it externally.
• All pipelines will now extract the attributes property from the config, allowing you to set it externally.
• All pipelines will now extract the topology property from the config, allowing you to set it externally.
• The WebGLPipeline.shouldFlush method now accepts an optional parameter amount. If given, it will return true if when the amount is added to the vertex count it will exceed the vertex capacity. The Multi Pipeline has been updated to now use this method instead of performing the comparison multiple times itself.
• The RopePipeline now extends MultiPipeline and just changes the topolgy, vastly reducing the filesize.

Pipeline Uniform Changes

Piplines now have a new uniforms array that can be passed in with the config. All default pipelines now set these. The array contains the names, as strings, of all uniforms your pipeline shader uses. Once the pipeline shader has been successfully linked, it will use the array of names to look-up the WebGLUniformLocation of all uniforms specified. These are stored in the new WebGLPipeline.uniforms object. This takes place in the new WebGLPipeline.setUniformLocations method.

When a pipeline is bound, you can now use the new methods (listed below) to set uniform values directly on the pipeline. Previously, calling a method such as setFloat3 on a pipeline would pass that call over to WebGLRenderer. The renderer would first check to see if the pipeline program was current, and if not, make it so, before then looking up the uniform location and finally setting it. This is a lot of steps to take for pipelines that potentially need to change uniforms for every Game Object they render.

Under the new methods, and using the new pre-cached uniform locations, these extra steps are skipped. The uniform value is set directly, no shader binding takes place and no location look-up happens. This dramatically reduces the number of WebGL ops being issued per frame. To clearly differentiate these pipline methods, we have renamed them. The new method names are as follows:

• WebGLPipeline.set1f will set a 1f uniform based on the given name.
• WebGLPipeline.set2f will set a 2f uniform based on the given name.
• WebGLPipeline.set3f will set a 3f uniform based on the given name.
• WebGLPipeline.set4f will set a 4f uniform based on the given name.
• WebGLPipeline.set1fv will set a 1fv uniform based on the given name.
• WebGLPipeline.set2fv will set a 2fv uniform based on the given name.
• WebGLPipeline.set3fv will set a 3fv uniform based on the given name.
• WebGLPipeline.set4fv will set a 4fv uniform based on the given name.
• WebGLPipeline.set1iv will set a 1iv uniform based on the given name.
• WebGLPipeline.set2iv will set a 2iv uniform based on the given name.
• WebGLPipeline.set3iv will set a 3iv uniform based on the given name.
• WebGLPipeline.set4iv will set a 4iv uniform based on the given name.
• WebGLPipeline.set1i will set a 1i uniform based on the given name.
• WebGLPipeline.set2i will set a 2i uniform based on the given name.
• WebGLPipeline.set3i will set a 3i uniform based on the given name.
• WebGLPipeline.set4i will set a 4i uniform based on the given name.
• WebGLPipeline.setMatrix2fv will set a matrix 2fv uniform based on the given name.
• WebGLPipeline.setMatrix3fv will set a matrix 3fv uniform based on the given name.
• WebGLPipeline.setMatrix4fv will set a matrix 4fv uniform based on the given name.

If your code uses any of the old method names, please update them using the list below:

• WebGLPipeline.setFloat1 has been removed. Please use set1f instead.
• WebGLPipeline.setFloat2 has been removed. Please use set2f instead.
• WebGLPipeline.setFloat3 has been removed. Please use set3f instead.
• WebGLPipeline.setFloat4 has been removed. Please use set4f instead.
• WebGLPipeline.setFloat1v has been removed. Please use set1fv instead.
• WebGLPipeline.setFloat2v has been removed. Please use set2fv instead.
• WebGLPipeline.setFloat3v has been removed. Please use set3fv instead.
• WebGLPipeline.setFloat4v has been removed. Please use set4fv instead.
• WebGLPipeline.setInt1 has been removed. Please use set1i instead.
• WebGLPipeline.setInt2 has been removed. Please use set2i instead.
• WebGLPipeline.setInt3 has been removed. Please use set3i instead.
• WebGLPipeline.setInt4 has been removed. Please use set4i instead.
• WebGLPipeline.setMatrix1 has been removed. Please use setMatrix2fv instead.
• WebGLPipeline.setMatrix2 has been removed. Please use setMatrix3fv instead.
• WebGLPipeline.setMatrix3 has been removed. Please use setMatrix4fv instead.

Pipeline Manager

The WebGL.PipelineManager is a new class that is responsbile for managing all of the WebGL Pipelines in Phaser. An instance of the Pipeline Manager is created by the WebGL Renderer and is available under the pipelines property. This means that the WebGL Renderer no longer handles pipelines directly, causing the following API changes:

• WebGLRenderer.pipelines is no longer a plain object containing pipeline instances. It's now an instance of the PipelineManager class. This instance is created during the init and boot phase of the renderer.
• The WebGLRenderer.currentPipeline property no longer exists, instead use PipelineManager.current.
• The WebGLRenderer.previousPipeline property no longer exists, instead use PipelineManager.previous.
• The WebGLRenderer.hasPipeline method no longer exists, instead use PipelineManager.has.
• The WebGLRenderer.getPipeline method no longer exists, instead use PipelineManager.get.
• The WebGLRenderer.removePipeline method no longer exists, instead use PipelineManager.remove.
• The WebGLRenderer.addPipeline method no longer exists, instead use PipelineManager.add.
• The WebGLRenderer.setPipeline method no longer exists, instead use PipelineManager.set.
• The WebGLRenderer.rebindPipeline method no longer exists, instead use PipelineManager.rebind.
• The WebGLRenderer.clearPipeline method no longer exists, instead use PipelineManager.clear.

The Pipeline Manager also offers the following new features:

• The PipelineManager.resize method automatically handles resize events across all pipelines.
• The PipelineManager.preRender method calls the pre-render method of all pipelines.
• The PipelineManager.render method calls the render method of all pipelines.
• The PipelineManager.postRender method calls the post-render method of all pipelines.
• The PipelineManager.setMulti method automatically binds the Multi Texture Pipeline, Phaser's default.
• The PipelineManager.clear method will clear the pipeline, store it in previous and free the renderer.
• The PipelineManager.rebind method will reset the rendering context and restore the previous pipeline, if set.

New constants have been created to help you reference a pipeline without needing to use strings:

• Phaser.Renderer.WebGL.Pipelines.BITMAPMASK_PIPELINE for the Bitmap Mask Pipeline.
• Phaser.Renderer.WebGL.Pipelines.LIGHT_PIPELINE for the Light 2D Pipeline.
• Phaser.Renderer.WebGL.Pipelines.SINGLE_PIPELINE for the Single Pipeline.
• Phaser.Renderer.WebGL.Pipelines.MULTI_PIPELINE for the Multi Pipeline.
• Phaser.Renderer.WebGL.Pipelines.ROPE_PIPELINE for the Rope Pipeline.

All Game Objects have been updated to use the new constants and Pipeline Manager.

Single Pipeline

There is also a new pipeline called SinglePipeline, created to emulate the old TextureTintPipeline. This special pipeline uses just a single texture and makes things a lot easier if you wish to create a custom pipeline, but not have to recode your shaders to work with multiple textures. Instead, just extend SinglePipeline, where-as before you extended the TextureTintPipeline and you won't have to change any of your shader code. Howeve...

Phaser v3.50.0 Beta 8

Version 3.50.0 - Subaru - in development

WebGL Pipeline Updates

If you use a custom WebGL Pipeline in your game, you must update your code in order to use Phaser 3.50.

Due to the huge amount of work that has taken place in this area, all of the pipelines have been renamed. If you extend any of these pipelines or use them in your game code (referenced by name), then please update accordingly. The name changes are:

• TextureTintPipeline is now called the MultiPipeline.
• TextureTintStripPipeline is now called the RopePipeline.
• ForwardDiffuseLightPipeline is now called the LightPipeline.

To match the new pipeline names, the shader source code has also been renamed.

• ForwardDiffuse.frag is now called Light.frag.
• TextureTint.frag is now called Multi.frag.
• TextureTint.vert is now called Multi.vert.

Other pipeline changes are as follows:

• Types.Renderer.WebGL.WebGLPipelineConfig is a new TypeDef that helps you easily configure your own Custom Pipeline when using TypeScript and also provides better JSDocs.
• Types.Renderer.WebGL.WebGLPipelineAttributesConfig is a new TypeDef that helps you easily configure the attributes for your own Custom Pipelines when using TypeScript and also provides better JSDocs.
• All pipelines will now work out the renderer property automatically, so it's no longer required in the config.
• All pipelines will now work out the gl property automatically, so it's no longer required in the config.
• All pipelines will now extract the name property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexCapacity property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexSize property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexData property from the config, allowing you to set it externally.
• All pipelines will now extract the attributes property from the config, allowing you to set it externally.
• All pipelines will now extract the topology property from the config, allowing you to set it externally.
• The WebGLPipeline.shouldFlush method now accepts an optional parameter amount. If given, it will return true if when the amount is added to the vertex count it will exceed the vertex capacity. The Multi Pipeline has been updated to now use this method instead of performing the comparison multiple times itself.
• The RopePipeline now extends MultiPipeline and just changes the topolgy, vastly reducing the filesize.

Pipeline Uniform Changes

Piplines now have a new uniforms array that can be passed in with the config. All default pipelines now set these. The array contains the names, as strings, of all uniforms your pipeline shader uses. Once the pipeline shader has been successfully linked, it will use the array of names to look-up the WebGLUniformLocation of all uniforms specified. These are stored in the new WebGLPipeline.uniforms object. This takes place in the new WebGLPipeline.setUniformLocations method.

When a pipeline is bound, you can now use the new methods (listed below) to set uniform values directly on the pipeline. Previously, calling a method such as setFloat3 on a pipeline would pass that call over to WebGLRenderer. The renderer would first check to see if the pipeline program was current, and if not, make it so, before then looking up the uniform location and finally setting it. This is a lot of steps to take for pipelines that potentially need to change uniforms for every Game Object they render.

Under the new methods, and using the new pre-cached uniform locations, these extra steps are skipped. The uniform value is set directly, no shader binding takes place and no location look-up happens. This dramatically reduces the number of WebGL ops being issued per frame. To clearly differentiate these pipline methods, we have renamed them. The new method names are as follows:

• WebGLPipeline.set1f will set a 1f uniform based on the given name.
• WebGLPipeline.set2f will set a 2f uniform based on the given name.
• WebGLPipeline.set3f will set a 3f uniform based on the given name.
• WebGLPipeline.set4f will set a 4f uniform based on the given name.
• WebGLPipeline.set1fv will set a 1fv uniform based on the given name.
• WebGLPipeline.set2fv will set a 2fv uniform based on the given name.
• WebGLPipeline.set3fv will set a 3fv uniform based on the given name.
• WebGLPipeline.set4fv will set a 4fv uniform based on the given name.
• WebGLPipeline.set1iv will set a 1iv uniform based on the given name.
• WebGLPipeline.set2iv will set a 2iv uniform based on the given name.
• WebGLPipeline.set3iv will set a 3iv uniform based on the given name.
• WebGLPipeline.set4iv will set a 4iv uniform based on the given name.
• WebGLPipeline.set1i will set a 1i uniform based on the given name.
• WebGLPipeline.set2i will set a 2i uniform based on the given name.
• WebGLPipeline.set3i will set a 3i uniform based on the given name.
• WebGLPipeline.set4i will set a 4i uniform based on the given name.
• WebGLPipeline.setMatrix2fv will set a matrix 2fv uniform based on the given name.
• WebGLPipeline.setMatrix3fv will set a matrix 3fv uniform based on the given name.
• WebGLPipeline.setMatrix4fv will set a matrix 4fv uniform based on the given name.

If your code uses any of the old method names, please update them using the list below:

• WebGLPipeline.setFloat1 has been removed. Please use set1f instead.
• WebGLPipeline.setFloat2 has been removed. Please use set2f instead.
• WebGLPipeline.setFloat3 has been removed. Please use set3f instead.
• WebGLPipeline.setFloat4 has been removed. Please use set4f instead.
• WebGLPipeline.setFloat1v has been removed. Please use set1fv instead.
• WebGLPipeline.setFloat2v has been removed. Please use set2fv instead.
• WebGLPipeline.setFloat3v has been removed. Please use set3fv instead.
• WebGLPipeline.setFloat4v has been removed. Please use set4fv instead.
• WebGLPipeline.setInt1 has been removed. Please use set1i instead.
• WebGLPipeline.setInt2 has been removed. Please use set2i instead.
• WebGLPipeline.setInt3 has been removed. Please use set3i instead.
• WebGLPipeline.setInt4 has been removed. Please use set4i instead.
• WebGLPipeline.setMatrix1 has been removed. Please use setMatrix2fv instead.
• WebGLPipeline.setMatrix2 has been removed. Please use setMatrix3fv instead.
• WebGLPipeline.setMatrix3 has been removed. Please use setMatrix4fv instead.

Pipeline Manager

The WebGL.PipelineManager is a new class that is responsbile for managing all of the WebGL Pipelines in Phaser. An instance of the Pipeline Manager is created by the WebGL Renderer and is available under the pipelines property. This means that the WebGL Renderer no longer handles pipelines directly, causing the following API changes:

• WebGLRenderer.pipelines is no longer a plain object containing pipeline instances. It's now an instance of the PipelineManager class. This instance is created during the init and boot phase of the renderer.
• The WebGLRenderer.currentPipeline property no longer exists, instead use PipelineManager.current.
• The WebGLRenderer.previousPipeline property no longer exists, instead use PipelineManager.previous.
• The WebGLRenderer.hasPipeline method no longer exists, instead use PipelineManager.has.
• The WebGLRenderer.getPipeline method no longer exists, instead use PipelineManager.get.
• The WebGLRenderer.removePipeline method no longer exists, instead use PipelineManager.remove.
• The WebGLRenderer.addPipeline method no longer exists, instead use PipelineManager.add.
• The WebGLRenderer.setPipeline method no longer exists, instead use PipelineManager.set.
• The WebGLRenderer.rebindPipeline method no longer exists, instead use PipelineManager.rebind.
• The WebGLRenderer.clearPipeline method no longer exists, instead use PipelineManager.clear.

The Pipeline Manager also offers the following new features:

• The PipelineManager.resize method automatically handles resize events across all pipelines.
• The PipelineManager.preRender method calls the pre-render method of all pipelines.
• The PipelineManager.render method calls the render method of all pipelines.
• The PipelineManager.postRender method calls the post-render method of all pipelines.
• The PipelineManager.setMulti method automatically binds the Multi Texture Pipeline, Phaser's default.
• The PipelineManager.clear method will clear the pipeline, store it in previous and free the renderer.
• The PipelineManager.rebind method will reset the rendering context and restore the previous pipeline, if set.

New constants have been created to help you reference a pipeline without needing to use strings:

• Phaser.Renderer.WebGL.Pipelines.BITMAPMASK_PIPELINE for the Bitmap Mask Pipeline.
• Phaser.Renderer.WebGL.Pipelines.LIGHT_PIPELINE for the Light 2D Pipeline.
• Phaser.Renderer.WebGL.Pipelines.SINGLE_PIPELINE for the Single Pipeline.
• Phaser.Renderer.WebGL.Pipelines.MULTI_PIPELINE for the Multi Pipeline.
• Phaser.Renderer.WebGL.Pipelines.ROPE_PIPELINE for the Rope Pipeline.

All Game Objects have been updated to use the new constants and Pipeline Manager.

Single Pipeline

There is also a new pipeline called SinglePipeline, created to emulate the old TextureTintPipeline. This special pipeline uses just a single texture and makes things a lot easier if you wish to create a custom pipeline, but not have to recode your shaders to work with multiple textures. Instead, just extend SinglePipeline, where-as before you extended the TextureTintPipeline and you won't have to change any of your shader code. Howeve...

Phaser v3.50.0 Beta 7

Version 3.50.0 - Subaru - in development

WebGL Pipeline Updates

If you use a custom WebGL Pipeline in your game, you must update your code in order to use Phaser 3.50.

Due to the huge amount of work that has taken place in this area, all of the pipelines have been renamed. If you extend any of these pipelines or use them in your game code (referenced by name), then please update accordingly. The name changes are:

• TextureTintPipeline is now called the MultiPipeline.
• TextureTintStripPipeline is now called the RopePipeline.
• ForwardDiffuseLightPipeline is now called the LightPipeline.

To match the new pipeline names, the shader source code has also been renamed.

• ForwardDiffuse.frag is now called Light.frag.
• TextureTint.frag is now called Multi.frag.
• TextureTint.vert is now called Multi.vert.

Other pipeline changes are as follows:

• Types.Renderer.WebGL.WebGLPipelineConfig is a new TypeDef that helps you easily configure your own Custom Pipeline when using TypeScript and also provides better JSDocs.
• Types.Renderer.WebGL.WebGLPipelineAttributesConfig is a new TypeDef that helps you easily configure the attributes for your own Custom Pipelines when using TypeScript and also provides better JSDocs.
• All pipelines will now work out the renderer property automatically, so it's no longer required in the config.
• All pipelines will now work out the gl property automatically, so it's no longer required in the config.
• All pipelines will now extract the name property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexCapacity property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexSize property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexData property from the config, allowing you to set it externally.
• All pipelines will now extract the attributes property from the config, allowing you to set it externally.
• All pipelines will now extract the topology property from the config, allowing you to set it externally.
• The WebGLPipeline.shouldFlush method now accepts an optional parameter amount. If given, it will return true if when the amount is added to the vertex count it will exceed the vertex capacity. The Multi Pipeline has been updated to now use this method instead of performing the comparison multiple times itself.

Pipeline Uniform Changes

Piplines now have a new uniforms array that can be passed in with the config. All default pipelines now set these. The array contains the names, as strings, of all uniforms your pipeline shader uses. Once the pipeline shader has been successfully linked, it will use the array of names to look-up the WebGLUniformLocation of all uniforms specified. These are stored in the new WebGLPipeline.uniforms object. This takes place in the new WebGLPipeline.setUniformLocations method.

When a pipeline is bound, you can now use the new methods (listed below) to set uniform values directly on the pipeline. Previously, calling a method such as setFloat3 on a pipeline would pass that call over to WebGLRenderer. The renderer would first check to see if the pipeline program was current, and if not, make it so, before then looking up the uniform location and finally setting it. This is a lot of steps to take for pipelines that potentially need to change uniforms for every Game Object they render.

Under the new methods, and using the new pre-cached uniform locations, these extra steps are skipped. The uniform value is set directly, no shader binding takes place and no location look-up happens. This dramatically reduces the number of WebGL ops being issued per frame. To clearly differentiate these pipline methods, we have renamed them. The new method names are as follows:

• WebGLPipeline.set1f will set a 1f uniform based on the given name.
• WebGLPipeline.set2f will set a 2f uniform based on the given name.
• WebGLPipeline.set3f will set a 3f uniform based on the given name.
• WebGLPipeline.set4f will set a 4f uniform based on the given name.
• WebGLPipeline.set1fv will set a 1fv uniform based on the given name.
• WebGLPipeline.set2fv will set a 2fv uniform based on the given name.
• WebGLPipeline.set3fv will set a 3fv uniform based on the given name.
• WebGLPipeline.set4fv will set a 4fv uniform based on the given name.
• WebGLPipeline.set1iv will set a 1iv uniform based on the given name.
• WebGLPipeline.set2iv will set a 2iv uniform based on the given name.
• WebGLPipeline.set3iv will set a 3iv uniform based on the given name.
• WebGLPipeline.set4iv will set a 4iv uniform based on the given name.
• WebGLPipeline.set1i will set a 1i uniform based on the given name.
• WebGLPipeline.set2i will set a 2i uniform based on the given name.
• WebGLPipeline.set3i will set a 3i uniform based on the given name.
• WebGLPipeline.set4i will set a 4i uniform based on the given name.
• WebGLPipeline.setMatrix2fv will set a matrix 2fv uniform based on the given name.
• WebGLPipeline.setMatrix3fv will set a matrix 3fv uniform based on the given name.
• WebGLPipeline.setMatrix4fv will set a matrix 4fv uniform based on the given name.

If your code uses any of the old method names, please update them using the list below:

• WebGLPipeline.setFloat1 has been removed. Please use set1f instead.
• WebGLPipeline.setFloat2 has been removed. Please use set2f instead.
• WebGLPipeline.setFloat3 has been removed. Please use set3f instead.
• WebGLPipeline.setFloat4 has been removed. Please use set4f instead.
• WebGLPipeline.setFloat1v has been removed. Please use set1fv instead.
• WebGLPipeline.setFloat2v has been removed. Please use set2fv instead.
• WebGLPipeline.setFloat3v has been removed. Please use set3fv instead.
• WebGLPipeline.setFloat4v has been removed. Please use set4fv instead.
• WebGLPipeline.setInt1 has been removed. Please use set1i instead.
• WebGLPipeline.setInt2 has been removed. Please use set2i instead.
• WebGLPipeline.setInt3 has been removed. Please use set3i instead.
• WebGLPipeline.setInt4 has been removed. Please use set4i instead.
• WebGLPipeline.setMatrix1 has been removed. Please use setMatrix2fv instead.
• WebGLPipeline.setMatrix2 has been removed. Please use setMatrix3fv instead.
• WebGLPipeline.setMatrix3 has been removed. Please use setMatrix4fv instead.

Pipeline Manager

The WebGL.PipelineManager is a new class that is responsbile for managing all of the WebGL Pipelines in Phaser. An instance of the Pipeline Manager is created by the WebGL Renderer and is available under the pipelines property. This means that the WebGL Renderer no longer handles pipelines directly, causing the following API changes:

• WebGLRenderer.pipelines is no longer a plain object containing pipeline instances. It's now an instance of the PipelineManager class. This instance is created during the init and boot phase of the renderer.
• The WebGLRenderer.currentPipeline property no longer exists, instead use PipelineManager.current.
• The WebGLRenderer.previousPipeline property no longer exists, instead use PipelineManager.previous.
• The WebGLRenderer.hasPipeline method no longer exists, instead use PipelineManager.has.
• The WebGLRenderer.getPipeline method no longer exists, instead use PipelineManager.get.
• The WebGLRenderer.removePipeline method no longer exists, instead use PipelineManager.remove.
• The WebGLRenderer.addPipeline method no longer exists, instead use PipelineManager.add.
• The WebGLRenderer.setPipeline method no longer exists, instead use PipelineManager.set.
• The WebGLRenderer.rebindPipeline method no longer exists, instead use PipelineManager.rebind.
• The WebGLRenderer.clearPipeline method no longer exists, instead use PipelineManager.clear.

The Pipeline Manager also offers the following new features:

• The PipelineManager.resize method automatically handles resize events across all pipelines.
• The PipelineManager.preRender method calls the pre-render method of all pipelines.
• The PipelineManager.render method calls the render method of all pipelines.
• The PipelineManager.postRender method calls the post-render method of all pipelines.
• The PipelineManager.setMulti method automatically binds the Multi Texture Pipeline, Phaser's default.
• The PipelineManager.clear method will clear the pipeline, store it in previous and free the renderer.
• The PipelineManager.rebind method will reset the rendering context and restore the previous pipeline, if set.

New constants have been created to help you reference a pipeline without needing to use strings:

• Phaser.Renderer.WebGL.Pipelines.BITMAPMASK_PIPELINE for the Bitmap Mask Pipeline.
• Phaser.Renderer.WebGL.Pipelines.LIGHT_PIPELINE for the Light 2D Pipeline.
• Phaser.Renderer.WebGL.Pipelines.SINGLE_PIPELINE for the Single Pipeline.
• Phaser.Renderer.WebGL.Pipelines.MULTI_PIPELINE for the Multi Pipeline.
• Phaser.Renderer.WebGL.Pipelines.ROPE_PIPELINE for the Rope Pipeline.

All Game Objects have been updated to use the new constants and Pipeline Manager.

Single Pipeline

There is also a new pipeline called SinglePipeline, created to emulate the old TextureTintPipeline. This special pipeline uses just a single texture and makes things a lot easier if you wish to create a custom pipeline, but not have to recode your shaders to work with multiple textures. Instead, just extend SinglePipeline, where-as before you extended the TextureTintPipeline and you won't have to change any of your shader code. However, if you can, you should update it to make it perform faster, but that choice is left up to you.

WebGL...

Phaser v3.50.0 Beta 4

WebGL Pipeline Updates

If you use a custom WebGL Pipeline in your game, you must update your code in order to use Phaser 3.50.

Due to the huge amount of work that has taken place in this area, all of the pipelines have been renamed. If you extend any of these pipelines or use them in your game code (referenced by name), then please update accordingly. The name changes are:

• TextureTintPipeline is now called the MultiPipeline.
• TextureTintStripPipeline is now called the RopePipeline.
• ForwardDiffuseLightPipeline is now called the LightPipeline.

To match the new pipeline names, the shader source code has also been renamed.

• ForwardDiffuse.frag is now called Light.frag.
• TextureTint.frag is now called Multi.frag.
• TextureTint.vert is now called Multi.vert.

Other pipeline changes are as follows:

• Types.Renderer.WebGL.WebGLPipelineConfig is a new TypeDef that helps you easily configure your own Custom Pipeline when using TypeScript and also provides better JSDocs.
• Types.Renderer.WebGL.WebGLPipelineAttributesConfig is a new TypeDef that helps you easily configure the attributes for your own Custom Pipelines when using TypeScript and also provides better JSDocs.
• All pipelines will now work out the renderer property automatically, so it's no longer required in the config.
• All pipelines will now work out the gl property automatically, so it's no longer required in the config.
• All pipelines will now extract the name property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexCapacity property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexSize property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexData property from the config, allowing you to set it externally.
• All pipelines will now extract the attributes property from the config, allowing you to set it externally.
• All pipelines will now extract the topology property from the config, allowing you to set it externally.

Single Pipeline

There is also a new pipeline called SinglePipeline, created to emulate the old TextureTintPipeline. This special pipeline uses just a single texture and makes things a lot easier if you wish to create a custom pipeline, but not have to recode your shaders to work with multiple textures. Instead, just extend SinglePipeline, where-as before you extended the TextureTintPipeline and you won't have to change any of your shader code. However, if you can, you should update it to make it perform faster, but that choice is left up to you.

WebGL Multi-Texture Rendering

The Multi Pipeline (previously the Texture Tint Pipeline) has had its core flow rewritten to eliminate the need for constantly creating batch objects. Instead, it now supports the new multi-texture shader, vastly increasing rendering performance, especially on draw-call bound systems.

All of the internal functions, such as batchQuad and batchSprite have been updated to use the new method of texture setting. The method signatures all remain the same unless indicated below.

• Config.render.maxTextures is a new game config setting that allows you to control how many texture units will be used in WebGL.
• WebGL.Utils.checkShaderMax is a new function, used internally by the renderer, to determine the maximum number of texture units the GPU + browser supports.
• The property WebGLRenderer.currentActiveTextureUnit has been renamed to currentActiveTexture.
• WebGLRenderer.startActiveTexture is a new read-only property contains the current starting active texture unit.
• WebGLRenderer.maxTextures is a new read-only property that contains the maximum number of texture units WebGL can use.
• WebGLRenderer.textureIndexes is a new read-only array that contains all of the available WebGL texture units.
• WebGLRenderer.tempTextures is a new read-only array that contains temporary WebGL textures.
• The WebGLRenderer.currentTextures property has been removed, as it's no longer used.
• TextureSource.glIndex is a new property that holds the currently assigned texture unit for the Texture Source.
• TextureSource.glIndexCounter is a new property that holds the time the index was assigned to the Texture Source.
• WebGLRenderer.currentTextures has been removed, as it's no longer used internally.
• WebGLRenderer.setBlankTexture no longer has a force parameter, as it's set by default.
• The Mesh Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Blitter Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Bitmap Text Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Dynamic Bitmap Text Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Particle Emitter Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Texture Tint vertex and fragment shaders have been updated to support the inTexId float attribute and dynamic generation.
• The Texture Tint Pipeline has a new attribute, inTexId which is a gl.FLOAT.
• TextureTintPipeline.bind is a new method that sets the uMainSampler uniform.
• The TextureTintPipeline.requireTextureBatch method has been removed, as it's no longer required.
• The TextureTintPipeline.pushBatch method has been removed, as it's no longer required.
• The TextureTintPipeline.maxQuads property has been removed, as it's no longer required.
• The TextureTintPipeline.batches property has been removed, as it's no longer required.
• TextureTintPipeline.flush has been rewritten to support multi-textures.
• TextureTintPipeline.flush no longer creates a sub-array if the batch is full, but instead uses bufferData for speed.
• WebGLPipeline.currentUnit is a new property that holds the most recently assigned texture unit. Treat as read-only.
• WebGLRenderer.setTextureSource is a new method, used by pipelines and Game Objects, that will assign a texture unit to the given Texture Source.
• The WebGLRenderer.setTexture2D method has been updated to use the new texture unit assignment. It no longer takes the textureUnit or flush parameters and these have been removed from its method signature.
• WebGLRenderer.setTextureZero is a new method that activates texture zero and binds the given texture to it. Useful for fbo backed game objects.
• WebGLRenderer.clearTextureZero is a new method that clears the texture that was bound to unit zero.
• WebGLRenderer.textureZero is a new property that holds the currently bound unit zero texture.
• WebGLRenderer.normalTexture is a new property that holds the currently bound normal map (texture unit one).
• WebGLRenderer.setNormalMap is a new method that sets the current normal map texture.
• WebGLRenderer.clearNormalMap is a new method that clears the current normal map texture.
• WebGLRenderer.resetTextures is a new method that flushes the pipeline, resets all textures back to the temporary ones, and resets the active texture counter.
• WebGLPipeline.boot will now check all of the attributes and store the pointer location within the attribute entry.
• WebGLPipeline.bind no longer looks-up and enables every attribute, every frame. Instead, it uses the cached pointer location stored in the attribute entry, cutting down on redundant WebGL operations.
• WebGLRenderer.isNewNormalMap is a new method that returns a boolean if the given parameters are not currently used.
• WebGLPipeline.forceZero is a new property that informs Game Objects if the pipeline requires a zero bound texture unit.
• WebGLPipeline.setAttribPointers is a new method that will set the vertex attribute pointers for the pipeline.
• WebGLRenderer.unbindTextures is a new method that will activate and then null bind all WebGL textures.
• Renderer.WebGL.Utils.parseFragmentShaderMaxTextures is a new function that will take fragment shader source and search it for %count% and %forloop% declarations, replacing them with the required GLSL for multi-texture support, returning the modified source.

Light Pipeline Changes

The Light Pipeline (previously called the Forward Diffuse Light Pipeline), which is responsible for rendering lights under WebGL, has been rewritten to work with the new Multi Pipeline features. Lots of redundant code has been removed and the following changes and improvements took place:

• The pipeline now works with Game Objects that do not have a normal map. They will be rendered using the new default normal map, which allows for a flat light effect to pass over them and merge with their diffuse map colors.
• Fixed a bug in the way lights were handled that caused Tilemaps to render one tile at a time, causing massive slow down. They're now batched properly, making a combination of lights and tilemaps possible again.
• The Bitmap Text (Static and Dynamic) Game Objects now support rendering with normal maps.
• The TileSprite Game Objects now support rendering with normal maps.
• Mesh and Quad Game Objects now support rendering with normal maps.
• The Graphics Game Objects now support rendering in Light2d. You can even use normal map textures for the texture fills.
• Particle Emitter Game Object now supports rendering in Light2d.
• All Shape Game Objects (Rectangle, IsoBox, Star, Polygon, etc) now support rendering in Light2d.
• The Text Game Object now supports rendering in Light2d, no matter which font, stroke or style it is using.
• Both Static and Dynamic Tilemap Layer Game Objects now support the Light2d pipeline, with or without normal maps.
• The pipeline will no longer look-up and set all of the light uniforms unless the Light is dirty.
• The pipeline will no longer ...

Phaser v3.50.0 Beta 2

WebGL Pipeline Updates

If you use a custom WebGL Pipeline in your game, you must update in order to use Phaser 3.50.

Due to the huge amount of work that has taken place in this area, all of the pipelines have been renamed. If you extend any of these pipelines or use them in your game code (referenced by name), then please update accordingly. The name changes are:

• TextureTintPipeline is now called the MultiPipeline.
• TextureTintStripPipeline is now called the RopePipeline.
• ForwardDiffuseLightPipeline is now called the LightPipeline.

To match the new pipeline names, the shader source code has also been renamed.

• ForwardDiffuse.frag is now called Light.frag.
• TextureTint.frag is now called Multi.frag.
• TextureTint.vert is now called Multi.vert.

Other pipeline changes are as follows:

• Types.Renderer.WebGL.WebGLPipelineConfig is a new TypeDef that helps you easily configure your own Custom Pipeline when using TypeScript and also provides better JSDocs.
• Types.Renderer.WebGL.WebGLPipelineAttributesConfig is a new TypeDef that helps you easily configure the attributes for your own Custom Pipelines when using TypeScript and also provides better JSDocs.
• All pipelines will now work out the renderer property automatically, so it's no longer required in the config.
• All pipelines will now work out the gl property automatically, so it's no longer required in the config.
• All pipelines will now extract the name property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexCapacity property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexSize property from the config, allowing you to set it externally.
• All pipelines will now extract the vertexData property from the config, allowing you to set it externally.
• All pipelines will now extract the attributes property from the config, allowing you to set it externally.
• All pipelines will now extract the topology property from the config, allowing you to set it externally.

Single Pipeline

There is also a new pipeline called SinglePipeline, created to emulate the old TextureTintPipeline. This special pipeline uses just a single texture and makes things a lot easier if you wish to create a custom pipeline, but not have to recode your shaders to work with multiple textures. Instead, just extend SinglePipeline, where-as before you extended the TextureTintPipeline and you won't have to change any of your shader code. However, if you can, you should update it to make it perform faster, but that choice is left up to you.

WebGL Multi-Texture Rendering

The Multi Pipeline (previously the Texture Tint Pipeline) has had its core flow rewritten to eliminate the need for constantly creating batch objects. Instead, it now supports the new multi-texture shader, vastly increasing rendering performance, especially on draw call-bound systems.

All of the internal functions, such as batchQuad and batchSprite have been updated to use the new method of texture setting. The method signatures all remain the same unless indicated below.

• Config.render.maxTextures is a new game config setting that allows you to control how many texture units will be used in WebGL.
• WebGL.Utils.checkShaderMax is a new function, used internally by the renderer, to determine the maximum number of texture units the GPU + browser supports.
• The property WebGLRenderer.currentActiveTextureUnit has been renamed to currentActiveTexture.
• WebGLRenderer.startActiveTexture is a new read-only property contains the current starting active texture unit.
• WebGLRenderer.maxTextures is a new read-only property that contains the maximum number of texture units WebGL can use.
• WebGLRenderer.textureIndexes is a new read-only array that contains all of the available WebGL texture units.
• WebGLRenderer.tempTextures is a new read-only array that contains temporary WebGL textures.
• The WebGLRenderer.currentTextures property has been removed, as it's no longer used.
• TextureSource.glIndex is a new property that holds the currently assigned texture unit for the Texture Source.
• TextureSource.glIndexCounter is a new property that holds the time the index was assigned to the Texture Source.
• WebGLRenderer.currentTextures has been removed, as it's no longer used internally.
• WebGLRenderer.setBlankTexture no longer has a force parameter, as it's set by default.
• The Mesh Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Blitter Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Bitmap Text Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Dynamic Bitmap Text Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Particle Emitter Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Texture Tint vertex and fragment shaders have been updated to support the inTexId float attribute and dynamic generation.
• The Texture Tint Pipeline has a new attribute, inTexId which is a gl.FLOAT.
• TextureTintPipeline.bind is a new method that sets the uMainSampler uniform.
• The TextureTintPipeline.requireTextureBatch method has been removed, as it's no longer required.
• The TextureTintPipeline.pushBatch method has been removed, as it's no longer required.
• The TextureTintPipeline.maxQuads property has been removed, as it's no longer required.
• The TextureTintPipeline.batches property has been removed, as it's no longer required.
• TextureTintPipeline.flush has been rewritten to support multi-textures.
• TextureTintPipeline.flush no longer creates a sub-array if the batch is full, but instead uses bufferData for speed.
• WebGLPipeline.currentUnit is a new property that holds the most recently assigned texture unit. Treat as read-only.
• WebGLRenderer.setTextureSource is a new method, used by pipelines and Game Objects, that will assign a texture unit to the given Texture Source.
• The WebGLRenderer.setTexture2D method has been updated to use the new texture unit assignment. It no longer takes the textureUnit or flush parameters and these have been removed from its method signature.
• WebGLRenderer.setTextureZero is a new method that activates texture zero and binds the given texture to it. Useful for fbo backed game objects.
• WebGLRenderer.clearTextureZero is a new method that clears the texture that was bound to unit zero.
• WebGLRenderer.textureZero is a new property that holds the currently bound unit zero texture.
• WebGLRenderer.normalTexture is a new property that holds the currently bound normal map (texture unit one).
• WebGLRenderer.setNormalMap is a new method that sets the current normal map texture.
• WebGLRenderer.clearNormalMap is a new method that clears the current normal map texture.
• WebGLRenderer.resetTextures is a new method that flushes the pipeline, resets all textures back to the temporary ones, and resets the active texture counter.
• WebGLPipeline.boot will now check all of the attributes and store the pointer location within the attribute entry.
• WebGLPipeline.bind no longer looks-up and enables every attribute, every frame. Instead, it uses the cached pointer location stored in the attribute entry, cutting down on redundant WebGL operations.
• WebGLRenderer.isNewNormalMap is a new method that returns a boolean if the given parameters are not currently used.
• WebGLPipeline.forceZero is a new property that informs Game Objects if the pipeline requires a zero bound texture unit.
• WebGLPipeline.setAttribPointers is a new method that will set the vertex attribute pointers for the pipeline.
• WebGLRenderer.unbindTextures is a new method that will activate and then null bind all WebGL textures.
• Renderer.WebGL.Utils.parseFragmentShaderMaxTextures is a new function that will take fragment shader source and search it for %count% and %forloop% declarations, replacing them with the required GLSL for multi-texture support, returning the modified source.

Light Pipeline Changes

The Light Pipeline (previously called the Forward Diffuse Light Pipeline), which is responsible for rendering lights under WebGL, has been rewritten to work with the new Multi Pipeline features. Lots of redundant code has been removed and the following changes and improvements took place:

• The pipeline now works with Game Objects that do not have a normal map. They will be rendered using the new default normal map, which allows for a flat light effect to pass over them and merge with their diffuse map colors.
• Fixed a bug in the way lights were handled that caused Tilemaps to render one tile at a time, causing massive slow down. They're now batched properly, making a combination of lights and tilemaps possible again.
• The Bitmap Text (Static and Dynamic) Game Objects now support rendering with normal maps.
• The TileSprite Game Objects now support rendering with normal maps.
• Mesh and Quad Game Objects now support rendering with normal maps.
• The Graphics Game Objects now support rendering in Light2d. You can even use normal map textures for the texture fills.
• Particle Emitter Game Object now supports rendering in Light2d.
• All Shape Game Objects (Rectangle, IsoBox, Star, Polygon, etc) now support rendering in Light2d.
• The Text Game Object now supports rendering in Light2d, no matter which font, stroke or style it is using.
• Both Static and Dynamic Tilemap Layer Game Objects now support the Light2d pipeline, with or without normal maps.
• The pipeline will no longer look-up and set all of the light uniforms unless the Light is dirty.
• The pipeline will no longer reset all ...

Phaser v3.50.0 Beta 1

WebGL Multi-Texture Rendering

The Texture Tint Pipeline has had its core flow rewritten to eliminate the need for constantly creating batch objects. Instead, it now supports the new multi-texture shader, vastly increasing rendering performance, especially on drawcall-bound systems.

All of the internal functions, such as batchQuad and batchSprite have been updated to use the new method of texture setting. The method signatures all remain the same, unless indicated below.

• Config.render.maxTextures is a new game config setting that allows you to control how many texture units will be used in WebGL.
• WebGL.Utils.checkShaderMax is a new function, used internally by the renderer, to determine the maximum number of texture units the GPU + browser supports.
• The property WebGLRenderer.currentActiveTextureUnit has been renamed to currentActiveTexture.
• WebGLRenderer.startActiveTexture is a new read-only property contains the current starting active texture unit.
• WebGLRenderer.maxTextures is a new read-only property that contains the maximum number of texture units WebGL can use.
• WebGLRenderer.textureIndexes is a new read-only array that contains all of the available WebGL texture units.
• WebGLRenderer.tempTextures is a new read-only array that contains temporary WebGL textures.
• The WebGLRenderer.currentTextures property has been removed, as it's no longer used.
• TextureSource.glIndex is a new property that holds the currently assigned texture unit for the Texture Source.
• TextureSource.glIndexCounter is a new property that holds the time the index was assigned to the Texture Source.
• WebGLRenderer.currentTextures has been removed, as it's no longer used internally.
• WebGLRenderer.setBlankTexture no longer has a force parameter, as it's set by default.
• The Mesh Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Blitter Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Bitmap Text Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Dynamic Bitmap Text Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Particle Emitter Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Texture Tint vertex and fragment shaders have been updated to support the inTexId float attribute and dynamic generation.
• The Texture Tint Pipeline has a new attribute, inTexId which is a gl.FLOAT.
• TextureTintPipeline.bind is a new method that sets the uMainSampler uniform.
• The TextureTintPipeline.requireTextureBatch method has been removed, as it's no longer required.
• The TextureTintPipeline.pushBatch method has been removed, as it's no longer required.
• The TextureTintPipeline.maxQuads property has been removed, as it's no longer required.
• The TextureTintPipeline.batches property has been removed, as it's no longer required.
• TextureTintPipeline.flush has been rewritten to support multi-textures.
• TextureTintPipeline.flush no longer creates a sub-array if the batch is full, but instead uses bufferData for speed.
• WebGLPipeline.currentUnit is a new property that holds the most recently assigned texture unit. Treat as read-only.
• WebGLRenderer.setTextureSource is a new method, used by pipelines and Game Objects, that will assign a texture unit to the given Texture Source.
• The WebGLRenderer.setTexture2D method has been updated to use the new texture unit assignment. It no longer takes the textureUnit or flush parameters and these have been removed from its method signature.
• WebGLRenderer.setTextureZero is a new method that activates texture zero and binds the given texture to it. Useful for fbo backed game objects.
• WebGLRenderer.clearTextureZero is a new method that clears the texture tha was bound to unit zero.
• WebGLRenderer.textureZero is a new property that holds the currently bound unit zero texture.
• WebGLRenderer.normalTexture is a new property that holds the currently bound normal map (texture unit one).
• WebGLRenderer.setNormalMap is a new method that sets the current normal map texture.
• WebGLRenderer.clearNormalMap is a new method that clears the current normal map texture.
• WebGLRenderer.resetTextures is a new method that flushes the pipeline, resets all textures back to the temporary ones and resets the active texture counter.
• WebGLPipeline.boot will now check all of the attributes and store the pointer location within the attribute entry.
• WebGLPipeline.bind no longer looks-up and enables every attribute, every frame. Instead it uses the cached pointer location stored in the attribute entry, cutting down on redundant WebGL operations.
• WebGLRenderer.isNewNormalMap is a new method that returns a boolean if the given parameters are not currently used.
• WebGLPipeline.forceZero is a new property that informs Game Objects if the pipeline requires a zero bound texture unit.
• WebGLPipeline.setAttribPointers is a new method that will set the vertex attribute pointers for the pipeline.
• WebGLRenderer.unbindTextures is a new method that will activate and then null bind all WebGL textures.

Forward Diffuse Light Pipeline API Changes

This Light2D pipeline, which is responsible for rendering lights under WebGL, has been rewritten to work with the new Texture Tint Pipeline functions. Lots of redundant code has been removed and the following changes and improvements took place:

• The pipeline now works with Game Objects that do not have a normal map. They will be rendered using the new default normal map, which allows for a flat light effect to pass over them and merge with their diffuse map colors.
• Fixed a bug in the way lights were handled that caused Tilemaps to render one tile at a time, causing massive slow down. They're now batched properly, making a combination of lights and tilemaps possible again.
• The Bitmap Text (Static and Dynamic) Game Objects now support rendering with normal maps.
• The TileSprite Game Objects now support rendering with normal maps.
• Mesh and Quad Game Objects now support rendering with normal maps.
• The Graphics Game Objects now support rendering in Light2d. You can even use normal map textures for the texture fills.
• Particle Emitter Game Object now supports rendering in Light2d.
• All Shape Game Objects (Rectangle, IsoBox, Star, Polygon, etc) now support rendering in Light2d.
• The Text Game Object now supports rendering in Light2d, no matter which font, stroke or style it is using.
• Both Static and Dynamic Tilemap Layer Game Objects now support the Light2d pipeline, with or without normal maps.
• The pipeline will no longer look-up and set all of the light uniforms unless the Light is dirty.
• The pipeline will no longer reset all of the lights unless the quantity of lights has changed.
• The ForwardDiffuseLightPipeline.defaultNormalMap property has changed, it's now an object with a glTexture property that maps to the pipelines default normal map.
• The ForwardDiffuseLightPipeline.boot method has been changed to now generate a default normal map.
• The ForwardDiffuseLightPipeline.onBind method has been removed as it's no longer required.
• The ForwardDiffuseLightPipeline.setNormalMap method has been removed as it's no longer required.
• ForwardDiffuseLightPipeline.bind is a new method that handles setting-up the shader uniforms.
• The ForwardDiffuseLightPipeline.batchTexture method has been rewritten to use the Texture Tint Pipeline function instead.
• The ForwardDiffuseLightPipeline.batchSprite method has been rewritten to use the Texture Tint Pipeline function instead.
• ForwardDiffuseLightPipeline.lightCount is a new property that stores the previous number of lights rendered.
• ForwardDiffuseLightPipeline.getNormalMap is a new method that will look-up and return a normal map for the given object.

Lights

• Light.dirty is a new property that controls if the light is dirty, or not, and needs its uniforms updating.
• Light has been recoded so that all of its properties are now setters that activate its dirty flag.
• LightsManager.destroy will now clear the lightPool array when destroyed, where-as previously it didn't.
• LightsManager.cull now takes the viewport height from the renderer instead of the game config (thanks zenwaichi)

WebGL ModelViewProjection API Changes

The ModelViewProjection object contained a lot of functions that Phaser never used internally. These have now been
moved to external functions, which can be easily excluded from Custom builds to save space.

If you used any of them in your code, please update to the new function names below:

• Phaser.Renderer.WebGL.MVP is a new namespace under which the Model View Projection functions now live.
• projIdentity is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.ProjectIdentity
• projPersp is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.ProjectPerspective
• modelRotateX is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.RotateX
• modelRotateY is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.RotateY
• modelRotateZ is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.RotateZ
• viewLoad is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.ViewLoad
• viewRotateX is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.ViewRotateX
• viewRotateY is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.ViewRotateY
• viewRotateZ is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.ViewRotateZ
• viewScale is now available as a stand-alone function `Phaser.Renderer.WebGL.MVP.View...

Phaser v3.25.0 Beta 0

WebGL Multi-Texture Rendering

The Texture Tint Pipeline has had its core flow rewritten to eliminate the need for constantly creating batch objects. Instead, it now supports the new multi-texture shader, vastly increasing rendering performance, especially on drawcall-bound systems.

All of the internal functions, such as batchQuad and batchSprite have been updated to use the new method of texture setting. The method signatures all remain the same, unless indicated below.

• Config.render.maxTextures is a new game config setting that allows you to control how many texture units will be used in WebGL.
• WebGL.Utils.checkShaderMax is a new function, used internally by the renderer, to determine the maximum number of texture units the GPU + browser supports.
• The property WebGLRenderer.currentActiveTextureUnit has been renamed to currentActiveTexture.
• WebGLRenderer.startActiveTexture is a new read-only property contains the current starting active texture unit.
• WebGLRenderer.maxTextures is a new read-only property that contains the maximum number of texture units WebGL can use.
• WebGLRenderer.textureIndexes is a new read-only array that contains all of the available WebGL texture units.
• WebGLRenderer.tempTextures is a new read-only array that contains temporary WebGL textures.
• The WebGLRenderer.currentTextures property has been removed, as it's no longer used.
• TextureSource.glIndex is a new property that holds the currently assigned texture unit for the Texture Source.
• TextureSource.glIndexCounter is a new property that holds the time the index was assigned to the Texture Source.
• WebGLRenderer.currentTextures has been removed, as it's no longer used internally.
• WebGLRenderer.setBlankTexture no longer has a force parameter, as it's set by default.
• The Mesh Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Blitter Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Bitmap Text Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Dynamic Bitmap Text Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Particle Emitter Game Object WebGL Renderer function has been updated to support multi-texture units.
• The Texture Tint vertex and fragment shaders have been updated to support the inTexId float attribute and dynamic generation.
• The Texture Tint Pipeline has a new attribute, inTexId which is a gl.FLOAT.
• TextureTintPipeline.bind is a new method that sets the uMainSampler uniform.
• The TextureTintPipeline.requireTextureBatch method has been removed, as it's no longer required.
• The TextureTintPipeline.pushBatch method has been removed, as it's no longer required.
• The TextureTintPipeline.maxQuads property has been removed, as it's no longer required.
• The TextureTintPipeline.batches property has been removed, as it's no longer required.
• TextureTintPipeline.flush has been rewritten to support multi-textures.
• TextureTintPipeline.flush no longer creates a sub-array if the batch is full, but instead uses bufferData for speed.
• WebGLPipeline.currentUnit is a new property that holds the most recently assigned texture unit. Treat as read-only.
• WebGLRenderer.setTextureSource is a new method, used by pipelines and Game Objects, that will assign a texture unit to the given Texture Source.
• The WebGLRenderer.setTexture2D method has been updated to use the new texture unit assignment. It no longer takes the textureUnit or flush parameters and these have been removed from its method signature.
• WebGLRenderer.setTextureZero is a new method that activates texture zero and binds the given texture to it. Useful for fbo backed game objects.
• WebGLRenderer.clearTextureZero is a new method that clears the texture tha was bound to unit zero.
• WebGLRenderer.textureZero is a new property that holds the currently bound unit zero texture.
• WebGLRenderer.normalTexture is a new property that holds the currently bound normal map (texture unit one).
• WebGLRenderer.setNormalMap is a new method that sets the current normal map texture.
• WebGLRenderer.clearNormalMap is a new method that clears the current normal map texture.
• WebGLRenderer.resetTextures is a new method that flushes the pipeline, resets all textures back to the temporary ones and resets the active texture counter.
• WebGLPipeline.boot will now check all of the attributes and store the pointer location within the attribute entry.
• WebGLPipeline.bind no longer looks-up and enables every attribute, every frame. Instead it uses the cached pointer location stored in the attribute entry, cutting down on redundant WebGL operations.
• WebGLRenderer.isNewNormalMap is a new method that returns a boolean if the given parameters are not currently used.
• WebGLPipeline.forceZero is a new property that informs Game Objects if the pipeline requires a zero bound texture unit.
• WebGLPipeline.setAttribPointers is a new method that will set the vertex attribute pointers for the pipeline.
• WebGLRenderer.unbindTextures is a new method that will activate and then null bind all WebGL textures.

Forward Diffuse Light Pipeline API Changes

This Light2D pipeline, which is responsible for rendering lights under WebGL, has been rewritten to work with the new Texture Tint Pipeline functions. Lots of redundant code has been removed and the following changes and improvements took place:

• The pipeline now works with Game Objects that do not have a normal map. They will be rendered using the new default normal map, which allows for a flat light effect to pass over them and merge with their diffuse map colors.
• Fixed a bug in the way lights were handled that caused Tilemaps to render one tile at a time, causing massive slow down. They're now batched properly, making a combination of lights and tilemaps possible again.
• The Bitmap Text (Static and Dynamic) Game Objects now support rendering with normal maps.
• The TileSprite Game Objects now support rendering with normal maps.
• Mesh and Quad Game Objects now support rendering with normal maps.
• The Graphics Game Objects now support rendering in Light2d. You can even use normal map textures for the texture fills.
• Particle Emitter Game Object now supports rendering in Light2d.
• All Shape Game Objects (Rectangle, IsoBox, Star, Polygon, etc) now support rendering in Light2d.
• The Text Game Object now supports rendering in Light2d, no matter which font, stroke or style it is using.
• Both Static and Dynamic Tilemap Layer Game Objects now support the Light2d pipeline, with or without normal maps.
• The pipeline will no longer look-up and set all of the light uniforms unless the Light is dirty.
• The pipeline will no longer reset all of the lights unless the quantity of lights has changed.
• The ForwardDiffuseLightPipeline.defaultNormalMap property has changed, it's now an object with a glTexture property that maps to the pipelines default normal map.
• The ForwardDiffuseLightPipeline.boot method has been changed to now generate a default normal map.
• The ForwardDiffuseLightPipeline.onBind method has been removed as it's no longer required.
• The ForwardDiffuseLightPipeline.setNormalMap method has been removed as it's no longer required.
• ForwardDiffuseLightPipeline.bind is a new method that handles setting-up the shader uniforms.
• The ForwardDiffuseLightPipeline.batchTexture method has been rewritten to use the Texture Tint Pipeline function instead.
• The ForwardDiffuseLightPipeline.batchSprite method has been rewritten to use the Texture Tint Pipeline function instead.
• ForwardDiffuseLightPipeline.lightCount is a new property that stores the previous number of lights rendered.
• ForwardDiffuseLightPipeline.getNormalMap is a new method that will look-up and return a normal map for the given object.

Lights

• Light.dirty is a new property that controls if the light is dirty, or not, and needs its uniforms updating.
• Light has been recoded so that all of its properties are now setters that activate its dirty flag.
• LightsManager.destroy will now clear the lightPool array when destroyed, where-as previously it didn't.
• LightsManager.cull now takes the viewport height from the renderer instead of the game config (thanks zenwaichi)

WebGL ModelViewProjection API Changes

The ModelViewProjection object contained a lot of functions that Phaser never used internally. These have now been
moved to external functions, which can be easily excluded from Custom builds to save space.

If you used any of them in your code, please update to the new function names below:

• Phaser.Renderer.WebGL.MVP is a new namespace under which the Model View Projection functions now live.
• projIdentity is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.ProjectIdentity
• projPersp is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.ProjectPerspective
• modelRotateX is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.RotateX
• modelRotateY is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.RotateY
• modelRotateZ is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.RotateZ
• viewLoad is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.ViewLoad
• viewRotateX is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.ViewRotateX
• viewRotateY is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.ViewRotateY
• viewRotateZ is now available as a stand-alone function Phaser.Renderer.WebGL.MVP.ViewRotateZ
• viewScale is now available as a stand-alone function `Phaser.Renderer.WebGL.MVP.View...

Phaser v3.24.1

Version 3.24.1 - Rem - 14th July 2020

• Reverted the PR that added the parent transform to a Static Tilemap Layer as it broke tilemap rendering when the camera was zoomed (thanks @kainage)
• Fixed an error with the use of the Vector2Like type in the Math.RotateTo function that caused a TypeScript error on compilation

Version 3.24.0 - Rem - 13th July 2020

Arcade Physics New Features, Updates and Fixes

• When colliding physics groups with the search tree enabled, there was an unnecessary intersection test for each body returned by the search (thanks @samme)
• When doing an overlap collision, there was an unnecessary intersection test for each pair of overlapping bodies (thanks @samme)
• Sprite vs. Static Group collision tests now always use the static tree (thanks @samme)
• Fixed a bug where if you added a static body to a sprite with scale ≠ 1, the body position was incorrect (thanks @samme)
• If you passed in an array of children when creating a Physics Group, they didn't receive bodies. Fix #5152 (thanks @samme)
• New types allow for better docs / TypeScript defs especially in the Factory functions: ArcadePhysicsCallback, GameObjectWithBody, GameObjectWithDynamicBody, GameObjectWithStaticBody, ImageWithDynamicBody, ImageWithStaticBody, SpriteWithDynamicBody and SpriteWithStaticBody. Fix #4994 (thanks @samme @gnesher)
• Body.updateFromGameObject is a new method that extracts the relevant code from preUpdate, allowing you to read the body's new position and center immediately, before the next physics step. It also lets refreshBody work for dynamic bodies, where previously it would error (thanks @samme)
• Momentum exchange wasn't working correctly vs. immovable bodies. The movable body tended to stop. Fix #4770 (thanks @samme)
• The Body mass was decreasing the inertia instead of increasing it. Fix #4770 (thanks @samme)
• The separation vector seemed to be incorrect, causing the slip / slide collisions. The separation is now correct for circle–circle collisions (although not fully for circle–rectangle collisions), part fix #4770 (thanks @samme)
• The Arcade Body delta was incorrectly calculated on bodies created during the update step, causing the position to be off. Fix #5204 (thanks @zackexplosion @samme)
• Arcade.Components.Size.setBodySize is a new method available on Arcade Physics Game Objects that allows you to set the body size. This replaces setSize which is now deprecated. Fix #4786 (thanks @wingyplus)

New Features

• The Animation component has a new property nextAnimsQueue which allows you to sequence Sprite animations to play in order, i.e: this.mole.anims.play('digging').anims.chain('lifting').anims.chain('looking').anims.chain('lowering'); (thanks @tgroborsch)
• Group.setActive is a new method that will set the active state of a Group, just like it does on other Game Objects (thanks @samme)
• Group.setName is a new method that will set the name property of a Group, just like it does on other Game Objects (thanks @samme)
• TWEEN_STOP is a new event dispatched by a Tween when it stops playback (thanks @samme @RollinSafary)
• You can now specify an onStop callback when creating a Tween as part of the tween config, which is invoked when a Tween stops playback (thanks @samme @RollinSafary)
• Previously, if you created a timeline and passed no tweens in the config, the timeline would be created but all config properties were ignored. Now the timeline's own properties (completeDelay, loop, loopDelay, useFrames, onStart, onUpdate, onLoop, onYoyo, onComplete, etc.) are set from the config properly (thanks @samme)
• TextStyle.wordWrapWidth lets you set the maximum width of a line of text (thanks @mikewesthad)
• TextStyle.wordWrapCallback is a custom function that will is responsible for wrapping the text (thanks @mikewesthad)
• TextStyle.wordWrapCallbackScope is the scope that will be applied when the wordWrapCallback is invoked (thanks @mikewesthad)
• TextStyle.wordWrapUseAdvanced controls whether or not to use the advanced wrapping algorithm (thanks @mikewesthad)
• KeyboardPlugin.removeAllKeys is a new method that allows you to automatically remove all Key instances that the plugin has created, making house-keeping a little easier (thanks @samme)
• Math.RotateTo is a new function that will position a point at the given angle and distance (thanks @samme)
• Display.Bounds.GetBounds is a new function that will return the un-transformed bounds of the given Game Object as a Rectangle (thanks @samme)

Updates

• The Pointer.dragStartX/YGlobal and Pointer.dragX/Y values are now populated from the worldX/Y, which means using those values directly in Input Drag callbacks will now work when the Camera is zoomed. Fix #4755 (thanks @braindx)
• The browser field has been added to the Phaser package.json pointing to the dist/phaser.js umd build (thanks @FredKSchott)
• Calling TimeStep.wake() while the loop is running will now cause nothing to happen, rather than sleeping and then waking again (thanks @samme)
• Container.getBounds will no longer set the temp rect bounds to the first child of the Container by default (which would error if the child had no bounds, like a Graphics object) and instead sets it as it iterates the children (thanks @blopa)
• File.state will now be set to the FILE_LOADING state while loading and FILE_LOADED after loading (thanks @samme)
• BaseCamera.cull now moves some of its calculations outside of the cull loop to speed it up (thanks @samme)
• SceneManager.createSceneFromInstance had a small refactor to avoid a pointless condition (thanks @samme)

Bug Fixes

• Fixed a TypeError warning when importing JSON objects directly to the url argument of any of the Loader filetypes. Fix #5189 (thanks @awweather @samme)
• The NOOP function was incorrectly imported by the Mouse and Keyboard Manager. Fix #5170 (thanks @samme @gregolai)
• When Audio files failed to decode on loading, they would always show 'undefined' as the key in the error log, now they show the actual key (thanks @samme)
• When the Sprite Sheet parser results in zero frames, the warning will now tell you the texture name that caused it (thanks @samme)
• KeyboardPlugin.checkDown didn't set the duration to zero if the parameter was omitted, causing it to always return false. Fix #5146 (thanks @lozzajp)
• If you passed in an array of children when creating a Group, they were not added and removed correctly. Fix #5151 (thanks @samme)
• When using HTML5 Audio with pauseOnBlur (the default), if you play a sound, schedule stopping the sound (e.g., timer, tween complete callback), leave the page, and return to the page, the sound stop() will error (thanks @samme)
• Using a Render Texture when you're also using the headless renderer would cause an error (thanks @samme)
• Ellipse.setWidth would incorrectly set the xRadius to the diameter (thanks @rexrainbow)
• Ellipse.setHeight would incorrectly set the yRadius to the diameter (thanks @rexrainbow)
• When specifically setting the parent property in the Game Config to null the canvas was appended to the document body, when it should have been ignored (allowing you to add it to the dom directly). Fix #5191 (thanks @MerganThePirate)
• Containers will now apply nested masks correctly when using the Canvas Renderer specifically (thanks @scott20145)
• Calling Scale.startFullScreen would fail in Safari on Mac OS, throwing a fullscreenfailed error. It now triggers fullscreen mode correctly, as on other browsers. Fix #5143 (thanks @samme @novaknole)
• Calling setCrop on a Matter Physics Sprite would throw a TypeError, but will now crop correctly. Not that it only crops the texture, the body is unaffected. Fix #5211 (thanks @MatthewRorke @samme)
• The Static Tilemap Layer would ignore the layer rotation and parent transform when using WebGL (but worked in Canvas). Both modes now work in the same manner (thanks @cruzdanilo)
• Calling getTextBounds on a BitmapText object would return the incorrect values if the origin had been changed, but the text itself had not, as it was using out of date dimensions. Changing the origin now automatically triggers BitmapText to be dirty, forcing the bounds to be refreshed. Fix #5121 (thanks @thenonamezz)
• The ISO Triangle shape would skip rendering the left side of the first triangle in the batch. It now renders all ISO Triangles correctly. Fix #5164 (thanks @mattjennings)

Examples, Documentation and TypeScript

My thanks to the following for helping with the Phaser 3 Examples, Docs and TypeScript definitions, either by reporting errors, fixing them or helping author the docs:

@samme @SanderVanhove @SirJosh3917 @mooreInteractive @A-312 @lozzajp @mikewesthad @j-waters @futuremarc

Phaser v3.24.0

Arcade Physics New Features, Updates and Fixes

• When colliding physics groups with the search tree enabled, there was an unnecessary intersection test for each body returned by the search (thanks @samme)
• When doing an overlap collision, there was an unnecessary intersection test for each pair of overlapping bodies (thanks @samme)
• Sprite vs. Static Group collision tests now always use the static tree (thanks @samme)
• Fixed a bug where if you added a static body to a sprite with scale ≠ 1, the body position was incorrect (thanks @samme)
• If you passed in an array of children when creating a Physics Group, they didn't receive bodies. Fix #5152 (thanks @samme)
• New types allow for better docs / TypeScript defs especially in the Factory functions: ArcadePhysicsCallback, GameObjectWithBody, GameObjectWithDynamicBody, GameObjectWithStaticBody, ImageWithDynamicBody, ImageWithStaticBody, SpriteWithDynamicBody and SpriteWithStaticBody. Fix #4994 (thanks @samme @gnesher)
• Body.updateFromGameObject is a new method that extracts the relevant code from preUpdate, allowing you to read the body's new position and center immediately, before the next physics step. It also lets refreshBody work for dynamic bodies, where previously it would error (thanks @samme)
• Momentum exchange wasn't working correctly vs. immovable bodies. The movable body tended to stop. Fix #4770 (thanks @samme)
• The Body mass was decreasing the inertia instead of increasing it. Fix #4770 (thanks @samme)
• The separation vector seemed to be incorrect, causing the slip / slide collisions. The separation is now correct for circle–circle collisions (although not fully for circle–rectangle collisions), part fix #4770 (thanks @samme)
• The Arcade Body delta was incorrectly calculated on bodies created during the update step, causing the position to be off. Fix #5204 (thanks @zackexplosion @samme)
• Arcade.Components.Size.setBodySize is a new method available on Arcade Physics Game Objects that allows you to set the body size. This replaces setSize which is now deprecated. Fix #4786 (thanks @wingyplus)

New Features

• The Animation component has a new property nextAnimsQueue which allows you to sequence Sprite animations to play in order, i.e: this.mole.anims.play('digging').anims.chain('lifting').anims.chain('looking').anims.chain('lowering'); (thanks @tgroborsch)
• Group.setActive is a new method that will set the active state of a Group, just like it does on other Game Objects (thanks @samme)
• Group.setName is a new method that will set the name property of a Group, just like it does on other Game Objects (thanks @samme)
• TWEEN_STOP is a new event dispatched by a Tween when it stops playback (thanks @samme @RollinSafary)
• You can now specify an onStop callback when creating a Tween as part of the tween config, which is invoked when a Tween stops playback (thanks @samme @RollinSafary)
• Previously, if you created a timeline and passed no tweens in the config, the timeline would be created but all config properties were ignored. Now the timeline's own properties (completeDelay, loop, loopDelay, useFrames, onStart, onUpdate, onLoop, onYoyo, onComplete, etc.) are set from the config properly (thanks @samme)
• TextStyle.wordWrapWidth lets you set the maximum width of a line of text (thanks @mikewesthad)
• TextStyle.wordWrapCallback is a custom function that will is responsible for wrapping the text (thanks @mikewesthad)
• TextStyle.wordWrapCallbackScope is the scope that will be applied when the wordWrapCallback is invoked (thanks @mikewesthad)
• TextStyle.wordWrapUseAdvanced controls whether or not to use the advanced wrapping algorithm (thanks @mikewesthad)
• KeyboardPlugin.removeAllKeys is a new method that allows you to automatically remove all Key instances that the plugin has created, making house-keeping a little easier (thanks @samme)
• Math.RotateTo is a new function that will position a point at the given angle and distance (thanks @samme)
• Display.Bounds.GetBounds is a new function that will return the un-transformed bounds of the given Game Object as a Rectangle (thanks @samme)

Updates

• The Pointer.dragStartX/YGlobal and Pointer.dragX/Y values are now populated from the worldX/Y, which means using those values directly in Input Drag callbacks will now work when the Camera is zoomed. Fix #4755 (thanks @braindx)
• The browser field has been added to the Phaser package.json pointing to the dist/phaser.js umd build (thanks @FredKSchott)
• Calling TimeStep.wake() while the loop is running will now cause nothing to happen, rather than sleeping and then waking again (thanks @samme)
• Container.getBounds will no longer set the temp rect bounds to the first child of the Container by default (which would error if the child had no bounds, like a Graphics object) and instead sets it as it iterates the children (thanks @blopa)
• File.state will now be set to the FILE_LOADING state while loading and FILE_LOADED after loading (thanks @samme)
• BaseCamera.cull now moves some of its calculations outside of the cull loop to speed it up (thanks @samme)
• SceneManager.createSceneFromInstance had a small refactor to avoid a pointless condition (thanks @samme)

Bug Fixes

• Fixed a TypeError warning when importing JSON objects directly to the url argument of any of the Loader filetypes. Fix #5189 (thanks @awweather @samme)
• The NOOP function was incorrectly imported by the Mouse and Keyboard Manager. Fix #5170 (thanks @samme @gregolai)
• When Audio files failed to decode on loading, they would always show 'undefined' as the key in the error log, now they show the actual key (thanks @samme)
• When the Sprite Sheet parser results in zero frames, the warning will now tell you the texture name that caused it (thanks @samme)
• KeyboardPlugin.checkDown didn't set the duration to zero if the parameter was omitted, causing it to always return false. Fix #5146 (thanks @lozzajp)
• If you passed in an array of children when creating a Group, they were not added and removed correctly. Fix #5151 (thanks @samme)
• When using HTML5 Audio with pauseOnBlur (the default), if you play a sound, schedule stopping the sound (e.g., timer, tween complete callback), leave the page, and return to the page, the sound stop() will error (thanks @samme)
• Using a Render Texture when you're also using the headless renderer would cause an error (thanks @samme)
• Ellipse.setWidth would incorrectly set the xRadius to the diameter (thanks @rexrainbow)
• Ellipse.setHeight would incorrectly set the yRadius to the diameter (thanks @rexrainbow)
• When specifically setting the parent property in the Game Config to null the canvas was appended to the document body, when it should have been ignored (allowing you to add it to the dom directly). Fix #5191 (thanks @MerganThePirate)
• Containers will now apply nested masks correctly when using the Canvas Renderer specifically (thanks @scott20145)
• Calling Scale.startFullScreen would fail in Safari on Mac OS, throwing a fullscreenfailed error. It now triggers fullscreen mode correctly, as on other browsers. Fix #5143 (thanks @samme @novaknole)
• Calling setCrop on a Matter Physics Sprite would throw a TypeError, but will now crop correctly. Not that it only crops the texture, the body is unaffected. Fix #5211 (thanks @MatthewRorke @samme)
• The Static Tilemap Layer would ignore the layer rotation and parent transform when using WebGL (but worked in Canvas). Both modes now work in the same manner (thanks @cruzdanilo)
• Calling getTextBounds on a BitmapText object would return the incorrect values if the origin had been changed, but the text itself had not, as it was using out of date dimensions. Changing the origin now automatically triggers BitmapText to be dirty, forcing the bounds to be refreshed. Fix #5121 (thanks @thenonamezz)
• The ISO Triangle shape would skip rendering the left side of the first triangle in the batch. It now renders all ISO Triangles correctly. Fix #5164 (thanks @mattjennings)

Examples, Documentation and TypeScript

My thanks to the following for helping with the Phaser 3 Examples, Docs and TypeScript definitions, either by reporting errors, fixing them or helping author the docs:

@samme @SanderVanhove @SirJosh3917 @mooreInteractive @A-312 @lozzajp @mikewesthad @j-waters @futuremarc