Add ColorMatrix ShaderEffect for global color transforms

[obiot]

Summary

Add a ColorMatrixEffect ShaderEffect preset that applies a 4x4 color transformation matrix to a renderable or camera output. A single matrix can express brightness, contrast, saturation, hue rotation, channel swapping, tinting, sepia, inversion, and any combination of these — replacing the need to stack multiple individual effects.

API Sketch

import { ColorMatrixEffect } from "melonjs";

// per-renderable
sprite.shader = new ColorMatrixEffect(renderer, {
    matrix: [
        1, 0, 0, 0,
        0, 1, 0, 0,
        0, 0, 1, 0,
        0, 0, 0, 1
    ]
});

// on camera (requires #1367 FBO pipeline)
camera.shader = new ColorMatrixEffect(renderer, {
    matrix: ColorMatrixEffect.desaturate(0.5)
});

Built-in presets (static helpers)

• ColorMatrixEffect.brightness(amount) — adjust brightness
• ColorMatrixEffect.contrast(amount) — adjust contrast
• ColorMatrixEffect.saturate(amount) — adjust saturation (0 = grayscale, 1 = normal)
• ColorMatrixEffect.hueRotate(angle) — rotate hue in radians
• ColorMatrixEffect.sepia(amount) — sepia tone
• ColorMatrixEffect.invert(amount) — color inversion
• ColorMatrixEffect.multiply(matA, matB) — combine two matrices

Shader

The fragment shader multiplies each pixel's vec4(r, g, b, a) by the 4x4 uniform matrix. Single uniform, single multiply — very cheap.

vec4 apply(vec4 color, vec2 uv) {
    return uMatrix * color;
}

Dependencies

• Works on per-renderable today via existing ShaderEffect infrastructure
• Camera-level usage requires Add post-processing pipeline: render-to-texture and camera shader effects #1367 (post-processing pipeline with FBO support)

References

• ShaderEffect: src/video/webgl/shadereffect.js
• Existing effect presets: src/video/webgl/effects/
• CSS feColorMatrix spec for matrix layout reference