Image Biopunk Filter Effect

function processImage(originalImg, intensity = 0.7, contrast = 1.4, noise = 15, greenChannelBoost = 0.7, blueChannelBoost = 0.2, redChannelSuppression = 0.5) {
    
    // Helper function for clamping values between min and max
    function _clamp(value, min, max) {
        return Math.max(min, Math.min(value, max));
    }

    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d', { willReadFrequently: true }); // Optimization hint for frequent getImageData/putImageData

    const imgWidth = originalImg.naturalWidth || originalImg.width;
    const imgHeight = originalImg.naturalHeight || originalImg.height;

    canvas.width = imgWidth;
    canvas.height = imgHeight;

    // Draw the original image onto the canvas
    ctx.drawImage(originalImg, 0, 0, imgWidth, imgHeight);

    // Prevent processing if image dimensions are invalid
    if (imgWidth === 0 || imgHeight === 0) {
        console.warn("Image has zero width or height. Returning canvas without processing.");
        return canvas;
    }

    const imageData = ctx.getImageData(0, 0, imgWidth, imgHeight);
    const data = imageData.data;

    // Calculate effective strengths of color modifications based on overall intensity
    const actualGreenBoostEffect = greenChannelBoost * intensity;
    const actualBlueBoostEffect = blueChannelBoost * intensity;
    const actualRedSuppressionEffect = redChannelSuppression * intensity;

    // Iterate over 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];

        // 1. Apply Contrast
        // Formula: NewValue = factor * (OldValue - 128) + 128
        // This increases the difference from the mid-gray value (128).
        if (contrast !== 1.0) { // Apply contrast only if it's not neutral (1.0)
            r = _clamp(contrast * (r - 128) + 128, 0, 255);
            g = _clamp(contrast * (g - 128) + 128, 0, 255);
            b = _clamp(contrast * (b - 128) + 128, 0, 255);
        }
        
        // Store contrasted values to be used as base for color grading
        const r_contrasted = r;
        const g_contrasted = g;
        const b_contrasted = b;

        // 2. Biopunk Color Grading (Greenish, synthetic, organic-like)
        // This effect is applied only if intensity > 0.
        if (intensity > 0) {
            // Suppress Red channel
            r = r_contrasted * (1 - actualRedSuppressionEffect);

            // Boost Green channel, add some influence from Blue channel
            g = g_contrasted * (1 + actualGreenBoostEffect) + b_contrasted * (actualGreenBoostEffect * 0.35); // 0.35 is cross-talk factor
            
            // Boost Blue channel, add some influence from Green channel
            b = b_contrasted * (1 + actualBlueBoostEffect) + g_contrasted * (actualBlueBoostEffect * 0.25); // 0.25 is cross-talk factor
        }
        // If intensity is 0, r, g, b will retain their post-contrast values.
        
        // Clamp color-graded values to [0, 255] range
        r = _clamp(r, 0, 255);
        g = _clamp(g, 0, 255);
        b = _clamp(b, 0, 255);
        
        // 3. Add Noise
        // This adds a random value to each channel, simulating film grain or sensor noise.
        if (noise > 0) {
            const noiseVal = (Math.random() - 0.5) * noise * 2; // noise ranges from -noise to +noise
            r = _clamp(r + noiseVal, 0, 255);
            g = _clamp(g + noiseVal, 0, 255);
            b = _clamp(b + noiseVal, 0, 255);
        }

        // Assign final, rounded values back to the imageData array
        data[i] = Math.round(r);
        data[i + 1] = Math.round(g);
        data[i + 2] = Math.round(b);
        // Alpha channel (data[i+3]) remains unchanged
    }

    // Put the modified image data back onto the canvas
    ctx.putImageData(imageData, 0, 0);

    return canvas;
}