Browse Source

Initial commit

main
Jo Jerrica Decker 7 years ago
parent
commit
fdc84292cd
  1. 53
      CSS/AllPages.css
  2. 74
      CSS/EndLayout.css
  3. 157
      CSS/GameLayout.css
  4. 28
      CSS/IntroLayout.css
  5. 24
      EndPage.html
  6. 61
      FrontPage.html
  7. 29
      Game.html
  8. BIN
      Images/BannerBG.png
  9. BIN
      Images/EndBGDarkRed.png
  10. BIN
      Images/EndBGRed.png
  11. BIN
      Images/FeedbackBG.png
  12. BIN
      Images/Logo.png
  13. BIN
      Images/Logo.xcf
  14. BIN
      Images/LogoBG.png
  15. BIN
      Images/MapBG.png
  16. BIN
      Images/ScoreBGLeft.png
  17. BIN
      Images/ScoreBGRight.png
  18. BIN
      Images/SuspectBG.png
  19. 376
      JS/Clues.js
  20. 52
      JS/Endings.js
  21. 4
      JS/FrontPage.js
  22. 203
      JS/GamePage.js
  23. 96
      JS/Rooms.js
  24. BIN
      Planning/Design Document - Javascript Arrays.docx
  25. BIN
      Planning/Design Document - Layout and Formatting.docx
  26. BIN
      Planning/Design Document - Pseudocode.docx
  27. BIN
      Planning/Evaluation.docx
  28. BIN
      Planning/Layouts.xlsx
  29. BIN
      Planning/Solution.docx
  30. BIN
      Planning/Testing.xlsx

53
CSS/AllPages.css

@ -0,0 +1,53 @@
body
{
font-family: "Lucida Console", "Courier New", Courier, Arial, sans-serif;
}
h1
{
margin-top: 10px;
margin-right: 10px;
text-align: right;
font-size: 48pt;
color: darkred;
}
h2
{
text-align: right;
margin-top: -65px;
margin-right: 10px;
font-size: 14pt;
color: grey;
}
h2.Light
{
color: lightgrey;
}
h3
{
background-color: grey;
color: white;
}
p
{
margin-left: 10px;
margin-right: 10px;
color: white;
}
p.Story
{
text-indent: 40px;
}
input
{
background-color: black;
color: white;
border-style: none;
font-family: "Lucida Console", "Courier New", Courier, Arial, sans-serif;
}

74
CSS/EndLayout.css

@ -0,0 +1,74 @@
#Container
{
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
background-color: black;
}
#ContentPane
{
position: absolute;
left: 200px;
top: 20px;
width: 600px;
height:580px;
overflow-y: auto;
background-image: url("../Images/EndBGRed.png");
background-size: 100% 99px;
color: black;
}
#ScoreContainer
{
position: absolute;
left: 200px;
bottom: 20px;
width: 600px;
height: 180px;
background-image: url("../Images/EndBGDarkRed.png");
background-size: 100% 99px;
color: black;
}
#ScoreHeader
{
position: absolute;
right: 300px;
top: 65px;
width: 100px;
height: 50px;
font-size: 18pt;
background-image: url("../Images/ScoreBGLeft.png");
background-size: 100%;
color: white;
text-align: right;
}
#ScoreCounter
{
position: absolute;
left: 300px;
top: 65px;
width: 100px;
height: 50px;
font-size: 42pt;
background-image: url("../Images/ScoreBGRight.png");
background-size: 100%;
color: white;
}
#ExitButton
{
position: absolute;
bottom: 0px;
left: 0px;
right: 0px;
margin-left: 0px;
margin-right: 0px;
height: 20px;
background-image: url("../Images/EndBGRed.png");
background-size: 100% 99px;
}

157
CSS/GameLayout.css

@ -0,0 +1,157 @@
#Container
{
position: absolute;
left: 0px;
top: 0px;
width: 1000px;
height: 800px;
background-color: black;
}
#Logo
{
position: absolute;
left: 0px;
top: 0px;
width: 100px;
height: 100px;
background-image: url("../Images/LogoBG.png");
}
#Banner
{
position: absolute;
right: 0px;
top: 0px;
width: 900px;
height: 100px;
background-image: url("../Images/BannerBG.png");
}
#FeedbackArea
{
position: absolute;
left: 0px;
top: 100px;
width: 700px;
height: 400px;
overflow-y: auto;
background-image: url("../Images/FeedbackBG.png");
color: white;
}
#NotepadArea
{
position: absolute;
right: 0px;
top: 100px;
width: 300px;
height: 400px;
font-family: "Lucida Console", "Courier New", Courier, Arial, sans-serif;
background-color: white;
}
/* This section shows a map of the area in boxes */
#MapArea
{
position: absolute;
left: 0px;
bottom: 0px;
width: 700px;
height: 300px;
background-image: url("../Images/MapBG.png");
}
.MapRoomUnvisited
{
background-color: darkgreen;
border: 1px solid limegreen;
}
.MapRoomVisited
{
background-color: limegreen;
border: 1px solid darkgreen;
}
.MapRoomVisited:hover
{
background-color: red;
cursor: pointer;
}
#SuspectArea
{
position: absolute;
right: 0px;
bottom: 0px;
width: 300px;
height: 300px;
text-align: center;
background-image: url("../Images/SuspectBG.png");
color: white;
}
/* Links to each individual room */
.RoomLink
{
background-color: limegreen;
color: black;
}
.RoomLink:hover
{
background-color: red;
color: black;
cursor: pointer;
}
/* Links to each individual clue */
.ClueLink
{
background-color: darkblue;
}
.ClueLink:hover
{
background-color: red;
color: black;
cursor: pointer;
}
.AnswerLink
{
color: white;
cursor: pointer;
}
.AnswerLink:hover
{
color: red;
cursor: pointer;
}
.CorrectAnswer
{
background-color: limegreen;
color: black;
}
.WrongAnswer
{
background-color: red;
color: black;
}
.Inform
{
background-color: black;
color: white;
}
img.LogoImage
{
margin: 15px;
}

28
CSS/IntroLayout.css

@ -0,0 +1,28 @@
#Container
{
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
background-color: black;
}
#ContentPane
{
position: absolute;
bottom: 0px;
top: 0px;
left: 0px;
right: 0px;
margin-top: 20px;
margin-bottom: 20px;
margin-left: 200px;
margin-right: 200px;
width: auto;
min-width: 400px;
height: auto;
overflow-y: auto;
background-image: url("../Images/EndBGRed.png");
background-size: 100% 99px;
}

24
EndPage.html

@ -0,0 +1,24 @@
<html>
<head>
<title>Revenge for the Nerd</title>
<link rel = "stylesheet" href = "CSS/EndLayout.css">
<link rel = "stylesheet" href = "CSS/AllPages.css">
<script type = "text/javascript" src = "JS/Endings.js"></script>
</head>
<body onLoad = "GetEnding()">
<div id = "Container">
<div id = "ContentPane"></div>
<div id = "ScoreContainer">
<div id = "ScoreHeader">FINAL SCORE</div>
<div id = "ScoreCounter">0</div>
<div id = "ExitButton">
<center>
<input type = 'Button' name = 'btnAnswer' value = 'There is nothing more to see here. Click to leave.' onClick = 'window.close()'>
</center>
</div>
</div>
</div>
</body>
</html>

61
FrontPage.html

