Apply Polar Coordinates To Image In After Effects

function processImage(originalImg, conversionType = "rectToPolar", wrapMode = "transparent") {
    const canvas = document.createElement('canvas');
    const w = originalImg.width;
    const h = originalImg.height;
    
    // Return early if image is empty
    if (w === 0 || h === 0) return canvas;

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

    const srcData = ctx.getImageData(0, 0, w, h);
    const dstData = ctx.createImageData(w, h);
    
    const sData = srcData.data;
    const dData = dstData.data;

    const type = conversionType.toLowerCase();
    const mode = wrapMode.toLowerCase();

    const cx = w / 2;
    const cy = h / 2;
    const R = Math.min(w, h) / 2;

    for (let y = 0; y < h; y++) {
        for (let x = 0; x < w; x++) {
            let u, v;

            if (type === "recttopolar") {
                let dx = x - cx;
                let dy = y - cy;
                let r = Math.sqrt(dx * dx + dy * dy);

                if (r > R && mode === "transparent") {
                    // Out of bounds for polar circle
                    continue;
                }

                let theta = Math.atan2(dy, dx);
                // Shift so top (12 o'clock) is mapped to left/right edge (u = 0 or u = w)
                let angle = theta + Math.PI / 2;
                // Normalize angle to [0, 1)
                let angle_norm = angle / (2 * Math.PI);
                angle_norm = angle_norm - Math.floor(angle_norm);

                u = angle_norm * w;
                v = (r / R) * h;
            } else {
                // PolarToRect: Unrolling the center circular portion into a rectangle
                let angle_norm = x / w;
                // Reverse rotation mapping
                let angle = angle_norm * 2 * Math.PI - Math.PI / 2;

                let v_norm = y / h;
                let r = v_norm * R;

                u = cx + r * Math.cos(angle);
                v = cy + r * Math.sin(angle);

                if (mode === "transparent" && (u < 0 || u >= w || v < 0 || v >= h)) {
                    continue; // Skip out of boundary values
                }
            }

            // --- Bilinear Interpolation ---
            let u0 = Math.floor(u);
            let v0 = Math.floor(v);
            let du = u - u0;
            let dv = v - v0;

            let u1 = u0 + 1;
            let v1 = v0 + 1;

            // Handle wrapping and clamping
            if (type === "recttopolar") {
                // U wraps infinitely because it represents the continuous angle
                u0 = ((u0 % w) + w) % w;
                u1 = ((u1 % w) + w) % w;

                // V clamps out-of-bounce mapped radius to bottom/top
                if (v0 >= h) v0 = h - 1; if (v0 < 0) v0 = 0;
                if (v1 >= h) v1 = h - 1; if (v1 < 0) v1 = 0;
            } else {
                // Both U and V clamp for cartesian fetch boundaries
                if (u0 < 0) u0 = 0; else if (u0 >= w) u0 = w - 1;
                if (u1 < 0) u1 = 0; else if (u1 >= w) u1 = w - 1;
                if (v0 < 0) v0 = 0; else if (v0 >= h) v0 = h - 1;
                if (v1 < 0) v1 = 0; else if (v1 >= h) v1 = h - 1;
            }

            let i00 = (v0 * w + u0) * 4;
            let i10 = (v0 * w + u1) * 4;
            let i01 = (v1 * w + u0) * 4;
            let i11 = (v1 * w + u1) * 4;

            let w00 = (1 - du) * (1 - dv);
            let w10 = du * (1 - dv);
            let w01 = (1 - du) * dv;
            let w11 = du * dv;

            let outIdx = (y * w + x) * 4;

            dData[outIdx]     = sData[i00] * w00 + sData[i10] * w10 + sData[i01] * w01 + sData[i11] * w11;
            dData[outIdx + 1] = sData[i00+1] * w00 + sData[i10+1] * w10 + sData[i01+1] * w01 + sData[i11+1] * w11;
            dData[outIdx + 2] = sData[i00+2] * w00 + sData[i10+2] * w10 + sData[i01+2] * w01 + sData[i11+2] * w11;
            dData[outIdx + 3] = sData[i00+3] * w00 + sData[i10+3] * w10 + sData[i01+3] * w01 + sData[i11+3] * w11;
        }
    }

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