melonJS
    Preparing search index...

    Class ShaderEffect

    A simplified shader class for applying custom fragment effects to renderables. Only requires a fragment apply() function — the vertex shader, uniforms, and texture sampling boilerplate are handled automatically. In Canvas mode, the shader is silently disabled (all methods become no-ops).

    // create a grayscale effect
    mySprite.shader = new ShaderEffect(renderer, `
        vec4 apply(vec4 color, vec2 uv) {
            float gray = dot(color.rgb, vec3(0.299, 0.587, 0.114));
            return vec4(vec3(gray), color.a);
        }
    `);

    // create an effect with a custom uniform
    const pulse = new ShaderEffect(renderer, `
        uniform float uTime;
        vec4 apply(vec4 color, vec2 uv) {
            float brightness = 0.8 + 0.2 * sin(uTime * 3.0);
            return vec4(color.rgb * brightness, color.a);
        }
    `);
    mySprite.shader = pulse;
    // update the uniform each frame
    pulse.setUniform("uTime", time);

    Hierarchy (View Summary)

    Index

    Constructors

    constructor

    Properties

    _enabledBeforeSuspend destroyed enabled

    Methods

    destroy setUniform

    Constructors

    • Parameters

      • renderer: any

        the current renderer instance

      • fragmentBody: string

        GLSL code containing a vec4 apply(vec4 color, vec2 uv) function that receives the sampled pixel color and UV coordinates, and returns the modified color. You can declare additional uniform variables before the apply() function.

      • Optionalprecision: string

        float precision ('lowp', 'mediump' or 'highp')

      Returns ShaderEffect

    Properties

    _enabledBeforeSuspend

    _enabledBeforeSuspend: boolean | undefined
    destroyed: boolean = false

    true once destroy has been called. Distinct from enabled — which also toggles transiently across a context lost / restored cycle — to give callers a stable signal for "this effect has been explicitly released."

    enabled: boolean = false

    whether this effect is active (false in Canvas mode, false after destroy, and false while the WebGL context is suspended between an ONCONTEXT_LOST and the matching ONCONTEXT_RESTORED event).

    Methods

    • destroy this shader effect. Idempotent — calling destroy twice is safe. Unsubscribes from the renderer's context-lost / restored events so a destroyed effect is not auto-reactivated.

      Returns void

    • Set the uniform to the given value

      Parameters

      • name: string

        the uniform name

      • value: object | Float32Array<ArrayBufferLike>

        the value to assign to that uniform

      Returns void

    Settings

    Member Visibility

    On This Page

    Constructors
    Properties
    Methods