@ -0,0 +1,61 @@
<html>
<head>
<title>Photo Finished | A Case for Bear</title>
<link rel = "stylesheet" href = "CSS/IntroLayout.css">
<link rel = "stylesheet" href = "CSS/AllPages.css">
<script type = "text/javascript" src = "JS/FrontPage.js"></script>
</head>
<body>
<div id = "Container">
<div id = "ContentPane">
<h1>Photo Finished</h1>
<h2 class = "Light">A Case for Bear</h2>
<h3>The Setting</h3>
<p class = "Story">The village of Littleden sits in the middle of nowhere. A quiet place, some would like to proclaim, on the English coast, more than half an hour’s drive away from all the troubles of the city. Too quiet, others would say, save for the odd case of vandalism or other youth crime. On rare occasions, however, a more serious crime occurs. A robbery, a murder, maybe an arson, but such crimes are so rare that the local police’s senses seem to have dulled somewhat, if they were even there to begin with.<p>
<h3>Bear</h3>
<p class = "Story">One of the newer arrivals to Littleden. Not a great deal is known about her, other than she was a city girl from the other end of the country, and that she is never seen without the steel gauntlet on her left hand.</p>
<p class = "Story">When she came to the village, Bear’s first order of business, to everyone’s surprise, was to open a gym. Despite the perceived lack of demand, the business has done well for itself, in part thanks to events and youth programs of her devising that have helped to reduce the crime rate. For that, many applaud her, while those less trusting of her are willing to merely tolerate her. For now.</p>
<p class = "Story">As the gym’s proprietor, there’s no mistaking that Bear works out. What takes people by surprise when they first meet her, however, is that although she likes to keep her body in peak condition, she keeps her mind sharp as well. This has been a boon in solving many of the village’s more complex cases, such that she is often called upon when the police are stumped. Usually the majority of the time.</p>
<h3>The Incident</h3>
<p class = "Story">It is Sunday. It is a day of gray skies and torrential rain. Despite the horrible weather, Bear is visiting a friend’s house on the other side of the village when a ear-splitting scream pierces the air. She steps outside to investigate and traces the screams to a single-storey house next door. She bangs on the door, which is answered by a tearful young woman who doesn’t appear much older than 25. She’s quick to tell Bear that there’s been a murder.</p>
<p class = "Story">The girl steps aside in at Bear’s request and she enters the house. Noticing the broken window in the dining room, she approaches for closer inspection and finds the victim on the floor, staring at the ceiling with lifeless eyes. Bear recognises his face: Darren Perceptor, a semi-popular photoblogger that she had been following of late. He won’t be looking at much any more.</p>
<p class = "Story">A deafening thunderclap goes right through Bear. She decides to step away and speak to the girl again. She is joined by another girl, almost identical to the first aside from the hair. One had her artificially red hair bunched up and fanned out at the back like a peacock’s tail while the other girl kept her flowing blue locks loose. Bear offers to take them to her friend’s house, both to shelter them from the storm and to keep them both away from the scene of the crime until the police arrive. Along the way, the red-haired girl introduces herself as Hephaesta and her twin sister Poseida. Bear chooses not to question their names.</p>
<p class = "Story">Once inside, Bear’s friend informs her that the one road leading up to the estate has been blocked. That last lightning strike had felled a tree that subsequently blocked the road right in front of the police car heading here. It could be some time before they can even get here.</p>
<p class = "Story">She asks the sisters their side of the story over fresh cups of tea. Hephaesta tells her that she was taking a shower when she heard her sister’s scream. Poseida, meanwhile, claims that she was asleep in her room when the murder took place and that the sound of breaking glass and the thud that followed prompted her to check on Darren, who was working on a personal project at the time.</p>
<p class = "Story">Bear finishes her drink and excuses herself to check on the status of that roadblock. She heads out into the kitchen and quietly exits out of the back door. Her friend catches her vaulting the waist-high wall between the two houses and enquires as to what she’s playing at.
'Something’s a little off here,' Bear answers, trusting her friend not to mention any of what she tells her. 'And I think it might be wise to look into this as soon as anyone can.'</p>
<p class = "Story">'Hold up.' Her friend protests. 'You make a rule of waiting until the police ask for you.'</p>
<p class = "Story">Bear nods in agreement. 'This is looking like one of those rare exceptions. Don't worry about it, the chief owes me big time, so it should be worth the gamble. Keep those two busy for me, will you?' Without waiting for an answer, she turns to the house and makes her way to the back door, which leads directly into the dining room.</p>
<h3>HOW TO PLAY</h3>
<p class = "Story">Each room has a number of clues, highlighted in blue. Click these to investigate them. Connected rooms are shown in green. Click these to travel to another room.</p>
<p class = "Story">Some clues offer a question. Answer questions correctly to increase your score.</p>
<p class = "Story">You can travel directly to other rooms without having to go through the rooms in between by clicking them on the map, but only if they have already been visited at least once</p>
<p class = "Story">Once all clues have been investigated, you must decide who to accuse. You can choose either sister, neither or both. But choose wisely.</p>
<center><input type = "Button" name = "btnAnswer" value = "Let's get on with it, then..." onClick = "OpenGameWindow()"></center>
</div>
</div>
</body>
</html>

29
Game.html

@ -0,0 +1,29 @@
<html>
<head>
<title>Bear: Photo Finished</title>
<link rel = "stylesheet" href = "CSS/AllPages.css">
<link rel = "stylesheet" href = "CSS/GameLayout.css">
<script type = "text/javascript" src = "JS/Rooms.js"></script>
<script type = "text/javascript" src = "JS/Clues.js"></script>
<script type = "text/javascript" src = "JS/GamePage.js"></script>
</head>
<body onLoad="InitialisePage()">
<div id = "Container">
<div id = "Logo">
<img class = "LogoImage" src = "Images/Logo.png">
</div>
<div id = "Banner">
<h1>Photo Finished</h1>
<h2>A Case for Bear<h2>
</div>
<div id = "FeedbackArea"></div>
<textarea id = "NotepadArea">Use this to note down anything you find in case you forget it.</textarea>
<div id = "MapArea"></div>
<div id = "SuspectArea"></div>
</div>
</body>
</html>

BIN
Images/BannerBG.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

BIN
Images/EndBGDarkRed.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.0 KiB

BIN
Images/EndBGRed.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.6 KiB

BIN
Images/FeedbackBG.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 39 KiB

BIN
Images/Logo.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.3 KiB

BIN
Images/Logo.xcf

Binary file not shown.

BIN
Images/LogoBG.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

BIN
Images/MapBG.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

BIN
Images/ScoreBGLeft.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 695 B

BIN
Images/ScoreBGRight.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 563 B

BIN
Images/SuspectBG.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

376
JS/Clues.js

