Skip to content

Commit 4aeb1d1

Browse files
Merge branch 'master' into master
2 parents f6f4f46 + 1999667 commit 4aeb1d1

File tree

12 files changed

+408
-38
lines changed

12 files changed

+408
-38
lines changed

108 - Maths addition/app.js

+6-1
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

+1
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>

125 - Flappy Bird/assets/Bird.png

177 KB
Loading
47.7 KB
Loading

125 - Flappy Bird/assets/favicon.ico

15 KB
Binary file not shown.

125 - Flappy Bird/index.html

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
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 maximum-scale=1, user-scalable=no">
7+
<link rel="icon" type="image/png" href="assets/favicon.ico">
8+
<title>Flappy Bird</title>
9+
<link rel="stylesheet" href="style.css">
10+
<script src="script.js" defer></script>
11+
</head>
12+
<body>
13+
<div class="background"></div>
14+
<img src="assets/Bird.png" alt="bird-img" class="bird" id="bird-1">
15+
<div class="message">
16+
Press Any Key to Start Playing
17+
</div>
18+
<div class="score">
19+
<span class="score_title"></span>
20+
<span class="score_val"></span>
21+
</div>
22+
</body>
23+
</html>

125 - Flappy Bird/script.js

+212
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,212 @@
1+
// Variable Bank
2+
let move_speed = 3; // Change moving speed of bird
3+
let gravity = 0.5; // Change gravity
4+
let bird = document.querySelector('.bird');
5+
let img = document.getElementById('bird-1');
6+
7+
// Getting bird element properties
8+
let bird_props = bird.getBoundingClientRect();
9+
let background = document.querySelector('.background').getBoundingClientRect();
10+
let score_val = document.querySelector('.score_val');
11+
let message = document.querySelector('.message');
12+
let score_title = document.querySelector('.score_title');
13+
14+
// Start Screen
15+
let game_state = 'Start';
16+
img.style.display = 'none';
17+
message.classList.add('messageStyle');
18+
19+
function fly() {
20+
img.src = 'assets/Bird.png';
21+
bird_dy = -7.6;
22+
}
23+
24+
function flyHandler(e) {
25+
if (game_state === 'Play') {
26+
fly();
27+
}
28+
}
29+
30+
function startGame() {
31+
if (game_state !== 'Play') {
32+
document.querySelectorAll('.pipe_sprite').forEach((e) => {
33+
e.remove();
34+
});
35+
img.style.display = 'block';
36+
bird.style.top = '40vh';
37+
bird.style.left = '10vw';
38+
game_state = 'Play';
39+
message.innerHTML = '';
40+
score_title.innerHTML = 'Score : ';
41+
score_val.innerHTML = '0';
42+
message.classList.remove('messageStyle');
43+
play();
44+
create_pipe();
45+
}
46+
}
47+
48+
function play() {
49+
bird_dy = 0;
50+
bird_props = bird.getBoundingClientRect();
51+
52+
function move() {
53+
if (game_state !== 'Play') return;
54+
55+
let pipe_sprite = document.querySelectorAll('.pipe_sprite');
56+
pipe_sprite.forEach((element) => {
57+
let pipe_sprite_props = element.getBoundingClientRect();
58+
bird_props = bird.getBoundingClientRect();
59+
60+
if (pipe_sprite_props.right <= 0) {
61+
element.remove();
62+
} else {
63+
if (
64+
bird_props.left < pipe_sprite_props.left + pipe_sprite_props.width &&
65+
bird_props.left + bird_props.width > pipe_sprite_props.left &&
66+
bird_props.top < pipe_sprite_props.top + pipe_sprite_props.height &&
67+
bird_props.top + bird_props.height > pipe_sprite_props.top
68+
) {
69+
endGame();
70+
return;
71+
} else {
72+
if (
73+
pipe_sprite_props.right < bird_props.left &&
74+
pipe_sprite_props.right + move_speed >= bird_props.left &&
75+
element.increase_score === '1'
76+
) {
77+
score_val.innerHTML = parseInt(score_val.innerHTML) + 1;
78+
element.increase_score = '0';
79+
}
80+
element.style.left = pipe_sprite_props.left - move_speed + 'px';
81+
}
82+
}
83+
});
84+
requestAnimationFrame(move);
85+
}
86+
requestAnimationFrame(move);
87+
88+
function apply_gravity() {
89+
if (game_state !== 'Play') return;
90+
bird_dy += gravity;
91+
92+
if (bird_props.top <= 0 || bird_props.bottom >= background.bottom) {
93+
endGame();
94+
return;
95+
}
96+
bird.style.top = bird_props.top + bird_dy + 'px';
97+
bird_props = bird.getBoundingClientRect();
98+
requestAnimationFrame(apply_gravity);
99+
}
100+
requestAnimationFrame(apply_gravity);
101+
102+
let pipe_separation = 0;
103+
let pipe_gap = 40; // Change gap between pipes
104+
let initial_pipe_delay = 0; // Change delay before the first pipe appears
105+
106+
function create_pipe() {
107+
if (game_state !== 'Play') return;
108+
109+
if (initial_pipe_delay > 0) {
110+
initial_pipe_delay--;
111+
requestAnimationFrame(create_pipe);
112+
return;
113+
}
114+
115+
if (pipe_separation > 110) {
116+
pipe_separation = 0;
117+
118+
let pipe_posi = Math.floor(Math.random() * 43) + 8;
119+
let pipe_sprite_inv = document.createElement('div');
120+
pipe_sprite_inv.className = 'pipe_sprite';
121+
pipe_sprite_inv.style.top = pipe_posi - 70 + 'vh';
122+
pipe_sprite_inv.style.left = '100vw';
123+
124+
document.body.appendChild(pipe_sprite_inv);
125+
let pipe_sprite = document.createElement('div');
126+
pipe_sprite.className = 'pipe_sprite';
127+
pipe_sprite.style.top = pipe_posi + pipe_gap + 'vh';
128+
pipe_sprite.style.left = '100vw';
129+
pipe_sprite.increase_score = '1';
130+
131+
document.body.appendChild(pipe_sprite);
132+
}
133+
pipe_separation++;
134+
requestAnimationFrame(create_pipe);
135+
}
136+
requestAnimationFrame(create_pipe);
137+
}
138+
139+
function endGame() {
140+
game_state = 'End';
141+
message.innerHTML = 'Game Over'.fontcolor('red') + '<br> Press Any Key to Restart';
142+
message.classList.add('messageStyle');
143+
img.style.display = 'none'
144+
}
145+
146+
function resetGame() {
147+
document.querySelectorAll('.pipe_sprite').forEach((e) => e.remove());
148+
bird.style.top = '40vh';
149+
bird.style.left = '10vw';
150+
bird_dy = 0;
151+
img.style.display = 'block';
152+
img.style.display = 'none';
153+
game_state = 'Start';
154+
}
155+
156+
document.addEventListener('keydown', (e) => {
157+
if (game_state === 'Start' || game_state === 'End') {
158+
resetGame();
159+
startGame();
160+
}
161+
if (game_state === 'Play') {
162+
flyHandler(e);
163+
}
164+
});
165+
166+
document.addEventListener('mousedown', (e) => {
167+
if (e.button === 0) {
168+
if (game_state === 'Start' || game_state === 'End') {
169+
resetGame();
170+
startGame();
171+
}
172+
if (game_state === 'Play') {
173+
flyHandler(e);
174+
}
175+
}
176+
});
177+
178+
document.addEventListener('touchstart', (e) => {
179+
if (game_state === 'Start' || game_state === 'End') {
180+
resetGame();
181+
startGame();
182+
}
183+
if (game_state === 'Play') {
184+
flyHandler(e);
185+
}
186+
});
187+
188+
document.addEventListener('touchend', (e) => {
189+
});
190+
191+
document.addEventListener('orientationchange', () => {
192+
});
193+
194+
let lastTouchEnd = 0;
195+
document.addEventListener('touchend', (e) => {
196+
let now = new Date().getTime();
197+
if (now - lastTouchEnd <= 300) {
198+
e.preventDefault();
199+
}
200+
lastTouchEnd = now;
201+
}, false);
202+
203+
function adjustPipeGap() {
204+
if (window.innerWidth <= 600) { // Mobile view
205+
pipe_gap = 8; // Decrease gap between pipes for mobile
206+
} else {
207+
pipe_gap = 40; // Default gap for larger screens
208+
}
209+
}
210+
211+
window.addEventListener('load', adjustPipeGap);
212+
window.addEventListener('resize', adjustPipeGap);

