Class: WebGLPipeline

Phaser.Renderer.WebGL. WebGLPipeline

WebGLPipeline is a class that describes the way elements will be rendererd in WebGL, specially focused on batching vertices (batching is not provided). Pipelines are mostly used for describing 2D rendering passes but it's flexible enough to be used for any type of rendering including 3D. Internally WebGLPipeline will handle things like compiling shaders, creating vertex buffers, assigning primitive topology and binding vertex attributes.

The config properties are:

  • game: Current game instance.
  • renderer: Current WebGL renderer.
  • gl: Current WebGL context.
  • topology: This indicates how the primitives are rendered. The default value is GL_TRIANGLES.
           Here is the full list of rendering primitives (https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/Constants).
  • vertShader: Source for vertex shader as a string.
  • fragShader: Source for fragment shader as a string.
  • vertexCapacity: The amount of vertices that shall be allocated
  • vertexSize: The size of a single vertex in bytes.
  • vertices: An optional buffer of vertices
  • attributes: An array describing the vertex attributes

The vertex attributes properties are:

  • name : String - Name of the attribute in the vertex shader
  • size : integer - How many components describe the attribute. For ex: vec3 = size of 3, float = size of 1
  • type : GLenum - WebGL type (gl.BYTE, gl.SHORT, gl.UNSIGNED_BYTE, gl.UNSIGNED_SHORT, gl.FLOAT)
  • normalized : boolean - Is the attribute normalized
  • offset : integer - The offset in bytes to the current attribute in the vertex. Equivalent to offsetof(vertex, attrib) in C Here you can find more information of how to describe an attribute:
  • https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/vertexAttribPointer

new WebGLPipeline(config)

Parameters:
Name Type Description
config object

The configuration object for this WebGL Pipeline, as described above.

Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 11)

Members


active :boolean

Indicates if the current pipeline is active or not for this frame only. Reset in the onRender method.

Type:
  • boolean
Since: 3.10.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 230)

attributes :object

Array of objects that describe the vertex attributes

Type:
  • object
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 174)

bytes :Uint8Array

Uint8 view to the vertex raw buffer. Used for uploading vertex buffer resources to the GPU.

Type:
  • Uint8Array
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 201)

flushLocked :boolean

Indicates if the current pipeline is flushing the contents to the GPU. When the variable is set the flush function will be locked.

Type:
  • boolean
Since: 3.1.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 220)

game :Phaser.Game

The Game which owns this WebGL Pipeline.

Type:
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 65)

gl :WebGLRenderingContext

The WebGL context this WebGL Pipeline uses.

Type:
  • WebGLRenderingContext
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 110)

height :number

Height of the current viewport

Type:
  • number
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 101)

name :string

Name of the Pipeline. Used for identifying

Type:
  • string
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 56)

program :WebGLProgram

The handle to a WebGL program

Type:
  • WebGLProgram
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 165)

renderer :Phaser.Renderer.WebGL.WebGLRenderer

The WebGL Renderer which owns this WebGL Pipeline.

Type:
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 138)

resolution :number

Used to store the current game resolution

Type:
  • number
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 83)

topology :integer

The primitive topology which the pipeline will use to submit draw calls

Type:
  • integer
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 192)

vertexBuffer :WebGLBuffer

The handle to a WebGL vertex buffer object.

Type:
  • WebGLBuffer
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 156)

vertexCapacity :integer

The limit of vertices that the pipeline can hold

Type:
  • integer
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 129)

vertexComponentCount :integer

This will store the amount of components of 32 bit length

Type:
  • integer
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 211)

vertexCount :number

How many vertices have been fed to the current pipeline.

Type:
  • number
Since: 3.0.0
Default Value:
  • 0
Source: src/renderer/webgl/WebGLPipeline.js (Line 119)

vertexData :ArrayBuffer

Raw byte buffer of vertices.

Type:
  • ArrayBuffer
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 147)

vertexSize :integer

The size in bytes of the vertex

Type:
  • integer
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 183)

view :HTMLCanvasElement

The canvas which this WebGL Pipeline renders to.

Type:
  • HTMLCanvasElement
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 74)

width :number

Width of the current viewport

Type:
  • number
Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 92)

Methods


addAttribute(name, size, type, normalized, offset)

Adds a description of vertex attribute to the pipeline

Parameters:
Name Type Description
name string

Name of the vertex attribute

size integer

Vertex component size

type integer

Type of the attribute

normalized boolean

Is the value normalized to a range

offset integer

Byte offset to the beginning of the first element in the vertex

Since: 3.2.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 254)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

bind()

Binds the pipeline resources, including programs, vertex buffers and binds attributes

Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 315)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

boot()

Called when the Game has fully booted and the Renderer has finished setting up.

By this stage all Game level systems are now in place and you can perform any final tasks that the pipeline may need that relied on game systems such as the Texture Manager.

Since: 3.11.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 241)

destroy()

Removes all object references in this WebGL Pipeline and removes its program from the WebGL context.

Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 450)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

flush()

Uploads the vertex data and emits a draw call for the current batch of vertices.

Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 415)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

onBind()

Set whenever this WebGL Pipeline is bound to a WebGL Renderer.

This method is called every time the WebGL Pipeline is attempted to be bound, even if it already is the current pipeline.

Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 354)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

onPostRender()

