/
game.html
142 lines (121 loc) · 7.11 KB
/
game.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<head>
<title>Pacific Warehouse</title>
<link href='https://fonts.googleapis.com/css?family=Special+Elite' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.css">
<link href='https://fonts.googleapis.com/css?family=Oxygen:400,300,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
</head>
<body>
<nav class="navbar navbar-custom">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"><a class="navbar-brand" href="index.html">Start Again</a></span>
</button>
<a class="navbar-brand" href="game.html">Start Again</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
</ul>
<ul class="nav navbar-nav navbar-right">
<li role="presentation"><a href="https://github.com/hayleenighbert/Pacific-Warehouse" target="_blank"><i class="fa fa-github fa-2x" aria-hidden="true"></i></a></li>
</ul>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container img-responsive">
<div id="ci">
<div id="slide-1" class="ci-slide">
<div class="bg" data-ibg-bg="images/gp_slide1.jpg"></div>
<p>You’ve heard stories about an abandoned warehouse at the waterfront in your town. It’s narrow structure towers over nearby buildings, nearly all the windows broken and walls eroded from years and years of exposure to the ocean’s salty air. You see a “no trespassing” sign.</p>
<button class="ci-nav" path="slide-2">Walk toward the building anyway...</button>
</div>
<div id="slide-2" class='ci-slide'>
<div class = "bg" data-ibg-bg="images/gp_slide2.jpg"></div>
<p>As you approach the side door of the building, you see a truck pull up to the side door. Someone exits the car, but you can't get a good look from far away. They walk briskly inside.</p>
<button class="ci-nav" path="slide-9">Follow through the front door.</button>
<button class="ci-nav" path="slide-4">Sneak in through the garage back door.</button>
</div>
<div id="slide-4" class='ci-slide'>
<div class = "bg" data-ibg-bg="images/gp_slide1-2.jpg"></div>
<p>You open the garage door.</p>
<button class="ci-nav" path="slide-5">Continue</button>
</div>
<div id="slide-5" class='ci-slide'>
<div class = "bg" data-ibg-bg="images/gp-12.jpg"></div>
<p>Your footsteps echo within the cavernous walls of the warehouse. You look around, but there is no one around...that you can see.</p>
<button class="ci-nav" path="slide-6">Continue Walking</button>
</div>
<div id="slide-6" class="ci-slide">
<div class = "bg" data-ibg-bg="images/gp_slide3_op1_1.jpg"></div>
<p>You suddenly feel the ground rumble. Adrenaline kicks in. What could that be? The shaking suddenly stops, and you hear a loud sound in the other room.</p>
<button class="ci-nav" path="slide-7">Continue exploring room</button>
<button class="ci-nav" path="slide-11">"I'm curious what's in the other room..."</button>
</div>
<div id="slide-7" class="ci-slide">
<div class = "bg" data-ibg-bg="images/gp-26.jpg"></div>
<p>You look around the room and see a stairwell.</p>
<button class="ci-nav" path="slide-8">Go down stairwell</button>
</div>
<div id="slide-8" class="ci-slide">
<div class = "bg" data-ibg-bg="images/gp-14.jpg"></div>
<p>There's something shiny on the floor</p>
<button class="item">[Collect Compass]</button>
<button class="ci-nav" path="slide-6">Walk back up stairs</button>
</div>
<div id="slide-9" class="ci-slide">
<div class = "bg" data-ibg-bg="images/gp-19.jpg"></div>
<p>You scan the room, looking for a sign of the stranger that has seemingly disappeared. They can't have gone far...</p>
<button class="ci-nav" path="slide-10">Look around room</button>
<button class="ci-nav" path="slide-11">Continue through the side door</button>
</div>
<div id="slide-10" class="ci-slide">
<div class = "bg" data-ibg-bg="images/gp-21.jpg"></div>
<p>There's a lot of junk in here. What's with all these old lockers?</p>
<button class="item">[Collect Notebook]</button>
<button class="ci-nav" path="slide-11">Walk into next room</button>
</div>
<div id="slide-11" class="ci-slide">
<div class = "bg" data-ibg-bg="images/gp-3.jpg"></div>
<p>The lights above start swinging back and forth and the floor shakes, scattering broken glass and objects across the floor. The shaking suddenly stops, and you hear a loud sound in the other room.</p>
<button class="ci-nav" path="slide-12">Check out next room</button>
</div>
<div id="slide-12" class="ci-slide">
<div class = "bg" data-ibg-bg="images/gp-4.jpg"></div>
<p>You enter a room full of debris and graffiti scrawled across the walls.<br>
"What was this place used for, anyway...?"</p>
<button class="item">[Collect Spraypaint Can]</button>
<button class="ci-nav" path="slide-14">Go toward strange sound</button>
<!-- <button class="ci-nav" path="slide-13">Inspect walls</button> -->
</div>
<div id="slide-13" class="ci-slide">
<div class = "bg" data-ibg-bg="images/gp-4.jpg"></div>
<p>You enter a room full of debris and graffiti scrawled across the walls.<br>
"What was this place used for, anyway...?"</p>
<button class="item">[Collect Spraypaint Can]</button>
<button class="ci-nav" path="slide-14">Go toward strange sound</button>
<button class="ci-nav" path="slide-13">Inspect walls</button>
</div>
<div id="slide-14" class="ci-slide">
<div class="bg" data-ibg-bg="images/gp.jpg"></div>
<p>You enter and scan the room for any signs of danger. Looks like a room full of old wires and circuit boards. But wait...I see something shiny! Looks like a dangerously sharp object.</p>
<button class="item">[Collect Dagger]</button>
<button class="ci-nav" path="slide-12">Go back to the last room</button>
</div>
</div>
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src= "js/jquery.interactive_bg.js"></script>
<script type="text/javascript" src="js/gamescript.js"></script>
<script type="text/javascript" src="js/choose-it.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
</body>
</html>