Петровский

const items = [
    { name: "100 000", reward: "100000_sr", chance: 5 },
    { name: "VIP (14 дней)", reward: "14_vipsr", chance: 3 },
    { name: "1000 Алмазов", reward: "1000_az", chance: 2 },
    { name: "75 000 ", reward: "75000_sr", chance: 10 },
    { name: "VIP SILVER (7 дней)", reward: "7_sl", chance: 8 },
    { name: "500 Алмазов", reward: "500_az", chance: 7 },
    { name: "1000 Пыли", reward: "1000_ds", chance: 6 },
    { name: "25 000 ", reward: "25000_sr", chance: 15 },
    { name: "200 Алмазов", reward: "200_az", chance: 15 },
    { name: "300 Пыли", reward: "300_ds", chance: 15 },
    { name: "Ускорение (3 lvl)", reward: "3_boost", chance: 10 },
    { name: "Улучшение (3 lvl)", reward: "3_imp", chance: 10 },
    { name: "VIP SILVER (2 дня)", reward: "2_sl", chance: 10 },
    { name: "10 000 ", reward: "10000_sr", chance: 20 },
    { name: "5 000 ", reward: "5000_sr", chance: 20 },
    { name: "100 Алмазов", reward: "100_az", chance: 20 },
    { name: "Ускорение (2 lvl)", reward: "2_boost", chance: 20 }
];

const caseContainer = document.getElementById("caseContainer");
const scrollingItems = document.getElementById("scrollingItems");
const resultText = document.getElementById("resultText");
const openCaseButton = document.getElementById("openCaseButton");
const marker = document.getElementById("marker");
let populatedItems = []; // Массив для хранения созданных предметов
let winningIndex = 0; // Индекс выигрышного предмета

function populateItems() {
    for (let i = 0; i < 151; i++) { // Создаем 151 предмет
        const item = items[i % items.length]; // Используем элементы из массива
        const div = document.createElement("div");
        div.className = "item";
        div.innerText = item.name;
        scrollingItems.appendChild(div);
        populatedItems.push(item); // Сохраняем предмет в массив
    }
}

function animateScroll(duration) {
    const itemWidth = scrollingItems.children[0].offsetWidth; // Ширина одного предмета
    const totalItems = scrollingItems.children.length;

    // Позиция, на которую нужно прокрутить, чтобы выигрышный элемент оказался под стрелкой
    const targetPosition = (winningIndex * itemWidth) - (caseContainer.offsetWidth / 2) + (itemWidth / 2); // Центрируем выигрышный элемент
    const scrollWidth = totalItems * itemWidth; // Общая ширина прокрутки
    const startTime = performance.now();

    function scrollAnimation(currentTime) {
        const elapsedTime = currentTime - startTime;
        const progress = Math.min(elapsedTime / duration, 1);
        const easeInOutQuad = (t) => t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t;

        const easeProgress = easeInOutQuad(progress);
        const currentPosition = -scrollWidth * easeProgress + targetPosition; // Прокручиваем к целевой позиции
        scrollingItems.style.marginLeft = `${currentPosition}px`;

        if (progress < 1) {
            requestAnimationFrame(scrollAnimation);
        } else {
            // После завершения анимации, показываем выигрышный элемент
            showWinningItem(); // Показываем выигрышный элемент
            positionMarker(); // Позиционируем маркер над выигрышным элементом
        }
    }

    requestAnimationFrame(scrollAnimation);
}

function showWinningItem() {
    const winningItem = populatedItems[winningIndex]; // Получаем выигрышный предмет
    resultText.innerText = `Вы выиграли: ${winningItem.name}`;

    // Изменяем текст выигрышного предмета в scrollingItems
    const winningElement = scrollingItems.children[winningIndex];
    winningElement.classList.add("winning-item"); // Добавляем класс для стилей
    winningElement.innerText = winningItem.name; // Обновляем текст
}

function positionMarker() {
    // Ширина одного предмета
    const itemWidth = scrollingItems.children[0].offsetWidth; 
    // Центрируем маркер над выигрышным элементом
    const markerPosition = (winningIndex * itemWidth) - (caseContainer.offsetWidth / 2) + (itemWidth / 2); 
    // Устанавливаем позицию маркера
    marker.style.left = `${markerPosition}px`; 
}

openCaseButton.addEventListener("click", () => {
    // Очищаем текст результата
    resultText.innerText = ""; 
    // Очищаем массив предметов
    populatedItems = []; 
    // Очищаем элементы прокрутки
    scrollingItems.innerHTML = ""; 
    // Заполняем предметами при загрузке страницы
    populateItems(); 

    // Выбираем случайный индекс выигрышного предмета
    // Случайный индекс в пределах массива items
    winningIndex = Math.floor(Math.random() * populatedItems.length);
    // Запускаем анимацию прокрутки (уменьшено время)
    animateScroll(2000); 
});