Home Reference Source
import RenderSystem from 'oxygen-core/systems/RenderSystem.js'
public class | source

RenderSystem

Extends:

System → RenderSystem

Rendering graphics onto screen canvas.

Example:

const system = new RenderSystem('screen-0');

Static Member Summary

Static Public Members
public static get

Constructor Summary

Public Constructor
public

constructor(canvas: string, optimize: boolean, extensions: Array<string>, contextVersion: number, manualMode: boolean)

Constructor.

Member Summary

Public Members
public get
public get
public get

canvas: HTMLCanvasElement

public get
public get
public set
public get
public get
public get

modelMatrix: mat4

public get
public get
public get
public get
public get
public set
public get
public set
public get

viewMatrix: mat4

Method Summary

Public Methods
public

Disable active render target.

public

Disable active shader.

public

Destructor (disposes internal resources).

public

enableRenderTarget(id: string, clearBuffer: bool)

Make given render target active for further rendering.

public

enableShader(id: string, forced: boolean)

Enable given shader (make it currently active for further rendering).

public

executeCommand(command: Command, deltaTime: number, layer: string | null)

Execute rendering command.

public

extension(name: string): * | null

Get loaded WebGL extension by it's name.

public

Try to generate mipmaps for given texture.

public

Get render target meta information (width and height).

public

Get texture meta information (width and height).

public

Tells if there is registered given render target.

public

Tells if there is registered given shader.

public

Tells if there is registered given texture.

public
public
public

overrideShaderSampler(name: string, texture: string | null, filtering: string | null)

Give active shader sampler different than it's default texture.

public

overrideShaderUniform(name: string, value: *)

Give active shader uniform a different than it's default value.

public

Enable last render target stored on stack (or disable if stack is empty).

public

pushRenderTarget(id: string, clearBuffer: bool)

Push current render target on stack and make given render target active for further rendering.

public

registerRenderTarget(id: string, width: number, height: number, floatPointData: boolean)

Register new render target.

public

registerRenderTargetMulti(id: string, width: number, height: number, targets: number | *[])

Register new multiple render target.

public

registerShader(id: string, vertex: string, fragment: string, layoutInfo: *, uniformsInfo: *, samplersInfo: *, blendingInfo: *, extensionsInfo: string[] | null)

Register new shader.

public

registerTexture(id: string, image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement, generateMipmap: boolean)

Register new texture.

public

registerTextureColor(id: string, width: number, height: number, r: number, g: number, b: number, a: number): *

Register colored texture (mostly used to create solid color textures).

public

registerTextureEmpty(id: string, width: number, height: number, floatPointData: boolean, pixelData: ArrayBufferView | null)

Register empty texture (mostly used in offscreen rendering cases).

public
public

Load WebGL extension by it's name.

public

Load WebGL extensions by their names.

public

resize(forced: boolean)

Resize frame buffer to match canvas size.

public

Unregister existing render target.

public

Unregister existing shader.

public

Unregister existing texture.

Inherited Summary

From class System
public static get
public static get

systems: *

public static

Dispose and remove all registered systems.

public static

get(typename: string): System | null

Returns system instance of given type name.

public static

register(typename: string, system: System): System

Register new system instance under given name.

public static

unregister(typename: string): System

Unregister given system.

public

Destructor (disposes all internal resources).

public

Event called after system gets registered.

public

Event called before system gets unregistered.

Static Public Members

public static get propsTypes: * source

Public Constructors

public constructor(canvas: string, optimize: boolean, extensions: Array<string>, contextVersion: number, manualMode: boolean) source

Constructor. Automaticaly binds into specified canvas.

Params:

NameTypeAttributeDescription
canvas string

HTML canvas element id.

optimize boolean

Optimize rendering pipeline.

extensions Array<string>

array with WebGL extensions list.

contextVersion number

WebGL context version number.

manualMode boolean

Manually trigger rendering next frames.

Public Members

public get activeRenderTarget: string source

public get activeShader: string source

public get canvas: HTMLCanvasElement source

public get clearColor: string source

public get collectStats: boolean source

public set collectStats: boolean source

public get contextVersion: number source

public get events: Events source

Override:

System#events

public get modelMatrix: mat4 source

public get passedTime: number source

public get projectionMatrix: mat4 source