125 - Flappy Bird/style.css

+118
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,118 @@
1+
*{
2+
margin: 0;
3+
padding: 0;
4+
box-sizing: border-box;
5+
font-family: Arial, Helvetica, sans-serif;
6+
}
7+
8+
.background{
9+
position: fixed;
10+
top: 0;
11+
left: 0;
12+
height: 100vh;
13+
width: 100vw;
14+
background: url('assets/background-img.png') no-repeat center center fixed;
15+
background-size: cover;
16+
z-index: -1;
17+
}
18+
19+
.bird{
20+
height: 100px;
21+
width: 130px;
22+
position: fixed;
23+
top: 40vh ;
24+
left: 70vh;
25+
z-index: 100;
26+
}
27+
28+
.pipe_sprite{
29+
position: fixed;
30+
top: 40vh;
31+
left: 100vw;
32+
height: 70vh;
33+
width: 6vw;
34+
background: radial-gradient(lightgreen 50%, green);
35+
border: 5px solid black;
36+
}
37+
38+
.message{
39+
position: absolute;
40+
z-index: 10;
41+
color: black;
42+
top: 30%;
43+
left: 50%;
44+
font-size: 4em;
45+
transform: translate(-50%, -50%);
46+
text-align: center;
47+
}
48+
49+
.messageStyle{
50+
background: white;
51+
padding: 30px;
52+
box-shadow: rgba(0,0,0,0.24) 0px 3px 8px;
53+
border-radius: 5%;
54+
}
55+
56+
.score{
57+
position: fixed;
58+
z-index: 10;
59+
height: 10vh;
60+
font-size: 10vh;
61+
font-weight: 100;
62+
color: white;
63+
-webkit-text-stroke-width: 2px;
64+
-webkit-text-stroke-color: black;
65+
top: 0;
66+
left: 0;
67+
margin: 10px;
68+
font-family: Arial, Helvetica, sans-serif;
69+
}
70+
71+
.score_val{
72+
color: gold;
73+
font-weight: bold;
74+
}
75+
76+
@media only screen and (max-width: 1080px) {
77+
.message{
78+
font-size: 50px;
79+
top: 50%;
80+
white-space: nowrap;
81+
}
82+
83+
.score{
84+
font-size: 8vh;
85+
}
86+
87+
.bird{
88+
width: 120px;
89+
height: 90px;
90+
}
91+
92+
.pipe_sprite{
93+
width: 14vw;
94+
}
95+
}
96+
97+
/* Media Queries for Smaller Devices */
98+
@media (max-width: 600px) {
99+
100+
.bird {
101+
position: absolute;
102+
width: 80px;
103+
height: 80px;
104+
z-index: 10;
105+
}
106+
107+
.message {
108+
font-size: 1.2em;
109+
}
110+
111+
.score {
112+
font-size: 4vh;
113+
}
114+
115+
.pipe_sprite {
116+
width: 15vw;
117+
}
118+
}
350 KB
Loading

30DaysOfJavaScript/script.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -189,7 +189,8 @@ function search_project() {
189189
{ name: "Maze Game", url: "./112 - Maze Game/index.html" },
190190
{ name: "Minesweeper", url: "./113 - Minesweeper/index.html" },
191191
{ name: "Guess the Country", url: "./115 - Guess The Country/index.html"},
192-
{ name: "2048 Game", url: "./124 - 2048 Game/index.html"}
192+
{ name: "2048 Game", url: "./124 - 2048 Game/index.html"},
193+
{ name: "Flappy Bird Game", url: "./125 - Flappy Bird/index.html"}
193194
];
194195

195196
// Filter suggestions based on input

0 commit comments

Comments
 (0)