Image Pastel Dream Filter

function processImage(originalImg, saturation = 0.7, brightness = 1.3, contrast = 0.85, blurAmount = 1) {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');

    // Use naturalWidth and naturalHeight for the true dimensions of the image
    const width = originalImg.naturalWidth;
    const height = originalImg.naturalHeight;

    // If image hasn't loaded or dimensions are invalid, return a small empty canvas
    // This case should ideally be handled by the caller ensuring the image is loaded.
    if (width === 0 || height === 0) {
        console.warn("Image may not have loaded properly or has zero dimensions.");
        canvas.width = 1;
        canvas.height = 1;
        return canvas;
    }

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

    // Construct the filter string.
    // We only add filter functions if their corresponding parameters are
    // different from the neutral values (e.g., saturation=1, brightness=1, etc.).
    const filterParts = [];

    if (typeof saturation === 'number' && saturation !== 1) {
        filterParts.push(`saturate(${saturation})`);
    }
    if (typeof brightness === 'number' && brightness !== 1) {
        filterParts.push(`brightness(${brightness})`);
    }
    if (typeof contrast === 'number' && contrast !== 1) {
        filterParts.push(`contrast(${contrast})`);
    }
    if (typeof blurAmount === 'number' && blurAmount > 0) {
        // Ensure blurAmount is not negative.
        filterParts.push(`blur(${Math.max(0, blurAmount)}px)`);
    }
    
    const filterString = filterParts.join(' ');

    // Apply the filter if any parts were added
    if (filterString) {
        ctx.filter = filterString;
    }

    // Draw the image onto the canvas.
    // The filter (if set) will be applied during this drawing operation.
    ctx.drawImage(originalImg, 0, 0, canvas.width, canvas.height);
    
    // The canvas now contains the filtered image.
    // It's good practice to reset filter if context were to be reused,
    // but here a new context is created each time, so not strictly needed.
    // ctx.filter = 'none'; 

    return canvas;
}