WebGL

LittleJS WebGL Interface

  • All webgl used by the engine is wrapped up here
  • For normal stuff you won't need to see or call anything in this file
  • For advanced stuff there are helper functions to create shaders, textures, etc
  • Can be disabled with glEnable to revert to 2D canvas rendering
  • Batches sprite rendering on GPU for incredibly fast performance
  • Sprite transform math is done in the shader where possible

Members

(static) glCanvas :HTMLCanvasElement

The WebGL canvas which appears above the main canvas and below the overlay canvas

Type:
  • HTMLCanvasElement

(static) glContext :WebGLRenderingContext

2d context for glCanvas

Type:
  • WebGLRenderingContext

(static) glTileTexture :WebGLTexture

Main tile sheet texture automatically loaded by engine

Type:
  • WebGLTexture

Methods

(static) glCompileShader(source, type) → {WebGLShader}

Compile WebGL shader of the given type, will throw errors if in debug mode

Parameters:
NameTypeDescription
sourceString
type
Returns:
Type: 
WebGLShader

(static) glCopyToContext(context, forceDrawopt)

Draw any sprites still in the buffer, copy to main canvas and clear

Parameters:
NameTypeAttributesDefaultDescription
contextCanvasRenderingContext2D
forceDrawBoolean<optional>
0

(static) glCreateProgram(vsSource, fsSource) → {WebGLProgram}

Create WebGL program with given shaders

Parameters:
NameTypeDescription
vsSourceWebGLShader
fsSourceWebGLShader
Returns:
Type: 
WebGLProgram

(static) glCreateTexture(image) → {WebGLTexture}

Create WebGL texture from an image and set the texture settings

Parameters:
NameTypeDescription
imageImage
Returns:
Type: 
WebGLTexture

(static) glDraw(x, y, sizeX, sizeY, angle, uv0X, uv0Y, uv1X, uv1Y, rgba, rgbaAdditiveopt)

Add a sprite to the gl draw list, used by all gl draw functions

Parameters:
NameTypeAttributesDefaultDescription
xNumber
yNumber
sizeXNumber
sizeYNumber
angleNumber
uv0XNumber
uv0YNumber
uv1XNumber
uv1YNumber
rgbaNumber
rgbaAdditiveNumber<optional>
0

(static) glDrawPoints(points, rgba)

Add a convex polygon to the gl draw list

Parameters:
NameTypeDescription
pointsArray

Array of Vector2 points

rgbaNumber

Color of the polygon

(static) glFlush()

Draw all sprites and clear out the buffer, called automatically by the system whenever necessary

(static) glInitPostProcess(shaderCode, includeOverlay)

Set up a post processing shader

Parameters:
NameTypeDescription
shaderCodeString
includeOverlayBoolean

(static) glSetBlendMode(additiveopt)

Set the WebGl blend mode, normally you should call setBlendMode instead

Parameters:
NameTypeAttributesDefaultDescription
additiveBoolean<optional>
0

(static) glSetTexture(textureopt)

Set the WebGl texture, not normally necessary unless multiple tile sheets are used

  • This may also flush the gl buffer resulting in more draw calls and worse performance
Parameters:
NameTypeAttributesDefaultDescription
textureWebGLTexture<optional>
glTileTexture