//tablica przechowująca punkt graczy

let punkty=[];

//punkty które zdobywa gracz po każdym rzucie kością
let punktyRundy;

//zmienna sterująca graczami jeśli równa 0 gra gracz1 jeśli równa 1 gra gracz2
//jako że w programowaniu numerujemy od 0, gracz1 będzie miał wartość 0 gracz2 wartość 1 ułatwi to pobieranie punktów z tablicy
let aktualnyGracz;

//zmienna boolowska sterująca rozgrywką jeśli true możemy grać jeśli false rozgrywka będzie niemożliwa
let czyMoznaGrac;


//dodajemy tablicę, która przechowa adresy do grafik z kością
const obrazki=["kosc-1.png",
              "kosc-2.png",
              "kosc-3.png",
              "kosc-4.png",
              "kosc-5.png",
              "kosc-6.png"];



//funkcja odpowiedzialna za przygotowanie nowej gry
nowaGra();

function nowaGra(){
  
//zezwalamy na grę
czyMoznaGrac=true;

//grę zawsze rozpoczyna gracz 1
aktualnyGracz=0;
//ukrywamy kosc na początku gry
document.querySelector('.kosc').style.display='none';

//zerujemy wszystkie wyniki
punkty=[0,0];
punktyRundy=0;
  
//aktualizujemy interfejs użytkownika  z punktami
document.getElementById('wynik-0').textContent='0';
document.getElementById('wynik-1').textContent='0';
document.getElementById('aktualne-punkty-0').textContent='0';
document.getElementById('aktualne-punkty-1').textContent='0';

//zmieniamy nazwy na Gracz1 i Gracz2 ponieważ podczas rozgrywki będziemy modyfikować te elementy ustawiająć tekst zwycięstwo
document.getElementById('nazwa-0').textContent = 'Gracz 1';
document.getElementById('nazwa-1').textContent = 'Gracz 2';
//usuwamy klasę zwycięstwo odpowiedzialną za podmianę tekstu Gracz1/2 na zwycięstwo
document.querySelector('.gracz-0-panel').classList.remove('zwyciestwo');
document.querySelector('.gracz-1-panel').classList.remove('zwyciestwo');

// usuwamy klasę aktywny odpowiedzialną za wskazywanie aktualnego gracza
document.querySelector('.gracz-0-panel').classList.remove('aktywny');
document.querySelector('.gracz-1-panel').classList.remove('aktywny');

//dodajemy klasę aktywny do Gracza1 ponieważ to on zawsze zaczyna grę
document.querySelector('.gracz-0-panel').classList.add('aktywny');
  
  
}


//dodajemy wykrywacz zdarzeń na naszej stronie, ten konkretny będzie wykrywać kliknięcie na przycisk Rzuć kością
//tworzymy funkcję anonimową- taką bez nazwy, którą wykorzystamy tylko w tym danym kontekście i nie będziemy z niej mogli skorzystać poza 
document.querySelector('.btn-rzuc').addEventListener('click',function(){
  
  
  
  if(czyMoznaGrac){
    
    //rzucamy kością, losujemy wartość 1-6
const liczbaOczek=Math.floor(Math.random()*6)+1;
  
  //tworzymy zmienną koscObrazek przechowującą odwolanie do elemnetu kosci na stronie i wyświetlamy kostke
  
  const koscObrazek=document.querySelector('.kosc');
  //wybieramy odpowiednią grafike
  koscObrazek.src=obrazki[liczbaOczek-1];

  //wyświetlamy kość
  koscObrazek.style.display='block';

  
  //aktualizujemy wynik rundy jeśli na kości nie zostało wyrzucone jedno oczko
  
  if(liczbaOczek!=1){
    
    //dodajemy wynik
    punktyRundy += liczbaOczek;
    document.querySelector('#aktualne-punkty-'+aktualnyGracz).textContent=punktyRundy;
    
  }
  else{
	
    nastepnyGracz();
  }
    
  }
  
});


//mechanizm przełączenia gracza

function nastepnyGracz(){
  
  
  
    //operator warunkowy- sprawdzany jest warunek jeśli zwrócony zostanie true to wykonuje się część po ? jeśli false to część po :
    aktualnyGracz == 0 ? aktualnyGracz=1 : aktualnyGracz=0;
    
    //zerujemy punkty rundy
    punktyRundy=0;
    
    //zerujemy punkty w interfejsie użytkownika
    
    document.getElementById('aktualne-punkty-0').textContent='0';
    document.getElementById('aktualne-punkty-1').textContent='0';
    
    //przełączamy klasę tak żeby wskazywać aktualnego gracza toggle działa tak że jeśli jest już wskazana klasa to ją usuwa a jeśli jej nie ma to zostaje dodana do danego elementu
    document.querySelector('.gracz-0-panel').classList.toggle('aktywny');
    document.querySelector('.gracz-1-panel').classList.toggle('aktywny');
    

  
}



//progrmujemy co ma się wykonać w momencie klknięcia przycisku zatrzymaj
document.querySelector('.btn-zatrzymaj').addEventListener('click',function(){
  
if(czyMoznaGrac){

  //dodajemy punkty dla konkretnego gracza
  punkty[aktualnyGracz] += punktyRundy;
  
  //aktualizujemy UI
  document.querySelector('#wynik-'+aktualnyGracz).textContent=punkty[aktualnyGracz];
  
  
  //sprawdzamy czy gracz wygrał
  if (punkty[aktualnyGracz] >= 100) {

          //blokujemy rozgrywkę
            czyMoznaGrac=false;
            //ustawiamy dla zwycięzcy tekst Zwycięstwo!
            document.querySelector('#nazwa-' + aktualnyGracz).textContent = 'Zwycięstwo!';
            //ukrywamy kostkę
            document.querySelector('.kosc').style.display = 'none';
    
            //dodajemy do aktualnego gracza klasę zwycięstwo która zmodyfikuje tekst wygranej
            document.querySelector('.gracz-' + aktualnyGracz + '-panel').classList.add('zwyciestwo');
           
         
        } else {
            //jeśli gracz nie uzyskał wymaganych punktów żęby wygrać to następuje przełączenie gracza
            nastepnyGracz();
        }
  }

});


//kliknięcie przycisku nowa gra uruchamia funkcje poczatkoweUstawienia
document.querySelector('.btn-nowa-gra').addEventListener('click',nowaGra);