Skip to content

L
Learning JavaScript
Commit 4e8045e7 authored by MohammadAli Keshavarz's avatar MohammadAli Keshavarz
Browse files
Options

add state variable to game

parent b6f1f948
Hide whitespace changes
Inline Side-by-side
Showing with 51 additions and 44 deletions
section3/app.js
View file @ 4e8045e7
...@@ -7,7 +7,7 @@ GAME RULES: ...@@ -7,7 +7,7 @@ GAME RULES:
- The first player to reach 100 points on GLOBAL score wins the game - The first player to reach 100 points on GLOBAL score wins the game
*/ */
var scores, roundScore, activePlayer; var scores, roundScore, activePlayer, isGamePlaying;
// document.querySelector("#current-" + activePlayer).textContent = dice; // document.querySelector("#current-" + activePlayer).textContent = dice;
// document.querySelector("#current-" + activePlayer).innerHTML = "<h1>" + dice + "</h1>"; // document.querySelector("#current-" + activePlayer).innerHTML = "<h1>" + dice + "</h1>";
...@@ -16,16 +16,15 @@ var scores, roundScore, activePlayer; ...@@ -16,16 +16,15 @@ var scores, roundScore, activePlayer;
// var x = document.querySelector("#score-1").textContent; // var x = document.querySelector("#score-1").textContent;
// console.log(x); // console.log(x);
//initializing everything //initializing everything
init(); init();
function init() { function init() {
// initializing global variable // initializing global variable
scores = [0, 0]; scores = [0, 0];
roundScore = 0; roundScore = 0;
activePlayer = 0; activePlayer = 0;
isGamePlaying = true;
// make dice invisible // make dice invisible
document.querySelector(".dice").style.display = "none"; document.querySelector(".dice").style.display = "none";
...@@ -35,14 +34,13 @@ function init() { ...@@ -35,14 +34,13 @@ function init() {
document.getElementById("current-1").textContent = "0"; document.getElementById("current-1").textContent = "0";
document.getElementById("score-0").textContent = "0"; document.getElementById("score-0").textContent = "0";
document.getElementById("score-1").textContent = "0"; document.getElementById("score-1").textContent = "0";
document.querySelector(".player-0-panel").classList.remove('active'); document.querySelector(".player-0-panel").classList.remove("active");
document.querySelector(".player-1-panel").classList.remove('active'); document.querySelector(".player-1-panel").classList.remove("active");
document.querySelector(".player-0-panel").classList.remove('winner'); document.querySelector(".player-0-panel").classList.remove("winner");
document.querySelector(".player-1-panel").classList.remove('winner'); document.querySelector(".player-1-panel").classList.remove("winner");
document.querySelector(".player-0-panel").classList.add('active'); document.querySelector(".player-0-panel").classList.add("active");
document.getElementById("name-0").textContent = "PLAYER 1"; document.getElementById("name-0").textContent = "PLAYER 1";
document.getElementById("name-1").textContent = "PLAYER 2"; document.getElementById("name-1").textContent = "PLAYER 2";
} }
function changePlayer() { function changePlayer() {
...@@ -64,46 +62,55 @@ function changePlayer() { ...@@ -64,46 +62,55 @@ function changePlayer() {
// add functionality for roll btn // add functionality for roll btn
document.querySelector(".btn-roll").addEventListener("click", function() { document.querySelector(".btn-roll").addEventListener("click", function() {
//create random number if (isGamePlaying) {
var dice = Math.floor(Math.random() * 6) + 1; //create random number
// disply the result var dice = Math.floor(Math.random() * 6) + 1;
var diceDOM = document.querySelector(".dice"); // disply the result
diceDOM.style.display = "block"; var diceDOM = document.querySelector(".dice");
diceDOM.src = "./dice-" + dice + ".png"; diceDOM.style.display = "block";
// update current scores, if the rolled number was not one diceDOM.src = "./dice-" + dice + ".png";
if (dice !== 1) { // update current scores, if the rolled number was not one
roundScore += dice; if (dice !== 1) {
} else { roundScore += dice;
changePlayer(); } else {
changePlayer();
}
// change current score in user inteface
document.querySelector("#current-" + activePlayer).textContent = roundScore;
} }
// change current score in user inteface
document.querySelector("#current-" + activePlayer).textContent = roundScore;
}); });
// add functionality for hold btn // add functionality for hold btn
document.querySelector(".btn-hold").addEventListener("click", function() { document.querySelector(".btn-hold").addEventListener("click", function() {
//update score if (isGamePlaying) {
scores[activePlayer] += roundScore; //update score
scores[activePlayer] += roundScore;
//change score in user interface
document.getElementById("score-" + activePlayer).textContent = //change score in user interface
scores[activePlayer]; document.getElementById("score-" + activePlayer).textContent =
scores[activePlayer];
//find winner!
if (scores[activePlayer] >= 20) { //find winner!
document.getElementById("name-" + activePlayer).textContent = "Winner! :)"; if (scores[activePlayer] >= 20) {
document.querySelector(".dice").style.display = "none"; document.getElementById("name-" + activePlayer).textContent =
document "Winner! :)";
.querySelector(".player-" + activePlayer + "-panel") document.querySelector(".dice").style.display = "none";
.classList.remove("active"); document
document .querySelector(".player-" + activePlayer + "-panel")
.querySelector(".player-" + activePlayer + "-panel") .classList.remove("active");
.classList.add("winner"); document
} else { .querySelector(".player-" + activePlayer + "-panel")
//change player .classList.add("winner");
changePlayer();
isGamePlaying = false;
} else {
//change player
changePlayer();
}
} }
}); });
// add functionality for newGame btn // add functionality for newGame btn
document.querySelector('.btn-new').addEventListener("click" , init); document.querySelector(".btn-new").addEventListener("click", init);
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment