Skip to content

Commit d27b89f

Browse files
pradipchaudharypradipchaudhary
authored
Merge pull request #113 from pradipchaudhary/project80
Project80
2 parents 0d543c7 + deeef16 commit d27b89f

File tree

9 files changed

+571
-0
lines changed

9 files changed

+571
-0
lines changed

‎78-Battleship/index.html‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<link rel="stylesheet" href="style.css" />
7+
<title>Battleship Game</title>
8+
</head>
9+
<body>
10+
<div id="game-container">
11+
<div id="player-board" class="board"></div>
12+
<div id="computer-board" class="board"></div>
13+
<div id="message" class="hidden"></div>
14+
<button id="reset-button">New Game</button>
15+
</div>
16+
<script src="script.js"></script>
17+
</body>
18+
</html>

‎78-Battleship/script.js‎

Lines changed: 172 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,172 @@
1+
document.addEventListener("DOMContentLoaded", () => {
2+
const playerBoard = document.getElementById("player-board");
3+
const computerBoard = document.getElementById("computer-board");
4+
const messageElement = document.getElementById("message");
5+
const resetButton = document.getElementById("reset-button");
6+
7+
const boardSize = 10;
8+
const shipLengths = [5, 4, 3, 3, 2];
9+
let playerBoardArray = createEmptyBoard();
10+
let computerBoardArray = createEmptyBoard();
11+
let playerShips = placeShips(playerBoardArray);
12+
let computerShips = placeShips(computerBoardArray);
13+
14+
// Function to create an empty game board
15+
function createEmptyBoard() {
16+
return Array.from({ length: boardSize }, () =>
17+
Array(boardSize).fill(0)
18+
);
19+
}
20+
21+
// Function to place ships on the board
22+
function placeShips(board) {
23+
const ships = [];
24+
for (const length of shipLengths) {
25+
let ship;
26+
do {
27+
ship = generateRandomShip(length);
28+
} while (shipCollides(ship, board));
29+
30+
ships.push(ship);
31+
32+
for (const { x, y } of ship) {
33+
board[y][x] = 1;
34+
}
35+
}
36+
return ships;
37+
}
38+
39+
// Function to generate a random ship
40+
function generateRandomShip(length) {
41+
const isVertical = Math.random() < 0.5;
42+
const x = Math.floor(
43+
Math.random() * (boardSize - (isVertical ? 0 : length))
44+
);
45+
const y = Math.floor(
46+
Math.random() * (boardSize - (isVertical ? length : 0))
47+
);
48+
49+
return Array.from({ length }, (_, i) => ({
50+
x: isVertical ? x : x + i,
51+
y: isVertical ? y + i : y,
52+
}));
53+
}
54+
55+
// Function to check if a ship collides with another ship on the board
56+
function shipCollides(ship, board) {
57+
for (const { x, y } of ship) {
58+
if (board[y][x] === 1) {
59+
return true;
60+
}
61+
}
62+
return false;
63+
}
64+
65+
// Function to handle player's move
66+
function handlePlayerMove(x, y) {
67+
if (computerBoardArray[y][x] === 1) {
68+
computerBoardArray[y][x] = 2; // Mark as hit
69+
playerBoardArray[y][x] = 2; // Update player's board
70+
renderBoards();
71+
checkGameStatus();
72+
} else {
73+
playerBoardArray[y][x] = -1; // Mark as miss
74+
computerMove();
75+
}
76+
}
77+
78+
// Function for the computer's move
79+
function computerMove() {
80+
let x, y;
81+
do {
82+
x = Math.floor(Math.random() * boardSize);
83+
y = Math.floor(Math.random() * boardSize);
84+
} while (playerBoardArray[y][x] === -1 || playerBoardArray[y][x] === 2);
85+
86+
if (playerBoardArray[y][x] === 1) {
87+
playerBoardArray[y][x] = 2; // Mark as hit
88+
computerMove(); // Computer gets another turn after a hit
89+
} else {
90+
playerBoardArray[y][x] = -1; // Mark as miss
91+
renderBoards();
92+
}
93+
94+
checkGameStatus();
95+
}
96+
97+
// Function to check the game status
98+
function checkGameStatus() {
99+
if (allShipsSunk(playerShips)) {
100+
displayMessage(
101+
"Congratulations! You sank all the computer's ships!"
102+
);
103+
} else if (allShipsSunk(computerShips)) {
104+
displayMessage("Game over! The computer sank all your ships.");
105+
}
106+
}
107+
108+
// Function to check if all ships are sunk
109+
function allShipsSunk(ships) {
110+
return ships.every((ship) =>
111+
ship.every(({ x, y }) => computerBoardArray[y][x] === 2)
112+
);
113+
}
114+
115+
// Function to render the game boards
116+
function renderBoards() {
117+
renderBoard(playerBoard, playerBoardArray, true);
118+
renderBoard(computerBoard, computerBoardArray, false);
119+
}
120+
121+
// Function to render a game board
122+
function renderBoard(boardElement, boardArray, playerBoard) {
123+
boardElement.innerHTML = "";
124+
125+
for (let y = 0; y < boardSize; y++) {
126+
for (let x = 0; x < boardSize; x++) {
127+
const cell = document.createElement("div");
128+
cell.classList.add("cell");
129+
130+
if (boardArray[y][x] === 1 && playerBoard) {
131+
cell.classList.add("ship");
132+
} else if (boardArray[y][x] === 2) {
133+
cell.classList.add("hit");
134+
} else if (boardArray[y][x] === -1) {
135+
cell.textContent = "X";
136+
}
137+
138+
if (playerBoard) {
139+
cell.addEventListener("click", () =>
140+
handlePlayerMove(x, y)
141+
);
142+
}
143+
144+
boardElement.appendChild(cell);
145+
}
146+
}
147+
}
148+
149+
// Function to display a message
150+
function displayMessage(message) {
151+
messageElement.textContent = message;
152+
messageElement.classList.remove("hidden");
153+
}
154+
155+
// Function to reset the game
156+
function resetGame() {
157+
playerBoardArray = createEmptyBoard();
158+
computerBoardArray = createEmptyBoard();
159+
playerShips = placeShips(playerBoardArray);
160+
computerShips = placeShips(computerBoardArray);
161+
162+
messageElement.classList.add("hidden");
163+
164+
renderBoards();
165+
}
166+
167+
// Event listener for the reset button
168+
resetButton.addEventListener("click", resetGame);
169+
170+
// Initial game setup
171+
renderBoards();
172+
});

