So, I have a function that checks if you pressed 'n' or 'y', when you press 'n', a figure attacks you, after it is supposed to remove the event listener, and then give you a chance to win the fight, but before that there is a screen that says press any key to continue, but that screen doesn't show. Help?
I've been working on this for a while, and it just wont work, it doesn't remove the event listener.
This is the start screen code, after naming your character and stuff
document.body.innerHTML = "<h4>As you are walking to the bar at a pub, a dark, hooded figure, pulls you aside to a corner: 'Listen, I have a job for you...'</h4><h2>Press 'Y' to accept, and 'N' to turn back to the bar</h2><img id='hoodedFigure' src='https://render.fineartamerica.com/images/rendered/default/print/6.125/8.000/break/images-medium/the-hooded-figure-kayleigh-semeniuk.jpg'>";
//Then it adds the event listener:
var event1 = window.addEventListener("keydown", checkKeyPressed, false);
//This is the function it calls:
{if (evt.keyCode == "89") {
changeContentOnPressY(1);
} if (evt.keyCode == "78") {
changeContentOnPressN(1);
}}}```
//Then it calls this function to change the screen:
```function changeContentOnPressN(num) {
if (num == 1) {
window.removeEventListener("keydown", checkKeyPressed, false);
document.body.innerHTML = "The strange figure draws his weapons and agresses on you. You draw your small blade, and attempt to slash his stomach.<h3 style='text-align:center;'>Press any key to continue...</h3>";
window.addEventListener("keydown", chance(1), false);
} if(num == 2) {
window.addEventListener("keydown", checkKeyPressed2, false);
document.body.innerHTML = ""; // for 2nd n path}}```
//This is the part that is not working:
```window.removeEventListener("keydown", checkKeyPressed, false);```
This is the chance() function:
```function chance(num) {
if (num == 1) {
var chance = Math.random(0.1, 1);
if (chance >= 0.80) {
document.body.innerHTML = "Suddenly a swaggering figure walks towards you he says intrduces himself as Jean-Jacques le Tourment des Ombres, Grand Connoisseur of the Ombres House, he says 'You made the right choice, he was not to be trusted. I too dont like the Sabbath Family. Together we can get revenge'. Press Y to accept and N top refuse";
} else {
document.body.innerHTML = "He quickly slits your right wrist, and collects the blood spilled in a barrel. Soon nobles will enjoy this aged red. <br> <h1 style='text-align:center;'>GAME OVER<h1><br><h3 style='text-align:center;'>Press any key to continue...</h3>";
window.addEventListener("keydown", startGame1, false);}}}}```
There is a lot happening in your question, I am going to focus on what I assume to be the skipped screen. As far I can tell it should remove the event listener.
In your code you have this segment, which is supposed to wait for the player to press anykey.
window.addEventListener("keydown", chance(1), false);
The problem is that you call the "chance" function immediately, instead of waiting.
If you want to be able to unbind that function again you have
function waitForChance() {
chance(1)
}
window.addEventListener("keydown", waitForChance, false);
Then you can unbind that later with
window.removeEventListener("keydown", waitForChance, false);
Btw If I were you I would probably try to avoid unbinding and rebinding event listeners as much since it is error prone(and difficult to read). I would probably create a state system like this where you create objects and switch between them. I think it makes it clearer which functions belong to which state.
// every state has 2 properties text and options // text is what is displayed on the screen // options contain the functions that are executed when the user presses a key // if you want to bind a specific just bind enter that key in lower case // if you want to accept any key add a function on anyKey //---------------- STATES -------------------------- let startState = { text: `<h4>As you are walking to the bar at a pub, a dark, hooded figure, pulls you aside to a corner: 'Listen, I have a job for you...'</h4><h2>Press 'Y' to accept, and 'N' to turn back to the bar</h2><img id='hoodedFigure' src='https://render.fineartamerica.com/images/rendered/default/print/6.125/8.000/break/images-medium/the-hooded-figure-kayleigh-semeniuk.jpg'>`, options: { y: function() { loadState(takeDealState) }, n: function() { loadState(ambushState) } } } let takeDealState = { text: `What ever happend when you take the deal (for now i reload the game on anykey)`, options: { /*Your options when you take the deal for now I just reset the game*/ anyKey: function() { loadState(startState) } } } let ambushState = { text: `The strange figure draws his weapons and agresses on you. You draw your small blade, and attempt to slash his stomach.<h3 style='text-align:center;'>Press any key to continue...</h3>`, options: { anyKey: function() { var chance = Math.random(0.1, 1) if (chance >= 0.80) { loadState(successfullAmbush) } else { loadState(failedAmbush) } } } } let successfullAmbush = { text: `Suddenly a swaggering figure walks towards you he says intrduces himself as Jean-Jacques le Tourment des Ombres, Grand Connoisseur of the Ombres House, he says 'You made the right choice, he was not to be trusted. I too dont like the Sabbath Family. Together we can get revenge'. Press Y to accept and N top refuse`, options: { y: function() { console.log("accept") }, n: function() { console.log("decline") } } } let failedAmbush = { text: `He quickly slits your right wrist, and collects the blood spilled in a barrel. Soon nobles will enjoy this aged red. <br> <h1 style='text-align:center;'>GAME OVER<h1><br><h3 style='text-align:center;'>Press any key to continue...</h3>`, options: { anyKey: function() { loadState(startState) } } } ///---------------- LOGIC show and handle keypresses ---------------------------------- let currentState; function loadState(state) { // set the state as the current state, so it can currentState = state; // let the state descibe the scene document.body.innerHTML = state.text; } function keyHandler(event) { if(currentState.options.anyKey) { // handle anykey currentState.options.anyKey(event.key) } else if(currentState.options[event.key]) { // handle other key presses such as y/n currentState.options[event.key](event.key) } } window.addEventListener("keypress", keyHandler, true) // start the game loadState(startState)
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.