Spaces:
Running
Running
增加排行榜TOP,表明 - Follow Up Deployment
Browse files- index.html +1 -39
index.html
CHANGED
@@ -128,16 +128,7 @@
|
|
128 |
</div>
|
129 |
</div>
|
130 |
|
131 |
-
<div class="mt-8
|
132 |
-
<div class="bg-white rounded-lg shadow p-4">
|
133 |
-
<h3 class="text-xl font-bold text-gray-800 mb-4">排行榜 TOP 5</h3>
|
134 |
-
<div id="leaderboard" class="space-y-2">
|
135 |
-
<!-- Leaderboard items will be added here by JavaScript -->
|
136 |
-
</div>
|
137 |
-
</div>
|
138 |
-
</div>
|
139 |
-
|
140 |
-
<div class="mt-4 text-gray-600 text-sm">
|
141 |
<p>使用键盘方向键或屏幕按钮控制蛇的移动</p>
|
142 |
</div>
|
143 |
|
@@ -326,7 +317,6 @@
|
|
326 |
isGameOver = true;
|
327 |
finalScoreDisplay.textContent = score;
|
328 |
gameOverlay.classList.remove('hidden');
|
329 |
-
updateLeaderboard();
|
330 |
}
|
331 |
|
332 |
// 开始游戏
|
@@ -379,36 +369,8 @@
|
|
379 |
wallMode = e.target.checked;
|
380 |
});
|
381 |
|
382 |
-
// 排行榜功能
|
383 |
-
let leaderboard = JSON.parse(localStorage.getItem('snakeLeaderboard')) || [];
|
384 |
-
|
385 |
-
function updateLeaderboard() {
|
386 |
-
// 添加当前分数到排行榜
|
387 |
-
leaderboard.push(score);
|
388 |
-
// 排序并保留前5名
|
389 |
-
leaderboard.sort((a, b) => b - a);
|
390 |
-
leaderboard = leaderboard.slice(0, 5);
|
391 |
-
// 保存到本地存储
|
392 |
-
localStorage.setItem('snakeLeaderboard', JSON.stringify(leaderboard));
|
393 |
-
|
394 |
-
// 更新显示
|
395 |
-
const leaderboardElement = document.getElementById('leaderboard');
|
396 |
-
leaderboardElement.innerHTML = '';
|
397 |
-
|
398 |
-
leaderboard.forEach((score, index) => {
|
399 |
-
const item = document.createElement('div');
|
400 |
-
item.className = 'flex justify-between items-center bg-gray-50 p-2 rounded';
|
401 |
-
item.innerHTML = `
|
402 |
-
<span class="font-medium">${index + 1}. ${score}</span>
|
403 |
-
<span class="text-xs text-gray-500">${new Date().toLocaleDateString()}</span>
|
404 |
-
`;
|
405 |
-
leaderboardElement.appendChild(item);
|
406 |
-
});
|
407 |
-
}
|
408 |
-
|
409 |
// 初始化显示
|
410 |
highScoreDisplay.textContent = highScore;
|
411 |
-
updateLeaderboard();
|
412 |
</script>
|
413 |
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=bozhong/awesome-about-me" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p><p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=bozhong/snake" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
|
414 |
</html>
|
|
|
128 |
</div>
|
129 |
</div>
|
130 |
|
131 |
+
<div class="mt-8 text-gray-600 text-sm">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
132 |
<p>使用键盘方向键或屏幕按钮控制蛇的移动</p>
|
133 |
</div>
|
134 |
|
|
|
317 |
isGameOver = true;
|
318 |
finalScoreDisplay.textContent = score;
|
319 |
gameOverlay.classList.remove('hidden');
|
|
|
320 |
}
|
321 |
|
322 |
// 开始游戏
|
|
|
369 |
wallMode = e.target.checked;
|
370 |
});
|
371 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
372 |
// 初始化显示
|
373 |
highScoreDisplay.textContent = highScore;
|
|
|
374 |
</script>
|
375 |
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=bozhong/awesome-about-me" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p><p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=bozhong/snake" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
|
376 |
</html>
|