Image Shadow Filter Effect Maker

function processImage(originalImg, offsetX = 5, offsetY = 5, blurRadius = 5, shadowColor = 'rgba(0,0,0,0.5)') {
    // Parse and validate numeric parameters, falling back to defaults from signature if invalid
    let numOffsetX = Number(offsetX);
    if (isNaN(numOffsetX)) {
        numOffsetX = 5; // Default offsetX from function signature
    }

    let numOffsetY = Number(offsetY);
    if (isNaN(numOffsetY)) {
        numOffsetY = 5; // Default offsetY from function signature
    }

    let numBlurRadius = Number(blurRadius);
    if (isNaN(numBlurRadius)) {
        numBlurRadius = 5; // Default blurRadius from function signature
    }
    // Ensure blur radius is non-negative
    numBlurRadius = Math.max(0, numBlurRadius);

    const iw = originalImg.width;
    const ih = originalImg.height;

    // Use validated and processed numeric values for calculations
    const dx = numOffsetX;
    const dy = numOffsetY;
    const blur = numBlurRadius;

    // Calculate the bounding box required to contain the image and its shadow.
    // The image itself is considered to be at (0,0) for bbox calculation purposes.
    // Shadow offset (dx, dy) and blur (blur) extend this box.
    const min_x_bbox = Math.min(0, dx - blur);
    const max_x_bbox = Math.max(iw, dx + iw + blur);
    const min_y_bbox = Math.min(0, dy - blur);
    const max_y_bbox = Math.max(ih, dy + ih + blur);

    // Calculate canvas dimensions from the bounding box
    const canvasWidth = max_x_bbox - min_x_bbox;
    const canvasHeight = max_y_bbox - min_y_bbox;

    const canvas = document.createElement('canvas');
    
    // Final canvas dimensions should be integers; ceil ensures enough space.
    const finalCanvasWidth = Math.ceil(canvasWidth);
    const finalCanvasHeight = Math.ceil(canvasHeight);

    // If dimensions are zero or negative (e.g., 0x0 image with no shadow), return a 0x0 canvas.
    if (finalCanvasWidth <= 0 || finalCanvasHeight <= 0) {
        canvas.width = 0;
        canvas.height = 0;
        return canvas;
    }

    canvas.width = finalCanvasWidth;
    canvas.height = finalCanvasHeight;

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

    // Fallback if context cannot be created (e.g., canvas too large)
    if (!ctx) {
        console.error("Failed to get 2D context. Canvas dimensions might be too large.");
        return canvas; // Return the (likely empty) canvas
    }

    // Calculate the image's drawing position on the canvas.
    // This shift ensures the entire image and shadow (parts with negative coords relative to image's (0,0)) fit.
    const imgDrawX = -min_x_bbox;
    const imgDrawY = -min_y_bbox;

    // Apply the drop-shadow filter.
    ctx.filter = `drop-shadow(${dx}px ${dy}px ${blur}px ${shadowColor})`;

    // Draw the image. The filter applies to this operation.
    ctx.drawImage(originalImg, imgDrawX, imgDrawY, iw, ih);
    
    return canvas;
}