Image Kodachrome 64 Filter Effect Tool

function processImage(originalImg) {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');

    const imgWidth = originalImg.naturalWidth;
    const imgHeight = originalImg.naturalHeight;

    if (imgWidth === 0 || imgHeight === 0) {
        // Handle cases where image dimensions might be 0 (e.g., image not fully loaded or invalid)
        console.warn("Image Kodachrome 64 Filter: Original image has zero width or height. Returning a 1x1 canvas.");
        canvas.width = 1;
        canvas.height = 1;
        // Optionally fill with a color or leave transparent
        // ctx.fillStyle = 'rgba(255,0,0,0.2)'; // Example: semi-transparent red for error
        // ctx.fillRect(0,0,1,1);
        return canvas;
    }

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

    ctx.drawImage(originalImg, 0, 0, imgWidth, imgHeight);

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

    // Kodachrome 64 simulation constants (approximated and adjustable)
    // These values are chosen to emulate the characteristic look of Kodachrome 64 film.
    
    // Contrast factor: Kodachrome was known for good contrast.
    const contrastFactor = 1.18; // Range: 1.0 (no change) to ~1.5

    // Warmth boost: Kodachrome often has a subtle warm cast.
    const warmRedBoost = 8;     // Added to red channel
    const warmGreenBoost = 4;   // Added to green channel (contributes to yellow warmth)

    // Channel-specific coefficients for Kodachrome color signature.
    // These are simplified matrix-like operations on RGB channels.
    // r_coeff = [r_from_r, r_from_g, r_from_b]
    // g_coeff = [g_from_r, g_from_g, g_from_b]
    // b_coeff = [b_from_r, b_from_g, b_from_b]
    const rCoeff = [1.15,  0.08, -0.08]; // Boosts red, adds bit of G (yellowish), reduces B influence
    const gCoeff = [0.10,  0.90, -0.05]; // Adds bit of R (warmth), slightly tones down G, reduces B influence
    const bCoeff = [-0.05, 0.10,  1.10]; // Reduces R influence (less magenta), adds bit of G (cyan-ish), boosts B

    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 Kodachrome-like color transformation
        let tr = r * rCoeff[0] + g * rCoeff[1] + b * rCoeff[2];
        let tg = r * gCoeff[0] + g * gCoeff[1] + b * gCoeff[2];
        let tb = r * bCoeff[0] + g * bCoeff[1] + b * bCoeff[2];

        // Intermediate values (tr, tg, tb) can be outside [0, 255] at this point.

        // 2. Apply Contrast
        // The formula maps [0, 255] to [-0.5, 0.5], scales, then maps back.
        // Mid-gray (127.5) remains largely unchanged by contrast.
        tr = (((tr / 255) - 0.5) * contrastFactor + 0.5) * 255;
        tg = (((tg / 255) - 0.5) * contrastFactor + 0.5) * 255;
        tb = (((tb / 255) - 0.5) * contrastFactor + 0.5) * 255;
        
        // 3. Add subtle overall warmth
        tr += warmRedBoost;
        tg += warmGreenBoost;
        // Blue channel is often kept strong or slightly cool in Kodachrome,
        // so no direct warmth subtracted from it. The red/green boost provides overall warmth.

        // 4. Clamp final values to the valid [0, 255] range
        data[i]     = Math.max(0, Math.min(255, tr));
        data[i + 1] = Math.max(0, Math.min(255, tg));
        data[i + 2] = Math.max(0, Math.min(255, tb));
        // Alpha channel (data[i + 3]) remains unchanged.
    }

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