Blissful Photo Filter Tool

function processImage(originalImg, brightness = 10, warmth = 0.15, softness = 0.1) {
    // brightness: Adjusts overall brightness. Suggested range: -30 to 30. Default: 10.
    //             Positive values brighten, negative values darken.
    // warmth: Controls the intensity of the warm tint. Suggested range: 0.0 to 0.3. Default: 0.15.
    //         0.0 means no warmth change. Higher values increase warmth (more red/yellow).
    // softness: Controls the amount of contrast reduction for a softer look. Suggested range: 0.0 to 0.3. Default: 0.1.
    //           0.0 means no softness (original contrast). Higher values increase softness (reduce contrast).

    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d', { willReadFrequently: true });

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

    if (width === 0 || height === 0) {
        console.error("Blissful Photo Filter Tool: Image has zero width or height. Cannot process.");
        // Return a minimal canvas as required, can be 1x1 or match input if it was meant to be empty.
        canvas.width = Math.max(1, width); // Ensure at least 1x1
        canvas.height = Math.max(1, height);
        return canvas;
    }

    canvas.width = width;
    canvas.height = height;

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

    // --- Parameter Parsing and Validation ---
    // Parameters from function signature are already defaulted if undefined.
    // Parse them to ensure they are numbers, falling back to signature defaults if parsing fails (e.g. "abc").

    let parsedBrightness = parseFloat(brightness);
    if (isNaN(parsedBrightness)) {
        parsedBrightness = 10; // Default value for brightness from signature
    }

    let parsedWarmth = parseFloat(warmth);
    if (isNaN(parsedWarmth)) {
        parsedWarmth = 0.15; // Default value for warmth from signature
    }

    let parsedSoftness = parseFloat(softness);
    if (isNaN(parsedSoftness)) {
        parsedSoftness = 0.1; // Default value for softness from signature
    }
    
    // Clamp parameters to their effective working ranges to prevent extreme effects
    const currentBrightness = Math.max(-50, Math.min(50, parsedBrightness));
    const currentWarmth = Math.max(0.0, Math.min(0.3, parsedWarmth)); // 0.0 to 0.3 is a good range
    const currentSoftness = Math.max(0.0, Math.min(0.3, parsedSoftness)); // 0.0 to 0.3 for subtle to moderate effect
    
    // Optimization: If all adjustments are effectively zero (or no-op values),
    // return the canvas with the original image already drawn.
    if (currentBrightness === 0 && currentWarmth === 0 && currentSoftness === 0) {
        return canvas;
    }

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

    // --- Calculate Effect Multipliers ---
    // Softness translates to a contrast factor (0.0 softness = 1.0 contrast, 0.3 softness = 0.7 contrast)
    const contrastFactor = 1.0 - currentSoftness;

    // Wärme-Multiplikatoren basierend auf currentWarmth
    // Beispiel: currentWarmth = 0.15 -> R*=1.09, G*=1.045, B*=0.97
    // currentWarmth = 0.3 (max) -> R*=1.18, G*=1.09, B*=0.94
    const warmRMultiplier = 1 + currentWarmth * 0.6; 
    const warmGMultiplier = 1 + currentWarmth * 0.3; 
    const warmBMultiplier = 1 - currentWarmth * 0.2; // Reducing blue enhances perceived warmth

    // --- Pixel Manipulation Loop ---
    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 Brightness Adjustment (if currentBrightness is not 0)
        if (currentBrightness !== 0) {
            r += currentBrightness;
            g += currentBrightness;
            b += currentBrightness;
        }

        // 2. Apply Softness (Contrast Reduction) (if currentSoftness > 0, so contrastFactor < 1.0)
        if (currentSoftness > 0) { 
            // Pull color values towards mid-gray (128)
            r = (r - 128) * contrastFactor + 128;
            g = (g - 128) * contrastFactor + 128;
            b = (b - 128) * contrastFactor + 128;
        }

        // 3. Apply Warmth (if currentWarmth > 0)
        if (currentWarmth > 0) {
            r *= warmRMultiplier;
            g *= warmGMultiplier;
            b *= warmBMultiplier;
        }
        
        // Clamp final RGB values to the 0-255 range
        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]) remains unchanged
    }

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