Skip to content

Commit 5bddfb4

Browse files
swapnilsparshswapnilsparsh
authored
Merge branch 'master' into reverse-memory-game
2 parents 0b64d1f + c1dfd77 commit 5bddfb4

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

82 files changed

+22244
-1893
lines changed

‎.vscode/settings.json

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎01 - Drum Kit/index.html

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,15 @@
33

44
<head>
55
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
67
<title>Drum Kit</title>
78
<link rel="stylesheet" href="style.css">
89
<link rel="icon" href="assets/drum.png">
910
<link rel="icon" href="assets/favicon.png">
1011
</head>
1112

1213
<body>
14+
<div id="container">
1315
<h1 id="title">Drum Kit</h1>
1416
<div class="keys">
1517
<div data-key="65" class="A key">
@@ -69,6 +71,7 @@ <h1 id="title">Drum Kit</h1>
6971
</p>
7072
</footer>
7173

74+
</div>
7275
<script src="main.js"></script>
7376

7477
</body>

‎01 - Drum Kit/style.css

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ h1 {
1818
color: #FEFFE2;
1919
font-family: "Arvo", cursive;
2020
text-align: center;
21+
margin-bottom: 0;
2122
}
2223

2324
span {
@@ -26,8 +27,9 @@ span {
2627

2728
.keys {
2829
display: flex;
30+
flex-wrap: wrap;
2931
flex: 1;
30-
min-height: 40vh;
32+
align-content: center;
3133
align-items: center;
3234
justify-content: center;
3335
}
@@ -39,7 +41,7 @@ span {
3941
font-size: 1.5rem;
4042
padding: 1rem .5rem;
4143
transition: all .07s ease;
42-
width: 10rem;
44+
width: 78pt;
4345
text-align: center;
4446
color: white;
4547
background-color: #212121;
@@ -72,14 +74,17 @@ footer {
7274
text-align: center;
7375
color: white;
7476
font-size: 1.5rem;
75-
position: absolute;
76-
left: 0;
77-
right: 0;
78-
bottom: 0;
7977
margin-bottom: 0;
8078
padding: 5px;
8179
}
8280

8381
footer a:visited {
8482
color: inherit;
83+
}
84+
85+
#container{
86+
height: 100vh;
87+
display: flex;
88+
flex-direction: column;
89+
justify-content: space-between;
8590
}

‎108 - Maths addition/app.js

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,8 +20,13 @@ button.addEventListener('click', function () {
2020

2121
let guess = document.getElementById('guess').value;
2222
guess = Number(guess);
23+
if(guess==" ")
24+
{
25+
alert("please enter the value")
26+
}
27+
2328
//check answer
24-
if (guess === total) {
29+
else if(guess === total) {
2530
alert('Correct');
2631
window.location.reload()
2732
} else {

‎108 - Maths addition/index.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@
1212
<body>
1313
<div id="canvas">
1414
<div id="primary-number">7</div>
15+
1516
<div id="add">+</div>
1617
<div id="secondary-number">10</div>
1718
<div id="equal">=</div>

‎117 - Guess the shape/index.html renamed to ‎116 - Guess the shape/index.html

File renamed without changes.

‎117 - Guess the shape/script.js renamed to ‎116 - Guess the shape/script.js

File renamed without changes.

‎117 - Guess the shape/style.css renamed to ‎116 - Guess the shape/style.css

File renamed without changes.

‎118 - Shell Game/README.MD renamed to ‎116 - Shell Game/README.MD

‎118 - Shell Game/bowl.png renamed to ‎116 - Shell Game/bowl.png

File renamed without changes.

‎118 - Shell Game/index.html renamed to ‎116 - Shell Game/index.html

File renamed without changes.

‎118 - Shell Game/script.js renamed to ‎116 - Shell Game/script.js

File renamed without changes.

‎118 - Shell Game/style.css renamed to ‎116 - Shell Game/style.css

File renamed without changes.

‎116 - Tower of Hanoi/index.html renamed to ‎117 - Tower of Hanoi/index.html

File renamed without changes.

‎116 - Tower of Hanoi/script.js renamed to ‎117 - Tower of Hanoi/script.js

File renamed without changes.

‎116 - Tower of Hanoi/style.css renamed to ‎117 - Tower of Hanoi/style.css

File renamed without changes.

‎119 - 3D Distance Calculator/index.html renamed to ‎118 - 3D Distance Calculator/index.html

File renamed without changes.

‎119 - 3D Distance Calculator/script.js renamed to ‎118 - 3D Distance Calculator/script.js

File renamed without changes.

‎119 - 3D Distance Calculator/style.css renamed to ‎118 - 3D Distance Calculator/style.css

File renamed without changes.

‎120 - Match Three/index.html renamed to ‎118 - Match Three/index.html

File renamed without changes.

‎120 - Match Three/script.js renamed to ‎118 - Match Three/script.js

File renamed without changes.

‎120 - Match Three/style.css renamed to ‎118 - Match Three/style.css

File renamed without changes.

‎121 - Taash Game/README.md renamed to ‎119 - Taash Game/README.md

‎121 - Taash Game/Taash Game.png renamed to ‎119 - Taash Game/Taash Game.png

File renamed without changes.

‎121 - Taash Game/images/10.png renamed to ‎119 - Taash Game/images/10.png

File renamed without changes.

‎121 - Taash Game/images/2.png renamed to ‎119 - Taash Game/images/2.png

File renamed without changes.

‎121 - Taash Game/images/3.png renamed to ‎119 - Taash Game/images/3.png

File renamed without changes.

‎121 - Taash Game/images/4.png renamed to ‎119 - Taash Game/images/4.png

File renamed without changes.

‎121 - Taash Game/images/5.png renamed to ‎119 - Taash Game/images/5.png

File renamed without changes.

‎121 - Taash Game/images/6.png renamed to ‎119 - Taash Game/images/6.png

File renamed without changes.

‎121 - Taash Game/images/7.png renamed to ‎119 - Taash Game/images/7.png

File renamed without changes.

‎121 - Taash Game/images/8.png renamed to ‎119 - Taash Game/images/8.png

File renamed without changes.

‎121 - Taash Game/images/9.png renamed to ‎119 - Taash Game/images/9.png

File renamed without changes.

‎121 - Taash Game/images/A.png renamed to ‎119 - Taash Game/images/A.png

File renamed without changes.

‎121 - Taash Game/images/J.png renamed to ‎119 - Taash Game/images/J.png

File renamed without changes.

‎121 - Taash Game/images/K.png renamed to ‎119 - Taash Game/images/K.png

File renamed without changes.

‎121 - Taash Game/images/Q.png renamed to ‎119 - Taash Game/images/Q.png

File renamed without changes.

‎121 - Taash Game/index.html renamed to ‎119 - Taash Game/index.html

File renamed without changes.

‎121 - Taash Game/script.js renamed to ‎119 - Taash Game/script.js

File renamed without changes.

‎121 - Taash Game/sounds/aww.mp3 renamed to ‎119 - Taash Game/sounds/aww.mp3

File renamed without changes.

‎121 - Taash Game/sounds/cash.mp3 renamed to ‎119 - Taash Game/sounds/cash.mp3

File renamed without changes.

‎121 - Taash Game/sounds/swish.m4a renamed to ‎119 - Taash Game/sounds/swish.m4a

File renamed without changes.

‎121 - Taash Game/style.css renamed to ‎119 - Taash Game/style.css

File renamed without changes.

‎124 - 2048 Game/game.js

Lines changed: 215 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,215 @@
1+
document.addEventListener("DOMContentLoaded", () => {
2+
const gridDisplay = document.querySelector('.grid-container');
3+
const scoreDisplay = document.querySelector('.score-container');
4+
const bestDisplay = document.querySelector('.best-container');
5+
const newGameButton = document.querySelector('.new-game-button');
6+
const tileContainer = document.querySelector('.tile-container');
7+
let tiles = [];
8+
let score = 0;
9+
let best = 0;
10+
11+
// Create the playing board
12+
function createBoard() {
13+
gridDisplay.innerHTML = ''; // Clear previous grid cells
14+
tiles = []; // Reset tiles array
15+
for (let i = 0; i < 16; i++) {
16+
let tile = document.createElement('div');
17+
tile.classList.add('grid-cell');
18+
gridDisplay.appendChild(tile);
19+
tiles.push(0);
20+
}
21+
addNumber();
22+
addNumber();
23+
}
24+
25+
// Add a number to the board
26+
function addNumber() {
27+
let emptyTiles = [];
28+
tiles.forEach((tile, index) => {
29+
if (tile === 0) emptyTiles.push(index);
30+
});
31+
if (emptyTiles.length > 0) {
32+
let randomNumber = emptyTiles[Math.floor(Math.random() * emptyTiles.length)];
33+
tiles[randomNumber] = 2;
34+
displayTiles();
35+
}
36+
}
37+
38+
// Display the tiles on the board
39+
function displayTiles() {
40+
tileContainer.innerHTML = '';
41+
if(window.innerWidth > 530){
42+
tiles.forEach((tile, index) => {
43+
if (tile !== 0) {
44+
let tileElement = document.createElement('div');
45+
tileElement.classList.add('tile');
46+
tileElement.classList.add(`tile-${tile}`);
47+
tileElement.innerText = tile;
48+
tileElement.style.top = `${Math.floor(index / 4) * 110}px`;
49+
tileElement.style.left = `${(index % 4) * 110}px`;
50+
tileContainer.appendChild(tileElement);
51+
}
52+
});
53+
} else {
54+
tiles.forEach((tile, index) => {
55+
if (tile !== 0) {
56+
let tileElement = document.createElement('div');
57+
tileElement.classList.add('tile');
58+
tileElement.classList.add(`tile-${tile}`);
59+
tileElement.innerText = tile;
60+
tileElement.style.top = `${Math.floor(index / 4) * 80}px`;
61+
tileElement.style.left = `${(index % 4) * 80}px`;
62+
tileContainer.appendChild(tileElement);
63+
}
64+
});
65+
}
66+
67+
checkForGameOver();
68+
checkForWin();
69+
}
70+
71+
// Check for game over condition
72+
function checkForGameOver() {
73+
if (!tiles.includes(0)) {
74+
for (let i = 0; i < 4; i++) {
75+
for (let j = 0; j < 4; j++) {
76+
let currentIndex = i * 4 + j;
77+
if (j < 3 && tiles[currentIndex] === tiles[currentIndex + 1]) return; // Check horizontal
78+
if (i < 3 && tiles[currentIndex] === tiles[currentIndex + 4]) return; // Check vertical
79+
}
80+
}
81+
alert("Game Over! No more moves available.");
82+
}
83+
}
84+
85+
// Check for 2048 tile
86+
function checkForWin() {
87+
if (tiles.includes(2048)) {
88+
alert("Congratulations! You've reached the 2048 tile!");
89+
}
90+
}
91+
92+
// Handle swipe events
93+
function moveTiles(direction) {
94+
let newTiles = [...tiles];
95+
for (let i = 0; i < 4; i++) {
96+
let row = [];
97+
for (let j = 0; j < 4; j++) {
98+
if (direction === 'right' || direction === 'left') {
99+
row.push(newTiles[i * 4 + j]);
100+
} else {
101+
row.push(newTiles[j * 4 + i]);
102+
}
103+
}
104+
if (direction === 'right' || direction === 'down') {
105+
row = row.reverse();
106+
}
107+
row = slide(row);
108+
if (direction === 'right' || direction === 'down') {
109+
row = row.reverse();
110+
}
111+
for (let j = 0; j < 4; j++) {
112+
if (direction === 'right' || direction === 'left') {
113+
newTiles[i * 4 + j] = row[j];
114+
} else {
115+
newTiles[j * 4 + i] = row[j];
116+
}
117+
}
118+
}
119+
if (JSON.stringify(newTiles) !== JSON.stringify(tiles)) {
120+
tiles = newTiles;
121+
addNumber();
122+
displayTiles();
123+
}
124+
}
125+
126+
function slide(row) {
127+
let newRow = row.filter(tile => tile);
128+
for (let i = 0; i < newRow.length - 1; i++) {
129+
if (newRow[i] === newRow[i + 1]) {
130+
newRow[i] *= 2;
131+
score += newRow[i];
132+
newRow.splice(i + 1, 1);
133+
newRow.push(0);
134+
}
135+
}
136+
while (newRow.length < 4) {
137+
newRow.push(0);
138+
}
139+
return newRow;
140+
}
141+
142+
// Listen for key presses
143+
document.addEventListener('keydown', e => {
144+
if (e.key === 'ArrowRight') {
145+
moveTiles('right');
146+
} else if (e.key === 'ArrowLeft') {
147+
moveTiles('left');
148+
} else if (e.key === 'ArrowUp') {
149+
moveTiles('up');
150+
} else if (e.key === 'ArrowDown') {
151+
moveTiles('down');
152+
}
153+
scoreDisplay.textContent = score;
154+
if (score > best) {
155+
best = score;
156+
bestDisplay.textContent = best;
157+
}
158+
});
159+
160+
// Variables to store touch positions
161+
let touchStartX = 0;
162+
let touchStartY = 0;
163+
let touchEndX = 0;
164+
let touchEndY = 0;
165+
166+
// Function to handle swipe detection
167+
function handleSwipe() {
168+
const diffX = touchEndX - touchStartX;
169+
const diffY = touchEndY - touchStartY;
170+
171+
if (Math.abs(diffX) > Math.abs(diffY)) {
172+
// Horizontal swipe
173+
if (diffX > 0) {
174+
moveTiles('right');
175+
} else {
176+
moveTiles('left');
177+
}
178+
} else {
179+
// Vertical swipe
180+
if (diffY > 0) {
181+
moveTiles('down');
182+
} else {
183+
moveTiles('up');
184+
}
185+
}
186+
scoreDisplay.textContent = score;
187+
if (score > best) {
188+
best = score;
189+
bestDisplay.textContent = best;
190+
}
191+
}
192+
193+
// Event listeners for touch events
194+
document.addEventListener('touchstart', e => {
195+
touchStartX = e.changedTouches[0].screenX;
196+
touchStartY = e.changedTouches[0].screenY;
197+
});
198+
199+
document.addEventListener('touchend', e => {
200+
touchEndX = e.changedTouches[0].screenX;
201+
touchEndY = e.changedTouches[0].screenY;
202+
handleSwipe();
203+
});
204+
205+
206+
// Start a new game
207+
newGameButton.addEventListener('click', () => {
208+
score = 0;
209+
scoreDisplay.textContent = "Current score = "+score;
210+
bestDisplay.textContent = "Best score = "+best;
211+
createBoard();
212+
});
213+
214+
createBoard();
215+
});

‎124 - 2048 Game/index.html

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
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+
<title>2048 Game</title>
7+
<link rel="stylesheet" href="styles.css">
8+
</head>
9+
<body>
10+
<div class="container">
11+
<div class="heading">
12+
<h1>2048</h1>
13+
<div class="scores-container">
14+
<div class="score-container">Current Score = 0</div>
15+
<div class="best-container">Best Score = 0</div>
16+
</div>
17+
<button class="new-game-button">New Game</button>
18+
</div>
19+
<div class="game-container">
20+
<div class="grid-container">
21+
<div class="grid-row">
22+
<div class="grid-cell"></div>
23+
<div class="grid-cell"></div>
24+
<div class="grid-cell"></div>
25+
<div class="grid-cell"></div>
26+
</div>
27+
<div class="grid-row">
28+
<div class="grid-cell"></div>
29+
<div class="grid-cell"></div>
30+
<div class="grid-cell"></div>
31+
<div class="grid-cell"></div>
32+
</div>
33+
<div class="grid-row">
34+
<div class="grid-cell"></div>
35+
<div class="grid-cell"></div>
36+
<div class="grid-cell"></div>
37+
<div class="grid-cell"></div>
38+
</div>
39+
<div class="grid-row">
40+
<div class="grid-cell"></div>
41+
<div class="grid-cell"></div>
42+
<div class="grid-cell"></div>
43+
<div class="grid-cell"></div>
44+
</div>
45+
</div>
46+
<div class="tile-container"></div>
47+
</div>
48+
<p class="game-explanation">
49+
<strong>HOW TO PLAY:</strong> Use your <strong>arrow keys</strong> to move the tiles. When two tiles with the same number touch, they <strong>merge into one!</strong>
50+
</p>
51+
</div>
52+
<script src="game.js"></script>
53+
</body>
54+
</html>

0 commit comments

Comments
 (0)