public get stats: Map source

public get statsText: string source

public get timeScale: number source

public set timeScale: number source

public get useDevicePixelRatio: boolean source

public set useDevicePixelRatio: boolean source

public get viewMatrix: mat4 source

Public Methods

public disableRenderTarget() source

Disable active render target.

Example:

system.disableRenderTarget();

public disableShader() source

Disable active shader. Make sure that this is currently active shader (otherwise it will unbind wrong shader locations)!

Example:

system.enableShader('red');
system.disableShader();

public dispose() source

Destructor (disposes internal resources).

Override:

System#dispose

Example:

system.dispose();
sustem = null;

public enableRenderTarget(id: string, clearBuffer: bool) source

Make given render target active for further rendering.

Params:

NameTypeAttributeDescription
id string

Render target id

clearBuffer bool

clear buffer.

Example:

system.enableRenderTarget('offscreen');

public enableShader(id: string, forced: boolean) source

Enable given shader (make it currently active for further rendering).

Params:

NameTypeAttributeDescription
id string

Shader id.

forced boolean

ignore optimizations (by default it will not enable if is currently active).

Example:

system.enableShader('red');

public executeCommand(command: Command, deltaTime: number, layer: string | null) source

Execute rendering command.

Params:

NameTypeAttributeDescription
command Command

command to execute.

deltaTime number

Delta time.

layer string | null

Layer ID.

public extension(name: string): * | null source

Get loaded WebGL extension by it's name.

Params:

NameTypeAttributeDescription
name string

Extension name.

Return:

* | null

WebGL extension or null if not found.

Example:

const extension = system.extension('vertex_array_object');
if (!!extension) {
  const vao = extension.createVertexArrayOES();
  extension.bindVertexArrayOES(vao);
}

public generateTextureMipmap(id: string) source

Try to generate mipmaps for given texture.

Params:

NameTypeAttributeDescription
id string

Texture id.

public getRenderTargetMeta(id: string): * | null source

Get render target meta information (width and height).

Params:

NameTypeAttributeDescription
id string

Texture id.

Return:

* | null

Object with width and height properties or null if not found.

public getTextureMeta(id: string): * | null source

Get texture meta information (width and height).

Params:

NameTypeAttributeDescription
id string

Texture id.

Return:

* | null

Object with width and height properties or null if not found.

public hasRenderTarget(id: string): boolean source

Tells if there is registered given render target.

Params:

NameTypeAttributeDescription
id string

Render target id.

Return:

boolean

public hasShader(id: string): boolean source

Tells if there is registered given shader.

Params:

NameTypeAttributeDescription
id string

Shader id.

Return:

boolean

public hasTexture(id: string): boolean source

Tells if there is registered given texture.

Params:

NameTypeAttributeDescription
id string

Texture id.

Return:

boolean

public onRegister() source

Event called after system gets registered.

Override:

System#onRegister

public onUnregister() source

Event called before system gets unregistered.

Override:

System#onUnregister

public overrideShaderSampler(name: string, texture: string | null, filtering: string | null) source

Give active shader sampler different than it's default texture.

Params:

NameTypeAttributeDescription
name string

Sampler id.

texture string | null

Texture id.

filtering string | null

Sampler filtering. Can be trilinear, bilinear, linear or nearest.

Example:

system.enableShader('sprite');
system.overrideShaderSampler('sTexture', 'martian', 'linear');

public overrideShaderUniform(name: string, value: *) source

Give active shader uniform a different than it's default value.

Params:

NameTypeAttributeDescription
name string

Uniform name.

value *

Uniform value. Can be number of array of numbers.

Example:

system.enableShader('color');
system.overrideShaderUniform('uColor', [1, 0, 0, 1]);

public popRenderTarget() source

Enable last render target stored on stack (or disable if stack is empty).

Example:

system.popRenderTarget();

public pushRenderTarget(id: string, clearBuffer: bool) source

Push current render target on stack and make given render target active for further rendering.

Params:

NameTypeAttributeDescription
id string

Render target id

clearBuffer bool

clear buffer.

Example:

system.pushRenderTarget('offscreen');

public registerRenderTarget(id: string, width: number, height: number, floatPointData: boolean) source

Register new render target.

Params:

NameTypeAttributeDescription
id string

Render target id.

width number

