Choro Door project

Hey there! I need help , I’ve been stucked doing this project, I’ve been watching the video and rechecking and I don’t know what’s wrong, there is not any movement with the doors and robots and in the console I got just this error: Uncaught TypeError: doorImage1 is null (I’ve been changing this name doorImage1 or door1, but there’s not any movement.

This my script

let doorImage1 = document.getElementById("door1")

let doorImage2 = document.getElementById("door2")

let doorImage3 = document.getElementById("door3")

let startButton = document.getElementById("start")

let botDoorPath = "https://content.codecademy.com/projects/chore-door/images/robot.svg";

let beachDoorPath = "https://content.codecademy.com/projects/chore-door/images/beach.svg";

let spaceDoorPath = "https://content.codecademy.com/projects/chore-door/images/space.svg";

let closedDoorPath = "https://content.codecademy.com/projects/chore-door/images/closed_door.svg";

doorImage1.onclick = () => {

  if(currentlyPlaing && !isclicked (doorImage1)) {

  doorImage1.src = openDoor1;

  playDoor(door1)

  gameOver('win')

}

}

doorImage2.onclick = () => {

  if(currentlyPlaing && !isclicked (doorImage2)) {

  doorImage2.src = openDoor2;

  playDoor(door2)

  gameOver('win')

}

}

doorImage3.onclick = () => {

  if(currentlyPlaing && !isclicked (doorImage3)) {

  doorImage3.src = openDoor3;

  playDoor(door3)

  gameOver('win')

}

}

startButton.onclick = ()  => {

  if(!currentlyPlaing) {

    startRound();

  }

}

const startRound = () => {

  door1.src = closedDoorPath

  door2.src = closedDoorPath

  door2.src = closedDoorPath

  numClosedDoors = 3;

  startButton.innerHTML = "Good Luck!"

  currentlyPlaing = true;

  randomChoreDoorGenerator();

}

const isBot = (door) => {

  gameOver()

  if(door.src === botDoorPath) {

    return true;

  }else {

    return false

  }

}

const gameOver = (status) => {

if(status === 'win') {

  startButton.innerHTML = 'You win!, Play again?';

 

}else {

  startButton.innerHTML = 'Game over! Play again ?'

}

 currentlyPlaing = false;

}

startRound()

let numClosedDoors = 3;

let currentlyPlaing = 'true';

let openDoor1;

let openDoor2 ;

let openDoor3 ;

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('lose')

  }

}

randomChoreDoorGenerator = () => {

  const 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 {

    (choreDoor === 2)

      openDoor3 = botDoorPath;

      openDoor1 = beachDoorPath;

      openDoor2= spaceDoorPath

  }

}

My HTML

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Chore Door!</title>

    <link rel="stylesheet" type="text/css" href="ChoreDoor1.css">

    <link href="https://fonts.googleapis.com/css?family=Work+Sans" rel="stylesheet" type="text/css">

    <script type="text/javascript" src="ChoreDoor1.js"></script>

</head>

<body>

    <div class="header">

        <img src="https://content.codecademy.com/projects/chore-door/images/logo.svg">

        <div class="title-row">

            <img src="https://content.codecademy.com/projects/chore-door/images/star.svg">

            <p class="instructions-title">Instructions</p>

            <img src="https://content.codecademy.com/projects/chore-door/images/star.svg">

        </div>

        <table class="instructions-row">

            <tr>

                <td class="instructions-number">1</td>

                <td class="instructions-text">Hiding behind one of these doors is the ChoreBot.</td>

            </tr>

            <tr>

                <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>

            </tr>

            <tr>

                <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>

            </tr>

            <tr>

                <td class="instructions-number">4</td>

                <td class="instructions-text">See if you can score a winning streak!</td>

            </tr>

        </table>

        <div class="door-row">

            <img id="door1" class="door-frame"

                src="https://content.codecademy.com/projects/chore-door/images/closed_door.svg">

            <img id="door2" class="door-frame"

                src="https://content.codecademy.com/projects/chore-door/images/closed_door.svg">

            <img id="door3" class="door-frame"

                src="https://content.codecademy.com/projects/chore-door/images/closed_door.svg">

   

        </div>

        <div id="start" class="start-row">Good Luck!</div>

       

</body>

</html>

Help !! I’d really appreciate any help with this project :grimacing:

Hello @pilymoncri3217857607 ,

you might want to visit the following line with the boolean variable,

sorry , I didn’t get it, which one? but this one has the let currentlyPlaing = “true”

hi @pilymoncri3217857607 ,

apologies for the late response, you can refer to this link to know more. But what I can highlight here is that you’re declaring a String value than a Boolean value.