JSFiddle - React, Tailwind, and code Playground
HTML
<!DOCTYPE html>
<html>
<body>
<div id="message"></div> <!-- "msgText" goes here -->
<div id="choices"></div> <!-- "choices" go here -->
<script>
//messages
var msg_000 = { //Starts with this one, I want to be able to go back to it
msgName: "msg_000",
msgText:"Sup! Choose an option!",
choices:[
ans_000 = {
ansText:"Climb a hill!",
ansGoto:"msg_001" //this works
},
ans_001 = {
ansText:"Skin a cat!",
ansGoto:"msg_002" //this works
},
ans_002 = {
ansText:"Build a birdhouse!",
ansGoto:"msg_003" //this works
}
]
};
var msg_001 = {
msgName: "msg_001",
msgText:"You summit the great snowy peaks!",
choices:[
ans_000 = {
ansText:"Talk to the Recursion Guru!",
ansGoto:"msg_000" //this doesn't work
}
]
};
var msg_002 = {
msgName:"msg_002",
msgText:"You suffer severe lacerations to the face!",
choices:[
ans_000 = {
ansText:"Start Over",
ansGoto:"msg_000" //this doesn't work
}
]
};
var msg_003 = {
msgText:"You build a pretty average looking birdhouse. Some grackles have moved in nonetheless, placing their various knicknacks, bedding materials, and chrono-gateways within their new abode.",
choices:[
ans_000 = {
ansText:"Step through the chrono-gateway!",
ansGoto:"msg_000" //this doesn't work
},
ans_001 = {
ansText:"I think I wanna climb that mountain over there.",
ansGoto:"msg_001" //this works
}
]
}
var currentMsg = "msg_000"; //the first message is "msg_000"
printCurrentMsg = function() {
document.getElementById("message").innerHTML =
window[currentMsg].msgText;
//sets the message (the div with the id of "message")
//based on the "currentMsg" variable. "currentMsg.msgText"
//doesn't seem to work.
var choices =...