‎78-Battleship/style.css‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
body {
2+
display: flex;
3+
align-items: center;
4+
justify-content: center;
5+
height: 100vh;
6+
margin: 0;
7+
font-family: "Arial", sans-serif;
8+
}
9+
10+
#game-container {
11+
text-align: center;
12+
}
13+
14+
.board {
15+
display: grid;
16+
grid-template-columns: repeat(10, 30px);
17+
gap: 5px;
18+
margin-top: 20px;
19+
}
20+
21+
.cell {
22+
width: 30px;
23+
height: 30px;
24+
border: 1px solid #ddd;
25+
display: flex;
26+
align-items: center;
27+
justify-content: center;
28+
cursor: pointer;
29+
}
30+
31+
.ship {
32+
background-color: #3498db;
33+
}
34+
35+
.hit {
36+
background-color: #e74c3c;
37+
}
38+
39+
.hidden {
40+
display: none;
41+
}
42+
43+
#reset-button {
44+
padding: 10px;
45+
font-size: 16px;
46+
cursor: pointer;
47+
margin-top: 20px;
48+
}

‎79-Crossword Puzzle/index.html‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<link rel="stylesheet" href="style.css" />
7+
<title>Crossword Puzzle</title>
8+
</head>
9+
<body>
10+
<div id="puzzle-container">
11+
<div id="puzzle-board" class="board"></div>
12+
<div id="word-input">
13+
<label for="word">Enter word:</label>
14+
<input type="text" id="word" maxlength="15" />
15+
<button id="submit-button">Submit</button>
16+
</div>
17+
<div id="message" class="hidden"></div>
18+
<button id="reset-button">New Puzzle</button>
19+
</div>
20+
<script src="script.js"></script>
21+
</body>
22+
</html>

