Spaces:
Running
Running
Update index.html
Browse files- index.html +22 -5
index.html
CHANGED
@@ -22,8 +22,10 @@
|
|
22 |
align-items: center;
|
23 |
height: 100vh;
|
24 |
margin: 0;
|
|
|
25 |
background: linear-gradient(45deg, var(--pink), var(--blue));
|
26 |
color: var(--dark-text);
|
|
|
27 |
}
|
28 |
|
29 |
.container {
|
@@ -136,6 +138,20 @@
|
|
136 |
font-size: 3em;
|
137 |
margin-bottom: 20px;
|
138 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
139 |
|
140 |
</style>
|
141 |
</head>
|
@@ -143,7 +159,7 @@
|
|
143 |
|
144 |
<div id="app-container">
|
145 |
<div id="song-selection" class="container">
|
146 |
-
<h1
|
147 |
<p>Choose your battle track!</p>
|
148 |
<button id="song-aespa">Aespa - Dirty Work</button>
|
149 |
<button id="song-itzy">Itzy - girls will be girl</button>
|
@@ -169,6 +185,10 @@
|
|
169 |
<button id="restart-button">Play Again? π</button>
|
170 |
</div>
|
171 |
</div>
|
|
|
|
|
|
|
|
|
172 |
|
173 |
<audio id="audio-player"></audio>
|
174 |
|
@@ -392,7 +412,7 @@
|
|
392 |
const frameCount = Math.min(player1Data.length, player2Data.length);
|
393 |
|
394 |
if (frameCount < 5) {
|
395 |
-
scoreDisplay.textContent = "Not enough data
|
396 |
return;
|
397 |
}
|
398 |
|
@@ -407,8 +427,6 @@
|
|
407 |
}
|
408 |
|
409 |
function restartGame() {
|
410 |
-
// The simplest and most robust way to restart is to reload the page.
|
411 |
-
// This guarantees all state is reset to its default.
|
412 |
location.reload();
|
413 |
}
|
414 |
|
@@ -429,6 +447,5 @@
|
|
429 |
// Start the application
|
430 |
main();
|
431 |
</script>
|
432 |
-
<div><br>fredmo - 2025 - All rights reserved to their respective owners </br></div>
|
433 |
</body>
|
434 |
</html>
|
|
|
22 |
align-items: center;
|
23 |
height: 100vh;
|
24 |
margin: 0;
|
25 |
+
padding-bottom: 50px; /* Add padding to prevent footer from overlapping content */
|
26 |
background: linear-gradient(45deg, var(--pink), var(--blue));
|
27 |
color: var(--dark-text);
|
28 |
+
box-sizing: border-box;
|
29 |
}
|
30 |
|
31 |
.container {
|
|
|
138 |
font-size: 3em;
|
139 |
margin-bottom: 20px;
|
140 |
}
|
141 |
+
|
142 |
+
footer {
|
143 |
+
position: fixed;
|
144 |
+
bottom: 0;
|
145 |
+
left: 0;
|
146 |
+
width: 100%;
|
147 |
+
padding: 15px;
|
148 |
+
background-color: rgba(0, 0, 0, 0.1);
|
149 |
+
color: var(--white);
|
150 |
+
text-align: center;
|
151 |
+
font-size: 14px;
|
152 |
+
z-index: 100;
|
153 |
+
text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
|
154 |
+
}
|
155 |
|
156 |
</style>
|
157 |
</head>
|
|
|
159 |
|
160 |
<div id="app-container">
|
161 |
<div id="song-selection" class="container">
|
162 |
+
<h1>β¨π¨ K AI Pop Dance - Challenge your Friend πβ¨</h1>
|
163 |
<p>Choose your battle track!</p>
|
164 |
<button id="song-aespa">Aespa - Dirty Work</button>
|
165 |
<button id="song-itzy">Itzy - girls will be girl</button>
|
|
|
185 |
<button id="restart-button">Play Again? π</button>
|
186 |
</div>
|
187 |
</div>
|
188 |
+
|
189 |
+
<footer>
|
190 |
+
Fredmo - vibe coded with gemini 2.5 pro - 2025 - All rights reserved to their respective owners
|
191 |
+
</footer>
|
192 |
|
193 |
<audio id="audio-player"></audio>
|
194 |
|
|
|
412 |
const frameCount = Math.min(player1Data.length, player2Data.length);
|
413 |
|
414 |
if (frameCount < 5) {
|
415 |
+
scoreDisplay.textContent = "Not enough data! π Try dancing more clearly!";
|
416 |
return;
|
417 |
}
|
418 |
|
|
|
427 |
}
|
428 |
|
429 |
function restartGame() {
|
|
|
|
|
430 |
location.reload();
|
431 |
}
|
432 |
|
|
|
447 |
// Start the application
|
448 |
main();
|
449 |
</script>
|
|
|
450 |
</body>
|
451 |
</html>
|