Photo Disco Effect Generator

function processImage(
    originalImg,
    intensity = 0.7,
    lightCount = 20,
    colors = "magenta,cyan,yellow,lime,blue,red,fuchsia",
    addSparkles = 1,
    vignetteIntensity = 0.5,
    gridOpacity = 0.15
) {
    const canvas = document.createElement('canvas');
    const width = originalImg.width;
    const height = originalImg.height;
    canvas.width = width;
    canvas.height = height;
    const ctx = canvas.getContext('2d');

    // 1. Draw the original image
    ctx.drawImage(originalImg, 0, 0, width, height);

    // Set up a simple deterministic pseudo-random generator
    // so the effect is consistent for the same image and parameters
    const parsedLightCount = parseInt(lightCount) || 20;
    let seed = ((width * 13) + (height * 17) + parsedLightCount) % 233280;
    if (seed === 0) seed = 123456; 
    
    function random() {
        seed = (seed * 9301 + 49297) % 233280;
        return seed / 233280;
    }

    const colorArr = colors.split(',').map(c => c.trim());
    const safeIntensity = Math.max(0, Math.min(1, parseFloat(intensity) || 0.7));

    // 2. Draw colorful Disco Lights (Spotlights)
    ctx.globalCompositeOperation = 'screen';
    ctx.globalAlpha = safeIntensity;

    const maxLights = Math.min(parsedLightCount, 150); // Cap at 150 for performance
    const maxDim = Math.max(width, height);

    for (let i = 0; i < maxLights; i++) {
        const x = random() * width;
        const y = random() * height;
        // Radius between 10% and 50% of the image size
        const r = (random() * 0.4 + 0.1) * maxDim;
        const color = colorArr[Math.floor(random() * colorArr.length)];

        const grad = ctx.createRadialGradient(x, y, 0, x, y, r);
        grad.addColorStop(0, color);
        // Using transparent black because we are in 'screen' mode, where black does not darken the image
        grad.addColorStop(1, 'rgba(0,0,0,0)');

        ctx.fillStyle = grad;
        ctx.beginPath();
        ctx.arc(x, y, r, 0, Math.PI * 2);
        ctx.fill();
    }

    // 3. Draw a Disco Floor Grid Overlay
    const parsedGridOpacity = parseFloat(gridOpacity) || 0;
    if (parsedGridOpacity > 0) {
        ctx.globalCompositeOperation = 'overlay';
        ctx.globalAlpha = Math.max(0, Math.min(1, parsedGridOpacity));
        
        const gridSize = maxDim * 0.05; // 5% of largest dimension
        
        ctx.beginPath();
        for (let x = 0; x <= width; x += gridSize) {
            ctx.moveTo(x, 0);
            ctx.lineTo(x, height);
        }
        for (let y = 0; y <= height; y += gridSize) {
            ctx.moveTo(0, y);
            ctx.lineTo(width, y);
        }
        ctx.strokeStyle = "white";
        ctx.lineWidth = Math.max(1, gridSize * 0.03);
        ctx.stroke();
    }

    // 4. Add Sparkles (Classic Disco Ball glitz)
    if (parseInt(addSparkles) === 1) {
        ctx.globalCompositeOperation = 'screen';
        ctx.globalAlpha = Math.min(1, safeIntensity * 1.5);
        
        const sparkleCount = Math.floor(maxLights * 1.5);
        for (let i = 0; i < sparkleCount; i++) {
            const x = random() * width;
            const y = random() * height;
            const size = (random() * 0.04 + 0.01) * maxDim;
            const sColor = colorArr[Math.floor(random() * colorArr.length)];

            ctx.save();
            ctx.translate(x, y);
            ctx.rotate(random() * Math.PI); // Random rotation for the star

            // Draw a 4-pointed sparkle star
            ctx.beginPath();
            for (let j = 0; j < 4; j++) {
                const angle = j * Math.PI / 2;
                const innerAngle = angle + (Math.PI / 4);
                
                ctx.lineTo(Math.cos(angle) * size, Math.sin(angle) * size);
                ctx.lineTo(Math.cos(innerAngle) * (size * 0.15), Math.sin(innerAngle) * (size * 0.15));
            }
            ctx.closePath();
            ctx.fillStyle = "white";
            ctx.fill();

            // Sparkle Glow
            const glowGrad = ctx.createRadialGradient(0, 0, 0, 0, 0, size * 0.8);
            glowGrad.addColorStop(0, 'white');
            glowGrad.addColorStop(0.3, sColor);
            glowGrad.addColorStop(1, 'rgba(0,0,0,0)');
            
            ctx.fillStyle = glowGrad;
            ctx.beginPath();
            ctx.arc(0, 0, size * 0.8, 0, Math.PI * 2);
            ctx.fill();

            ctx.restore();
        }
    }

    // 5. Add Vignette ("Stage Lighting" focus)
    const safeVignette = Math.max(0, Math.min(1, parseFloat(vignetteIntensity) || 0.5));
    if (safeVignette > 0) {
        ctx.globalCompositeOperation = 'multiply';
        ctx.globalAlpha = safeVignette;
        
        const vignetteGrad = ctx.createRadialGradient(
            width / 2, height / 2, Math.min(width, height) * 0.3, // Inner clean circle
            width / 2, height / 2, maxDim * 0.8  // Outer darkened edge
        );
        vignetteGrad.addColorStop(0, 'white'); // White is neutral in multiply mode
        vignetteGrad.addColorStop(1, 'black'); // Black darkens the edges
        
        ctx.fillStyle = vignetteGrad;
        ctx.fillRect(0, 0, width, height);
    }

    // Reset context state
    ctx.globalAlpha = 1.0;
    ctx.globalCompositeOperation = 'source-over';

    return canvas;
}