Photo Korean Filter Application

/**
 * Applies a "Korean-style" photo filter to an image.
 * This filter aims to achieve a look often associated with Korean aesthetics,
 * typically involving brightening, mild contrast enhancement, and a soft,
 * often warm (peachy/pinkish) color tint.
 *
 * @param {Image} originalImg The original JavaScript Image object.
 * @param {number} [intensity=0.7] The strength of the filter, from 0.0 (no G_effect) to 1.0 (full effect).
 *                                 Values outside this range will be clamped.
 * @param {string} [tintColorStr="255,230,225"] A comma-separated string of RGB values (e.g., "255,220,230")
 *                                            for the tint color. Defaults to a light pinkish/peach.
 *                                            If parsing fails, this default is used.
 * @returns {HTMLCanvasElement} A new canvas element with the filtered image.
 */
function processImage(originalImg, intensity = 0.7, tintColorStr = "255,230,225") {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d', { willReadFrequently: true }); // willReadFrequently for performance with getImageData/putImageData

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

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

    // Clamp intensity to the range [0, 1]
    const effectiveIntensity = Math.max(0, Math.min(1, intensity));

    if (effectiveIntensity === 0) {
        // If intensity is 0, no processing needed, return the canvas with the original image drawn
        return canvas;
    }

    let parsedTintR = 255;
    let parsedTintG = 230;
    let parsedTintB = 225; // Default tint color (light pinkish/peach)

    try {
        const parts = tintColorStr.split(',').map(s => parseInt(s.trim(), 10));
        if (parts.length === 3 && parts.every(p => !isNaN(p) && p >= 0 && p <= 255)) {
            [parsedTintR, parsedTintG, parsedTintB] = parts;
        } else {
            console.warn("Invalid tintColorStr provided ('" + tintColorStr + "'), using default pinkish/peach tint.");
        }
    } catch (e) {
        console.warn("Error parsing tintColorStr ('" + tintColorStr + "'), using default pinkish/peach tint.", e);
    }

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

    // Filter parameters based on intensity
    const brightnessAmount = 25 * effectiveIntensity; // Max brightness increase of 25
    const contrastFactor = 1.0 + 0.2 * effectiveIntensity; // Max contrast factor of 1.2
    const tintStrength = 0.25 * effectiveIntensity; // Max tint overlay strength of 25%

    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
        r += brightnessAmount;
        g += brightnessAmount;
        b += brightnessAmount;

        // 2. Apply Contrast
        // Formula: NewValue = (OldValue - 128) * Factor + 128
        r = (r - 128) * contrastFactor + 128;
        g = (g - 128) * contrastFactor + 128;
        b = (b - 128) * contrastFactor + 128;
        
        // 3. Apply Tint Overlay (Color Blending)
        // Formula: NewValue = OldValue * (1 - Strength) + TintColorValue * Strength
        if (tintStrength > 0) {
            r = r * (1 - tintStrength) + parsedTintR * tintStrength;
            g = g * (1 - tintStrength) + parsedTintG * tintStrength;
            b = b * (1 - tintStrength) + parsedTintB * tintStrength;
        }

        // 4. Clamp values to ensure they are within 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;
}