Skip to content

Commit 7472df5

Browse files
Merge pull request #204 from Pramod-Munnoli/feature/issue-170-enhanced-edition
feat: Enhanced Edition: Major Gameplay, Visual, and Performance Upgrades (#170)
2 parents 8b1bdab + 6b46dc5 commit 7472df5

File tree

3 files changed

+1529
-501
lines changed

3 files changed

+1529
-501
lines changed

projects/orbit/index.html

Lines changed: 133 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,138 @@
1-
<!doctype html>
1+
<!DOCTYPE html>
22
<html lang="en">
33
<head>
4-
<meta charset="utf-8" />
5-
<meta name="viewport" content="width=device-width,initial-scale=1" />
6-
<title>Orbit Collector</title>
7-
<link rel="stylesheet" href="styles.css" />
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
6+
<title>Shadow Collector</title>
7+
<link rel="stylesheet" href="styles.css">
8+
<script src="script.js" defer></script>
89
</head>
910
<body>
10-
<div id="ui">
11-
<div id="score">Score: 0</div>
12-
<div id="level">Level: 1</div>
13-
<div id="lives">Lives: 3</div>
14-
<div id="target">Target: <span id="targetColorName"></span></div>
15-
<button id="restart">Restart</button>
16-
</div>
17-
18-
<canvas id="game"></canvas>
19-
20-
<script src="script.js"></script>
11+
<header>
12+
<h1>Shadow Collector</h1>
13+
</header>
14+
15+
<main>
16+
<div id="gameContainer">
17+
<canvas id="gameCanvas"></canvas>
18+
19+
<div id="gameUI">
20+
<div id="leftUI">
21+
<div class="uiElement">Score: <span id="score">0</span></div>
22+
<div class="uiElement">Orbs: <span id="orbCount">0</span></div>
23+
<div class="uiElement">High Score: <span id="highScoreValue">0</span></div>
24+
</div>
25+
<div id="rightUI">
26+
</div>
27+
</div>
28+
29+
<div id="lightIndicator">
30+
<div id="lightBar" style="width: 100%"></div>
31+
</div>
32+
33+
<div id="powerUp" title="Light Burst">💡</div>
34+
<div id="pauseButton" title="Pause">⏸️</div>
35+
<div id="statsButton" title="Statistics">📊</div>
36+
37+
<div id="mobileControls">
38+
<div class="joystick-container">
39+
<div class="joystick"></div>
40+
</div>
41+
</div>
42+
43+
<div id="stealthButton">👤</div>
44+
45+
<div id="startScreen">
46+
<h2 class="screenTitle">Shadow Collector</h2>
47+
<p class="screenText">Navigate through the darkness and collect glowing orbs. Each orb you collect dims the room, spawning more watchers that hunt you in the shadows.</p>
48+
<div class="highScore">High Score: <span id="menuHighScore">0</span></div>
49+
<button id="startButton">Start Game</button>
50+
<button id="statsMenuButton">View Statistics</button>
51+
</div>
52+
53+
<div id="pauseScreen" class="hidden">
54+
<h2 class="screenTitle">Game Paused</h2>
55+
<p class="screenText">Take a break. The shadows will wait for you.</p>
56+
<button id="resumeButton">Resume</button>
57+
<button id="restartButton">Restart</button>
58+
<button id="statsPauseButton">View Statistics</button>
59+
</div>
60+
61+
<div id="statsScreen" class="hidden">
62+
<h2 class="screenTitle">Game Statistics</h2>
63+
64+
<div class="statsContainer">
65+
<div class="statsSection">
66+
<div class="statsSectionTitle">Overall Performance</div>
67+
<div class="statsGrid">
68+
<div class="statsCard">
69+
<div class="statsCardTitle">Games Played</div>
70+
<div class="statsCardValue" id="statGamesPlayed">0</div>
71+
</div>
72+
<div class="statsCard">
73+
<div class="statsCardTitle">Total Orbs Collected</div>
74+
<div class="statsCardValue" id="statTotalOrbs">0</div>
75+
</div>
76+
<div class="statsCard">
77+
<div class="statsCardTitle">High Score</div>
78+
<div class="statsCardValue" id="statHighScore">0</div>
79+
</div>
80+
<div class="statsCard">
81+
<div class="statsCardTitle">Average Score</div>
82+
<div class="statsCardValue" id="statAvgScore">0</div>
83+
</div>
84+
</div>
85+
</div>
86+
87+
<div class="statsSection">
88+
<div class="statsSectionTitle">Survival Stats</div>
89+
<div class="statsGrid">
90+
<div class="statsCard">
91+
<div class="statsCardTitle">Total Time Survived</div>
92+
<div class="statsCardValue" id="statTotalTime">0s</div>
93+
</div>
94+
<div class="statsCard">
95+
<div class="statsCardTitle">Longest Survival</div>
96+
<div class="statsCardValue" id="statLongestTime">0s</div>
97+
</div>
98+
<div class="statsCard">
99+
<div class="statsCardTitle">Enemies Avoided</div>
100+
<div class="statsCardValue" id="statEnemiesAvoided">0</div>
101+
</div>
102+
<div class="statsCard">
103+
<div class="statsCardTitle">Times Caught</div>
104+
<div class="statsCardValue" id="statTimesCaught">0</div>
105+
</div>
106+
</div>
107+
</div>
108+
109+
<div class="statsSection">
110+
<div class="statsSectionTitle">Power-Up Usage</div>
111+
<div class="statsGrid">
112+
<div class="statsCard">
113+
<div class="statsCardTitle">Light Bursts Used</div>
114+
<div class="statsCardValue" id="statPowerUpsUsed">0</div>
115+
</div>
116+
<div class="statsCard">
117+
<div class="statsCardTitle">Stealth Time</div>
118+
<div class="statsCardValue" id="statStealthTime">0s</div>
119+
</div>
120+
</div>
121+
</div>
122+
</div>
123+
124+
<button id="closeStatsButton">Back</button>
125+
<button id="resetStatsButton">Reset Statistics</button>
126+
</div>
127+
128+
<div id="gameOverScreen" class="hidden">
129+
<h2 class="screenTitle">Game Over</h2>
130+
<p class="screenText">You were caught by the watchers. You collected <span id="finalScore">0</span> orbs.</p>
131+
<div class="highScore" id="newHighScore" class="hidden">New High Score!</div>
132+
<button id="playAgainButton">Play Again</button>
133+
<button id="statsGameOverButton">View Statistics</button>
134+
</div>
135+
</div>
136+
</main>
21137
</body>
22-
</html>
138+
</html>

0 commit comments

Comments
 (0)