Island Of Joy Photo Editor

function processImage(originalImg, intensity = "1.0", warmthAmount = "30") {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    canvas.width = originalImg.width;
    canvas.height = originalImg.height;

    // Draw the original image
    ctx.drawImage(originalImg, 0, 0);

    const intVal = Math.max(0, parseFloat(intensity));
    const warmthVal = parseFloat(warmthAmount);

    const imgData = ctx.getImageData(0, 0, canvas.width, canvas.height);
    const data = imgData.data;

    // Contrast calculation
    const contrast = 30 * intVal; // Contrast range map
    const cFactor = (259 * (contrast + 255)) / (255 * (259 - contrast));
    
    // Saturation calculation
    const sat = 1 + (0.4 * intVal);

    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
        r = cFactor * (r - 128) + 128;
        g = cFactor * (g - 128) + 128;
        b = cFactor * (b - 128) + 128;

        // 2. Apply Brightness (make it cheerful)
        r *= (1 + 0.08 * intVal);
        g *= (1 + 0.08 * intVal);
        b *= (1 + 0.05 * intVal);

        // 3. Apply Warmth (Island feel)
        r += warmthVal * intVal;
        g += (warmthVal * 0.5) * intVal;
        b -= (warmthVal * 0.3) * intVal;

        // 4. Apply Saturation
        const lum = 0.299 * r + 0.587 * g + 0.114 * b;
        r = lum + (r - lum) * sat;
        g = lum + (g - lum) * sat;
        b = lum + (b - lum) * sat;

        // Clamp values between 0 and 255
        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));
    }

    ctx.putImageData(imgData, 0, 0);

    // Apply a warm, dreamy "Island of Joy" sunset-like overlay
    if (intVal > 0) {
        ctx.globalCompositeOperation = 'soft-light';
        
        const centerX = canvas.width / 2;
        const centerY = canvas.height / 2;
        const radius = Math.max(canvas.width, canvas.height) * 0.8;
        
        const grad = ctx.createRadialGradient(
            centerX, centerY, 0,
            centerX, centerY, radius
        );
        
        // Warm sunny center fading out to a deeper vibrant edge
        grad.addColorStop(0, `rgba(255, 240, 200, ${0.35 * intVal})`);
        grad.addColorStop(0.5, `rgba(255, 180, 100, ${0.45 * intVal})`);
        grad.addColorStop(1, `rgba(180, 60, 0, ${0.55 * intVal})`);

        ctx.fillStyle = grad;
        ctx.fillRect(0, 0, canvas.width, canvas.height);
        
        // Reset composite operation
        ctx.globalCompositeOperation = 'source-over';
    }

    return canvas;
}