@ -0,0 +1,376 @@
// Create a 2-dimensional array of 27 indices (including 0) with an additional 10 indices within each one (likewise) to represent each room
// Data types:
// 0: Clue Name
// 1: Location of the clue (room number to return to)
// 2: Description of the clue
// 3: Question
// 4: Answer A
// 5: Answer B
// 6: Answer C
// 7: Correct Answer (A, B or C)
// 8: Explanation for why the correct answer was so (even if you got it wrong, it will show this anyway)
// 9: Investigated flag (switches to 1 once investigated, regardless of whether you answered correctly)
var Clue = new Array(26);
for (var i = 0; i < 27; i++)
{
Clue[i] = new Array(9);
}
// Living Room
// Sofa
Clue[0][0] = "Sofa";
Clue[0][1] = 0;
Clue[0][2] = "<p>Bear examines the sofa closely, running her hand along every gap and under the seat itself. She finds nothing but dust.</p>";
Clue[0][3] = "";
Clue[0][4] = "";
Clue[0][5] = "";
Clue[0][6] = "";
Clue[0][7] = 0;
Clue[0][8] = "";
Clue[0][9] = 0;
// Chair
Clue[1][0] = "Chair";
Clue[1][1] = 0;
Clue[1][2] = "<p>Bear examines the chair closely, running her hand along every gap and under the seat itself. She finds nothing but dust.</p>";
Clue[1][3] = "";
Clue[1][4] = "";
Clue[1][5] = "";
Clue[1][6] = "";
Clue[1][7] = 0;
Clue[1][8] = "";
Clue[1][9] = 0;
// Bookshelf
Clue[2][0] = "Bookshelf";
Clue[2][1] = 0;
Clue[2][2] = "<p>Bear examines the bookshelf to the best of her abilities, but the masses of paperback educational books, stacked together in haphazard fashion lead her to decide against moving a single one. Chances are, the whole thing will collapse like a poorly-assembled Jenga tower.</p>"
+ "<p>She backs away from the bookshelf.</p>";
Clue[2][3] = "";
Clue[2][4] = "";
Clue[2][5] = "";
Clue[2][6] = "";
Clue[2][7] = 0;
Clue[2][8] = "";
Clue[2][9] = 0;
// Television
Clue[3][0] = "Television";
Clue[3][1] = 0;
Clue[3][2] = "<p>Bear examines the television, finding nothing out of the ordinary on the surface. She then turns her attention to the underside of the table holding it, where she soon notices what little light manages to get there reflecting of something in the shadow. She brings herself back to her feet and carefully pushes the TV to one side, revealing two small metallic cylinders on the floor.</p>"
+ "<p>Bear reaches down to carefully pick up one of the cylinders with the claws of her gauntlet and examines it closely. It is open and vacant at one end, while the other is closed. At the closed end of the object is a silvery circle embedded in the middle, and a noticeable dent can be seen in it.<p>"
Clue[3][3] = "<p>What is it?</p>";
Clue[3][4] = "Discarded jewellery";
Clue[3][5] = "The spent casing of a bullet";
Clue[3][6] = "A piece of the TV stand, broken off without anyone’s notice";
Clue[3][7] = 2;
Clue[3][8] = "<p>Bear is quick to realise that she is holding in her hand the spent casing of a bullet. The actual weapon that fired it cannot be far, she hazards. If the culprit was in such a hurry to hide these, though, then the actual weapon used to fire them cannot be far away.</p>";
Clue[3][9] = 0;
// Kitchen
// Sink
Clue[4][0] = "Sink";
Clue[4][1] = 1;
Clue[4][2] = "<p>Bear looks with disdain around the sink and within the cupboards beneath it. All she can find is the realisation that any amount of elbow grease will be wasted on this thing.</p>";
Clue[4][3] = "";
Clue[4][4] = "";
Clue[4][5] = "";
Clue[4][6] = "";
Clue[4][7] = 0;
Clue[4][8] = "";
Clue[4][9] = 0;
// Fridge
Clue[5][0] = "Fridge";
Clue[5][1] = 1;
Clue[5][2] = "<p>Bear checks the fridge. Much to her surprise, it is not as empty as she was led to believe. However, the contents are few: a few bottles of supermarket-brand cola, an out-of-date bottle of milk, some leftover noodles and not much else.</p>"
+ "<p>She closes the door and moves on.</p>";
Clue[5][3] = "";
Clue[5][4] = "";
Clue[5][5] = "";
Clue[5][6] = "";
Clue[5][7] = 0;
Clue[5][8] = "";
Clue[5][9] = 0;
// Rubbish Bin
Clue[6][0] = "Rubbish Bin";
Clue[6][1] = 1;
Clue[6][2] = "<p>Bear lifts the lid of the bin up carefully using her gauntlet. It seems empty. Erring on the side of caution, she kicks the bin lightly, listens, and repeats a few more times. Nothing.</p>"
+ "<p>She closes the lid and pulls a pack of antiseptic wipes and a plastic bag from her left coat pocket. She uses one to wipe her gauntlet, slips it into the bag, which then goes into an opposite pocket. She will throw that bag into the first available bin when she leaves.</p>";
Clue[6][3] = "";
Clue[6][4] = "";
Clue[6][5] = "";
Clue[6][6] = "";
Clue[6][7] = 0;
Clue[6][8] = "";
Clue[6][9] = 0;
// Study
// Darren Perceptor
Clue[7][0] = "Darren Perceptor";
Clue[7][1] = 2;
Clue[7][2] = "<p>Bear crouches down to the lifeless body of Darren Perceptor. She immediately decides there’s not much to gain from him at this point. A coroner’s line of expertise is required here, and Bear is no coroner. She doesn’t dare interfere with the body in any way whatsoever.</p>"
+ "<p>She leaves him as is, though it pains her to do so.</p>";
Clue[7][3] = "";
Clue[7][4] = "";
Clue[7][5] = "";
Clue[7][6] = "";
Clue[7][7] = 0;
Clue[7][8] = "";
Clue[7][9] = 0;
// Monitor
Clue[8][0] = "Monitor";
Clue[8][1] = 2;
Clue[8][2] = "<p>Bear inspects the monitor. The display is beyond repair, due in no small part to the hole driven right into the screen by the fatal bullet. The light from the window reveals that the bullet is still lodged firmly inside, perhaps due to being stopped by a metal plate. Possibly the bracket attaching it to the stand, she guesses. Bear wonders why it’s still there, but figures it’s lodged in too well.<p>"
+ "<p>She does, however, note the path of the bullet, seems to have been slightly downward. Beyond that, there is not much else to glean from the broken display.</p>"
+ "<p>She steps away and turns her attention elsewhere.</p>";
Clue[8][3] = "";
Clue[8][4] = "";
Clue[8][5] = "";
Clue[8][6] = "";
Clue[8][7] = 0;
Clue[8][8] = "";
Clue[8][9] = 0;
// Window
Clue[9][0] = "Window";
Clue[9][1] = 2;
Clue[9][2] = "<p>Bear steps over to the window to inspect the damage to it. The hole and the labyrinth of cracks formed between it and the window’s edge is consistent with a bullet passing through it, but despite this she feels something is off.</p>"
+ "<p>The house is at one of the highest points in the village, and there is very little outside that could be considered higher or even level with the window, not even a tree, giving this room a view of the coast barely obstructed by the rest of the village.</p>";
Clue[9][3] = "<p>Something is definitely wrong with this picture, but what? (HINT: You may want to have a look at other clues in this room before deciding on an answer)</p>";
Clue[9][4] = "Nothing at all! Bear is just being paranoid";
Clue[9][5] = "Any shot from outside would have most certainly missed";
Clue[9][6] = "Any shot from outside would have to have been on an ascending trajectory";
Clue[9][7] = 3;
Clue[9][8] = "<p>The monitor - and, of course, Darren - was struck by a bullet on the descent. Heading toward the ground. There are no real vantage points directly outside the window that could grant that kind of shot at all. That didn't rule out the possibility of hitting Darren with an outside shot, however, any vantage point could only offer an ascending trajectory of such a shot.</p>";
Clue[9][9] = 0;
// Glass on the floor
Clue[10][0] = "Glass on the floor";
Clue[10][1] = 2;
Clue[10][2] = "<p>Bear crouches to inspect the fragments glass on the hardwood floor below the window. She notices that the very few and very tiny fragments are close to the wall.</p>";
Clue[10][3] = "<p>This doesn't make sense. Why is that?</p>";
Clue[10][4] = "Anything passing through the window from the outside would have left more shards. And possibly larger";
Clue[10][5] = "There shouldn't be any glass there at all";
Clue[10][6] = "It makes perfect sense, actually";
Clue[10][7] = 1;
Clue[10][8] = "<p>Bear glances up at the hole in the window and back at the fragments on the floor. Any object passing through a pane of glass - even a small bullet - should throw quite a few fragments into the general direction of the object's path, in this case, into the room. There should be far more pieces of broken glass here than the few tiny crystals at Bear's feet. Bear suspects that the hole was created from the inside.</p>";
Clue[10][9] = 0;
// Computer
Clue[11][0] = "Computer";
Clue[11][1] = 2;
Clue[11][2] = "<p>Bear crouches down to get a good look at the computer. A high-end gaming PC, she notes, a self-build, possibly. One of the side panels has been removed, but this may not be out of the ordinary. The victim may have been tinkering with it just moments before his untimely death.</p>"
+ "<p>She inspects the system a little closer and finds that the hard drive is missing. A quick look around reveals no sign of such a component either.</p>"
+ "<p>Bear gets up and backs away.</p>";
Clue[11][3] = "";
Clue[11][4] = "";
Clue[11][5] = "";
Clue[11][6] = "";
Clue[11][7] = 0;
Clue[11][8] = "";
Clue[11][9] = 0;
// Bathroom
// Bathtub
Clue[12][0] = "Bathtub";
Clue[12][1] = 3;
Clue[12][2] = "<p>Bear inspects the bathtub, catching the a lingering scent of cream cleaner as she approaches. She notes that the bathtub is squeaky clean and showing barely any trace of recent use.</p>";
Clue[12][3] = "";
Clue[12][4] = "";
Clue[12][5] = "";
Clue[12][6] = "";
Clue[12][7] = 0;
Clue[12][8] = "";
Clue[12][9] = 0;
// Toilet
Clue[13][0] = "Toilet";
Clue[13][1] = 3;
Clue[13][2] = "<p>Bear glances at the toilet. It’s been cleaned recently, by whom she can’t say.</p>"
+ "<p>She decides that there’s not much to glean from it and steps away.</p>";
Clue[13][3] = "";
Clue[13][4] = "";
Clue[13][5] = "";
Clue[13][6] = "";
Clue[13][7] = 0;
Clue[13][8] = "";
Clue[13][9] = 0;
// Sink
Clue[14][0] = "Sink";
Clue[14][1] = 3;
Clue[14][2] = "<p>Bear inspects the sink and finds that it has been cleaned recently. Beside the single-handled chrome tap lies two soap dishes with a fresh bar in each. One has the initial 'P' carved into it while the other bears an 'H'. Above them, a partially-used soap-on-a-rope hangs from a poorly-installed adhesive hook that’s on the verge of falling off. She assumes that this soap belonged to Darren.</p>"
+ "<p>Bear finds nothing of note and backs away.</p>";
Clue[14][3] = "";
Clue[14][4] = "";
Clue[14][5] = "";
Clue[14][6] = "";
Clue[14][7] = 0;
Clue[14][8] = "";
Clue[14][9] = 0;
// Humidity
Clue[15][0] = "Humidity";
Clue[15][1] = 3;
Clue[15][2] = "<p>Bear notices the lack of humidity in the bathroom. The air is as clear as day and there are no signs of condensation on the window.</p>";
Clue[15][3] = "<p>Why does that sound strange?</p>";
Clue[15][4] = "It doesn't";
Clue[15][5] = "Didn't Hephaesta say she was in the shower when the murder took place?";
Clue[15][6] = "Shouldn't Hephaesta have opened that window?";
Clue[15][7] = 2;
Clue[15][8] = "<p>Hephaesta claimed that she was in the shower at the time of Darren's murder and only knew of the incident from her sister's screaming. The exact same screaming that drew Bear to the house. There hasn't been enough time for any resulting steam and condensation to clear. Not for a couple of hours anyway.</p>";
Clue[15][9] = 0;
// Darren's Room
// Bedside Table
Clue[16][0] = "Bedside Table";
Clue[16][1] = 4;
Clue[16][2] = "<p>Bear checks out the bedside table. A single tall tumbler - used - sticks out like a sore thumb against the otherwise immaculate condition the bedroom has been left in. However, she realises that this may still fit with the culprit’s account of the victim often dozing off at the study desk. It may have been left there after the last attempt to clean the room, perhaps.</p>"
+ "<p>She opens the door on the table and peeks in. Among the piles of CDs and books lies a single USB flash drive. She picks it up carefully with her gauntlet and pops it into her tablet. None of the files make sense to her, but she recognises the file extensions from a prior case. It’s program code for something, or at least part of that something. For what, she can’t say.</p>"
+ "<p>She removes the stick and places it back into the beside table, then closes the door.</p>";
Clue[16][3] = "";
Clue[16][4] = "";
Clue[16][5] = "";
Clue[16][6] = "";
Clue[16][7] = 0;
Clue[16][8] = "";
Clue[16][9] = 0;
// Bed
Clue[17][0] = "Bed";
Clue[17][1] = 4;
Clue[17][2] = "<p>Bear looks at the bed. It has been made with a careful hand, with nary a single crease to be seen. This doesn’t appear out of the ordinary given the state of the room and the claim from the culprit that he often worked will into the night on projects and fell asleep at the desk.</p>"
+ "<p>She checks beneath, and find it surprisingly bereft of anything, with the exception of a single dismantled toy laptop. Pink, with the branding of a popular line of dolls. She decides there and then to think no more on that matter.</p>"
+ "<p>She brings herself to her feet again and steps away.</p>";
Clue[17][3] = "";
Clue[17][4] = "";
Clue[17][5] = "";
Clue[17][6] = "";
Clue[17][7] = 0;
Clue[17][8] = "";
Clue[17][9] = 0;
// Wardrobe
Clue[18][0] = "Wardrobe";
Clue[18][1] = 4;
Clue[18][2] = "<p>Bear checks the wardrobe. She checks inside and, barring more skinny-fit jeans than can last a month and several sneakers, finds nothing of note. Aside from a couple of family photographs in cheap supermarket picture frames, the top of the connected chest of drawers is otherwise clear.</p>"
+ "<p>She checks the drawers, finding nothing more than clothes, including several merchandise t-shirts for bands she couldn’t hope to pronounce without accidentally insulting someone.</p>"
+ "<p>She closes the drawers and the door and looks elsewhere.</p>";
Clue[18][3] = "";
Clue[18][4] = "";
Clue[18][5] = "";
Clue[18][6] = "";
Clue[18][7] = 0;
Clue[18][8] = "";
Clue[18][9] = 0;
// Poseida's Room
// Bed
Clue[19][0] = "Bed";
Clue[19][1] = 5;
Clue[19][2] = "<p>Bear inspects the bed and risks moving the discarded clothes on the mattress, finding nothing else but a horribly-creased sheet beneath. The quilt has hastily been bunched up at the lower end. She checks beneath it and, again, steps away empty-handed. Beneath the bed lies a few stacks of CDs, which Bear proceeds to pull out and quickly skim through. Once more this garners nothing.</p>"
+ "<p>She pushes the CDs back and carries on.</p>";
Clue[19][3] = "";
Clue[19][4] = "";
Clue[19][5] = "";
Clue[19][6] = "";
Clue[19][7] = 0;
Clue[19][8] = "";
Clue[19][9] = 0;
// Bedside Table
Clue[20][0] = "Bed";
Clue[20][1] = 5;
Clue[20][2] = "<p>Bear inspects the bedside table. She twists her face at the sight of coffee stains all over, many that seem to be weeks old. A bell-based analogue alarm clock aside, there is nothing of interest here. She checks inside the table and finds nothing but a small stack of women’s weeklies, one of which dates back to this time last year. She quickly flicks through them, but finds nothing.</p>"
+ "<p>She closes the door of the table and backs away.</p>";
Clue[20][3] = "";
Clue[20][4] = "";
Clue[20][5] = "";
Clue[20][6] = "";
Clue[20][7] = 0;
Clue[20][8] = "";
Clue[20][9] = 0;
// Wardrobe
Clue[21][0] = "Wardrobe";
Clue[21][1] = 5;
Clue[21][2] = "<p>Bear searches the wardrobe. All she finds is the usual. Clothes, shoes, a box for a motherboard, but not much else. The top of the integrated drawer is littered with action figures and models of robots from Japanese cartoons, but nothing else stands out.</p>"
+ "<p>She searches the drawers and finds nothing of interest, enough socks to last half a year aside.</p>"
+ "<p>She closes both the drawers and the wardrobe and turns her attention elsewhere.</p>";
Clue[21][3] = "";
Clue[21][4] = "";
Clue[21][5] = "";
Clue[21][6] = "";
Clue[21][7] = 0;
Clue[21][8] = "";
Clue[21][9] = 0;
// Dressing Table
Clue[22][0] = "Dressing Table";
Clue[22][1] = 5;
Clue[22][2] = "<p>Bear investigates the dressing table. Assorted jewellery litters the surface. She takes great care in inspecting the mess with her gauntlet, finding nothing until she finally, by pure chance, finds a single small screw among it all. This screw looks like the kind that would be found on a PC.</p>"
+ "<p>She puts the screw to one side as she continues. Opening and searching the drawer, however, reveals nothing.</p>";
Clue[22][3] = "<p>That screw still bugs Bear, however, but why?</p>";
Clue[22][4] = "No legitimate reason";
Clue[22][5] = "The mere presence of a screw among jewellery is weird";
Clue[22][6] = "The possibility that it's one of the screws from Darren's PC";
Clue[22][7] = 3;
Clue[22][8] = "<p>The screw matches the kind commonly seen holding together the panels on most computers. Its presence here hints at the possibility that Poseida has been trying to obtain something from Darren's machine. However, this remains speculation. Acting on this evidence would be a massive gamble and Bear would do well to choose wisely.</p>";
Clue[22][9] = 0;
// Hephaesta's Room
// Bed
Clue[23][0] = "Bed";
Clue[23][1] = 6;
Clue[23][2] = "<p>Bear checks out the bed. Aside from a couple of discarded clothes at the lower end of the bed, it has been hastily made yet rarely used since.</p>";
Clue[23][3] = "";
Clue[23][4] = "";
Clue[23][5] = "";
Clue[23][6] = "";
Clue[23][7] = 0;
Clue[23][8] = "";
Clue[23][9] = 0;
// Bedside Table
Clue[24][0] = "Bedside Table";
Clue[24][1] = 6;
Clue[24][2] = "<p>Bear examines the bedside table. Inside the drawer, she finds a faux-leather notepad buried under several pieces of clutter. She picks up the book and carefully flicks through the pages. It turns out to be a diary, many of the pages descending into rants about a doctor whose name was mispelled often an in so many different ways that it was difficult to tell his or her real name.</p>"
+ "<p>Starting from a few weeks ago, Poseida details her increasing frustration with Darren Perceptor, initially exhibiting mild irritation at his turning the dining room into a study to expressing the desire for commit acts of violence against him for keeping her awake with his late night typing. Bear read on, only to find an increasing number of pages descending into wild single-word scribbles of hatred and malice.</p>"
+ "<p>Bear closes the book and slips it back where she found it.</p>";
Clue[24][3] = "<p>What does this immediately suggest?</p>";
Clue[24][4] = "The possibility that Poseida had a hand in Darren Perceptor's murder";
Clue[24][5] = "That she really needed to take a Nytol";
Clue[24][6] = "Nothing but baseless assumptions";
Clue[24][7] = 1;
Clue[24][8] = "<p>It's possible that Poseida may have grown so frustrated with Perceptor that it would push her to kill him or have him killed. Anything to get him out of the rest of her life. The trouble is, this is only speculation. A notebook is hardly conclusive evidence. She may not have had a hand in the murder at all. Bear might wish to tread carefully around this evidence. A wrongful accusation, a single finger pointed at the wrong person can do untold and unwanted harm to both the suspect and herself.</p>";
Clue[24][9] = 0;
// Wardrobe
Clue[25][0] = "Wardrobe";
Clue[25][1] = 6;
Clue[25][2] = "<p>Bear checks out the corner wardrobe. Aside from the usual clothes, and some unusual ones - Poseida was a bit of a cosplayer, she assumed when she found an outfit not unlike that from a space western that only lasted for one season and a movie - there is nothing that particularly stands out to her.</p>"
+ "<p>She closes the wardrobe and examines the drawers, again finding nothing of note there other than an ornate pistol that is quickly determined to be a simple prop gun with no moving parts.</p>";
Clue[25][3] = "";
Clue[25][4] = "";
Clue[25][5] = "";
Clue[25][6] = "";
Clue[25][7] = 0;
Clue[25][8] = "";
Clue[25][9] = 0;
// Dressing Table
Clue[26][0] = "Dressing Table";
Clue[26][1] = 6;
Clue[26][2] = "<p>Bear investigates the dressing table, finding nothing aside from sewing equipment and materials in the drawer. There also happen to be a few of those virtual pets that were popular in the late 1990s, some of which show clear signs of battery leakage.</p>"
+ "<p>Bear cringes at the acid-damaged toys and counts herself grateful that she only touched them with her gauntlet. She closes the drawer and runs an antiseptic wipe over the armoured glove.</p>";
Clue[26][3] = "";
Clue[26][4] = "";
Clue[26][5] = "";
Clue[26][6] = "";
Clue[26][7] = 0;
Clue[26][8] = "";
Clue[26][9] = 0;