Width.

height number

Height.

floatPointData boolean

Tells if render target will store floating point data.

Example:

system.registerRenderTarget('offscreen', 512, 512);

public registerRenderTargetMulti(id: string, width: number, height: number, targets: number | *[]) source

Register new multiple render target.

Params:

NameTypeAttributeDescription
id string

Render target id.

width number

Width.

height number

Height.

targets number | *[]

Number of render targets or array with target descriptors.

Example:

system.registerRenderTargetMulti('offscreen', 512, 512, 2);

public registerShader(id: string, vertex: string, fragment: string, layoutInfo: *, uniformsInfo: *, samplersInfo: *, blendingInfo: *, extensionsInfo: string[] | null) source

Register new shader.

Params:

NameTypeAttributeDescription
id string

Shader id.

vertex string

Vertex shader code.

fragment string

Fragment shader code.

layoutInfo *

Vertex layout description.

uniformsInfo *

Uniforms description.

samplersInfo *

Samplers description.

blendingInfo *

Blending mode description.

extensionsInfo string[] | null

Required extensions list.

Example:

system.registerShader(
  'red',
  'attribute vec2 aPosition;\nvoid main() { gl_Position = vec4(aPosition, 0.0, 1.0); }',
  'void main() { gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0); }',
  { aPosition: { size: 2, stride: 2, offset: 0 } },
  {},
  { source: 'src-alpha', destination: 'one-minus-src-alpha' }
);

public registerTexture(id: string, image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement, generateMipmap: boolean) source

Register new texture.

Params:

NameTypeAttributeDescription
id string

Texture id.

image HTMLImageElement | HTMLCanvasElement | HTMLVideoElement

Image, canvas or video instance.

generateMipmap boolean

Should generate mipmaps.

Example:

const image = new Image();
image.src = 'martian.png';
system.registerTexture('martian', image);

public registerTextureColor(id: string, width: number, height: number, r: number, g: number, b: number, a: number): * source

Register colored texture (mostly used to create solid color textures).

Params:

NameTypeAttributeDescription
id string

Texture id.

width number

Width.

height number

Height.

r number

Red value.

g number

Green value.

b number

Blue value.

a number

Alpha value.

Return:

*

Example:

system.registerTextureEmpty('offscreen', 512, 512);

public registerTextureEmpty(id: string, width: number, height: number, floatPointData: boolean, pixelData: ArrayBufferView | null) source

Register empty texture (mostly used in offscreen rendering cases).

Params:

NameTypeAttributeDescription
id string

Texture id.

width number

Width.

height number

Height.

floatPointData boolean

Tells if this texture will store floating point data.

pixelData ArrayBufferView | null

ArrayBuffer view with pixel data or null if empty.

Example:

system.registerTextureEmpty('offscreen', 512, 512);

public renderFrame() source

public requestExtension(name: string): * | null source

Load WebGL extension by it's name.

Params:

NameTypeAttributeDescription
name string

Extension name.

Return:

* | null

WebGL extension or null if not supported.

Example:

const extension = system.requestExtension('vertex_array_object');
if (!!extension) {
  const vao = extension.createVertexArrayOES();
  extension.bindVertexArrayOES(vao);
}

public requestExtensions(args: string[]): boolean source

Load WebGL extensions by their names.

Params:

NameTypeAttributeDescription
args string[]

Extension names.

Return:

boolean

True if all are supported and loaded, false otherwise.

Example:

const supported = system.requestExtensions('texture_float', 'texture_float_linear');
if (!supported) {
  throw new Error('One of requested WebGL extensions is not supported!');
}

public resize(forced: boolean) source

Resize frame buffer to match canvas size.

Params:

NameTypeAttributeDescription
forced boolean

True if ignore optimizations.

public unregisterRenderTarget(id: string) source

Unregister existing render target.

Params:

NameTypeAttributeDescription
id string

Render target id.

Example:

system.unregisterRenderTarget('offscreen');

public unregisterShader(id: string) source

Unregister existing shader.

Params:

NameTypeAttributeDescription
id string

Shader id.

Example:

system.unregisterShader('red');

public unregisterTexture(id: string) source

Unregister existing texture.

Params:

NameTypeAttributeDescription
id string

Texture id.

Example:

system.unregisterTexture('red');