Chore Door startRound() steps 69 & 70


#1

I am at the final steps of the project. I can get the startButton to call the startRound() function, resetting the game - however, it appears that the value for choreDoor seems to stay the same - meaning that the bot image doesn’t move after I click Play again.
The only way to get it to move is by reloading the whole page.
I am pasting my code below.
Any help would be greatly appreciated!

script.js

let doorImage1 = document.getElementById("door1");
let doorImage2 = document.getElementById("door2");
let doorImage3 = document.getElementById("door3");
let startButton = document.getElementById("start");
let numClosedDoors = 3;
let openDoor1;
let openDoor2;
let openDoor3;
let currentlyPlaying = true;

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"

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) => {
  numClosedDoors--;
  if(numClosedDoors === 0) {
    gameOver('win');
  } else if (isBot(door)) {
    gameOver();
  }
}

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

door1.onclick = () => {
  if(!isClicked(doorImage1) && currentlyPlaying){
	  doorImage1.src = openDoor1;
  	playDoor(door1);
  }
}
door2.onclick = () => {
  if(!isClicked(doorImage2) && currentlyPlaying){
	  doorImage2.src = openDoor2;
  	playDoor(door2);
  }
}
door3.onclick = () => {
  if(!isClicked(doorImage3) && currentlyPlaying){
	  doorImage3.src = openDoor3;
  	playDoor(door3);
  }
}

const startRound = () => {
  doorImage1.src = closedDoorPath;
  doorImage2.src = closedDoorPath;
	doorImage3.src = closedDoorPath;
	numClosedDoors = 3;
  startButton.innerHTML = 'Good luck!';
	currentlyPlaying = true;
  randomChoreGenerator();
}

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

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

randomChoreDoorGenerator();```

#2

Hi there, I am having a similar problem at step 70. I cannot get any response at all from the start button to reset the game.
However looking at your code I noticed you have not replaced the randomChoreDoorGenerator() call at the bottom of the script with the startRound() function call. This is step 69 and the randomChoreDoorGenerator function is called inside the startRound function.
Does this help?
SD


#3

Thanks SD - I saw some weird behavior when I replaced the randomChoreDoorGenerator() call at the bottom of the script with the startRound() function call. Even stranger - now it seems to be happening even after I changed it back to randomChoreDoorGenerator() - screenshot attached.

Regarding the issue you’re seeing at step 70 - I ran into something similar and, in my case, it was due to not having properly closed one of the {} that was causing the script to not finish running properly…


#4

yep, i observed this as well. Which is weird, because startRound would be the logic function to call.

As i see it, there are two options, either call startRound at the end to automatically start the first game, or call no function at all, so that the user has to click the start button to launch the first game

if you go through the logic of the code, startRound isn’t called until the second game round, which is just bad design.

Let me see what i can dig up to make this work


#5

apparently the solution is really easy

call startRound at the end (so not randomChoreDoorGenerator), the first thing startRound then should do is generating the doors, so call randomChoreDoorGenerator().

otherwise there no images for the open doors.


#6

Be sure you have the correct name for the function.


#7

Ahh that was it!!! Inside startRound() I had randomChoreGenerator() - instead of randomChoreDoorGenerator()! Thank you so much!!
All works now - here’s the full code

let doorImage1 = document.getElementById("door1");
let doorImage2 = document.getElementById("door2");
let doorImage3 = document.getElementById("door3");
let startButton = document.getElementById("start");
let numClosedDoors = 3;
let openDoor1;
let openDoor2;
let openDoor3;
let currentlyPlaying = true;

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"

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) => {
  numClosedDoors--;
  if(numClosedDoors === 0) {
    gameOver('win');
  } else if (isBot(door)) {
    gameOver();
  }
}

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

door1.onclick = () => {
  if(!isClicked(doorImage1) && currentlyPlaying){
	  doorImage1.src = openDoor1;
  	playDoor(door1);
  }
}
door2.onclick = () => {
  if(!isClicked(doorImage2) && currentlyPlaying){
	  doorImage2.src = openDoor2;
  	playDoor(door2);
  }
}
door3.onclick = () => {
  if(!isClicked(doorImage3) && currentlyPlaying){
	  doorImage3.src = openDoor3;
  	playDoor(door3);
  }
}

const startRound = () => {
  doorImage1.src = closedDoorPath;
  doorImage2.src = closedDoorPath;
	doorImage3.src = closedDoorPath;
	numClosedDoors = 3;
  startButton.innerHTML = 'Good luck!';
	currentlyPlaying = true;
  randomChoreDoorGenerator();
}

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

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

startRound();

#8

This topic was automatically closed after 7 days. New replies are no longer allowed.