Untitled
unknown
javascript
3 years ago
3.9 kB
7
Indexable
//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 gracz2wartość 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 = ["https://cdn.glitch.com/8fbc579f-3346-47a0-abbc-945a83abb962%2Fkosc-1.png?v=1610038358032", "https://cdn.glitch.com/8fbc579f-3346-47a0-abbc-945a83abb962%2Fkosc-2.png?v=1610038358080", "https://cdn.glitch.com/8fbc579f-3346-47a0-abbc-945a83abb962%2Fkosc-3.png?v=1610038358032", "https://cdn.glitch.com/8fbc579f-3346-47a0-abbc-945a83abb962%2Fkosc-4.png?v=610038358142", "https://cdn.glitch.com/8fbc579f-3346-47a0-abbc-945a83abb962%2Fkosc-5.png?v=1610038358032", "https://cdn.glitch.com/8fbc579f-3346-47a0-abbc-945a83abb962%2Fkosc-6.png?v=1610038358193 " ]; //funkcja odpowiedzialna za przygotowanie nowej gry nowaGra(); function nowaGra() { //zezwalamy na grę czyMoznaGrac = true; //grę zawsze rozpoczyna gracz 1 aktualnyGracz = 0; //ukrywamy kość 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ąc 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'); } //przycisk Rzuć kością //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 tymdanym 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ą odwołanie do elementu kosci nastronie i wyświetlamy kostkę 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 { //Prosimy uczestników o zapisanie wywołania funkcji a jej definicjenapiszemy na lekcji kolejnej //TODO //nastepnyGracz(); } } });
Editor is loading...