Wii Menu Chirp Echo Image Effect Generator

function processImage(originalImg, echoCount = 5, scaleIncrement = 0.1, initialOpacity = 0.6, offsetX = 0, offsetY = 0, blendMode = "screen") {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    
    const w = originalImg.width;
    const h = originalImg.height;
    canvas.width = w;
    canvas.height = h;

    // Parse parameters to ensure they are the correct type if passed as strings
    echoCount = parseInt(echoCount, 10);
    scaleIncrement = parseFloat(scaleIncrement);
    initialOpacity = parseFloat(initialOpacity);
    offsetX = parseFloat(offsetX);
    offsetY = parseFloat(offsetY);

    // Fallbacks just in case of invalid input
    if (isNaN(echoCount)) echoCount = 5;
    if (isNaN(scaleIncrement)) scaleIncrement = 0.1;
    if (isNaN(initialOpacity)) initialOpacity = 0.6;
    if (isNaN(offsetX)) offsetX = 0;
    if (isNaN(offsetY)) offsetY = 0;

    // 1. Draw the base original image
    ctx.globalAlpha = 1.0;
    ctx.drawImage(originalImg, 0, 0, w, h);

    // 2. Set blend mode to create the ethereal "chirp" echo effect
    // Allowed web canvas blend modes: "source-over", "screen", "overlay", "lighten", etc.
    ctx.globalCompositeOperation = blendMode;

    // 3. Draw the echoes
    for (let i = 1; i <= echoCount; i++) {
        ctx.save();
        
        // Move to center to scale from the middle
        ctx.translate(w / 2, h / 2);
        
        // Calculate the scale for this specific echo layer
        const scale = 1 + (i * scaleIncrement);
        ctx.scale(scale, scale);
        
        // Apply accumulating translations for an expanding directional effect
        ctx.translate(offsetX * i, offsetY * i);
        
        // Move back from center to draw from top-left
        ctx.translate(-w / 2, -h / 2);
        
        // Progressively decrease the opacity for outer echoes
        ctx.globalAlpha = Math.max(0.01, initialOpacity * Math.pow(0.65, (i - 1)));
        
        ctx.drawImage(originalImg, 0, 0, w, h);
        
        ctx.restore();
    }

    // Reset composite operation to default
    ctx.globalCompositeOperation = "source-over";

    return canvas;
}