52
JS/Endings.js

@ -0,0 +1,52 @@
// This code defines each of the game's endings. One will be the "Good" ending, reflecting a correct choice made
// when all clues have been investigated. The three "Bad" endings will depend on which wrong choice you will make.
var Ending = new Array(3)
// Ending 0 (No suspects accused)
Ending[0] = "<p class = 'Story'>Bear returns to her friend’s house with little more than a shrug, signifying that she’s come up empty, and leaves the matter to the police when they finally arrive.</p>"
+ "<p class = 'Story'>A few days later, the news breaks that both sisters have gone on the run, wanted on charges for Darren Perceptor’s murder, based on overwhelming evidence against them, and word travels of what is perceived to be a massive blunder on Bear’s part. Her reputation seriously damaged, she finds that many of the villagers are reluctant to even look at her, much less visit her gym. In time, the loss of business forces her to close up, and after ultimately drawing the conclusion that there is nothing in Littleden for her any more, she leaves as soon as possible.</p>"
+ "<p>BETTER LUCK NEXT TIME.</p>"
+ "<p>THANK YOU FOR PLAYING</p>";
// Ending 1 (Hephaesta only)
Ending[1] = "<p class = 'Story'>Bear returns to her friend’s house through the front door and storms up behind Hephaesta before she can even notice her approach. The red-haired sister lets out a yelp when the amateur detective plants her hands forcibly down her shoulders and struggles to free herself, but to no avail.</p>"
+ "<p class = 'Story'>'I suggest you sit still until the police finally get here.' Bear commands. 'Don’t make me force you unless you want to face the judge with a couple of black eyes.'</p>"
+ "<p class = 'Story'>Hephaesta reluctantly sits back down. The shock is evident on her sister’s face. Both sisters bore fair complexions, but Poseida has essentially become a ghost in the face of the accusations levelled at Hephaesta.</p>"
+ "<p class = 'Story'>Eventually, the coppers finally arrive and give the sister the free ride in a police car she deserves. It is to Bear’s relief that Hephaesta goes quietly. As much as she’s capable of putting up a fight, Bear preferred to avoid one unless it was absolutely necessary.</p>"
+ "<p class = 'Story'>Several months pass. Hephaesta has been tried and convicted and Poseida has since left Littleden. Bear takes a moment from working out to check her emails and notices an odd one that her mail service’s spam filters seem to have allowed to slip through the net. She is about to flag it when she notices the address belongs to a company with a familiar name: Poseidan Ltd. Curious, she risks opening it to find a press release for a revolutionary photoblogging service and, to her horror, that it’s in the similarly-named sister’s name.</p>"
+ "<p class = 'Story'>For a time, Bear kept to herself, and the other villagers opted to leave her to it, not wishing to suffer the same fate as her PC, which was found shattered across the road from the gym.</p>"
+ "<p>BETTER LUCK NEXT TIME</p>"
+ "<p>THANK YOU FOR PLAYING</p>";
// Ending 2 (Poseida only)
Ending[2] = "<p class = 'Story'>Bear returns to her friend’s house, through the kitchen, and makes a bee line for Poseida. The blue-haired sister is quick to realise she’s in trouble and scrambles to get away, but it is too late. Bear grabs the girl by the collar and pins her to the wall.</p>"
+ "<p class = 'Story'>'You're not going anywhere until the police arrive. Then it’s straight to a cell. Do no pass go, do not collect two hundred quid, do NOT even think of trying to fight me.'</p>"
+ "<p class = 'Story'>Poseida turns to her sister, silently begging for help, but Hephaesta is having none of it. She was on her own now. When the police finally arrived, Poseida resisted violently. In the end, Bear had to literally carry her like a battering ram to get into the car.</p>"
+ "<p class = 'Story'>Several months pass. Poseida has been tried and convicted and Poseida has since left Littleden. Bear takes a moment from working out to check her emails and notices an odd one that her mail service’s spam filters seem to have allowed to slip through the net. She is about to flag it when she notices the address belongs to a company with a familiar name: Hephaestic Ltd. Curious, she risks opening it to find a press release for a revolutionary photoblogging service and, to her horror, that it’s in the similarly-named sister's name.</p>"
+ "<p class = 'Story'>For a time, Bear kept to herself, and the other villagers opted to leave her to it, not wishing to suffer the same fate as her PC, which was found shattered across the road from the gym.</p>"
+ "<p>BETTER LUCK NEXT TIME</p>"
+ "<p>THANK YOU FOR PLAYING</p>";
// Ending 3 (Both suspects accused)
Ending[3] = "<p class = 'Story'>Bear storms into her friend’s house and heads straight for Hephaesta. She plants her hands forcibly onto the sister’s shoulders and ignores her squeals as she turns her attention to the other sibling. 'I think it's time I had a word with the two of you.'</p>"
+ "<p class = 'Story'>Poseida’s eyes widen and before Bear can tell her to stay put, shedarts out of her seat, making a break for the kitchen. Unfortunately for Poseida, her attempted escape put her in the path of a frying pan. Her feet flew upward, the inertia keeping the rest of her hanging in the air for a split second before she crashed back down to the floor. In the fall, something else drops to the floor. It is the murder weapon used on Darren Perceptor, a small pistol with a silencer attached. Poseida was out cold, which suited Bear just fine. Bear hauls Hephaesta to her feet when a brick-like object landed on the sofa. Closer inspection revealed it to be a hard drive.</p>"
+ "<p class = 'Story'>Weeks later, Bear returns from a much-needed trip back to her home city. As expected, her absence was ignored by the paperboy, which forces her to enter the gym via the rear entrance, since the front door is blocked by enough free papers to start her own newsagent shop. Mildly irritated, she collects the pile of papers, dumps them on the coffee table and flicks through them quickly.</p>"
+ "<p class = 'Story'>She finds within the pages of the latest edition, the headline: FATES FROWN UPON SIBLING KILLERS. Further reading of the article reveals that Poseida was convicted of the murder itself, just as she had expected, while Hephaesta was found guilty of perverting the course of justice and theft. It was revealed in court that Poseida had indeed snapped and Hephaesta planned on stealing Darren's project and claiming it as her own work. Both received lengthy sentences.</p>"
+ "<p class = 'Story'>Satisfied, Bear tosses the paper back onto the pile and sits back on her sofa. She is just about to doze off when she is abruptly dragged back into the waking world by frantic knocking on the front door.</p>"
+ "<p class = 'Story'>'Bear!' someone squeals from behind it 'I'm glad you're back! I need your help, man. Woman. WHATEVER. Please, you have to help me. My girl's gone and the coppers’re writing it off as if she’s left me or something!'</p>"
+ "<p class = 'Story'>Bear quietly smirks to herself, feeling a little relief that she's still in demand after taking some time out. The smirk soon fades as quickly as it formed, and she calls out 'Door's open.'</p>"
+ "<p>CONGRATULATIONS. Bear has prevented another crime from going unpunished.</p>"
+ "<p>THANK YOU FOR PLAYING!</p>";
function GetEnding()
{
var IncomingData = window.location.search.substring(1);
var Len = IncomingData.length;
var SeparatorPosition = IncomingData.search("_");
var EndingNumber = IncomingData.substring(0,SeparatorPosition);
var Score = IncomingData.substring(SeparatorPosition + 1,Len);
ContentPane.innerHTML = Ending[EndingNumber];
ScoreCounter.innerHTML = Score;
}

