Strange Customs Image Viewer

function processImage(originalImg, edgeEnhancement = 1.5, strangeShift = 0) {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    const width = originalImg.width;
    const height = originalImg.height;
    canvas.width = width;
    canvas.height = height;
    ctx.drawImage(originalImg, 0, 0);

    const imgData = ctx.getImageData(0, 0, width, height);
    const data = imgData.data;

    // Cache the luminance for each pixel to calculate borders quickly
    const lums = new Uint8Array(width * height);
    let j = 0;
    for (let i = 0; i < data.length; i += 4) {
        // Luminance formulation: standard grayscale conversion
        lums[j++] = 0.299 * data[i] + 0.587 * data[i + 1] + 0.114 * data[i + 2];
    }

    const edgeFactor = Number(edgeEnhancement) || 1.5;
    const shiftVal = Number(strangeShift) || 0;

    // Color gradient mapping for a true "Customs X-ray Scanner" effect
    // White background -> Orange (organic) -> Green (inorganic) -> Blue (metals) -> Black (dense)
    const stops = [
        { v: 0, c: [255, 255, 255] },
        { v: 30, c: [255, 140, 0] },
        { v: 90, c: [0, 200, 50] },
        { v: 160, c: [0, 50, 255] },
        { v: 255, c: [0, 0, 20] }
    ];

    for (let y = 0; y < height; y++) {
        for (let x = 0; x < width; x++) {
            const idx = y * width + x;
            const lum = lums[idx];

            // Roberts Cross edge detection for fast outlining
            let edge = 0;
            if (x < width - 1 && y < height - 1) {
                const diffX = lum - lums[y * width + (x + 1)];
                const diffY = lum - lums[(y + 1) * width + x];
                edge = Math.sqrt(diffX * diffX + diffY * diffY);
            }

            // Invert luminance (Dense items are darker in real life, so they have high density value)
            let density = 255 - lum;
            
            // Apply edge enhancement to simulate overlapping material thickness in X-Ray 
            density += edge * edgeFactor;
            
            // Add a cyclic "strange custom" shift if specified
            density = density + shiftVal * 40;

            if (shiftVal !== 0 && density > 255) {
                density = density % 255;
            } else {
                if (density < 0) density = 0;
                if (density > 255) density = 255;
            }

            // Interpolate colors based on simulated material density
            let outColor = stops[stops.length - 1].c;
            for (let k = 0; k < stops.length - 1; k++) {
                if (density >= stops[k].v && density <= stops[k + 1].v) {
                    const range = stops[k + 1].v - stops[k].v;
                    const factor = (density - stops[k].v) / (range || 1);
                    outColor = [
                        Math.round(stops[k].c[0] + factor * (stops[k + 1].c[0] - stops[k].c[0])),
                        Math.round(stops[k].c[1] + factor * (stops[k + 1].c[1] - stops[k].c[1])),
                        Math.round(stops[k].c[2] + factor * (stops[k + 1].c[2] - stops[k].c[2]))
                    ];
                    break;
                }
            }

            const dataIdx = idx * 4;
            data[dataIdx] = outColor[0];
            data[dataIdx + 1] = outColor[1];
            data[dataIdx + 2] = outColor[2];
            // keep the original alpha channel integrity
        }
    }

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