document.addEventListener("DOMContentLoaded", () => {
    const message = "                              YODLOHIHIHIHI       ATARI AREA ORAZ KOMITET SPOLECZNY KRONIKA POLSKIEJ DEMOSCENY ZAPRASZAJA DO UCZESTNICTWA W KONKURSIE ZORGANIZOWANYM Z OKAZJI TRZYDZIESTEJ ROCZNICY PIERWSZEGO POLSKIEGO DEMOSCENOWEGO PARTY KTORE ODBYLO SIE W MIROWIE KOLO CZESTOCHOWY          KONKURS POLEGA NA ODGADNIECIU TRZYDZIESTU DEM NA PODSTAWIE STOPNIOWO ODSLANIANEGO SCREENA        KAZDY SCREEN TO JEDNO DEMO LUB INTRO Z DANEGO ROKU POCZAWSZY OD TYSIAC DZIEWIECSET DZIEWIECDZIESIATEGO CZWARTEGO ROKU       NAGRODA GLOWNA TO SCANDOUBLER MEDUSA                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              ";
    const letterWidth = 30; // Szerokość pojedynczej litery
    const letterHeight = 40; // Wysokość pojedynczej litery
    const amplitude = 10; // Amplituda sinusoidy
    const frequency = 0.05; // Częstotliwość sinusoidy

    const spritesheet = "img/font.png"; // Ścieżka do spritesheet

    const scrollingText = document.getElementById("scrolling-text");

    // Funkcja tworząca litery z napisu
    function createLetters(text) {
        const fragment = document.createDocumentFragment();
        text.split('').forEach((char, index) => {
            const letter = document.createElement('div');
            letter.className = 'letter';
            letter.style.width = `${letterWidth}px`;
            letter.style.height = `${letterHeight}px`;

            // Ustaw tło na odpowiednią pozycję w spritesheet
            const charCode = char.charCodeAt(0) - 65; // 'A' ma kod 65
            letter.style.background = `url(${spritesheet}) -${charCode * letterWidth}px 0`;
            fragment.appendChild(letter);
        });
        return fragment;
    }

    // Dodaj litery do kontenera
    scrollingText.appendChild(createLetters(message));
    scrollingText.appendChild(createLetters(message)); // Dodaj duplikat tekstu

    // Przesuwanie napisu
    let position = 0;
    const containerWidth = document.getElementById('container').offsetWidth;
    const textWidth = scrollingText.offsetWidth / 2; // Szerokość pojedynczego zestawu tekstu

    function scroll() {
        position -= 4;
        if (position <= -textWidth) {
            position = 0;
        }

        // Aktualizacja pozycji litery
        message.split('').forEach((_, index) => {
            const letter = scrollingText.children[index];
            const y = amplitude * Math.sin((position + index * letterWidth) * frequency);
            letter.style.transform = `translate(${position + index * letterWidth}px, ${y}px)`;
        });

        requestAnimationFrame(scroll);
    }

    scroll();
});
