Skip to content

Commit fd6cdc6

Browse files
devrutu143devrutu143
authored
Create script.js
1 parent 89d4891 commit fd6cdc6

1 file changed

Lines changed: 367 additions & 0 deletions

File tree

‎script.js‎

Lines changed: 367 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,367 @@
1+
// User Name Handling
2+
const userNameInput = document.getElementById('user-name');
3+
const saveNameBtn = document.getElementById('save-name');
4+
const welcomeNote = document.getElementById('welcome-note');
5+
const dashboardSection = document.getElementById('dashboard-section');
6+
const dashboardWelcome = document.getElementById('dashboard-welcome');
7+
const updateNameInput = document.getElementById('update-name');
8+
const updateNameBtn = document.getElementById('update-name-btn');
9+
const nishaQuote = document.getElementById('nisha-quote');
10+
const gamesSection = document.getElementById('games-section');
11+
const leaderboardSection = document.getElementById('leaderboard-section');
12+
const leaderboardList = document.getElementById('leaderboard');
13+
14+
let userName = ''; // No localStorage, reset on load
15+
let scores = JSON.parse(localStorage.getItem('scores')) || { tic: 0, rps: 0, memory: 0 }; // Keep scores in localStorage
16+
17+
const lovelyQuotes = [
18+
"Your smile lights up the world like a starry night.",
19+
"You bring joy to every moment, like a gentle breeze.",
20+
"Your heart is a garden where kindness blooms.",
21+
"You shine brighter than the sun on a summer day.",
22+
"Your presence is a melody that warms the soul."
23+
];
24+
25+
// Ensure welcome screen is shown on load
26+
welcomeNote.classList.remove('hidden');
27+
userNameInput.classList.remove('hidden');
28+
saveNameBtn.classList.remove('hidden');
29+
dashboardSection.classList.add('hidden');
30+
31+
saveNameBtn.addEventListener('click', () => {
32+
const inputName = userNameInput.value.trim();
33+
if (inputName) {
34+
userName = inputName;
35+
showDashboard();
36+
userNameInput.value = ''; // Clear input after submission
37+
}
38+
});
39+
40+
updateNameBtn.addEventListener('click', () => {
41+
const inputName = updateNameInput.value.trim();
42+
if (inputName) {
43+
userName = inputName;
44+
showDashboard();
45+
updateNameInput.value = ''; // Clear input after submission
46+
}
47+
});
48+
49+
function showDashboard() {
50+
// Hide welcome screen
51+
welcomeNote.classList.add('hidden');
52+
userNameInput.classList.add('hidden');
53+
saveNameBtn.classList.add('hidden');
54+
// Show dashboard
55+
dashboardSection.classList.remove('hidden');
56+
gamesSection.classList.add('hidden');
57+
leaderboardSection.classList.add('hidden');
58+
dashboardWelcome.textContent = `Hello, ${userName}! Welcome to your dashboard.`;
59+
if (userName.toLowerCase().includes('nisha')) {
60+
nishaQuote.textContent = lovelyQuotes[Math.floor(Math.random() * lovelyQuotes.length)];
61+
nishaQuote.classList.remove('hidden');
62+
} else {
63+
nishaQuote.classList.add('hidden');
64+
}
65+
}
66+
67+
// Game Navigation
68+
const gamesBtn = document.getElementById('games-btn');
69+
const leaderboardBtn = document.getElementById('leaderboard-btn');
70+
const game1Btn = document.getElementById('game1-btn');
71+
const game2Btn = document.getElementById('game2-btn');
72+
const game3Btn = document.getElementById('game3-btn');
73+
const game1 = document.getElementById('game1');
74+
const game2 = document.getElementById('game2');
75+
const game3 = document.getElementById('game3');
76+
77+
gamesBtn.addEventListener('click', () => showSection(gamesSection));
78+
leaderboardBtn.addEventListener('click', () => showSection(leaderboardSection));
79+
game1Btn.addEventListener('click', () => showSection(game1));
80+
game2Btn.addEventListener('click', () => showSection(game2));
81+
game3Btn.addEventListener('click', () => showSection(game3));
82+
83+
const backBtns = document.querySelectorAll('.back-btn');
84+
backBtns.forEach(btn => {
85+
btn.addEventListener('click', () => showSection(dashboardSection));
86+
});
87+
88+
function showSection(section) {
89+
dashboardSection.classList.add('hidden');
90+
gamesSection.classList.add('hidden');
91+
leaderboardSection.classList.add('hidden');
92+
game1.classList.add('hidden');
93+
game2.classList.add('hidden');
94+
game3.classList.add('hidden');
95+
section.classList.remove('hidden');
96+
}
97+
98+
// Leaderboard
99+
function loadLeaderboard() {
100+
leaderboardList.innerHTML = `
101+
<li>Tic-Tac-Toe Wins: ${scores.tic}</li>
102+
<li>Rock-Paper-Scissors Score: ${scores.rps}</li>
103+
<li>Memory Match Best Moves: ${scores.memory || 'N/A'}</li>
104+
`;
105+
}
106+
107+
function updateScore(game, value) {
108+
if (game === 'memory') {
109+
if (!scores.memory || value < scores.memory) scores.memory = value;
110+
} else {
111+
scores[game] += value;
112+
}
113+
localStorage.setItem('scores', JSON.stringify(scores));
114+
loadLeaderboard();
115+
}
116+
117+
// Game 1: Tic-Tac-Toe vs Rutu
118+
const board = document.getElementById('board');
119+
const message = document.getElementById('message');
120+
const resetTic = document.getElementById('reset-tic');
121+
const difficultySelect = document.getElementById('difficulty');
122+
const thinkingLoader = document.getElementById('thinking-loader');
123+
let currentPlayer = 'X';
124+
let gameBoard = ['', '', '', '', '', '', '', '', ''];
125+
let gameActive = true;
126+
127+
function initTicTacToe() {
128+
board.innerHTML = '';
129+
for (let i = 0; i < 9; i++) {
130+
const cell = document.createElement('div');
131+
cell.classList.add('cell');
132+
cell.dataset.index = i;
133+
cell.addEventListener('click', handleCellClick);
134+
board.appendChild(cell);
135+
}
136+
currentPlayer = 'X';
137+
gameBoard = ['', '', '', '', '', '', '', '', ''];
138+
gameActive = true;
139+
message.textContent = `${userName}'s turn (X)`;
140+
thinkingLoader.classList.add('hidden');
141+
}
142+
143+
function handleCellClick(e) {
144+
if (!gameActive || currentPlayer !== 'X') return;
145+
const index = e.target.dataset.index;
146+
if (gameBoard[index]) return;
147+
gameBoard[index] = 'X';
148+
e.target.textContent = 'X';
149+
e.target.classList.add('fade-in');
150+
if (checkWin('X')) {
151+
message.textContent = `${userName} wins!`;
152+
gameActive = false;
153+
updateScore('tic', 1);
154+
thinkingLoader.classList.add('hidden');
155+
} else if (gameBoard.every(cell => cell)) {
156+
message.textContent = 'Draw!';
157+
gameActive = false;
158+
thinkingLoader.classList.add('hidden');
159+
} else {
160+
currentPlayer = 'O';
161+
message.textContent = `Rutu's turn (O)`;
162+
if (difficultySelect.value === 'hardcore') {
163+
thinkingLoader.classList.remove('hidden');
164+
}
165+
setTimeout(() => rutuMove(), 1000);
166+
}
167+
}
168+
169+
function rutuMove() {
170+
if (!gameActive) return;
171+
const difficulty = difficultySelect.value;
172+
let move;
173+
if (difficulty === 'easy') {
174+
move = easyAIMove();
175+
} else if (difficulty === 'medium') {
176+
move = mediumAIMove();
177+
} else {
178+
move = minimax(gameBoard, 'O').index;
179+
}
180+
if (move !== undefined) {
181+
gameBoard[move] = 'O';
182+
const cell = board.querySelector(`[data-index="${move}"]`);
183+
cell.textContent = 'O';
184+
cell.classList.add('fade-in');
185+
thinkingLoader.classList.add('hidden');
186+
if (checkWin('O')) {
187+
message.textContent = 'Rutu wins!';
188+
gameActive = false;
189+
} else if (gameBoard.every(cell => cell)) {
190+
message.textContent = 'Draw!';
191+
gameActive = false;
192+
} else {
193+
currentPlayer = 'X';
194+
message.textContent = `${userName}'s turn (X)`;
195+
}
196+
}
197+
}
198+
199+
function easyAIMove() {
200+
let emptyCells = gameBoard.map((val, idx) => val ? null : idx).filter(val => val !== null);
201+
return emptyCells[Math.floor(Math.random() * emptyCells.length)];
202+
}
203+
204+
function mediumAIMove() {
205+
for (let i = 0; i < 9; i++) {
206+
if (!gameBoard[i]) {
207+
gameBoard[i] = 'O';
208+
if (checkWin('O')) {
209+
gameBoard[i] = '';
210+
return i;
211+
}
212+
gameBoard[i] = '';
213+
}
214+
}
215+
for (let i = 0; i < 9; i++) {
216+
if (!gameBoard[i]) {
217+
gameBoard[i] = 'X';
218+
if (checkWin('X')) {
219+
gameBoard[i] = '';
220+
return i;
221+
}
222+
gameBoard[i] = '';
223+
}
224+
}
225+
return easyAIMove();
226+
}
227+
228+
function minimax(board, player) {
229+
const emptyCells = board.map((val, idx) => val ? null : idx).filter(val => val !== null);
230+
if (checkWin('O')) return { score: 10 };
231+
if (checkWin('X')) return { score: -10 };
232+
if (emptyCells.length === 0) return { score: 0 };
233+
234+
const moves = [];
235+
for (let i of emptyCells) {
236+
let move = {};
237+
move.index = i;
238+
board[i] = player;
239+
if (player === 'O') {
240+
move.score = minimax(board, 'X').score - 1;
241+
} else {
242+
move.score = minimax(board, 'O').score + 1;
243+
}
244+
board[i] = '';
245+
moves.push(move);
246+
}
247+
248+
let bestMove;
249+
if (player === 'O') {
250+
let bestScore = -Infinity;
251+
for (let move of moves) {
252+
if (move.score > bestScore) {
253+
bestScore = move.score;
254+
bestMove = move;
255+
}
256+
}
257+
} else {
258+
let bestScore = Infinity;
259+
for (let move of moves) {
260+
if (move.score < bestScore) {
261+
bestScore = move.score;
262+
bestMove = move;
263+
}
264+
}
265+
}
266+
return bestMove;
267+
}
268+
269+
function checkWin(player) {
270+
const wins = [
271+
[0,1,2], [3,4,5], [6,7,8],
272+
[0,3,6], [1,4,7], [2,5,8],
273+
[0,4,8], [2,4,6]
274+
];
275+
return wins.some(combo => combo.every(i => gameBoard[i] === player));
276+
}
277+
278+
resetTic.addEventListener('click', initTicTacToe);
279+
initTicTacToe();
280+
281+
// Game 2: Rock-Paper-Scissors
282+
const choices = document.querySelectorAll('.choice');
283+
const result = document.getElementById('result');
284+
const scoreEl = document.getElementById('score');
285+
const vsGraphic = document.getElementById('vs-graphic');
286+
let rpsScore = 0;
287+
288+
choices.forEach(choice => {
289+
choice.addEventListener('click', (e) => {
290+
choice.classList.add('bounce');
291+
setTimeout(() => choice.classList.remove('bounce'), 300);
292+
const userChoice = e.target.dataset.choice;
293+
const computerChoice = ['rock', 'paper', 'scissors'][Math.floor(Math.random() * 3)];
294+
let outcome = '';
295+
if (userChoice === computerChoice) {
296+
outcome = 'Tie!';
297+
} else if (
298+
(userChoice === 'rock' && computerChoice === 'scissors') ||
299+
(userChoice === 'paper' && computerChoice === 'rock') ||
300+
(userChoice === 'scissors' && computerChoice === 'paper')
301+
) {
302+
outcome = 'You win!';
303+
rpsScore++;
304+
updateScore('rps', 1);
305+
} else {
306+
outcome = 'Computer wins!';
307+
}
308+
result.textContent = `You: ${userChoice} | Computer: ${computerChoice} | ${outcome}`;
309+
scoreEl.textContent = rpsScore;
310+
vsGraphic.classList.remove('hidden');
311+
setTimeout(() => vsGraphic.classList.add('hidden'), 500);
312+
});
313+
});
314+
315+
// Game 3: Memory Match
316+
const memoryBoard = document.getElementById('memory-board');
317+
const movesEl = document.getElementById('moves');
318+
const resetMemory = document.getElementById('reset-memory');
319+
let cards = ['A','A','B','B','C','C','D','D','E','E','F','F','G','G','H','H'];
320+
let shuffledCards = cards.sort(() => 0.5 - Math.random());
321+
let flippedCards = [];
322+
let moves = 0;
323+
324+
function initMemory() {
325+
memoryBoard.innerHTML = '';
326+
shuffledCards = cards.sort(() => 0.5 - Math.random());
327+
shuffledCards.forEach((val, idx) => {
328+
const card = document.createElement('div');
329+
card.classList.add('card');
330+
card.dataset.value = val;
331+
card.dataset.index = idx;
332+
card.addEventListener('click', handleCardClick);
333+
memoryBoard.appendChild(card);
334+
});
335+
flippedCards = [];
336+
moves = 0;
337+
movesEl.textContent = moves;
338+
}
339+
340+
function handleCardClick(e) {
341+
if (flippedCards.length === 2 || e.target.classList.contains('flipped') || e.target.classList.contains('matched')) return;
342+
e.target.classList.add('flipped');
343+
e.target.textContent = e.target.dataset.value;
344+
flippedCards.push(e.target);
345+
if (flippedCards.length === 2) {
346+
moves++;
347+
movesEl.textContent = moves;
348+
if (flippedCards[0].dataset.value === flippedCards[1].dataset.value) {
349+
flippedCards.forEach(card => card.classList.add('matched'));
350+
flippedCards = [];
351+
if (document.querySelectorAll('.matched').length === cards.length) {
352+
updateScore('memory', moves);
353+
}
354+
} else {
355+
setTimeout(() => {
356+
flippedCards.forEach(card => {
357+
card.classList.remove('flipped');
358+
card.textContent = '';
359+
});
360+
flippedCards = [];
361+
}, 1000);
362+
}
363+
}
364+
}
365+
366+
resetMemory.addEventListener('click', initMemory);
367+
initMemory();

0 commit comments

Comments
 (0)