4
JS/FrontPage.js

@ -0,0 +1,4 @@
function OpenGameWindow()
{
window.open("Game.html", "GameWindow", "width = 1000, height = 800, location = no, resizable = no, scrollbars = no");
}

203
JS/GamePage.js

@ -0,0 +1,203 @@
// Defines a variable for the player's score.
var PlayerScore = 0;
// Sends the player to the very first room.
function InitialisePage()
{
document.getElementById('FeedbackArea').innerHTML = Room[2][1]; // Takes the description for Room 0, the Living Room, and inserts it into the Feedback Area block.
RedrawMap(); // Rewrites the divs that make up the map into the map area, based on current progress.
RedrawSuspectArea(2); // Rewrites the player's current score to the suspect area, based on current progress.
}
// If the Map has been clicked on, this checks to see if the room has been visited before and thus be fast
// travelled to. If not, then clicking does nothing.
// "RoomNum" is the desired room. See Rooms.js for room numbers and other data.
function CheckMap(RoomNum)
{
if(Number(Room[RoomNum][2]) == 1) // Number() is just to make sure that this variable can be read as a number rather than text.
{
GoToRoom(RoomNum);
}
}
// This function sends you to the room designated by RoomNum upon clicking a room link.
function GoToRoom(RoomNum)
{
// RoomComplete is checked against the clue count of the room and used to bring up a string to alert
// the player that the room is finished. If there are no uninvestigated clues left this variable will
// be set to 1.
var RoomComplete = 0;
// Strings associated with a room's status
var RoomStatus = new Array (1)
RoomStatus[0] = ""
RoomStatus[1] = "<p class = 'Inform'>Bear has investigated everything here. There is nothing more to see.</p>"
if (Room[RoomNum][3] == 0)
{
RoomComplete = 1;
}
document.getElementById('FeedbackArea').innerHTML = Room[RoomNum][1] // Takes the description for the new room and replaces the last room's description in the Feedback Area block.
+ RoomStatus[RoomComplete];
Room[RoomNum][2] = 1; // Sets the room's visited flag to 1, denoting that it has been visited and can be fast travelled to.
RedrawMap();
RedrawSuspectArea(RoomNum);
}
// This function sends you to the clue designated by ClueNum upon clicking a clue link.
// "ClueNum" is the desired clue. See Clues.js for clue numbers and other related data.
function GoToClue(ClueNum)
{
//Create a variable to hold the link that will return you to the original room. This is purely for tidiness.
var StepAwayLink = "<p class = 'RoomLink' onClick = 'GoToRoom(" + Clue[ClueNum][1] + ")'>Back away.</p>";
if (Clue[ClueNum][9] == 0) // Has this clue been looked at before? Is this variable set to 1?
{
if(Clue[ClueNum][3] != "") // Is there a Question here?
{
// Replaces existing text in Feedback Area with Clue description, followed by the question and
// the three possible answers to it in an unordered list.
document.getElementById('FeedbackArea').innerHTML = Clue[ClueNum][2]
+ Clue[ClueNum][3]
+ "<ul><li class = 'AnswerLink' onClick = 'GoToAnswer(" + ClueNum + ",1)'>" + Clue[ClueNum][4]
+ "</li><li class = 'AnswerLink' onClick = 'GoToAnswer(" + ClueNum + ",2)'>" + Clue[ClueNum][5]
+ "</li><li class = 'AnswerLink' onClick = 'GoToAnswer(" + ClueNum + ",3)'>" + Clue[ClueNum][6]
+ "</li></ul>" + StepAwayLink;
}
else //If no question exists...
{
// ...just show the clue. Flag the clue as investigated as well.
document.getElementById('FeedbackArea').innerHTML = Clue[ClueNum][2] + StepAwayLink;
FlagClue(ClueNum,Clue[ClueNum][1]);
}
}
else //If clue has been investigated already...
{
document.getElementById('FeedbackArea').innerHTML = "<p class = 'Inform'>You've already looked at that. There's nothing more to see.</p>" + StepAwayLink;
}
RedrawSuspectArea(Clue[ClueNum][1]); // Updates the player's score onscreen.
}
// This function responds according to which answer you chose. There will always be one right and one
// wrong answer and this function will serve to inform you of whether you answered correctly and reward you
// by adding to your total score. Regardless, though, it will always offer an explanation of why the correct
// answer is so.
function GoToAnswer(ClueNum,Response)
{
//Create a variable to hold the link that will return you to the original room. This is purely for tidiness.
var StepAwayLink = "<p class = 'RoomLink' onClick = 'GoToRoom(" + Clue[ClueNum][1] + ")'>Okay.</p>";
if(Response == Clue[ClueNum][7]) // Is the answer given the same as the correct answer?
{
document.getElementById('FeedbackArea').innerHTML = "<p class = 'CorrectAnswer'>Correct!</p>" + Clue[ClueNum][8] + StepAwayLink; // If the answer is correct...
PlayerScore = PlayerScore + 10; // ...increase the player's score by 10 points.
}
else
{
document.getElementById('FeedbackArea').innerHTML = "<p class = 'WrongAnswer'>Wrong.</p>" + Clue[ClueNum][8] + StepAwayLink; // If the player has given the wrong answer...
}
FlagClue(ClueNum,Clue[ClueNum][1]);
RedrawSuspectArea(Clue[ClueNum][1]); // Updates the player's score onscreen.
}
// This function checks the visited status of all rooms and redraws the map accordingly. Unvisited rooms are
// dark green and do not react to clicks, though hovering over them will still show their names in a tooltip.
// Light green rooms have been visited and enable fast travel to them wihtout having to pass through others.
function RedrawMap()
{
var MapCode = ""; // This variable is for the generated HTML that draws the room.
var RoomStatus = ""; // Serves as the latter half of the required CSS class name for each room.
for (var a = 0; a < 7; a++) // Cycles through each and every room.
{
if (Number(Room[a][2]) == 1) // Has this room been visited?
{
RoomStatus = "Visited";
}
else
{
RoomStatus = "Unvisited";
}
// Generates a div based on:
MapCode = MapCode
+ "<div class = 'MapRoom" + RoomStatus // Visited Status (RoomStatus)
+ "' title = '" + Room[a][0] // Room name (Room[a][0])
+ "' style = 'position: absolute; left:" + (Room[a][4] + 1) // Position from left of page in pixels (Room[a][4], plus 1 pixel to compensate for the border)
+ "; bottom:" + (Room[a][5] + 1) // Position from bottom of page in pixels (Room[a][5], plus 1 pixel to compensate for the border)
+ "; width:" + (Room[a][6] - 2) // Width in pixels (Room[a][6], less 2 pixels to compensate for the border)
+ "; height:" + (Room[a][7] - 2) // Height in pixels (Room[a][7], less 2 pixels to compensate for the border)
+ ";' onClick = 'CheckMap(" + a + ")'></div>"; // This executes the CheckMap() function if the div is clicked.
}
document.getElementById('MapArea').innerHTML = MapCode; // Inserts the completed HTML into the Map Area.
}
function FlagClue(ClueNum,RoomNum)
{
Clue[ClueNum][9] = 1; // Flag clue as investigated.
Room[RoomNum][3] = Number(Room[RoomNum][3]) - 1; // Reduce clue count.
}
function RedrawSuspectArea(RoomNum)
{
var DisabledState = " disabled"; // This will be inserted into all inputs when the inner HTML is assembled.
var GameComplete = 0; // 1 if all clues have been investigated, 0 if not.
var ClueCount = 0; // Total clues remaining.
// Strings associated with game completion (all clues investigated)
var ClueStatus = new Array (1)
ClueStatus[0] = "<p>Clues in room:" + Room[RoomNum][3] + "</p>"
ClueStatus[1] = "<p class = 'Inform'>You've found all you can.<br/>Time to point the finger.</p>"
// Total all remaining clues in every room. If there are no clues left, nullify DisabledState so that
// the property is not added to any inputs, thus enabling them, and set GameComplete to 0.
for(a = 0; a < Room.length; a++)
{
ClueCount = ClueCount + Room[a][3];
}
if(ClueCount == 0)
{
DisabledState = "";
GameComplete = 1;
}
// Refresh the suspect area to update the player's score, number of clues in each room remaining (or
// the notification that it's time to select a suspect in its place) and the form for accusing each suspect.
document.getElementById('SuspectArea').innerHTML = "<p>Score: " + PlayerScore + "</p>"
+ ClueStatus[GameComplete]
+ "<form name = 'frmSuspect'>"
+ "<p><input type = 'checkbox' name = 'chkSuspect1' value = 0" + DisabledState + ">Hephaesta</input></p>"
+ "<p><input type = 'checkbox' name = 'chkSuspect2' value = 0" + DisabledState + ">Poseida</input></p>"
+ "<p><input type = 'button' name = 'btnAccuse' value = 'Accuse!'" + DisabledState + " onClick = 'MakeAccusation()'></input></p>"
+ "</form>";
}
// Makes the necessary accusation. To allow either one or both suspects to be selected, the chkSuspect1's checked value
// remains at 1 if checked, but chkSuspect2 will be doubled when both checked values are added together. As a result,
// ChosenSuspect will become 1 if only the first suspect is selected, 2 if only the second one is, but 3 if both. The variable
// remains at 0 if nobody has been selected.
// The resulting ending number and player's score will then be passed to the ending page.
function MakeAccusation()
{
var ChosenSuspect = (document.frmSuspect.chkSuspect1.checked) + (document.frmSuspect.chkSuspect2.checked * 2);
window.location = "EndPage.html?" + ChosenSuspect + "_" + PlayerScore;
}

