-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
106 lines (87 loc) · 5.31 KB
/
index.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="./img/favicon.png" type="image/x-icon">
<title>El Pollo Loco</title>
<link rel="stylesheet" href="style.css">
<script src="./models/drawable-object.class.js"></script>
<script src="./models/character-statusbar.class.js"></script>
<script src="./models/bottle-statusbar.class.js"></script>
<script src="./models/endboss-statusbar.class.js"></script>
<script src="./models/coin-statusbar.class.js"></script>
<script src="./models/movable-object.class.js"></script>
<script src="./models/background-object.class.js"></script>
<script src="./models/cloud.class.js"></script>
<script src="./models/character.class.js"></script>
<script src="./models/chicken.class.js"></script>
<script src="./models/chicken-dead.class.js"></script>
<script src="./models/small-chicken.class.js"></script>
<script src="./models/small-chicken-dead.class.js"></script>
<script src="./models/keyboard.class.js"></script>
<script src="./models/level.class.js"></script>
<script src="./models/endboss.class.js"></script>
<script src="./models/bottle.class.js"></script>
<script src="./models/coin.class.js"></script>
<script src="./models/throwable-object.class.js"></script>
<script src="./models/world.class.js"></script>
<script src="./js/game.js"></script>
<script src="./levels/level1.js"></script>
</head>
<body onload="init()">
<div id="content" class="content">
<div id="loader-box" class="loader-box">
<img src="./img/loading.png" alt="loading">
<div class="loader"></div>
</div>
<div class="flip-device">
Please rotate your device to experience the best game result
</div>
<div id="game" class="game">
<h1>El Pollo Loco</h1>
<div id="startscreen" class="startscreen">
<button id="start-btn" onclick="startGame()" class="btn start-btn">Start</button>
</div>
<div class="canvas-wrapper">
<div id="info-btns-container" class="info-btns-container">
<div class="info-btns">
<button id="btn-mute" class="btn info-btn"><img onclick="muteAllAudio()" src="./img/mute.png" alt="info" class="img"></button>
<button id="btn-unmute" class="btn info-btn display-none"><img onclick="unmuteAllAudio()" src="./img/unmute.png" alt="info" class="img"></button>
<button id="btn-info" class="btn info-btn"><img onclick="showInfo()" src="./img/info.png" alt="info" class="img"></button>
<button id="btn-fullscreen" class="btn info-btn"><img onclick="fullscreen()" src="./img/expand-screen.png" alt="fullscreen view" class="img"></button>
</div>
</div>
<canvas id="canvas" width="720" height="480" class="display-none"></canvas>
<div id="play-btns-container" class="play-btns-container">
<div class="play-btns">
<button id="btn-left" class="btn play-btn"><img src="./img/arrow-left.png" alt="move left" class="img"></button>
<button id="btn-right" class="btn play-btn"><img src="./img/arrow-right.png" alt="move right" class="img"></button>
</div>
<div class="play-btns">
<button id="btn-jump" class="btn play-btn"><img src="./img/arrow-up.png" alt="jump" class="img"></button>
<button id="btn-throw" class="btn play-btn"><img src="./img/throw.png" alt="throw bottle" class="img"></button>
</div>
</div>
<div id="info" class="info display-none">
<div class="info-btn-container">
<button onclick="closeInfo()" class="btn info-close-btn">X</button>
</div>
<p>All the chickens have broken out and gone mad. If our Mexican friend Pepe doesn't do something, they will eat all the seeds and destroy the harvest. Help Pepe defeat the crazy chickens. But be careful, the chickens will fight back and in the end the big rooster is waiting and he is mighty angry.</p>
<p>To move Pepe, use the arrow keys to go left or right.</p>
<p>To defeat a chick or a chicken you have to jump on it, use the arrow up key.</p>
<p>To defeat the big rooster you have to throw the salsa bottles, you can collect, at him, use the "d" key, on a mobile device use the right key in the bottom.</p>
<p>Good luck, you will need it.</p>
</div>
</div>
<div id="character_lost" class="endscreen endscreen-boss">
<button id="restart-btn-boss" onclick="restartGame()" class="btn start-btn display-none">Restart</button>
</div>
<div id="character_won" class="endscreen endscreen-pepe">
<button id="restart-btn-character" onclick="restartGame()" class="btn start-btn display-none">Restart</button>
</div>
</div>
</div>
</body>
</html>