‎79-Crossword Puzzle/script.js‎

Lines changed: 116 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
document.addEventListener("DOMContentLoaded", () => {
2+
const puzzleBoard = document.getElementById("puzzle-board");
3+
const wordInput = document.getElementById("word");
4+
const submitButton = document.getElementById("submit-button");
5+
const messageElement = document.getElementById("message");
6+
const resetButton = document.getElementById("reset-button");
7+
8+
const puzzleSize = 10;
9+
const puzzleWords = ["JAVASCRIPT", "HTML", "CSS", "WEB", "DEVELOPER"];
10+
let puzzleGrid = createPuzzleGrid();
11+
12+
// Function to create an empty crossword puzzle grid
13+
function createPuzzleGrid() {
14+
return Array.from({ length: puzzleSize }, () =>
15+
Array(puzzleSize).fill("")
16+
);
17+
}
18+
19+
// Function to render the puzzle grid
20+
function renderPuzzle() {
21+
puzzleBoard.innerHTML = "";
22+
23+
for (let y = 0; y < puzzleSize; y++) {
24+
for (let x = 0; x < puzzleSize; x++) {
25+
const cell = document.createElement("div");
26+
cell.classList.add("cell");
27+
cell.textContent = puzzleGrid[y][x];
28+
cell.addEventListener("click", () => handleCellClick(x, y));
29+
puzzleBoard.appendChild(cell);
30+
}
31+
}
32+
}
33+
34+
// Function to handle cell click
35+
function handleCellClick(x, y) {
36+
if (wordInput.value.length === 0) return;
37+
38+
const direction = confirm(
39+
"Choose direction: Horizontal (OK) or Vertical (Cancel)"
40+
)
41+
? "H"
42+
: "V";
43+
const word = wordInput.value.toUpperCase();
44+
45+
if (checkWordFit(word, x, y, direction)) {
46+
placeWord(word, x, y, direction);
47+
wordInput.value = "";
48+
renderPuzzle();
49+
checkPuzzleComplete();
50+
} else {
51+
alert("Word does not fit in the selected direction. Try again.");
52+
}
53+
}
54+
55+
// Function to check if the word fits in the given direction
56+
function checkWordFit(word, startX, startY, direction) {
57+
const maxLength =
58+
direction === "H" ? puzzleSize - startX : puzzleSize - startY;
59+
60+
return word.length <= maxLength;
61+
}
62+
63+
// Function to place the word in the puzzle grid
64+
function placeWord(word, startX, startY, direction) {
65+
for (let i = 0; i < word.length; i++) {
66+
const x = direction === "H" ? startX + i : startX;
67+
const y = direction === "V" ? startY + i : startY;
68+
puzzleGrid[y][x] = word[i];
69+
}
70+
}
71+
72+
// Function to check if the puzzle is complete
73+
function checkPuzzleComplete() {
74+
const puzzleComplete = puzzleWords.every((word) => {
75+
return (
76+
puzzleGrid.some(
77+
(row) =>
78+
row.includes(word) ||
79+
row.includes(word.split("").reverse().join(""))
80+
) ||
81+
puzzleGrid.some(
82+
(col) =>
83+
col.includes(word) ||
84+
col.includes(word.split("").reverse().join(""))
85+
)
86+
);
87+
});
88+
89+
if (puzzleComplete) {
90+
displayMessage("Congratulations! Puzzle Complete!");
91+
}
92+
}
93+
94+
// Function to display a message
95+
function displayMessage(message) {
96+
messageElement.textContent = message;
97+
messageElement.classList.remove("hidden");
98+
}
99+
100+
// Function to reset the puzzle
101+
function resetPuzzle() {
102+
puzzleGrid = createPuzzleGrid();
103+
renderPuzzle();
104+
messageElement.classList.add("hidden");
105+
wordInput.value = "";
106+
}
107+
108+
// Event listener for the submit button
109+
submitButton.addEventListener("click", () => handleCellClick(0, 0));
110+
111+
// Event listener for the reset button
112+
resetButton.addEventListener("click", resetPuzzle);
113+
114+
// Initial puzzle setup
115+
renderPuzzle();
116+
});

0 commit comments

Comments
 (0)