add a button i can return with it to the home screen
Browse files- game.html +12 -8
- index.html +4 -3
game.html
CHANGED
|
@@ -111,8 +111,11 @@
|
|
| 111 |
<button id="restart-btn" class="game-ui p-2 rounded-lg text-white btn-game">
|
| 112 |
<i data-feather="refresh-cw"></i>
|
| 113 |
</button>
|
|
|
|
|
|
|
|
|
|
| 114 |
<button id="sound-btn" class="game-ui p-2 rounded-lg text-white btn-game">
|
| 115 |
-
|
| 116 |
</button>
|
| 117 |
<button id="language-btn" class="game-ui p-2 rounded-lg text-white btn-game">
|
| 118 |
<img src="https://flagcdn.com/w20/gb.png" class="w-5 h-5">
|
|
@@ -187,13 +190,13 @@
|
|
| 187 |
restart: "إعادة التشغيل"
|
| 188 |
}
|
| 189 |
};
|
| 190 |
-
|
| 191 |
// DOM elements
|
| 192 |
const blocksCounter = document.getElementById('blocks-counter');
|
| 193 |
const pauseBtn = document.getElementById('pause-btn');
|
| 194 |
const restartBtn = document.getElementById('restart-btn');
|
|
|
|
| 195 |
const soundBtn = document.getElementById('sound-btn');
|
| 196 |
-
|
| 197 |
const player = document.getElementById('player');
|
| 198 |
const stonesContainer = document.getElementById('stones-container');
|
| 199 |
const pyramidArea = document.getElementById('pyramid-area');
|
|
@@ -435,13 +438,14 @@ pauseBtn.addEventListener('click', () => {
|
|
| 435 |
});
|
| 436 |
|
| 437 |
resumeBtn.addEventListener('click', resumeGame);
|
| 438 |
-
|
| 439 |
menuBtn.addEventListener('click', () => {
|
| 440 |
-
|
| 441 |
-
alert('Would navigate back to main menu');
|
| 442 |
});
|
| 443 |
-
|
| 444 |
-
|
|
|
|
|
|
|
|
|
|
| 445 |
document.querySelectorAll('.language-option').forEach(option => {
|
| 446 |
option.addEventListener('click', () => {
|
| 447 |
updateLanguage(option.dataset.lang);
|
|
|
|
| 111 |
<button id="restart-btn" class="game-ui p-2 rounded-lg text-white btn-game">
|
| 112 |
<i data-feather="refresh-cw"></i>
|
| 113 |
</button>
|
| 114 |
+
<button id="home-btn" class="game-ui p-2 rounded-lg text-white btn-game">
|
| 115 |
+
<i data-feather="home"></i>
|
| 116 |
+
</button>
|
| 117 |
<button id="sound-btn" class="game-ui p-2 rounded-lg text-white btn-game">
|
| 118 |
+
<i data-feather="volume-2"></i>
|
| 119 |
</button>
|
| 120 |
<button id="language-btn" class="game-ui p-2 rounded-lg text-white btn-game">
|
| 121 |
<img src="https://flagcdn.com/w20/gb.png" class="w-5 h-5">
|
|
|
|
| 190 |
restart: "إعادة التشغيل"
|
| 191 |
}
|
| 192 |
};
|
|
|
|
| 193 |
// DOM elements
|
| 194 |
const blocksCounter = document.getElementById('blocks-counter');
|
| 195 |
const pauseBtn = document.getElementById('pause-btn');
|
| 196 |
const restartBtn = document.getElementById('restart-btn');
|
| 197 |
+
const homeBtn = document.getElementById('home-btn');
|
| 198 |
const soundBtn = document.getElementById('sound-btn');
|
| 199 |
+
const languageBtn = document.getElementById('language-btn');
|
| 200 |
const player = document.getElementById('player');
|
| 201 |
const stonesContainer = document.getElementById('stones-container');
|
| 202 |
const pyramidArea = document.getElementById('pyramid-area');
|
|
|
|
| 438 |
});
|
| 439 |
|
| 440 |
resumeBtn.addEventListener('click', resumeGame);
|
|
|
|
| 441 |
menuBtn.addEventListener('click', () => {
|
| 442 |
+
window.location.href = 'index.html';
|
|
|
|
| 443 |
});
|
| 444 |
+
|
| 445 |
+
homeBtn.addEventListener('click', () => {
|
| 446 |
+
window.location.href = 'index.html';
|
| 447 |
+
});
|
| 448 |
+
// Language selection
|
| 449 |
document.querySelectorAll('.language-option').forEach(option => {
|
| 450 |
option.addEventListener('click', () => {
|
| 451 |
updateLanguage(option.dataset.lang);
|
index.html
CHANGED
|
@@ -79,12 +79,13 @@
|
|
| 79 |
<p class="text-xl mb-12 text-gray-300 text-center max-w-2xl">
|
| 80 |
Collect stones from the river and stack them to build an ancient pyramid!
|
| 81 |
</p>
|
| 82 |
-
|
| 83 |
<button id="start-btn" class="btn-primary px-12 py-4 rounded-full text-xl font-semibold mb-16">
|
| 84 |
Start Game
|
| 85 |
</button>
|
| 86 |
-
|
| 87 |
-
|
|
|
|
|
|
|
| 88 |
<!-- Sound Controls -->
|
| 89 |
<div class="flex items-center space-x-4">
|
| 90 |
<i data-feather="volume-2" class="text-gray-300"></i>
|
|
|
|
| 79 |
<p class="text-xl mb-12 text-gray-300 text-center max-w-2xl">
|
| 80 |
Collect stones from the river and stack them to build an ancient pyramid!
|
| 81 |
</p>
|
|
|
|
| 82 |
<button id="start-btn" class="btn-primary px-12 py-4 rounded-full text-xl font-semibold mb-16">
|
| 83 |
Start Game
|
| 84 |
</button>
|
| 85 |
+
<a href="game.html" class="btn-primary px-12 py-4 rounded-full text-xl font-semibold mb-16 hidden" id="direct-start-btn">
|
| 86 |
+
Play Directly
|
| 87 |
+
</a>
|
| 88 |
+
<div class="w-full max-w-md space-y-8">
|
| 89 |
<!-- Sound Controls -->
|
| 90 |
<div class="flex items-center space-x-4">
|
| 91 |
<i data-feather="volume-2" class="text-gray-300"></i>
|