Build A Text Adventure Game With JavaScript

What people said

Cites CatRass · 2020-02 · Stack Overflow · on “Showing an image depending on what option you choose”

I was following a tutorial ( [this video] ) on how to make a text adventure game in javascript, and wanted to re purpose that code into a game of my own, except depending on what option you choose, the image changes. How would I do that? Original code can be found here ( [LINK] ), but heres the basic gist of the code: const textElement = document.getElementById('text') const optionButtonsElement = document.getElementById('option-buttons') let state = {} function startGame() { state = {} showTextNode(1) } function showTextNode(textNodeIndex) { const textNode = textNodes.find(textNode => textNode.id === textNodeIndex) textElement.innerText = textNode.text while (optionButtonsElement.firstChild) { o

Cites ETHan · 2020-06 · Stack Overflow · on “Auto call function within Object once object is called?”

@ΣπύροςΓούλας thank you for your comment. When i mean "called", I mean that whenever the user selects an "option" for that question ID, I want to run any and all functions that are within my object. So if the question ( id 2 ) is "Do you want to run or fight", and the user selects the option "fight", any function within that option will be run. If the user chooses to fight, maybe my function will subtract health from a player object. I am using this tutorial as a starting point, and might help understand what I am trying to do. [this video] .

Cites lennytriestocode · 2020-09 · Stack Overflow · on “Show option only when currentState is empty”

I'm following this [this video] tutorial to make a text based adventure as my first real javaScript program. I'm a total beginner, but I figured that I could learn something from just throwing myself out there. My problem is that I want one of my options to show only when the character isn't carrying anything. This is my code: id: 2, text:"You venture forth and soon appears a small village. The village seems to be holding a celebration. By the side of the road, you see a merchant.", options: [ { text: "Trade the stone for a sword", requriedState: (currentState) => currentState.strangeStone, setState: { strangeStone: false, sword: true }, nextText: 3 }, { text: "Trade the stone for some money", re

Cites Henry Pucknell · 2021-05 · Stack Overflow · on “Having trouble removing undefined values from javascript objects (Web Dev Simplified)”

Sorry i know this has been asked before but the solutions i have tried dont seem to be working :( I need the undefined values to not appear when i look at the simple inventory i've built in HTML. function pullValue() { var node = document.createElement("li"); var textNode = (document.createTextNode(state.thing1 + " " + state.thing2 + " " + state.thing3)); node.appendChild(textNode); document.getElementById("inventory").appendChild(node); /////I have tried the below solutions with no luck :( //////// Object.keys(state).forEach(key => state[key] === undefined && delete state[key]); state.filter(Boolean); var ret = (state.thing1 + state.thing2 + state.thing3).replace(/undefined/g,''); var filte

Cites William S · 2021-11 · Stack Overflow · on “How do I make it so when my array includes a specific word a text input shows up?”

After getting help countless times in this forum, I finally created my own account after getting stuck in my code, and not being able to resolve it :( Pre-info, I wanted to create a text adventure with javascript and followed this guide on youtube: [this video] I wanted my game to have several "rooms" that you can go thru, and some rooms you only can go thru if you have found a key for example. See demo. To do this i added if/if else at the end of my selectChoice. However, If you watch the demo, I want so that when you press the button that says 'Go to Bowser's door(!!!)', a text input shows up, instead of the button that says Enter favorite song. The user is then supposed to enter a guess of Bow

Cites aquintingsongs · 2022-03 · Stack Overflow · on “How does one add an image to different id's in a constant in javascript for a text based adventure game?”

I am following this [this video] tutorial to build a text based adventure game. Here [LINK] is the code for the entire game that is mine too. I'd like to add an image to each page of the game. For example, this: const textNodes = [ { id: 1, text: 'you walk down the road blah blah', options: [ { text: 'Take the goo', setState: { blueGoo: true }, nextText: 2 }, { text: 'Leave the goo', nextText: 2 } ] is a constant where i'd like to add the image to. This: var imagesDatabase = { '1': src="images/bs1.jpg", '2': src="images/bs2.jpg", '3':src="images/bulb.png" } var theImageDiv = document.createElement('div'); theImageDiv.innerHTML = "<img id='the-image-bro' src='" + imagesDatabase[textNodeIndex] + "'

Cites IvorMectin1 · 2022-05 · Stack Overflow · on “Manipulating Variables in a game based on HTML Radio Buttons”

I am building a text adventure game in javascript and constructing it based off the tutorial case documented here: [this video] with the code being available here: [LINK] This was a great tutorial however for the game I am building there needs to be a series of variables ands arrays for exapmle, defence budget, number of tanks, diplomacy levels etc. which can be manipulated by the players actions and read back out on an analysis screen. The currernt tutorial code allows you to set states for example having a sword or not, but not mainpulation of variables and arrays. I have apttempted to set selection of the option to call a function which modifies the variable which is then read back out to the

Cites invikta · 2024-02 · Stack Overflow · on “JavaScript removeChild Method Not Working?”

I am trying to build a "choose your own adventure"-type text adventure site using JavaScript for choice selection based on this Youtube tutorial [this video] and I'm running into an issue where the ".removeChild" method is not working to replace the default "Option #" buttons with the choice selections as shown in the tutorial, and when an option is clicked, it is just adding onto the available options and duplicating instead of moving to the next screen: screenshot [LINK] . I believe I've followed it step for step and I can't find any inconsistencies that would cause my code to behave differently. Here is the code: [LINK] And here is the website I'm trying to implement it on, which strangely eno