Image To Gold Effect Filter

function processImage(originalImg, intensity = 100, contrast = 1.2) {
    // Ensure parameters are parsed as numbers
    intensity = Number(intensity);
    contrast = Number(contrast);
    
    // Create and size the canvas
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    canvas.width = originalImg.width;
    canvas.height = originalImg.height;
    
    // Draw the original image onto the canvas
    ctx.drawImage(originalImg, 0, 0);
    
    // Fetch image data to manipulate pixels
    const imgData = ctx.getImageData(0, 0, canvas.width, canvas.height);
    const data = imgData.data;

    // Define the color stops for the gold effect gradient
    const goldGradient = [
        { l: 0,   rgb: [0, 0, 0] },             // Black shadows
        { l: 50,  rgb: [64, 38, 11] },          // Dark bronze / brown
        { l: 120, rgb: [168, 120, 29] },        // Mid-tone classic gold
        { l: 180, rgb: [230, 195, 80] },        // Bright gold
        { l: 255, rgb: [255, 253, 220] }        // Pale yellow / white highlights
    ];

    // Precompute a Look-Up Table (LUT) for performance
    const lut = [];
    for (let i = 0; i < 256; i++) {
        let color = [0, 0, 0];
        
        for (let j = 0; j < goldGradient.length - 1; j++) {
            let p1 = goldGradient[j];
            let p2 = goldGradient[j + 1];
            
            // Interpolate between color stops based on luminance
            if (i >= p1.l && i <= p2.l) {
                let t = (i - p1.l) / (p2.l - p1.l);
                color[0] = Math.round(p1.rgb[0] + t * (p2.rgb[0] - p1.rgb[0]));
                color[1] = Math.round(p1.rgb[1] + t * (p2.rgb[1] - p1.rgb[1]));
                color[2] = Math.round(p1.rgb[2] + t * (p2.rgb[2] - p1.rgb[2]));
                break;
            }
        }
        
        // Handle edge case if luminance surpasses defined stops
        if (i > goldGradient[goldGradient.length - 1].l) {
            color = [...goldGradient[goldGradient.length - 1].rgb];
        }
        
        lut.push(color);
    }

    const blend = intensity / 100;

    // Loop through each pixel
    for (let i = 0; i < data.length; i += 4) {
        let r = data[i];
        let g = data[i + 1];
        let b = data[i + 2];

        // Calculate standard perceptive luminance
        let luma = 0.299 * r + 0.587 * g + 0.114 * b;
        
        // Apply contrast to make the metallic effect pop more
        luma = (luma - 128) * contrast + 128;
        
        // Clamp luminance to 0-255 range and round to map to LUT index
        luma = Math.max(0, Math.min(255, Math.round(luma)));

        // Retrieve mapped gold color
        let goldColor = lut[luma];

        // Blend the gold effect with the original pixel based on intensity
        data[i]     = r * (1 - blend) + goldColor[0] * blend;
        data[i + 1] = g * (1 - blend) + goldColor[1] * blend;
        data[i + 2] = b * (1 - blend) + goldColor[2] * blend;
    }

    // Apply the manipulated image data back to the canvas
    ctx.putImageData(imgData, 0, 0);
    
    return canvas;
}