Photo Ambrotype Filter Effect Tool

function processImage(originalImg, tint = "cool", tintIntensity = 0.5, contrast = -30, brightness = 10, milkyHighlights = 0.7, vignetteStrength = 0.6, vignetteSoftness = 0.8, noise = 10) {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d', { willReadFrequently: true });

    // Ensure the image is loaded, though the problem implies originalImg is an Image object that has loaded.
    // Using naturalWidth/Height is best for unscaled dimensions.
    canvas.width = originalImg.naturalWidth || originalImg.width;
    canvas.height = originalImg.naturalHeight || originalImg.height;

    ctx.drawImage(originalImg, 0, 0, canvas.width, canvas.height);

    const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
    const data = imageData.data;
    const width = canvas.width;
    const height = canvas.height;
    const centerX = width / 2;
    const centerY = height / 2;
    const maxDist = Math.sqrt(centerX * centerX + centerY * centerY); // Distance to a corner

    function clamp(value, min = 0, max = 255) {
        return Math.min(Math.max(value, min), max);
    }

    for (let i = 0; i < data.length; i += 4) {
        let r_orig = data[i];
        let g_orig = data[i + 1];
        let b_orig = data[i + 2];

        // 1. Grayscale
        let gray = 0.299 * r_orig + 0.587 * g_orig + 0.114 * b_orig;
        
        let r = gray;
        let g = gray;
        let b = gray;

        // 2. Tinting
        if (tintIntensity > 0 && tint !== "none") {
            let r_tinted_target = gray;
            let g_tinted_target = gray;
            let b_tinted_target = gray;

            if (tint === "sepia") {
                r_tinted_target = gray * 1.15 + 30;
                g_tinted_target = gray * 1.10 + 10;
                b_tinted_target = gray * 0.90 - 10; 
            } else if (tint === "cool") {
                r_tinted_target = gray * 0.90 - 5;
                g_tinted_target = gray * 0.95;
                b_tinted_target = gray * 1.10 + 20; 
            } else if (tint === "warm") {
                r_tinted_target = gray * 1.10 + 20;
                g_tinted_target = gray * 1.05 + 5;
                b_tinted_target = gray * 0.90 - 5;
            }
        
            r = gray * (1 - tintIntensity) + r_tinted_target * tintIntensity;
            g = gray * (1 - tintIntensity) + g_tinted_target * tintIntensity;
            b = gray * (1 - tintIntensity) + b_tinted_target * tintIntensity;
        }

        // 3. Contrast and Brightness
        // Contrast formula: factor * (color - 128) + 128
        // The contrast value is from -100 to 100.
        const contrastFactor = (259 * (contrast + 255)) / (255 * (259 - contrast));
        r = contrastFactor * (r - 128) + 128 + brightness;
        g = contrastFactor * (g - 128) + 128 + brightness;
        b = contrastFactor * (b - 128) + 128 + brightness;

        // 4. Milky Highlights (compress extreme highlights)
        // milkyHighlights: 0 (no effect) to 1 (full compression to threshold)
        const highlightThreshold = 210; 
        if (milkyHighlights > 0) {
            if (r > highlightThreshold) {
                r = highlightThreshold + (r - highlightThreshold) * (1 - milkyHighlights);
            }
            if (g > highlightThreshold) {
                g = highlightThreshold + (g - highlightThreshold) * (1 - milkyHighlights);
            }
            if (b > highlightThreshold) {
                b = highlightThreshold + (b - highlightThreshold) * (1 - milkyHighlights);
            }
        }

        // 5. Vignette
        // vignetteStrength: 0 (no effect) to 1 (edges are black)
        // vignetteSoftness: 0.1 (sharp edge) to 2.0 (very soft gradient)
        if (vignetteStrength > 0) {
            const x_coord = (i / 4) % width;
            const y_coord = Math.floor((i / 4) / width);
            const dx = x_coord - centerX;
            const dy = y_coord - centerY;
            const dist = Math.sqrt(dx * dx + dy * dy);
            
            // Power for falloff: higher power = sharper edge
            // vignetteSoftness 0.1 -> power 20; vignetteSoftness 2.0 -> power 1
            const power = 2.0 / Math.max(0.1, vignetteSoftness); 
            const v_factor = Math.pow(dist / maxDist, power);
            const reduction = 1.0 - vignetteStrength * clamp(v_factor, 0, 1);

            r *= reduction;
            g *= reduction;
            b *= reduction;
        }

        // 6. Noise
        // noise: 0 (no noise) up to e.g. 50 (intensity of noise)
        if (noise > 0) {
            const noiseVal = (Math.random() - 0.5) * noise;
            r += noiseVal;
            g += noiseVal;
            b += noiseVal;
        }

        // Clamp final values
        data[i] = clamp(r);
        data[i + 1] = clamp(g);
        data[i + 2] = clamp(b);
        // Alpha (data[i+3]) remains unchanged
    }

    ctx.putImageData(imageData, 0, 0);
    return canvas;
}