I'm currently trying to make a text adventure, but I'm having difficulties with the room navigation. It is 4 x 4 -- 16 rooms total. It's still under major construction as far as the interface and overall story of the game, I'm just coding off of a shell to get the functionality. I'm planning on using doors and lock tasks, but I have to make sure I can navigate correctly first.
My problem is that the game starts in the 12th room, and navigation west works just fine, just as navigation east or west works in the room west of the 12th room, and so on. But, if the player goes north, it navigates to a completely different room than what's on the map.
This is a map of the game just for reference. From the 12th room, the player should be able to type "north" and go directly into the 8th room. Instead, it seems to go into the 9th room. Going east will successfully take them into the 13th room.
I want north and south to work. It seems like only my east and west navigation is working.
Here is the full code:
<!doctype html>
<title>House</title>
<img src="" width="300" height="267">
<p id="output"></p>
<input id="input" type="text" placeholder="Enter your action…">
<button>enter</button>
<script>
//Create the map
var map = [];
map[0] = "Graveyard";
map[1] = "Coffin Room";
map[2] = "Monster Party";
map[3] = "Spacious Room";
map[4] = "Burned Room";
map[5] = "Ghost Room";
map[6] = "Empty Room";
map[7] = "Catacombs";
map[8] = "Cluttered Room";
map[9] = "Spider Room";
map[10] = "Dressing Room";
map[11] = "Front Door and Entrance Hall";
map[12] = "Closet";
map[13] = "Very Dark Room";
map[14] = "Kitchen";
map[15] = "Gate";
// create a two dimensional array to store path movement for each room
// [ NORTH, SOUTH, EAST, WEST ]
var mapPath = [];
mapPath[0] = [false, true, true, false];
mapPath[1] = [false, true, true, true];
mapPath[2] = [false, true, true, true];
mapPath[3] = [false, true, false, true];
mapPath[4] = [true, true, true, false];
mapPath[5] = [true, true, true, true];
mapPath[6] = [true, true, true, true];
mapPath[7] = [true, true, false, true];
mapPath[8] = [true, true, true, false];
mapPath[9] = [true, true, true, true];
mapPath[10] = [true, true, true, true];
mapPath[11] = [true, true, false, true];
mapPath[12] = [true, false, true, false];
mapPath[13] = [true, false, true, true];
mapPath[14] = [true, false, true, true];
mapPath[15] = [true, false, false, true];
//Set the player's start location
var mapLocation = 12;
//Set the images
var images = [];
images[0] = "";
images[1] = "";
images[2] = "";
images[3] = "";
images[4] = "";
images[5] = "";
images[6] = "";
images[7] = "";
images[8] = "";
//Set the blocked path messages
var blockedPathMessages = [];
blockedPathMessages[0] = "It's too dangerous to move that way.";
blockedPathMessages[1] = "A mysterious force holds you back.";
blockedPathMessages[2] = "A tangle of thorns blocks your way.";
blockedPathMessages[3] = "You can't step over the dragon.";
blockedPathMessages[4] = "The terrain is too rocky that way.";
blockedPathMessages[5] = "The gate locks shut.";
blockedPathMessages[6] = "The river is too deep to cross.";
blockedPathMessages[7] = "The trees are too thick to pass.";
blockedPathMessages[8] = "You're too scared to go that way.";
//Create the objects and set their locations
var items = ["stone"];
var itemLocations = [6];
//An array to store what the player is carrying
var backpack = [];
//Initialize the player's input
var playersInput = "";
//Initialize the gameMessage
var gameMessage = "";
//Create an array of actions the game understands
//and a variable to store the current action
var actionsIKnow
= ["north", "east", "south",
"west", "take", "use", "drop"];
var action = "";
//An array of items the game understands
//and a variable to store the current item
var itemsIKnow = ["flute", "stone", "sword"];
var item = "";
//The img element
var image = document.querySelector("img");
//The input and output fields
var output = document.querySelector("#output");
var input = document.querySelector("#input");
//The button
var button = document.querySelector("button");
button.style.cursor = "pointer";
button.addEventListener("click", clickHandler, false);
window.addEventListener("keydown", keyHandler, false);
//Dispay the player's location
render();
function keyHandler(event) {
if (event.keyCode === 13) {
clickHandler();
}
}
function clickHandler() {
playGame();
}
function playGame() {
//Get the player's input and convert it to lowercase
playersInput = input.value;
playersInput = playersInput.toLowerCase();
//Reset these variables from the previous turn
gameMessage = "";
action = "";
//Figure out the player's action
for (i = 0; i < actionsIKnow.length; i++) {
if (playersInput.indexOf(actionsIKnow[i]) !== -1) {
action = actionsIKnow[i];
console.log("player's action: " + action);
break;
}
}
//Figure out the item the player wants
for (i = 0; i < itemsIKnow.length; i++) {
if (playersInput.indexOf(itemsIKnow[i]) !== -1) {
item = itemsIKnow[i];
console.log("player's item: " + item);
}
}
//Choose the correct action
switch(action) {
case "north":
if (mapPath[mapLocation][0]) {
mapLocation -= 3;
} else {
gameMessage = blockedPathMessages[mapLocation];
}
break;
case "east":
if (mapPath[mapLocation][2]) {
mapLocation += 1;
} else {
gameMessage = blockedPathMessages[mapLocation];
}
break;
case "south":
if (mapPath[mapLocation][1]) {
mapLocation += 3;
} else {
gameMessage = blockedPathMessages[mapLocation];
}
break;
case "west":
if (mapPath[mapLocation][3]) {
mapLocation -= 1;
} else {
gameMessage = blockedPathMessages[mapLocation];
}
break;
case "take":
takeItem()
break;
case "drop":
dropItem();
break;
case "use":
useItem();
break;
default:
gameMessage = "I don't understand that.";
}
//Render the game
render();
}
function takeItem() {
//Find the index number of the item in the items array
var itemIndexNumber = items.indexOf(item);
//Does the item exist in the game world
//and is it at the player's current location?
if (itemIndexNumber !== -1 && itemLocations[itemIndexNumber] === mapLocation) {
gameMessage = "You take the " + item + ".";
//Add the item to the player's backpack
backpack.push(item);
//Remove the item from the game world
items.splice(itemIndexNumber, 1);
itemLocations.splice(itemIndexNumber, 1);
//Display in the console for testing
console.log("World items: " + items);
console.log("backpack items: " + backpack);
} else {
//Message if you try and take an item
//that isn't in the current location
gameMessage = "You can't do that.";
}
}
function dropItem() {
//Try to drop the item only if the backpack isn't empty
if (backpack.length !== 0) {
//Find the item's array index number in the backpack
var backpackIndexNumber = backpack.indexOf(item);
//The item is in the backpack if backpackIndex number isn't -1
if (backpackIndexNumber !== -1) {
//Tell the player that the item has been dropped
gameMessage = "You drop the " + item + ".";
//Add the item from the backpack to the game world
items.push(backpack[backpackIndexNumber]);
itemLocations.push(mapLocation);
//Remove the item from the player's backpack
backpack.splice(backpackIndexNumber, 1);
} else {
//Message if the player tries to drop
//something that's not in the backpack
gameMessage = "You can't do that.";
}
} else {
//Message if the backpack is empty
gameMessage = "You're not carrying anything.";
}
}
function useItem() {
//1. Find out if the item is in the backpack
//Find the item's array index number in the backpack
var backpackIndexNumber = backpack.indexOf(item);
//If the index number is -1, then it isn't in the backpack.
//Tell the player that he or she isn't carrying it.
if (backpackIndexNumber === -1) {
gameMessage = "You're not carrying it.";
}
//If there are no items in the backpack, then
//tell the player the backpack is empty
if (backpack.length === 0) {
gameMessage += " Your backpack is empty";
}
//2. If the item is found in the backpack
//figure out what to do with it
if (backpackIndexNumber !== -1) {
switch(item) {
case "flute":
if(mapLocation === 8) {
gameMessage = "Beautiful music fills the air.";
gameMessage += "A wizend old man steps outside "
gameMessage += "and hands you a sword!";
//Add the sword to the world
items.push("sword");
itemLocations.push(mapLocation);
} else {
gameMessage = "You try and play the flute "
gameMessage += "but it makes no sound here.";
}
break;
case "sword":
if(mapLocation === 3) {
gameMessage = "You swing the sword and slay the dragon! ";
gameMessage += "You've saved the forest of Lyrica!";
} else {
gameMessage = "You swing the sword listlessly.";
}
break;
case "stone":
if(mapLocation === 1) {
gameMessage = "You drop the stone in the well.";
gameMessage += " A magical flute appears!";
//Remove the stone from the player's backpack
backpack.splice(backpackIndexNumber, 1);
//Add the flute to the world
items.push("flute");
itemLocations.push(mapLocation);
} else {
gameMessage = "You fumble with the stone in your pocket.";
}
break;
}
}
}
function render() {
//Render the location
output.innerHTML = map[mapLocation] + "<br>";
image.src = "images/" + images[mapLocation];
// display the directions the user can travel
for (var i = 0; i < mapPath[mapLocation].length; i++) {
if (mapPath[mapLocation][i]) {
switch (i) {
case 0:
output.innerHTML += "A path leads north<br>"
break;
case 1:
output.innerHTML += "A path leads south<br>"
break;
case 2:
output.innerHTML += "A path leads east<br>"
break;
case 3:
output.innerHTML += "A path leads west<br>"
break;
}
}
}
//Display an item if there's one in this location
//1. Loop through all the game items
for (var i = 0; i < items.length; i++) {
//Find out if there's an item at this location
if (mapLocation === itemLocations[i]) {
//Display it
output.innerHTML += "<br>You see a <strong>" + items[i] + "</strong> here.";
}
}
//Display the game message
output.innerHTML += "<br><em>" + gameMessage + "</em>";
//Display the player's backpack contents
if (backpack.length !== 0) {
output.innerHTML += "<br>You are carrying: " + backpack.join(", ");
}
input.value = "";
input.focus();
}
</script>