Called after each frame has been completely rendered and snapshots have been taken.

Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 401)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

onPreRender()

Called before each frame is rendered, but after the canvas has been cleared.

Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 370)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

onRender(scene, camera)

Called before a Scene's Camera is rendered.

Parameters:
Name Type Description
scene Phaser.Scene

The Scene being rendered.

camera Phaser.Cameras.Scene2D.Camera

The Scene Camera being rendered with.

Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 384)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

resize(width, height, resolution)

Resizes the properties used to describe the viewport

Parameters:
Name Type Description
width number

The new width of this WebGL Pipeline.

height number

The new height of this WebGL Pipeline.

resolution number

The resolution this WebGL Pipeline should be resized to.

Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 294)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

setFloat1(name, x)

Set a uniform value of the current pipeline program.

Parameters:
Name Type Description
name string

The name of the uniform to look-up and modify.

x number

The new value of the float uniform.

Since: 3.2.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 472)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

setFloat1v(name, arr)

Set a uniform value of the current pipeline program.

Parameters:
Name Type Description
name string

The name of the uniform to look-up and modify.

arr Float32Array

The new value to be used for the uniform variable.

Since: 3.13.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 550)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

setFloat2(name, x, y)

Set a uniform value of the current pipeline program.

Parameters:
Name Type Description
name string

The name of the uniform to look-up and modify.

x number

The new X component of the vec2 uniform.

y number

The new Y component of the vec2 uniform.

Since: 3.2.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 490)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

setFloat2v(name, arr)

Set a uniform value of the current pipeline program.

Parameters:
Name Type Description
name string

The name of the uniform to look-up and modify.

arr Float32Array

The new value to be used for the uniform variable.

Since: 3.13.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 568)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

setFloat3(name, x, y, z)

Set a uniform value of the current pipeline program.

Parameters:
Name Type Description
name string

The name of the uniform to look-up and modify.

x number

The new X component of the vec3 uniform.

y number

The new Y component of the vec3 uniform.

z number

The new Z component of the vec3 uniform.

Since: 3.2.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 509)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

setFloat3v(name, arr)

Set a uniform value of the current pipeline program.

Parameters:
Name Type Description
name string

The name of the uniform to look-up and modify.

arr Float32Array

The new value to be used for the uniform variable.

Since: 3.13.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 586)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

setFloat4(name, x, y, z, w)

Set a uniform value of the current pipeline program.

Parameters:
Name Type Description
name string

The name of the uniform to look-up and modify.

x number

X component of the uniform

y number

Y component of the uniform

z number

Z component of the uniform

w number

W component of the uniform

Since: 3.2.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 529)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

setFloat4v(name, arr)

Set a uniform value of the current pipeline program.

Parameters:
Name Type Description
name string

The name of the uniform to look-up and modify.

arr Float32Array

The new value to be used for the uniform variable.

Since: 3.13.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 604)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

setInt1(name, x)

Set a uniform value of the current pipeline program.

Parameters:
Name Type Description
name string

The name of the uniform to look-up and modify.

x integer

The new value of the int uniform.

Since: 3.2.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 622)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

setInt2(name, x, y)

Set a uniform value of the current pipeline program.

Parameters:
Name Type Description
name string

The name of the uniform to look-up and modify.

x integer

The new X component of the ivec2 uniform.

y integer

The new Y component of the ivec2 uniform.

Since: 3.2.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 640)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

setInt3(name, x, y, z)

Set a uniform value of the current pipeline program.

Parameters:
Name Type Description
name string

The name of the uniform to look-up and modify.

x integer

The new X component of the ivec3 uniform.

y integer

The new Y component of the ivec3 uniform.

z integer

The new Z component of the ivec3 uniform.

Since: 3.2.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 659)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

setInt4(name, x, y, z, w)

Set a uniform value of the current pipeline program.

Parameters:
Name Type Description
name string

The name of the uniform to look-up and modify.

x integer

X component of the uniform

y integer

Y component of the uniform

z integer

Z component of the uniform

w integer

W component of the uniform

Since: 3.2.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 679)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

setMatrix2(name, transpose, matrix)

Set a uniform value of the current pipeline program.

Parameters:
Name Type Description
name string

The name of the uniform to look-up and modify.

transpose boolean

Whether to transpose the matrix. Should be false.

matrix Float32Array

The new values for the mat2 uniform.

Since: 3.2.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 700)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

setMatrix3(name, transpose, matrix)

Set a uniform value of the current pipeline program.

Parameters:
Name Type Description
name string

The name of the uniform to look-up and modify.

transpose boolean

Whether to transpose the matrix. Should be false.

matrix Float32Array

The new values for the mat3 uniform.

Since: 3.2.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 719)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

setMatrix4(name, transpose, matrix)

Set a uniform value of the current pipeline program.

Parameters:
Name Type Description
name string

The name of the uniform to look-up and modify.

transpose boolean

Should the matrix be transpose

matrix Float32Array

Matrix data

Since: 3.2.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 738)
Returns:

This WebGLPipeline instance.

Type
Phaser.Renderer.WebGL.WebGLPipeline

shouldFlush()

Check if the current batch of vertices is full.

Since: 3.0.0
Source: src/renderer/webgl/WebGLPipeline.js (Line 281)
Returns:

true if the current batch should be flushed, otherwise false.

Type
boolean