Chore door start button not working

Hello. For some reason my start button isn’t restarting the game but when I lose I can’t click on any more doors, meaning that gameOver and currentlyPlaying are working. I’m not sure if it’s a small mistake or a big one. Thanks in advance. My javascript is below.

Javascript

let doorImage1 = document.getElementById('door1');
let doorImage2 = document.getElementById('door2');
let doorImage3 = document.getElementById('door3');
const startButton = document.getElementById('start');

let botDoorPath = "https://s3.amazonaws.com/codecademy-content/projects/chore-door/images/robot.svg";
let beachDoorPath = "https://s3.amazonaws.com/codecademy-content/projects/chore-door/images/beach.svg";
let spaceDoorPath = "https://s3.amazonaws.com/codecademy-content/projects/chore-door/images/space.svg";
let closedDoorPath = "https://s3.amazonaws.com/codecademy-content/projects/chore-door/images/closed_door.svg";
numClosedDoor = 3;
currentlyPlaying = true;
let openDoor1;
let openDoor2;
let openDoor3;

const isBot = (door) => {
  if(door.src === botDoorPath) {
    return true;
  } else {
   return false;
  }
};

const isClicked = (door) => {
  if(door.src === closedDoorPath) {
    return false;
  } else {
    return true;
  }
};

const playDoor = (door) => {
  numClosedDoor--;
  if(numClosedDoor === 0) {
    gameOver('win');
  } else if(isBot(door)) {
    gameOver();
  }
};

const randomChoreDoorGenerator = () => {
  const choreDoor = Math.floor(Math.random() * numClosedDoor);
  if(choreDoor === 0) {
    openDoor2 = botDoorPath;
    openDoor1 = spaceDoorPath;
    openDoor3 = beachDoorPath;
  } else if(choreDoor === 1) {
    openDoor3 = botDoorPath;
    openDoor2 = spaceDoorPath;
    openDoor1 = beachDoorPath;
  } else if(choreDoor === 2) {
    openDoor1 = botDoorPath;
    openDoor3 = beachDoorPath;
    openDoor2 = spaceDoorPath;
  };
};

doorImage1.onclick = () => {
  if(currentlyPlaying && !isClicked(doorImage1)) {
  doorImage1.src=openDoor1;
  playDoor(doorImage1);
  }
};

doorImage2.onclick = () => {
  if(currentlyPlaying && !isClicked(doorImage2)) {
  doorImage2.src=openDoor2;
  playDoor(doorImage2);
  }
};

doorImage3.onclick = () => {
  if(currentlyPlaying && !isClicked(doorImage3)) {
 doorImage3.src=openDoor3;
 playDoor(doorImage3);
  }
};

startButton.onclick = () => {
  if(currentlyPlaying === false) {
  startRound();
  }
};

  startRound = () => {
  numClosedDoor === 3;
  randomChoreDoorGenerator();
  door.src = closedDoorPath;
  startButton.innerHTML = 'Good luck!';
  currentlyPlaying = true;
};

const gameOver = (status) => {
  if(status === 'win') {
    startButton.innerHTML = 'You win! Play again?';
  } else {
    startButton.innerHTML = 'Game over! Play again?';  
  }
  currentlyPlaying = false;
};

startRound();

Hello :slight_smile:

Take a look at this function:

startRound = () => {
  numClosedDoor === 3;
  randomChoreDoorGenerator();
  door.src = closedDoorPath;
  startButton.innerHTML = 'Good luck!';
  currentlyPlaying = true;
};

At the start of the function you assign value 3 to the variable numClosedDoor, that’s correct because you defined this variable as a global variable in the 10th line of your script:

let closedDoorPath = "https://s3.amazonaws.com/codecademy-content/projects/chore-door/images/closed_door.svg";
numClosedDoor = 3; // <-- here
currentlyPlaying = true;

But later you assign value stored in variable closedDoorPath to the property src of the door object. But the problem is that variable door is never defined - not as a global variable, not as a parameter of the function. And that’s why clicking on the “start” button after loosing will result in this error:

Uncaught ReferenceError: door is not defined

Try to sort this out and let us know if you managed to fix this. Try to explain to yourself what you want to achieve in this line of code, this should help.

1 Like

Thank you so much that fixed it!

1 Like