const canvas = document.getElementById('matrix');
const ctx = canvas.getContext('2d');

canvas.width = window.innerWidth;
canvas.height = window.innerHeight;

const chars = "アイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤユヨラリルレロワヲンあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゆよらりるれろわをん0123456789!#$%&'()*+,-./:;<=>?@";
const fontSize = 14;
let columns = Math.floor(canvas.width / fontSize);
let drops = Array.from({ length: columns }, () => Math.random() * canvas.height / fontSize);

// Récupère les zones à masquer : formulaire + tableau
function getMaskRects() {
    const rects = [];
    const form = document.getElementById('search-form');
    if (form) rects.push(form.getBoundingClientRect());
    const table = document.getElementById('results-table');
    if (table) rects.push(table.getBoundingClientRect());
    return rects;
}

// Calcul de l'opacité selon distance au centre de la zone
function opacityForPosition(x, y, rects) {
    if (!rects || rects.length === 0) return 1;
    let minOpacity = 1;
    rects.forEach(rect => {
        const cx = rect.left + rect.width / 2;
        const cy = rect.top + rect.height / 2;
        const dx = x - cx;
        const dy = y - cy;
        const distance = Math.sqrt(dx*dx + dy*dy);
        const radius = Math.max(rect.width, rect.height) * 0.8;

        let alpha;
        const inner = radius * 0.3;   // centre complètement transparent réduit
        const outer = radius;         // bord complet visible

        if (distance < inner) alpha = 0;
        else if (distance > outer) alpha = 1;
        else alpha = (distance - inner) / (outer - inner); // transition plus large

        if (alpha < minOpacity) minOpacity = alpha;
    });
    return minOpacity;
}

function draw() {
    ctx.fillStyle = "rgba(0,0,0,0.05)";
    ctx.fillRect(0, 0, canvas.width, canvas.height);

    ctx.font = fontSize + "px monospace";

    const maskRects = getMaskRects();

    for (let i = 0; i < drops.length; i++) {
        const text = chars.charAt(Math.floor(Math.random() * chars.length));
        const x = i * fontSize;
        const y = drops[i] * fontSize;

        const alpha = opacityForPosition(x, y, maskRects);
        ctx.fillStyle = `rgba(0,255,65,${alpha})`;
        ctx.fillText(text, x, y);

        if (y > canvas.height && Math.random() > 0.98) drops[i] = 0;
        drops[i]++;
    }
}

setInterval(draw, 20);

window.addEventListener('resize', () => {
    canvas.width = window.innerWidth;
    canvas.height = window.innerHeight;
    columns = Math.floor(canvas.width / fontSize);
    drops = Array.from({ length: columns }, () => Math.random() * canvas.height / fontSize);
});