Photo Cozy Filter Application

function processImage(originalImg, warmthEffect = 0.3, saturationAdjust = -0.1, brightnessAdjust = 0.05, vignetteIntensity = 0.4) {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');

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

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

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

    // If all effect parameters are neutral, no need to process pixels
    if (warmthEffect === 0 && saturationAdjust === 0 && brightnessAdjust === 0 && vignetteIntensity === 0) {
        return canvas;
    }

    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;
    // Max distance from center to a corner
    const maxDist = Math.sqrt(centerX * centerX + centerY * centerY);

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

        // 1. Brightness Adjustment
        // brightnessAdjust: -1 (black) to 1 (white), 0 is no change
        if (brightnessAdjust !== 0) {
            const adjustment = 255 * brightnessAdjust;
            r += adjustment;
            g += adjustment;
            b += adjustment;
        }

        // 2. Saturation Adjustment
        // saturationAdjust: -1 (grayscale) to 1 (double saturation), 0 is no change
        if (saturationAdjust !== 0) {
            const R_WEIGHT = 0.299; // Luminance weights for grayscale conversion
            const G_WEIGHT = 0.587;
            const B_WEIGHT = 0.114;
            
            // Clamp r,g,b before calculating gray to ensure they are in a valid range for gray calculation
            // if brightness pushed them out of 0-255.
            const r_sat_in = Math.max(0, Math.min(255, r));
            const g_sat_in = Math.max(0, Math.min(255, g));
            const b_sat_in = Math.max(0, Math.min(255, b));

            const gray = R_WEIGHT * r_sat_in + G_WEIGHT * g_sat_in + B_WEIGHT * b_sat_in;
            
            const satFactor = 1.0 + saturationAdjust; 
            r = gray + (r_sat_in - gray) * satFactor;
            g = gray + (g_sat_in - gray) * satFactor;
            b = gray + (b_sat_in - gray) * satFactor;
        }
        
        // 3. Warmth Effect
        // warmthEffect: 0 (no change) to 1 (max warmth). Only positive values for warming.
        if (warmthEffect > 0) {
            // These constants determine the "color" of the warmth. Current aims for a soft orange/yellow.
            // Values are scaled by warmthEffect.
            r += 30 * warmthEffect;  // Increase red
            g += 18 * warmthEffect;  // Increase green (less than red to make it more orange/reddish warm)
            b -= 25 * warmthEffect;  // Decrease blue substantially
        }

        // Intermediate clamping: Ensure R, G, B are within [0, 255] before vignette multiplication
        r = Math.max(0, Math.min(255, r));
        g = Math.max(0, Math.min(255, g));
        b = Math.max(0, Math.min(255, b));

        // 4. Vignette Effect
        // vignetteIntensity: 0 (no vignette) to 1 (edges are black).
        if (vignetteIntensity > 0 && maxDist > 0) {
            const x = (i / 4) % width;
            const y = Math.floor((i / 4) / width);
            const dx = x - centerX;
            const dy = y - centerY;
            const dist = Math.sqrt(dx * dx + dy * dy);
            
            // Calculate vignette factor: 1 at center, (1 - vignetteIntensity) at maxDist.
            // relativeDist is capped at 1 to prevent issues if dist > maxDist.
            const relativeDist = Math.min(1, dist / maxDist); 
            
            // A power can make the falloff curve non-linear (e.g., Math.pow(relativeDist, 1.5) for softer center)
            // For a standard cozy feel, a somewhat gradual falloff.
            const vignettePower = 1.2; // >1 means falloff is slower initially then faster. <1 is faster initially.
            const vignetteAmount = Math.pow(relativeDist, vignettePower) * vignetteIntensity;
            const vignetteFactor = Math.max(0, 1.0 - vignetteAmount); // Ensure factor is not negative
            
            r *= vignetteFactor;
            g *= vignetteFactor;
            b *= vignetteFactor;
        }
        
        // Final Clamping and assignment
        data[i] = Math.max(0, Math.min(255, r));
        data[i+1] = Math.max(0, Math.min(255, g));
        data[i+2] = Math.max(0, Math.min(255, b));
        // Alpha channel (data[i+3]) is preserved
    }

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