jQuery(document).ready(function($) {
    const wheel = $('#grok-wheel');
    const button = $('#grok-spin-button');
    const result = $('#grok-result');
    const sections = $('.grok-section');
    const numSections = sections.length;

    button.on('click', function() {
        button.prop('disabled', true);
        result.text('');

        // Rastgele bir bölüm seç
        const randomIndex = Math.floor(Math.random() * numSections) + 1;
        const randomDegree = (360 / numSections) * (randomIndex - 1) + (Math.random() * (360 / numSections));
        
        // Dönme animasyonu: 3-5 tam tur + rastgele derece
        const spins = 3 + Math.floor(Math.random() * 3); // 3-5 tur
        const totalRotation = (spins * 360) + randomDegree;

        wheel.css({
            'transition': 'transform 3s ease-out',
            'transform': `rotate(${totalRotation}deg)`
        });

        // Animasyon bitince sonucu göster
        setTimeout(() => {
            // Durduğu bölümü hesapla (ters dönüş nedeniyle mod al)
            const stoppedIndex = Math.floor(((totalRotation % 360) / (360 / numSections))) + 1;
            const selectedSection = sections.eq(numSections - stoppedIndex); // Ters sırayı düzelt
            const selectedText = selectedSection.text();
            
            result.text(`Sonuç: ${selectedText}`);
            button.prop('disabled', false);
            
            // Çarkı sıfırla (animasyonsuz)
            wheel.css({
                'transition': 'none',
                'transform': 'rotate(0deg)'
            });
        }, 3000); // Animasyon süresiyle eşleş
    });
});