96
JS/Rooms.js

@ -0,0 +1,96 @@
// Create a 2-dimensional array of 7 indices (including 0) with 8 additional indices in each (likewise) to represent each room
// Data types:
// 0: Room Name
// 1: Description of the room
// 2: Visited flag (may need to be converted from text into a number)
// 3: Clue count (decreases with each investigated clue, once at zero, you will be told that you've found everything)
// 4: X position on map (from left)
// 5: Y position on map (from bottom)
// 6: Width on map
// 7: Height on map
var Room = new Array(6);
for (var i = 0; i < 7; i++)
{
Room[i] = new Array(7);
}
// Living Room
Room[0][0] = "Living Room";
Room[0][1] = "<p>Bear stands in the living room of the house. She feels a little off-balance. The carpet beneath her feet has seen better days - and unfortunately not a vacuum cleaner, it seems - but it still remains noticeably soft against her sneakers. She shrugs, chalks it up to spending much of her time on tarmac and the hardwood flooring of her gym, and carries on.</p>"
+ "<p>For an home housing three and in spite of the living room's size, it is remarkably sparse, save for the obligatory dark red <span class = 'ClueLink' onClick = 'GoToClue(0)'>three-seater sofa</span> in the centre of the room, joined by a matching <span class = 'ClueLink' onClick = 'GoToClue(1)'>chair</span> to its left. Both face a large <span class = 'ClueLink' onClick = 'GoToClue(3)'>flat-screen television</span> at the south end of the room. Near the front door to the north resides a simple oak-effect <span class = 'ClueLink' onClick = 'GoToClue(2)'>bookshelf</span>, overburdened by more textbooks than it can handle.</p>"
+ "<p>To the east is the <span class = 'RoomLink' onClick = 'GoToRoom(1)'>kitchen</span>, as well as the dining room, which has been converted into a <span class = 'RoomLink' onClick = 'GoToRoom(2)'>study</span>. That room was where the murder took place. The doors on the west side of the room lead to the <span class = 'RoomLink' onClick = 'GoToRoom(3)'>bathroom</span> and <span class = 'RoomLink' onClick = 'GoToRoom(4)'>Darren's bedroom</span>.</p>";
Room[0][2] = 0;
Room[0][3] = 4;
Room[0][4] = 200;
Room[0][5] = 100;
Room[0][6] = 100;
Room[0][7] = 100;
// Kitchen
Room[1][0] = "Kitchen";
Room[1][1] = "<p>Bear enters the kitchen, and it becomes apparent that either none of the roommates could cook or could be bothered to, upon seeing the stack of takeaway cartons stacked high around the place. She finds it difficult to decide whether the <span class = 'ClueLink' onClick = 'GoToClue(4)'>sink</span> is in need of more than a little elbow grease or just a replacement, and wonders if the obligatory <span class = 'ClueLink' onClick = 'GoToClue(5)'>fridge</span> is actually stocked. Surprisingly, there is a <span class = 'ClueLink' onClick = 'GoToClue(6)'>rubbish bin</span>, wedged in a space between that fridge and an adjacent cupboard beneath the sink.</p>"
+ "<p>An arch to the south leads straight to the <span class = 'RoomLink' onClick = 'GoToRoom(2)'>study</span>, due in part to it being a dining room when the place was originally constructed. The unique layout of the apartment places <span class = 'RoomLink' onClick = 'GoToRoom(5)'>Hephaesta's bedroom</span> directly to the east of the kitchen. The <span class = 'RoomLink' onClick = 'GoToRoom(0)'>living room</span> is to the west.</p>";
Room[1][2] = 0;
Room[1][3] = 3;
Room[1][4] = 300;
Room[1][5] = 150;
Room[1][6] = 100;
Room[1][7] = 50;
// Study
Room[2][0] = "Study";
Room[2][1] = "<p>Bear steps into the dining room. From the looks of it, the room has been essentially converted into a study, as in place of a dining table there is, instead, a computer desk with a full tower PC alongside it.</p>"
+ "<p>For the most part, the <span class = 'ClueLink' onClick = 'GoToClue(9)'>broken window</span>, where the shot that had apparently taken the victim had passed through, provides the only real light into the study. Bear checks the light switch, but to no avail. The bulb is as dead as the victim himself, whose <span class = 'ClueLink' onClick = 'GoToClue(7)'>body</span> lies at the feet of the desk. She notes the <span class = 'ClueLink' onClick = 'GoToClue(8)'>destroyed monitor</span> across from the window and finds something a little odd about the <span class = 'ClueLink' onClick = 'GoToClue(11)'>computer</span> under the desk. Also beneath the desk lies an empty waste paper basket. In front of the window lie a few minuscule <span class = 'ClueLink' onClick = 'GoToClue(10)'>pieces of glass<span>.</p>"
+ "<p>The <span class = 'RoomLink' onClick = 'GoToRoom(1)'>kitchen</span> lies to the north, and the apartment's layout places <span class = 'RoomLink' onClick = 'GoToRoom(6)'>Poseida's bedroom</span> through the door to the east. The <span class = 'RoomLink' onClick = 'GoToRoom(0)'>living room</span> lies west.</p>";
Room[2][2] = 1; //Since it's the first room to be entered, this is already set to 1
Room[2][3] = 5;
Room[2][4] = 300;
Room[2][5] = 100;
Room[2][6] = 100;
Room[2][7] = 50;
// Bathroom
Room[3][0] = "Bathroom";
Room[3][1] = "<p>Bear checks the bathroom. She finds it strange that such a room in a recent construction would be built without an extractor fan. But who was she to question the architect behind this madness?</p>"
+ "<p>Fortunately, the layout remains sensible enough. A <span class = 'ClueLink' onClick = 'GoToClue(12)'>bathtub</span> takes up most of the entire southern wall with the <span class = 'ClueLink' onClick = 'GoToClue(13)'>toilet</span> and <span class = 'ClueLink' onClick = 'GoToClue(14)'>sink</span> directly opposite. Bear also notes the <span class = 'ClueLink' onClick = 'GoToClue(15)'>lack of humidity</span> in the room.</p>"
+ "<p>The only way of this room is east, back into the <span class = 'RoomLink' onClick = 'GoToRoom(0)'>living room</span>.</p>";
Room[3][2] = 0;
Room[3][3] = 4;
Room[3][4] = 150;
Room[3][5] = 150;
Room[3][6] = 50;
Room[3][7] = 50;
// Darren's Room
Room[4][0] = "Darren&#39;s Room";
Room[4][1] = "<p>Bear enters Darren's bedroom and finds herself surprised to find the place is immaculate compared to much of the house. A single used tumbler on the <span class = 'ClueLink' onClick = 'GoToClue(16)'>bedside table</span> tarnishes the cleanliness a little, but this is nothing compared to the disgraceful state of the living room carpet. Care and attention seems to have been given to the keeping the <span class = 'ClueLink' onClick = 'GoToClue(17)'>bed</span> along the south wall tidy and aside from a <span class = 'ClueLink' onClick = 'GoToClue(18)'>wardrobe</span> opposite, furniture is minimal.</p>"
+ "<p>The only exit is east, back to the <span class = 'RoomLink' onClick = 'GoToRoom(0)'>living room</span>.</p>";
Room[4][2] = 0;
Room[4][3] = 3;
Room[4][4] = 150;
Room[4][5] = 100;
Room[4][6] = 50;
Room[4][7] = 50;
// Hephaesta's Room
Room[5][0] = "Hephaesta&#39;s Room";
Room[5][1] = "<p>Bear enters Hephaesta's bedroom. Little effort has been made to ensure the room's tidiness aside from the <span class = 'ClueLink' onClick = 'GoToClue(19)'>bed</span> along the eastern wall being made. Random objects litter the floor, forcing the amateur detective to treat carefully. The <span class = 'ClueLink' onClick = 'GoToClue(20)'>bedside table</span> by the north wall has seen better days - days without so many scratch marks and dents - as has the <span class = 'ClueLink' onClick = 'GoToClue(22)'>dressing table</span> along the southern wall. A combination <span class = 'ClueLink' onClick = 'GoToClue(21)'>corner wardrobe</span> with integrated drawers sits beside the dressing table, in the south-west corner.</p>"
+ "<p>The only exit is west, back into the <span class = 'RoomLink' onClick = 'GoToRoom(1)'>kitchen</span>.</p>";
Room[5][2] = 0;
Room[5][3] = 4;
Room[5][4] = 400;
Room[5][5] = 150;
Room[5][6] = 50;
Room[5][7] = 50;
// Poseida's Room
Room[6][0] = "Poseida&#39;s Room";
Room[6][1] = "<p>Bear enters Poseida's bedroom. To call it a mess would have been an understatement. Old clothes and shoes lay scattered on the floor and the <span class = 'ClueLink' onClick = 'GoToClue(23)'>bed</span> along the eastern wall. She cringes at the state of the <span class = 'ClueLink' onClick = 'GoToClue(24)'>bedside table</span> at the south wall, littered with various papers and receipts that, with their close proximity to an electrical socket, pose a serious fire risk. A small <span class = 'ClueLink' onClick = 'GoToClue(26)'>dressing table</span> sits along the eastern wall, at the foot of the bed. Opposite, a <span class = 'ClueLink' onClick = 'GoToClue(25)'>corner wardrobe</span> with an integrated chest of drawers rests in the north-west corner.</p>"
+ "<p>The only exit is west, back into the <span class = 'RoomLink' onClick = 'GoToRoom(2)'>study</span>.</p>";
Room[6][2] = 0;
Room[6][3] = 4;
Room[6][4] = 400;
Room[6][5] = 100;
Room[6][6] = 50;
Room[6][7] = 50;

BIN
Planning/Design Document - Javascript Arrays.docx

Binary file not shown.

BIN
Planning/Design Document - Layout and Formatting.docx

Binary file not shown.

BIN
Planning/Design Document - Pseudocode.docx

Binary file not shown.

BIN
Planning/Evaluation.docx

Binary file not shown.

BIN
Planning/Layouts.xlsx

Binary file not shown.

BIN
Planning/Solution.docx

Binary file not shown.

BIN
Planning/Testing.xlsx

Binary file not shown.
Loading…
Cancel
Save