Return Styles: Pseud0ch, Terminal, Valhalla, NES, Geocities, Blue Moon.

Pages: 1-

Need help with JavaScript Interface for text based Game

Name: Axel 2016-12-18 19:52

Hello My name is Axel and i am making a text based JavaScript game

MY code works perfectly but i don't know how to make an interface for my game, it is a very simply game based on decisions, if you choose x you get x outcome.
Now the only way i know how to change the put comes it to change the value of my variables.

Here is a part of my code:
var a1= false;
var a2= false;
var a3= false;
var a4= true;

console.log("Theic detective");

console.log(" ") ;
console.log(" ") ;
console.log(" ") ;

console.log("Yourm clock goes of, Do you;");

console.log("1get up" ) ;

console.log("2hit snooze" ) ;

console.log("3Turn it of and keep sleeping" ) ;

console.log("4Shoot it" ) ;

console.log(" ") ;

if (a1 ===true) {console.log("Youout of bed and Katie mumbles: 'have fun at work', you reply: 'Thank you honey.'") ;
}

if (a2 ===true) {console.log("Them rings 5 minutes later and you get up Katie mumbles: 'Have fun at work sleepy head' you mumble 'Thank you'") ;
}

if (a3 ===true) {console.log("Katiees you up 20 minutes later and tells you to hurry or you will be late for work. You jump out of bed");
}

if (a4 ===true) {console.log("'Jesus yells Katie, She drags you to a therapist, there a psychologist determines you have sociopathic tendencies and you are not fit to work as a detective anymore, you leave your resignation to the chief a day later.") ;
console.log();
console.log("Game");
}


at the top are the variables that determine the outcome of my story but could someone help me make a way for my users to answer the question with out having to open the code and edit it them selves.
I read about java-script interfaces but i honestly didn't understand any of it, i am very new at programing and this is about what i can do, So please tell me in as simple as possible terms how could i make and interface/ way for them to answer my questions.

Please help i would realy appreciate it!!!

(sory for bad english)
Thank you

Name: Anonymous 2016-12-18 20:03

If you're using Node.js (for Javascript applications running in a console window), there's something called "readline" to accept typed user input to the program, but it looks overly complicated.

How I would do it is set up a HTML file, with two text boxes - one large one containing the output of the program, and one smaller one that contains the user's commands. Whenever the user types enter, or presses some kind of 'submit' button, the program would read input from the box and erase it.

It's been a while since I've done anything serious with JS/HTML, so I can't come up with an example implementation off the top of my head, but your best bet is probably going to the w3schools website and looking up the tutorials on HTML forms and how to interface with them using Javascript.

Name: Anonymous 2016-12-18 21:48

>>2 here again, here's a VERY sloppy example of what I'm talking about:

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div align="center">
<form name="terminal">
<textarea name="term_out" cols="80" rows="24" readonly></textarea><br/>
<input type="text" name="term_in" maxlength="80" size="80">
<input type="button" name="term_update" value="SEND" onClick="send()">
</form>
</div>
<script>
//have to put script below the form, otherwise it will try printing to terminal before it knows what terminal is
var userInput = "";

function print(string) {
terminal.term_out.value += (string + "\n");
}

function send() {
userInput = terminal.term_in.value;
print(userInput);
handleInput();
terminal.term_in.value = "";
}

function handleInput() {
if(userInput == "HAXMYANUS") print("Correct password!");
else print("Sorry, wrong password!");
}

print("What is the password?");
</script>
</body>
</html>


Basically, the user types their input into the bottom text box, then presses send, which echoes it on the top text box, which also shows any output from the program. This demo just repeatedly asks for the correct password, but it could be modified for any sort of interactive text game. A cleaner solution would be to eliminate the bottom text box and instead have the top text box emulate the behavior of a command prompt window (i.e., you can't go back and edit after making a newline) but this is good enough for now to demonstrate an I/O interface for a JS program.

Don't change these.
Name: Email:
Entire Thread Thread List