const emailBtn = document.getElementById('emailBtn');
const emailModal = new bootstrap.Modal(document.getElementById('emailModal'));
const emailContent = document.getElementById('emailContent');
const progBtn = document.getElementById('progBtn');
const progModal = new bootstrap.Modal(document.getElementById('progModal'));
const progContent = document.getElementById('progContent');
const sobreBtn = document.getElementById('sobreBtn');
const sobreModal = new bootstrap.Modal(document.getElementById('sobreModal'));
const sobreContent = document.getElementById('sobreContent');

    emailBtn.addEventListener('click', showEmail);

    progBtn.addEventListener('click', showProg);

    sobreBtn.addEventListener('click', showSobre);

function showHistorico() {
historicoModal.show();
}

function showEmail() {
emailModal.show();
}

function showProg() {
progModal.show();
}

function showSobre() {
sobreModal.show();
}

    // Background animation
    const canvas = document.getElementById('backgroundCanvas');
    const ctx = canvas.getContext('2d');

    // Set canvas size
    function resizeCanvas() {
    canvas.width = window.innerWidth;
    canvas.height = window.innerHeight;
    }

    window.addEventListener('resize', resizeCanvas);
    resizeCanvas();

            // Ball class
        class Ball {
        constructor() {
        this.x = Math.random() * canvas.width;
        this.y = Math.random() * canvas.height;
        this.size = Math.random() * 5 + 1;
        this.speedX = Math.random() * 1 - 0.5;
        this.speedY = Math.random() * 1 - 0.5;
        }

        update() {
        this.x += this.speedX;
        this.y += this.speedY;

        if (this.x > canvas.width || this.x < 0) {
            this.speedX=-this.speedX;
            }
            if (this.y> canvas.height || this.y < 0) {
                this.speedY=-this.speedY;
                }
                }

                draw() {
                ctx.fillStyle='rgba(255, 255, 255, 0.5)' ;
                ctx.beginPath();
                ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);
                ctx.closePath();
                ctx.fill();
                }
                }

                const balls=[];
                for (let i=0; i < 50; i++) {
                balls.push(new Ball());
                }

                function animate() {
                ctx.clearRect(0, 0, canvas.width, canvas.height);
                balls.forEach(ball=> {
                ball.update();
                ball.draw();
                });
                requestAnimationFrame(animate);
                }

                animate();