Chore door step 57

Hi guys,

"You win! Play again” message not appearing on this project step 57.

Ive checked the code multiple times, and the console are no other problems but showing this msg: “Failed to load resource: the server responded with a status of 404 (Not Found)” in the script.js:1.

please help! thanks a lot!

here’s my code:

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

const botDoorPath = ""
const beachDoorPath = ""
const spaceDoorPath = ""
const closedDoorPath = ''

let numClosedDoors = 3
let openDoor1
let openDoor2
let openDoor3

const isClicked=(door)=>{
return false
return true
const playDoor = (door) => {
  if (numClosedDoors === 0){

const randomChoreDoorGenerator=()=>{
  let choreDoor = Math.floor(Math.random()*2)
openDoor1 = botDoorPath
openDoor3 = beachDoorPath
openDoor2 = spaceDoorPath

  }else if(choreDoor===1){
openDoor2 = botDoorPath
openDoor1 = beachDoorPath
openDoor3 = spaceDoorPath

  }else if(choreDoor===2){
openDoor3 = botDoorPath
openDoor2 = beachDoorPath
openDoor1 = spaceDoorPath


  doorImage1.src = openDoor1
  doorImage2.src = openDoor2
  doorImage3.src = openDoor3

const gameOver=(status)=>{
startButton.innerHTML='You win! Play again?'


Hi @core6779996331
where do you call the function playDoor()? Can you post your HTML as well?

I did call the function playDoor() at first, but I found there is no difference… so I delete…

heres HTML code:

<!DOCTYPE html>
    <title>Chore Door!</title>
    <link href="./style.css" rel="stylesheet" type="text/css">
    <link href="" rel="stylesheet" type="text/css">

    <div class="header">
      <img src="">
    <div class="title-row">
<img src="">
<p class="instructions-title">Instructions</p>
<img src="">
      <table class="instructions-row">
<td class="instructions-number">1</td>
<td class="instructions-text">Hiding behind one of these doors is the ChoreBot.</td>
<td class="instructions-number">2</td>
<td class="instructions-text">Your mission is to open all of the doors without running into the ChoreBot.</td>
<td class="instructions-number">3</td>
<td class="instructions-text">If you manage to avoid the ChoreBot until you open the very last door, you win!</td>
<td class="instructions-number">4</td>
<td class="instructions-text">See if you can score a winning streak!</td>

<div class="door-row">
<img id="door1" class="door-frame" src="">
<img id="door2" class="door-frame" src="">
<img id="door3" class="door-frame" src="">

<div id="start" class="start-row">
  Good luck!
<script src="script.js" type="text/javascript"></script>

thanks again!

Where did you call it?
Inside the function playDoor there is a function call for gameOver which changes the text. So when you don’t call playDoor, two things never happen:

  1. You don’t count down the variable numClosedDoors which means the game never ends
  2. You never call the function gameOver so the text never changes

Think about where and when you need to call the function: When exactly should numClosedDoors be counted down?

When you fixed that and call the function in the right place, the player will always win as soon as they clicked each door, whether they clicked the chore door or not. So you also need to think about a logic to end the game with another status earlier once the wrong door was clicked.

You could think about a way to write only one callback for each door instead of three which would make it easier and more concise to add the missing logic for winning or losing the game.

This topic was automatically closed 41 days after the last reply. New replies are no longer allowed.