Vibrant Photo Filter Tool

function processImage(originalImg, saturation = 1.7, contrast = 1.05, brightness = 1.0) {
    const canvas = document.createElement('canvas');
    
    // Use naturalWidth and naturalHeight for the original image dimensions.
    // These properties give the intrinsic dimensions of the image.
    canvas.width = originalImg.naturalWidth;
    canvas.height = originalImg.naturalHeight;

    // If the image hasn't loaded or is invalid, naturalWidth/Height might be 0.
    // In such a scenario, the canvas will have dimensions 0x0.
    // Drawing on a 0x0 canvas is effectively a no-op. This is acceptable,
    // as the caller is responsible for providing a loaded image.
    // No explicit error handling for 0x0 dimensions is added here,
    // as it aligns with standard behavior of canvas with unloaded images.

    const ctx = canvas.getContext('2d');

    // Check if the 2D context was successfully obtained.
    // This is highly unlikely to fail in modern browsers for '2d'.
    if (!ctx) {
        console.error("Failed to get 2D rendering context. Your browser might not support Canvas.");
        // Return the canvas element, even if unusable, to adhere to the return type requirement.
        // The canvas will be blank or 0x0 if width/height were 0.
        return canvas;
    }

    // Parse input parameters, ensuring they are numbers.
    // The default values in the function signature handle cases where parameters are not provided (i.e., undefined).
    // The following logic handles cases where parameters ARE provided but might be invalid (e.g., non-numeric string, NaN, negative).
    // If an invalid value is provided, it falls back to the function's specified default values for a "vibrant" effect.
    
    let sValue = parseFloat(saturation);
    if (isNaN(sValue) || sValue < 0) {
        sValue = 1.7; // Default saturation for "vibrant" effect
    }

    let cValue = parseFloat(contrast);
    if (isNaN(cValue) || cValue < 0) {
        cValue = 1.05; // Default contrast for "vibrant" effect
    }

    let bValue = parseFloat(brightness);
    if (isNaN(bValue) || bValue < 0) {
        bValue = 1.0;  // Default brightness (no change) for "vibrant" effect
    }

    // Construct the filter string.
    // Filters are only added if they differ from their neutral value (1 for these filters).
    // This keeps the filter string minimal and avoids applying no-op filters.
    const filterEffects = [];
    if (sValue !== 1) { // neutral value for saturate is 1
        filterEffects.push(`saturate(${sValue})`);
    }
    if (cValue !== 1) { // neutral value for contrast is 1
        filterEffects.push(`contrast(${cValue})`);
    }
    if (bValue !== 1) { // neutral value for brightness is 1
        filterEffects.push(`brightness(${bValue})`);
    }

    if (filterEffects.length > 0) {
        ctx.filter = filterEffects.join(' ');
    }
    // If filterEffects is empty (all values are neutral), ctx.filter remains 'none' (its default value).

    // Draw the original image onto the canvas.
    // The filters, if any, will be applied during this drawing operation.
    ctx.drawImage(originalImg, 0, 0, canvas.width, canvas.height);
    
    // The context's filter state persists. If this context were to be reused for further drawing
    // operations that should not have this filter, it would be important to reset it:
    // ctx.filter = 'none';
    // However, since we create a new canvas and context for this specific operation and return the canvas,
    // resetting is not strictly necessary for the function's isolated execution.

    return canvas;
}