Photo Kodak Retina Filter Effect Tool

function processImage(originalImg, brightness = 1.0, contrast = 1.2, saturation = 1.1, sepia = 0.15) {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d', { willReadFrequently: true }); // willReadFrequently for performance with getImageData/putImageData

    // Ensure the image is loaded before trying to get its dimensions or draw it
    // This is a safeguard. If originalImg is guaranteed to be loaded, this can be simpler.
    const drawImageToCanvas = () => {
        const w = originalImg.naturalWidth;
        const h = originalImg.naturalHeight;
        canvas.width = w;
        canvas.height = h;

        ctx.drawImage(originalImg, 0, 0, w, h);

        const imageData = ctx.getImageData(0, 0, w, h);
        const data = imageData.data;
        const len = data.length;

        // Helper for clamping values to the 0-255 range
        const clamp = (value) => Math.max(0, Math.min(255, Math.round(value)));

        for (let i = 0; i < len; i += 4) {
            let r = data[i];
            let g = data[i + 1];
            let b = data[i + 2];

            // 1. Apply Brightness
            // brightness is a multiplier (1.0 = no change)
            if (brightness !== 1.0) {
                r *= brightness;
                g *= brightness;
                b *= brightness;
            }

            // 2. Apply Contrast
            // contrast is a factor (1.0 = no change)
            // Formula: C' = ( (C/255 - 0.5) * contrast_factor + 0.5 ) * 255
            if (contrast !== 1.0) {
                r = ((r / 255.0 - 0.5) * contrast + 0.5) * 255.0;
                g = ((g / 255.0 - 0.5) * contrast + 0.5) * 255.0;
                b = ((b / 255.0 - 0.5) * contrast + 0.5) * 255.0;
            }
            
            // 3. Apply Saturation
            // saturation is a factor (1.0 = no change, 0.0 = grayscale)
            if (saturation !== 1.0) {
                // Standard luminance coefficients for RGB
                const lumR = 0.299; 
                const lumG = 0.587;
                const lumB = 0.114;
                const lum = r * lumR + g * lumG + b * lumB;
                
                r = lum + saturation * (r - lum);
                g = lum + saturation * (g - lum);
                b = lum + saturation * (b - lum);
            }

            // 4. Apply Sepia
            // sepia is a blend factor (0.0 = no change, 1.0 = full sepia)
            if (sepia > 0.0) {
                const originalR = r;
                const originalG = g;
                const originalB = b;
                
                // Standard sepia matrix weights
                // These weights can make image a bit darker, often balanced by brightness
                const sr = originalR * 0.393 + originalG * 0.769 + originalB * 0.189;
                const sg = originalR * 0.349 + originalG * 0.686 + originalB * 0.168;
                const sb = originalR * 0.272 + originalG * 0.534 + originalB * 0.131;

                r = (1 - sepia) * originalR + sepia * sr;
                g = (1 - sepia) * originalG + sepia * sg;
                b = (1 - sepia) * originalB + sepia * sb;
            }

            // Store clamped and rounded values back into the imageData
            data[i] = clamp(r);
            data[i + 1] = clamp(g);
            data[i + 2] = clamp(b);
            // Alpha channel (data[i+3]) remains unchanged
        }

        ctx.putImageData(imageData, 0, 0);
    };
    
    // Check if the image is already loaded
    if (originalImg.complete && originalImg.naturalWidth !== 0) {
        drawImageToCanvas();
    } else {
        // If not loaded, set up an event listener.
        // This part makes the function more robust if it's called with an image URL
        // that hasn't finished loading yet. However, the problem implies originalImg
        // is a ready-to-use Image object. For simplicity in that strict context, 
        // this onload handling could be omitted if caller guarantees loaded image.
        // For this example, we'll return a Promise that resolves with the canvas.
        // However, the prompt implies synchronous return.
        // Let's assume image is loaded, as per "javascript Image object".
        // If originalImg.complete is false, there's not much we can do synchronously to get data.
        // The prompt guideline indicates a synchronous function returning the canvas.
        // So, we must assume `originalImg` is already loaded and usable.
        
        // Fallback for images that might not be 'complete' but are Image objects already
        // This typically happens if `src` was just set.
        // A truly synchronous approach would fail if the image isn't loaded.
        // Given the guidelines, we proceed assuming it's usable.
        drawImageToCanvas();
    }

    return canvas;
}