Funny Image Effect Generator

function processImage(originalImg, bulgeStrength = 1.25, swirlAngle = 0, radiusRatio = 0.6, centerX = 0.5, centerY = 0.5) {
    // Parse parameters to numbers (allows strings to be safely passed from inputs)
    const str = Number(bulgeStrength);
    const swirl = Number(swirlAngle);
    // Ensure radius is minimally larger than 0
    const radRatio = Math.max(0.01, Number(radiusRatio));
    const cxRatio = Number(centerX);
    const cyRatio = Number(centerY);

    const canvas = document.createElement('canvas');
    const width = originalImg.width;
    const height = originalImg.height;
    
    if (width === 0 || height === 0) return canvas;

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

    const ctx = canvas.getContext('2d');
    ctx.drawImage(originalImg, 0, 0);

    const srcData = ctx.getImageData(0, 0, width, height);
    const destData = ctx.createImageData(width, height);
    
    // Using simple array refs for faster access
    const src = srcData.data;
    const dest = destData.data;

    const cx = width * cxRatio;
    const cy = height * cyRatio;
    
    const radius = Math.min(width, height) * radRatio;
    const radius2 = radius * radius;
    
    // Calculate inverse effect power
    // if bulgeStrength > 0, power > 1 (bulges outward, mapping outward pixels to inner src)
    // if bulgeStrength < 0, power < 1 (pinches inward, mapping inner pixels to outward src)
    const power = Math.max(0.01, str + 1);

    for (let y = 0; y < height; y++) {
        for (let x = 0; x < width; x++) {
            const dx = x - cx;
            const dy = y - cy;
            const dist2 = dx * dx + dy * dy;

            let sx = x;
            let sy = y;

            if (dist2 < radius2 && dist2 > 0) {
                const dist = Math.sqrt(dist2);
                const r = dist / radius; // Normalized distance [0 to 1]

                // Apply Bulge/Pinch distortion
                const r_src = Math.pow(r, power);
                const s_dist = r_src * radius;

                // Apply Swirl distortion
                let angle = Math.atan2(dy, dx);
                if (swirl !== 0) {
                    // Maximum swirl occurs nearest to the center point
                    angle += swirl * (1 - r);
                }

                // Map requested pixel coordinate to source image target point
                sx = cx + Math.cos(angle) * s_dist;
                sy = cy + Math.sin(angle) * s_dist;
            }

            // Perform Bilinear Interpolation for smoother, high-quality morphing
            const x0 = Math.floor(sx);
            const y0 = Math.floor(sy);
            const x1 = x0 + 1;
            const y1 = y0 + 1;

            const weightX = sx - x0;
            const weightY = sy - y0;

            const c00 = (1 - weightX) * (1 - weightY);
            const c10 = weightX * (1 - weightY);
            const c01 = (1 - weightX) * weightY;
            const c11 = weightX * weightY;

            // Clamp coordinate reads to edges
            const cX0 = x0 < 0 ? 0 : (x0 >= width ? width - 1 : x0);
            const cX1 = x1 < 0 ? 0 : (x1 >= width ? width - 1 : x1);
            const cY0 = y0 < 0 ? 0 : (y0 >= height ? height - 1 : y0);
            const cY1 = y1 < 0 ? 0 : (y1 >= height ? height - 1 : y1);
            
            const idx00 = (cY0 * width + cX0) * 4;
            const idx10 = (cY0 * width + cX1) * 4;
            const idx01 = (cY1 * width + cX0) * 4;
            const idx11 = (cY1 * width + cX1) * 4;

            const destIdx = (y * width + x) * 4;

            // Compute RGB and Alpha values
            dest[destIdx]     = src[idx00] * c00 + src[idx10] * c10 + src[idx01] * c01 + src[idx11] * c11;
            dest[destIdx + 1] = src[idx00 + 1] * c00 + src[idx10 + 1] * c10 + src[idx01 + 1] * c01 + src[idx11 + 1] * c11;
            dest[destIdx + 2] = src[idx00 + 2] * c00 + src[idx10 + 2] * c10 + src[idx01 + 2] * c01 + src[idx11 + 2] * c11;
            dest[destIdx + 3] = src[idx00 + 3] * c00 + src[idx10 + 3] * c10 + src[idx01 + 3] * c01 + src[idx11 + 3] * c11;
        }
    }

    ctx.putImageData(destData, 0, 0);
    return canvas;
}