From 36ffd021565b14c9f7cf75240bace60bdb946dfa Mon Sep 17 00:00:00 2001 From: Mastan Sayyad Date: Sat, 27 Jul 2024 17:24:05 +0530 Subject: [PATCH] Update game.html --- pages/game.html | 1385 ++++++++++++++++++++++++----------------------- 1 file changed, 715 insertions(+), 670 deletions(-) diff --git a/pages/game.html b/pages/game.html index 51f883ae..deff3dcf 100644 --- a/pages/game.html +++ b/pages/game.html @@ -1,6 +1,7 @@ - + + @@ -16,407 +17,313 @@ - + Dots & Boxes Game - + - +
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
- PlayerX's turn -
+
+ PlayerX's turn +
-
-

Scoreboard

-
- +
+

Scoreboard

+
+ +
+
+
+
-
-
-
-
- - - - - - - - - - - - - - + + + + + + + + + + + + + + +
-
-
-

Game Tour

-

- Welcome to the Dot-box game presented by Chrome Gaming!

- Dot-Box is a game where players take turns drawing lines between - dots to create boxes. The player who completes the most boxes wins. - It's a simple yet strategic game enjoyed by people of all ages. - Click the "Next" button to start the tour. -

-
- - +
+
+

Game Tour

+

+ Welcome to the Dot-box game presented by Chrome Gaming!

+ Dot-Box is a game where players take turns drawing lines between + dots to create boxes. The player who completes the most boxes wins. + It's a simple yet strategic game enjoyed by people of all ages. + Click the "Next" button to start the tour. +

+
+ + +
-
-
-

Step 1

-

- This is Game Board! This is where the game is displayed, Play here - by connecting the lines. -

-
- - - +
+

Step 1

+

+ This is Game Board! This is where the game is displayed, Play here + by connecting the lines. +

+
+ + + +
-
-
-

Step 2

-

- Here's where the player's score is displayed, Keep track of your - score as you play the game -

-
- - - +
+

Step 2

+

+ Here's where the player's score is displayed, Keep track of your + score as you play the game +

+
+ + + +
-
-
-

Step 3

-

Here you can see the player's turn indicator.

-
- - - +
+

Step 3

+

Here you can see the player's turn indicator.

+
+ + + +
-
-
-

Step 4

-

This is the live draggable scoreboard. Hold and move to your desired place

-
- - - +
+

Step 4

+

This is the live draggable scoreboard. Hold and move to your desired place

+
+ + + +
-
-
-

Step 5

-

This is the home button. Click to go back to the homepage.

-
- - - +
+

Step 5

+

This is the home button. Click to go back to the homepage. Besides it there is a 30s timer for each + player turn, you have to make a move before time gets up!

+
+ + + +
-
-
-

Step 6

-

- This is the sound toggle button. Click to mute/unmute the sound. - Besides it there is a reset/restart button. -

-
- - - +
+

Step 6

+

+ This is the sound toggle button. Click to mute/unmute the sound. + Besides it there is a reset/restart button. +

+
+ + + +
-
-
-

Step 7

-

Now you are ready to start the game. Have fun!

-
- - +
+

Step 7

+

Now you are ready to start the game. Have fun!

+
+ + +
-
- const closeTour = () => { - document.getElementById("tour-overlay").style.display = "none"; - }; + - document.querySelectorAll("#next-step").forEach((button) => { - button.addEventListener("click", nextStep); - }); + + - document.querySelectorAll("#skip-tour").forEach((button) => { - button.addEventListener("click", skipTour); - }); - - document.querySelectorAll("#close-tour").forEach((button) => { - button.addEventListener("click", closeTour); - }); - - document.getElementById("tour-overlay").style.display = "flex"; - showStep(currentStep); - }); - - - + \ No newline at end of file