Skip to content

Commit 8a7921c

Browse files
Dinesh1042Dinesh1042
authored
Sos Game
1 parent 69a02d0 commit 8a7921c

File tree

7 files changed

+799
-0
lines changed

7 files changed

+799
-0
lines changed

‎Sos Game/css/style.css‎

Lines changed: 2 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎Sos Game/css/style.css.map‎

Lines changed: 9 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎Sos Game/index.html‎

Lines changed: 108 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,108 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<link rel="stylesheet" href="./css/style.css" />
8+
<script defer type="module" src="./scripts/script.js"></script>
9+
<title>SOS</title>
10+
</head>
11+
<body>
12+
<div class="container">
13+
<a href="/" class="brand d-none">
14+
<h1>SOS</h1>
15+
</a>
16+
<header class="header d-none">
17+
<div id="players" class="players">
18+
<div class="player-1">
19+
<h6 id="player1Name">PLAYER 1</h6>
20+
<span id="player1Score">0</span>
21+
</div>
22+
<div class="player-2">
23+
<h6 id="player2Name">PLAYER 2</h6>
24+
<span id="player2Score">0</span>
25+
</div>
26+
</div>
27+
<div class="current-player">
28+
<h6>CURRENT PLAYER</h6>
29+
<h4 id="currentPlayerName">PLAYER 1</h4>
30+
</div>
31+
</header>
32+
<div class="board"></div>
33+
34+
<div class="game-modal">
35+
<div class="modal">
36+
<div class="modal-header">
37+
<h3 class="modal-title">Create new game</h3>
38+
</div>
39+
<div class="modal-body">
40+
<form class="form" id="form">
41+
<div class="form-group">
42+
<label for="player1Name" class="form-label"
43+
>Player 1 Name</label
44+
>
45+
<input
46+
class="form-control"
47+
type="text"
48+
maxlength="10"
49+
id="player1Name"
50+
placeholder="Player 1"
51+
/>
52+
</div>
53+
<div class="form-group">
54+
<label for="player2Name" class="form-label"
55+
>Player 2 Name</label
56+
>
57+
<input
58+
class="form-control"
59+
type="text"
60+
maxlength="10"
61+
id="player2Name"
62+
placeholder="Player 2"
63+
/>
64+
</div>
65+
<div class="form-group">
66+
<label for="boardSize" class="form-label">Board Size</label>
67+
<input
68+
class="form-control"
69+
type="number"
70+
min="3"
71+
max="20"
72+
id="boardSize"
73+
placeholder="7"
74+
/>
75+
</div>
76+
<div class="cta-btn">
77+
<button type="submit" class="btn btn-primary">Create</button>
78+
</div>
79+
</form>
80+
</div>
81+
</div>
82+
</div>
83+
84+
<div class="winner-modal">
85+
<div class="modal">
86+
<header class="modal-header">
87+
<h2 id="winnerName">DINESH</h2>
88+
<h6 id="wonText">WON THE GAME</h6>
89+
</header>
90+
<div class="modal-body">
91+
<div class="players">
92+
<div class="player1-score">
93+
<h6 id="player1Name">YOUR SCORE</h6>
94+
<span id="winnerScore">0</span>
95+
</div>
96+
<div class="player2-score">
97+
<h6 id="player2Name">OPPONENT SCORE</h6>
98+
<span id="opponentScore">0</span>
99+
</div>
100+
</div>
101+
<div class="btn btn-success">Restart</div>
102+
</div>
103+
</div>
104+
</div>
105+
<div class="modal-backdrop"></div>
106+
</div>
107+
</body>
108+
</html>

‎Sos Game/scripts/form.js‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
const formEl = document.getElementById("form");
2+
3+
export function createNewGameForm(e) {
4+
const player1NameEl = formEl.querySelector("#player1Name");
5+
const player2NameEl = formEl.querySelector("#player2Name");
6+
const boardSizeEl = formEl.querySelector("#boardSize");
7+
8+
const player1Name = player1NameEl.value.trim() || "Player 1";
9+
const player2Name = player2NameEl.value.trim() || "Player 2";
10+
const boardSize = +boardSizeEl.value || 7;
11+
12+
const players = [
13+
{
14+
id: "PLAYER1",
15+
playerName: player1Name,
16+
score: 0,
17+
},
18+
{
19+
id: "PLAYER2",
20+
playerName: player2Name,
21+
score: 0,
22+
},
23+
];
24+
25+
return { boardSize, players };
26+
}

0 commit comments

Comments
 (0)