1 "use strict"; 2 var rooms; 3 var player; 4 var display = getDisplay(); 5 var houseImages = 6 { 7 outside: { 8 src: "http://coding.stephenjwolf.com/roomadventure/roomimages/house.jpg", 9 caption: "Photo by Rowan Heuvel", 10 link: "https://unsplash.com/photos/bjej8BY1JYQ", 11 linkInfo: "Courtesy: unsplash.com" 12 }, 13 exitSign: { 14 src: "http://coding.stephenjwolf.com/roomadventure/roomimages/exit.jpg", 15 caption: "Photo by Elliott Stallion", 16 link: "https://unsplash.com/photos/wweHSdXdAgA", 17 linkInfo: "Courtesy: unsplash.com" 18 } 19 }; 20 startGame(); 21
22 function startGame() 23 { 24 //reset the global rooms and player objects 25 rooms = getRooms(); 26 player = getPlayer(); 27 28 //This explains the game to a new player 29 var text = "<h3>Welcome to the Room Adventure!</h3>"; 30 text += "You are " + player.name; 31 text += " and you are in a house"; 32 text += " where many things are broken."; 33 text += "<p>Go from room to room"; 34 text += " to find the items you need"; 35 text += " to fix what's broken.</p>"; 36 text += "<p>Earn points for fixing things."; 37 text += " There are " + player.itemsLeftToFix; 38 text += " things that need to be fixed.</p>"; 39 text += "<span style='color: slateblue;'>"; 40 text += "You start in the "; 41 text += player.currentRoom.name + ".</span>"; 42 text += "<h3>Good luck!</h3>"; 43 44 display.clear(); 45 display.info(text); 46 47 var button = "<button id='start' onclick='moveToRoom()'>Start Game</button>"; 48 display.navigation(button); 49 50 display.image(houseImages.outside); 51 } 52
53 function getPlayer() 54 { 55 var player = 56 { 57 name: "Lica", 58 score: 0, 59 currentRoom: rooms["living room"], 60 inventory: [], 61 itemsLeftToFix: 10 62 }; 63 return player; 64 } 65
66 function movePlayer(direction) 67 { 68 var exits = player.currentRoom.exits; 69 var roomName = exits[direction]; 70 var roomToGoTo = rooms[roomName]; 71 player.currentRoom = roomToGoTo; 72 moveToRoom(); 73 } 74
75 function moveToRoom() 76 { 77 display.clear(); 78 display.image(player.currentRoom.image); 79 createNavigationButtons(player); 80 display.description(player.currentRoom); 81 isThereAnItem(); 82 fixBrokenThing(); 83 display.score(); 84 showInventory(); 85 86 if (checkGameOver()) //watch the parentheses 87 { 88 alertGameWon(); 89 checkPlayAgain(); 90 } 91 } 92
93 function isThereAnItem() 94 { 95 var item = player.currentRoom.itemFound; 96 if (item) 97 { 98 display.found("You found the " + item + "!"); 99 player.inventory.push(item); 100 player.currentRoom.itemFound = null; 101 } 102 showInventory(); 103 } 104
105 function fixBrokenThing() 106 { 107 //helper variables to make the code easier to read 108 var brokenThing = player.currentRoom.brokenThing; 109 var fixWith = player.currentRoom.fixWith; 110 111 //test: Is there a broken thing? 112 if (brokenThing) 113 { 114 //get ready to announce there's a broken thing 115 var text = "There is a broken "; 116 text += brokenThing + " in this room. "; 117 118 //helper variable 119 var index = player.inventory.indexOf(fixWith); 120 121 //test: if fixWith is NOT in inventory 122 if (index === -1) 123 { 124 text += "You need the " + fixWith; 125 text += " to fix it."; 126 } 127 else //the item IS in the inventory 128 { 129 text += "You fixed the " + brokenThing; 130 text += " with the " + fixWith + "!"; 131 text += " You earn "; 132 text += player.currentRoom.points; 133 text += " points."; 134 135 player.currentRoom.brokenThing = null; 136 player.score += player.currentRoom.points; 137 player.itemsLeftToFix--; 138 player.inventory.splice(index, 1); 139 } 140 display.broken(text); 141 display.score(); 142 showInventory(); 143 } 144 } 145
146 function showInventory() 147 { 148 var text = "<h3>Inventory</h3>"; 149 150 var length = player.inventory.length; 151 152 for (var i = 0; i < length; i++) 153 { 154 text += "["; 155 text += player.inventory[i]; 156 text += "] "; 157 } 158 159 display.inventory(text); 160 } 161
162 function checkGameOver() 163 { 164 return player.itemsLeftToFix === 0; 165 } 166
167 function alertGameWon() 168 { 169 var text = "Congratulations, " + player.name +"! "; 170 text += "You fixed everything in the house! "; 171 text += "You should be proud of yourself! "; 172 text += "You finished the game with a score of "; 173 text += player.score + " points! "; 174 text += "Play again soon!"; 175 display.info(text); 176 display.image(houseImages.outside); 177 } 178
179 function checkPlayAgain() 180 { 181 //create the replay button 182 var buttons = "<button id='replay' onclick='startGame()'>Replay Game</button>"; 183 184 //optional: add a second 'leave game' button 185 var url = "http://coding.stephenjwolf.com"; 186 buttons += "<a href='" + url + "' target='_blank'><button id='leave'>Learn to Code</button></a>"; 187 188 display.navigation(buttons); 189 } 190
191 function createNavigationButtons(player) 192 { 193 var buttons = "<h3>Navigation</h3>"; 194 var toggle = false; 195 196 for (var exit in player.currentRoom.exits) 197 { 198 var button = "<button id='" + exit + "' "; 199 200 if (toggle) //add 'even' class to every other button 201 { 202 button += "class='even' "; 203 } 204 toggle = !toggle; //flip the toggle switch 205 206 button += "onclick='movePlayer(this.id)'>"; 207 208 button += exit; 209 //option: replace above line with this to show room names 210 //button += player.currentRoom.exits[exit]; 211 212 button += "</button>"; 213 buttons += button; //add to buttons string 214 } 215 display.navigation(buttons); 216 } 217
218 function getDisplay() 219 { 220 var display = 221 {
222 info: function (text) 223 { 224 var element = document.getElementById("info"); 225 element.innerHTML = text; 226 }, 227
228 found: function (text) 229 { 230 var element = document.getElementById("found"); 231 element.innerHTML = text; 232 }, 233
234 broken: function (text) 235 { 236 var element = document.getElementById("broken"); 237 element.innerHTML = text; 238 }, 239
240 navigation: function (text) 241 { 242 var element = document.getElementById("navigation"); 243 element.innerHTML = text; 244 }, 245
246 gameTitle: function (text) 247 { 248 var element = document.getElementById("gameTitle"); 249 element.innerHTML = text; 250 }, 251
252 inventory: function (text) 253 { 254 var element = document.getElementById("inventory"); 255 element.innerHTML = text; 256 },
257 score: function (clear) //this is a little different 258 { 259 var element = document.getElementById("score"); 260 261 if (clear) //lets us clear the box 262 { 263 element.innerHTML = ""; 264 return; 265 } 266 player.score = Math.max(0, player.score); 267 element.innerHTML = "Score: " + player.score; 268 269 //if there is a maxScore tally, then show the max 270 if (player.maxScore > 0) 271 { 272 element.innerHTML += " / Max: " + player.maxScore; 273 } 274 },
275 description: function (room) 276 { 277 var element = document.getElementById("description"); 278 279 if (!room) 280 { 281 element.innerHTML = ""; 282 return; 283 } 284 285 var innerHTML = "<h3>You are in the "; 286 innerHTML += room.name + ".</h3>"; 287 innerHTML += "<p>" + room.description + "</p>"; 288 element.innerHTML = innerHTML; 289 },
290 image: function (source) 291 { 292 //if no image exists, set up a blank one 293 if (!source) 294 { 295 source = {src: "", caption: ""}; 296 } 297 298 document.getElementById("image").src = source.src; 299 300 //set up the caption 301 var cap = source.caption; 302 303 //if image has a link, include it with the caption 304 if (source.link) 305 { 306 cap += "<br><a target='_blank' "; 307 cap += "href='" + source.link + "'>"; 308 cap += source.linkInfo + "</a>"; 309 } 310 document.getElementById("caption").innerHTML = cap; 311 },
312 clear: function ()
313 { 314 this.info(""); 315 this.found(""); 316 this.broken(""); 317 this.navigation(""); 318 this.inventory(""); 319 this.image(); 320 this.description(); 321 this.score(true); 322 } 323 }; 324 return display; 325 } 326
327 function getRooms() 328 { 329 var livingRoom = 330 { 331 name: "living room", 332 brokenThing: "fireplace screen", 333 description: "A cozy room with a fireplace.", 334 fixWith: "new wire", 335 points: 25, 336 itemFound: "batteries", 337 exits: 338 { 339 north: "dining room", 340 east: "hallway" 341 }, 342 image: 343 { 344 src: "http://coding.stephenjwolf.com/roomadventure/roomimages/livingroom.jpg", 345 caption: "Photo by Outsite Co", 346 link: "https://unsplash.com/photos/R-LK3sqLiBw", 347 linkInfo: "Courtesy: unsplash.com" 348 } 349 }; 350 351 var diningRoom = 352 { 353 name: "dining room", 354 description: "A great place to enjoy a meal.", 355 brokenThing: "chandelier", 356 fixWith: "light bulb", 357 points: 15, 358 itemFound: "new wire", 359 exits: 360 { 361 south: "living room", 362 east: "kitchen" 363 }, 364 image: 365 { 366 src: "http://coding.stephenjwolf.com/roomadventure/roomimages/diningroom.jpg", 367 caption: "Photo by Erick Lee Hodge", 368 link: "https://unsplash.com/photos/el_V6z_h5nA", 369 linkInfo: "Courtesy: unsplash.com" 370 } 371 }; 372 373 var kitchen = 374 { 375 name: "kitchen", 376 description: "It needs a little attention, but the kitchen has everything you need to have a snack or host a huge party.", 377 brokenThing: "faucet", 378 fixWith: "wrench", 379 points: 35, 380 itemFound: "package with color ink", 381 exits: 382 { 383 south: "hallway", 384 east: "pantry", 385 west: "dining room" 386 }, 387 image: 388 { 389 src: "http://coding.stephenjwolf.com/roomadventure/roomimages/kitchen.jpg", 390 caption: "Photo by Paul", 391 link: "https://unsplash.com/photos/w2DsS-ZAP4U", 392 linkInfo: "Courtesy: unsplash.com" 393 } 394 }; 395 396 var hallway = 397 { 398 name: "hallway", 399 description: "The hallway helps make the house feel grand, though the old carpet curls up and it's easy to trip over.", 400 brokenThing: "rug", 401 fixWith: "special carpet tape", 402 points: 45, 403 itemFound: "light bulb", 404 exits: 405 { 406 north: "kitchen", 407 south: "basement", 408 east: "office", 409 west: "living room", 410 northeast: "bathroom", 411 southeast: "den" 412 }, 413 image: 414 { 415 src: "http://coding.stephenjwolf.com/roomadventure/roomimages/hallway.jpg", 416 caption: "Photo by runnyrem", 417 link: "https://unsplash.com/photos/LfqmND-hym8", 418 linkInfo: "Courtesy: unsplash.com" 419 } 420 }; 421 422 var bathroom = 423 { 424 name: "bathroom", 425 description: "You take pride in your pristine bathroom. It's a relaxing place to take care of necessities.", 426 brokenThing: "mirror", 427 fixWith: "new mirror", 428 points: 20, 429 itemFound: "screwdriver", 430 exits: 431 { 432 southwest: "hallway" 433 }, 434 image: 435 { 436 src: "http://coding.stephenjwolf.com/roomadventure/roomimages/bathroom.jpg", 437 caption: "Photo by Logan Ripley", 438 link: "https://unsplash.com/photos/w8UQkjQ_bS4", 439 linkInfo: "Courtesy: unsplash.com" 440 } 441 }; 442 443 var office = 444 { 445 name: "office", 446 description: "This place is a mess. It's a wonder you ever get any work done in here.", 447 brokenThing: "color printer", 448 fixWith: "package with color ink", 449 points: 40, 450 itemFound: "garbage bag", 451 exits: 452 { 453 west: "hallway" 454 }, 455 image: 456 { 457 src: "http://coding.stephenjwolf.com/roomadventure/roomimages/office.jpg", 458 caption: "Photo by Annie Spratt", 459 link: "https://unsplash.com/photos/FSFfEQkd1sc", 460 linkInfo: "Courtesy: unsplash.com" 461 } 462 }; 463 464 var basement = 465 { 466 name: "basement", 467 description: "You hide your eyes behind your hands so you don't have to see everything that's out of place down here.", 468 brokenThing: "door hinge", 469 fixWith: "screwdriver", 470 points: 30, 471 itemFound: "catnip", 472 exits: 473 { 474 north: "hallway" 475 }, 476 image: 477 { 478 src: "http://coding.stephenjwolf.com/roomadventure/roomimages/basement.jpg", 479 caption: "Photo by S W", 480 link: "https://unsplash.com/photos/mNWsZDYUCFs", 481 linkInfo: "Courtesy: unsplash.com" 482 } 483 }; 484 485 var den = 486 { 487 name: "den", 488 description: "The den is a comfortable spot to watch TV and catch up on the latest movies.", 489 brokenThing: "TV remote", 490 fixWith: "batteries", 491 points: 10, 492 itemFound: "wrench", 493 exits: 494 { 495 northwest: "hallway", 496 south: "cat den" 497 }, 498 image: 499 { 500 src: "http://coding.stephenjwolf.com/roomadventure/roomimages/den.jpg", 501 caption: "Photo by Daniel Barnes", 502 link: "https://unsplash.com/photos/z0VlomRXxE8", 503 linkInfo: "Courtesy: unsplash.com" 504 } 505 }; 506 507 var catDen = 508 { 509 name: "cat den", 510 description: "An offshoot of another room, the cat den is a place the cats come to play, nap, and meow merrily.", 511 brokenThing: "cat toy", 512 fixWith: "catnip", 513 points: 100, 514 itemFound: "new mirror", 515 exits: 516 { 517 north: "den" 518 }, 519 image: 520 { 521 src: "http://coding.stephenjwolf.com/roomadventure/roomimages/catden.jpg", 522 caption: "Photo by Jonathan Fink", 523 link: "https://unsplash.com/photos/Sa1z1pEzjPI", 524 linkInfo: "Courtesy: unsplash.com" 525 } 526 }; 527 528 var pantry = 529 { 530 name: "pantry", 531 description: "You have all shelves organized so you can find the food supplies you need.", 532 brokenThing: "box of spaghetti", 533 fixWith: "garbage bag", 534 points: 15, 535 itemFound: "special carpet tape", 536 exits: 537 { 538 west: "kitchen" 539 }, 540 image: 541 { 542 src: "http://coding.stephenjwolf.com/roomadventure/roomimages/pantry.jpg", 543 caption: "Photo by Annie Spratt", 544 link: "https://unsplash.com/photos/SvBnIWiLbcQ", 545 linkInfo: "Courtesy: unsplash.com" 546 } 547 }; 548 549 var rooms = {}; 550 rooms[livingRoom.name] = livingRoom; 551 rooms[diningRoom.name] = diningRoom; 552 rooms[kitchen.name] = kitchen; 553 rooms[hallway.name] = hallway; 554 rooms[bathroom.name] = bathroom; 555 rooms[office.name] = office; 556 rooms[basement.name] = basement; 557 rooms[den.name] = den; 558 rooms[catDen.name] = catDen; 559 rooms[pantry.name] = pantry; 560 561 return rooms; 562 } 563