choreDoor


#1

My program does not working, I’m do not why. I am doing everything strictly to solution.

Can You check and tell me what is wrong?

On point 60 my Win button should change to Game over after find Bot but it not changes.

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

let botDoorPath = "link";
let beachDoorPath = "link"
let spaceDoorPath = "link"
let closedDoorPath = "link"



let numClosedDoors = 3;

let openDoor1;
let openDoor2;
let openDoor3;

const isBot = (door) => {
  if (door.scr === 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();
  }
}

const 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 if(choreDoor === 2){openDoor3 = botDoorPath;
                    openDoor2 = beachDoorPath;
                     openDoor1 = spaceDoorPath;}
}


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

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


randomChoreDoorGenerator();

#2

You’re trying to access them, but did you define door1, door2 and door3 somewhere prior to that?
Also, check your semicolons, some seem to be missing. (Just a minor thing.) :slight_smile:


#3

If I change the code for

onst playDoor = (door) => {
numClosedDoors–;
if(numClosedDoors === 0){
gameOver(‘win’);
} else if (numClosedDoors === 2) {
gameOver();
}
}

it works

maybe it is sth with isBot function?

I have defined door as in the walkthrough

let doorImage1 = document.getElementById(‘door1’);
let doorImage2 = document.getElementById(‘door2’);
let doorImage3 = document.getElementById(‘door3’);

I have to done it differently?


#4

Debugging only a part of your code without the HTML code is hard to do, you can try debugging it yourself first: using sites like https://jsfiddle.net/ and let us know what you find.

Maybe that makes it easier :slight_smile:


#5

Thank You for help: there is my code on this site:

https://jsfiddle.net/7at8gx9d/#&togetherjs=jgddpjgrAN


#6

Sorry:

this one: https://jsfiddle.net/Stolaweb/4t19Lh67/2/#&togetherjs=HUwjHctpAh


#7

The pattern for your onclicks should be

doorImage1.onclick = () => {
doorImage2.onclick = () => {
doorImage3.onclick = () => {

instead of

door1.onclick = () => {
door2.onclick = () => {
door3.onclick = () => {

because door1 - door 3 never got defined as JavaScript variables.
see here:

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

the variables doorImage1 - doorImage3 are holding the HTML tags that are marked with the ID ‘door1’ - ‘door3’ as a string

you could basically read this as:

let doorImage1 = <img id="door1" ...>

so when you’re accessing the onclick event of door1 like so: door1.onclick nothing will be found, because JavaScript is looking for a JavaScript variable named door1 and checks whether whatever is stored in it has been clicked on.

Now for the isBot() function:

There’s actually three of the doorImage onclicks but I’ll only look at one for an example here.

doorImage1.onclick = () => {
  if (!isClicked(doorImage1)) {
	doorImage1.src = openDoor1;
  	playDoor(); // <---------
  }
};

The function playDoor() that get’s called

const playDoor = door => {
  numClosedDoors--;
  if (numClosedDoors === 0){
    gameOver('win');
  } else if (isBot()) { // <--------- isBot(no parameter)
    gameOver();
  }
};

actually calls your isBot() function.

const isBot = door => { // <---------  isBot(door parameter)
  if (door === botDoorPath) {
    return true;
  } else {
    return false;
  }
};

isBot() is evaluating a parameter (door), which should get passed to it from the .onclick function above,
this is done by placing the param openDoor1 into playDoor(); like so

doorImage1.onclick = () => {
  if (!isClicked(doorImage1)) {
		doorImage1.src = openDoor1;
// calling playDoor() with a param for isBot()
  	playDoor(openDoor1); // <--------- param openDoor1
  }
};

(again, this is for the example doorImage1 part, you need to adjust that according to the door numbers for all thee onclicks (openDoor1 - openDoor3).

let’s finish this up by looking at your playDoor() function:

const playDoor = door => {
  numClosedDoors--;
  if (numClosedDoors === 0){
    gameOver('win');
  } else if (isBot()) { // <--------- isBot(no parameter)
    gameOver();
  }
};

notice this part: else if (isBot()) {

simply putting isBot() into the if condition doesn’t cut it, isBot() would be evaluated without a parameter, so you must pass a parameter into it. Ideally it looks at the parameter that got passed along by the onclick function.

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

now isBot() can evaluate whether the URL is that of the bot or not and return true or false accordingly.

All of this makes the game over condition work, but getting the script to stop evaluating the following onclick events (aka stopping the game) or even restarting the game by a click on the start button is a whole other story.


#8

In isBot you wrote scr instead of src


#9

[coderighton] thank You very much for help and essential explanation. I have to analyze my code and make it once again from the scratch.

Thank You lofail for src


#10

I have door1.onclick and it also works

https://jsfiddle.net/#&togetherjs=tiuBhkn166

so it can be also door1 even if it is not defined?


#11

That is not recommended practice. Dig around for the topic that explains why globals are vulnerable to collisions with other script. Best practice, define doorImageN and cache the doorN nodes, then use that variable throughout your code.

CC has revised the course to this end but may have skipped a couple things. First rule of thumb, just because it works does not mean it is right. If it raises a question, then there is probably something amiss.


#12

Thank You for explanation. I am still learning and Your suggestions are very important for me.

Thx

wt., 16.04.2019, 21:59 użytkownik Roy via Codecademy Forums codecademy@discoursemail.com napisał: