forked from Codeer12/games4u-app
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathfortnite.html
363 lines (347 loc) · 12.7 KB
/
fortnite.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
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
<html>
<head>
<style>* {
padding: 0px;
margin: 0px;
background-color: #cc66ff;
}
.title h1 {
text-align: center;
font-size: 700%;
color: white;
font-family: Anton;
}
.title p {
text-align: center;
font-family: Anton;
color: #FFF;
margin: 20px;
font-size: 150%;
margin-bottom: 40px;
}
.game {
text-align: center;
}
.game img {
width: 850px;
display: block;
margin: auto;
}
#scenario {
color: #FFF;
text-align: center;
font-family: Anton;
margin-top: 15px;
font-size: 30px;
}
#submit {
color: #FFF;
font-family: Anton;
margin: 25px;
font-size: 30px;
background-color: #8E24AA;
border-color: #CE93D8;
width: 250px;
}
#retry {
color: #FFF;
font-family: Anton;
margin: 25px;
font-size: 30px;
background-color: #8E24AA;
border-color: #CE93D8;
width: 250px;
display: none;
}
#button-title {
color: #FFF;
text-align: center;
font-family: Anton;
margin-top: 15px;
font-size: 50px;
}
#choice {
background-color: #8E24AA;
color: #FFF;
border-color: #CE93D8;
width: 250px;
height: 25px;
margin-top: 20px;
}</style>
</head>
<body>
<div class = title>
<script>/* I have previous javascript knowledge. I learned js through self learning by many YouTube videos and online resources. I've known js for about a year now so if anything is not from codeacademy, It is from my prior knowledge. Also I have done extra research on html and css. That knowledge has all come from Youtube and w3 schools as well, but it would be very tedious to go back and cite ALL of it so yeah :) */
//stage is to check that the answer is valid for the current stage. choice is the user input checked in the switch statement.
var stage = 1;
var choice = null;
// I am lazy so I made a function. This one ends the game for me
function dead() {
stage = 1;
$('#submit').hide();
$('#choice').hide();
$('#button-title').hide();
$('#choice').val("");
$('#retry').show();
$('#game-img').attr("src", "https://i.ytimg.com/vi/OxEiwH1LLDk/maxresdefault.jpg");
}
// I am lazy so I made another function. This one shows a victory for me
function win() {
stage = 1;
$('#submit').hide();
$('#choice').hide();
$('#button-title').hide();
$('#choice').val("");
$('#retry').show();
$('#game-img').attr("src", "https://pbs.twimg.com/media/DKvC8P3WsAAwKQM.jpg");
}
function dance() {
stage = 1;
$('#submit').hide();
$('#choice').hide();
$('#button-title').hide();
$('#choice').val("");
$('#retry').show();
$('#game-img').attr("src", "https://i.ytimg.com/vi/glx_s1bNYI4/maxresdefault.jpg");
}
//this is part of a cool easter egg. There is a puzzle built in to the game better explained a bit later.
function beaten() {
stage = 1;
$('#submit').hide();
$('#choice').hide();
$('#button-title').hide();
$('#choice').val("");
$('#retry').show();
$('#game-img').attr("src", "http://3.images.southparkstudios.com/blogs/southparkstudios.com/files/2014/02/1008-MWBZ-faq-q1.jpg?quality=0.8");
}
// This is my algorithm. The if/else statements are taking in the user choice and turning it into new scenarios. Also if/else is logic stuff.
$(document).ready(() => {
$('#submit').on('click', () => {
choice = $('#choice').val().toLowerCase();
//this is where it gets a little messy. Basically this giant event handler checks for a valid response to the current prompt and advances the game accordingly.
if (choice === "test") {
console.log("Working");
$('#choice').val("");
}
else if (choice === "pleasant park" && stage === 1 || choice === "salty springs" && stage === 1) {
stage = 2
$('#scenario').text("[1 = P] You are confronted with an enemy. Will you attempt to kill them with a pickaxe like they are a noob or RUN AWAY?");
$('#choice').val("");
}
else if (choice === "run away" && stage === 2) {
dead();
$('#scenario').text("The enemy had a purple scar. You were killed because you are bad.");
}
else if (choice === "run away" && stage === 3) {
stage = 4;
$('#scenario').text("You spot an air drop. Will you go for the AIR DROP or hide in a BUSH?");
$('#choice').val("");
}
else if (choice === "pickaxe them" && stage === 2) {
stage = 3;
$('#scenario').text('You killed the enemy and took their purple scar! Will you CLEAR PLEASANT PARK or RUN AWAY?');
$('#choice').val("");
}
else if (choice === "clear pleasant park" && stage === 3) {
dead();
$('#scenario').text("You got sniped by a bush virgin! (got'em) [2 = A]");
}
else if (choice === "air drop" && stage === 4) {
stage = 5;
$('#scenario').text("You see two players fighting by the air drop. Will you ENGAGE or HIDE?");
$('#choice').val("");
}
else if (choice === "bush" && stage === 4) {
dead();
$('#scenario').text("You got rekt by a player using a green pump shotgun!");
}
else if (choice === "engage" && stage === 5) {
dead();
$('#scenario').text("The players quickly eliminated you before returning to their fight.");
}
else if (choice === "hide" && stage === 5) {
dead();
$('#scenario').text("You were killed when someone came up behind you with an SMG. [3 = S]");
}
else if (choice === "flush factory" && stage === 1) {
stage = 6;
$('#scenario').text("This place is a meme. Will you become a BUSH VIRGIN or a TREE NOOB? [5 = W]");
$('#choice').val("");
}
else if (stage === 6 || stage === 7) {
win();
$('#scenario').text("This place is a meme. It doesn't matter campers always win #crievrytiem.");
}
else if (choice === "moisty mire" && stage === 1) {
dead();
$('#scenario').text("[4 = S] You were lost in the storm :(");
}
else if (choice === "lonely lodge" && stage === 1) {
dead();
$('#scenario').text("You were lost in the storm :(");
}
else if (choice === "wailing woods" && stage === 1) {
dead();
$('#scenario').text("You were lost in the storm :(");
}
else if (choice === "tomato town" && stage === 1) {
stage = 7;
}
else if (choice === "loot lake" && stage === 1) {
stage = 8;
$('#scenario').text("You landed and found a green AR, a sheild potion, and some bandages. Will you wait in the HOUSE or CROSS the lake?");
$('#choice').val("");
}
else if (choice === "cross" && stage === 8) {
dead();
$('#scenario').text("[6 = O] You got sniped while trying to cross the lake!");
}
else if (choice === "house" && stage === 8) {
stage = 9;
$('#scenario').text("You hear someone in the basement of the house. Do you PUSH THEM or WAIT?");
$('#choice').val("");
}
else if (choice === "wait" && stage === 9) {
dead();
$('#scenario').text("[7 = R] The enemy snuck up behind you and rekt you with a purple semi-auto shotgun!");
}
else if (choice === "push them" && stage === 9) {
stage = 10;
$('#scenario').text("You killed the enemy and took their purple semi-autp shotgun. Will you push towards the SAFE ZONE or WAIT?");
$('#choice').val("");
}
else if (choice === "wait" && stage === 10) {
dead();
$('#scenario').text("You were lost in the storm :(");
}
else if (choice === "safe zone" && stage === 10) {
stage = 11;
$('#scenario').text("You escaped the storm! An enemy is near by. Will you ENGAGE or RUN AWAY?");
$('#choice').val("");
}
else if (choice === "run away" && stage === 11) {
dead();
$('#scenario').text("You got killed by a wookie in a tree!");
}
else if (choice === "engage" && stage === 11) {
stage = 12;
$('#scenario').text("You defeated the player with your shotgun. Two players remain! Will you HUNT the enemy or BUILD a fort?");
$('#choice').val("");
}
else if (choice === "hunt" && stage === 12) {
win();
$('#scenario').text("You snuck up behind the enemy and killed them with your shotgun!");
}
else if (choice === "build" && stage ===12) {
dead();
$('#scenario').text("The enemy used a grenade launcher and exploded you and your base! [8 = D]");
}
else if (choice === "anarchy acres" && stage === 1 || choice === "fatal fields" && stage === 1) {
stage = 13;
$('#scenario').text("You land and find a purple bolt action sniper. Will you SNIPE people or LOOT?");
$('#choice').val("");
}
else if (choice === "loot" && stage === 13) {
dead();
$('#scenario').text("You died of fall damage like an idiot.");
}
else if (choice === "snipe" && stage === 13) {
stage = 14;
$('#scenario').text("You got 5 filthy sniper kills!!!!!");
$('#choice').val("");
}
else if (stage === 14) {
dead();
$('#scenario').text("You got banned because the game thought you were hacking!!!");
}
else if (choice === "retail row" && stage === 1) {
stage = 15;
$('#scenario').text("You land in retail row and find a golden SCAR-20 as well as a blue bolt action sniper. Will you LEAVE or STAY?");
$('#choice').val("");
}
else if (choice === "leave" && stage === 15) {
stage = 16;
$('#scenario').text("You leave retail row, and wonder around. Somehow, you are now in the top 2!!! Will you CAMP and snipe, or HUNT and use the rifle?");
$('#choice').val("");
}
else if (choice === "camp" && stage === 16) {
dead();
$('#scenario').text("You got killed by the enemy in a sniper duel.");
}
else if (choice === "hunt" && stage === 16) {
win();
$('#scenario').text("You rekt the enemy and two tapped him with headshots using your golden SCAR-20!");
}
else if (choice === "dusty depot" && stage === 1) {
stage = 17;
$('#scenario').text("You find nothing but a grey smg. Surely this can't go well. Will you DANCE for mercy or PLAY NORMALLY?");
$('#choice').val("");
}
else if (choice === "play normally" && stage === 17) {
dead();
$('#scenario').text("You got rekt. What did you excpect going dusty lul.");
}
else if (choice === "dance" && stage === 17) {
dance();
$('#scenario').text("Miraculously, all the people around you join in and dance! How fun!");
}
//this adds a place to enter secret codes to do cool stuffs.
else if (choice === "greasy grove" && stage === 1) {
stage = 100;
$('#scenario').text("This location is an easter egg! (figure it out it's a secret)");
$('#choice').val("");
$('#retry').show();
}
// Greasy grove is a secret that allows you to input keywords to trigger any of the three outcomes, plus a secret fourth. If you play the game you will find letters scattered around. Piecing together all 8 you get the password to truly beat the game!
else if (stage === 100) {
if (choice === "win") {
win();
$('#scenario').text("There has been a transdimentional disturbance!");
}
else if (choice === "dance") {
dance();
$('#scenario').text("There has been a transdimentional disturbance!");
}
else if (choice === "lose") {
dead();
$('#scenario').text("There has been a transdimentional disturbance!");
}
else if (choice === "password") {
beaten();
$('#scenario').text("You have beaten my game! Congrats! Yay! Wee! You have no life!");
}
else {
$('#choice').val("");
alert("Invalid Choice!");
}
}
else {
$('#choice').val("");
alert("Invalid Choice!");
}
});
//this makes the play again button reset the game when clicked
$('#retry').on('click', () => {
$('#submit').show();
$('#choice').show();
$('#button-title').show();
$('#scenario').text("You are about to drop from the battle bus. You can land on any of the major zones.");
$('#choice').val("Enter Choice");
$('#retry').hide();
$('#game-img').attr("src", "https://cdn2.unrealengine.com/Fortnite%2Fblog%2F1-7-1-patch-notes%2FMiniMapAthena-2048x2048-257033270bfbd1f8bd239d3fc98dd2a6438e85e4.jpg");
});
}); </script>
<h1>Fortnite Choose Your Own Adventure!</h1>
<p>In this game, you will make descisions based on the popular battle royale game Fortnite. Your goal is to be the Victor Royale!</p>
</div>
<div class = game>
<img id = game-img src="https://cdn2.unrealengine.com/Fortnite%2Fblog%2F1-7-1-patch-notes%2FMiniMapAthena-2048x2048-257033270bfbd1f8bd239d3fc98dd2a6438e85e4.jpg">
<p id = scenario>You are about to drop from the battle bus. You can land on any of the major zones.</p>
<p id = button-title>What will you do?</p>
<input type = "text" id = choice value = "Enter Choice"></input> <br>
<button id = submit>Proceed</button>
<br>
<button id = retry>Play Again</button>
</div>
</body>
</html>