Skip to content

Commit fdf6166

Browse files
tajulafreentajulafreen
committed
solve linter errors
1 parent d31d54f commit fdf6166

File tree

3 files changed

+78
-73
lines changed

3 files changed

+78
-73
lines changed

‎Source-Code/DinosaurGame/index.html

+14-15
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,21 @@
11
<!DOCTYPE html>
22
<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">
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" />
77
<title>DINOSAUR GAME</title>
8-
</head>
9-
<body>
8+
</head>
9+
<body>
1010
<h1 class="game-heading">DINOSAUR GAME 🦕</h1>
1111
<div class="game">
12-
<div class="character">
13-
<img class="dino" src="./assets/dinosaur.png" alt="dino">
14-
</div>
15-
<div class="block">
16-
<img class="cactus" src="./assets/cactus.png" alt="cactus">
17-
</div>
12+
<div class="character">
13+
<img class="dino" src="./assets/dinosaur.png" alt="dino" />
14+
</div>
15+
<div class="block">
16+
<img class="cactus" src="./assets/cactus.png" alt="cactus" />
17+
</div>
1818
</div>
1919
<script src="script.js"></script>
20-
</body>
21-
22-
</html>
20+
</body>
21+
</html>

‎Source-Code/DinosaurGame/script.js

+14-12
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,40 @@
1-
document.addEventListener("DOMContentLoaded", () => {
2-
const character = document.querySelector(".dino");
3-
const block = document.querySelector(".cactus");
1+
document.addEventListener('DOMContentLoaded', () => {
2+
const character = document.querySelector('.dino');
3+
const block = document.querySelector('.cactus');
44

55
const jump = () => {
66
// Add class to initiate jump
7-
character.classList.add("animate");
7+
character.classList.add('animate');
88

99
// Remove class after animation duration (500ms)
1010
setTimeout(() => {
11-
character.classList.remove("animate");
11+
character.classList.remove('animate');
1212
}, 500);
1313
};
1414

1515
// Trigger jump on spacebar press
16-
document.addEventListener("keydown", (event) => {
17-
if (event.code === "Space") {
16+
document.addEventListener('keydown', (event) => {
17+
if (event.code === 'Space') {
1818
jump();
1919
}
2020
});
2121

2222
// Check for collision
2323
const checkDead = setInterval(() => {
2424
const blockLeft = parseInt(
25-
window.getComputedStyle(block).getPropertyValue("left")
25+
window.getComputedStyle(block).getPropertyValue('left'),
26+
10,
2627
);
2728
const characterTop = parseInt(
28-
window.getComputedStyle(character).getPropertyValue("top")
29+
window.getComputedStyle(character).getPropertyValue('top'),
30+
10,
2931
);
3032

3133
// Check for collision
3234
if (blockLeft < 20 && blockLeft > 0 && characterTop >= 178) {
33-
block.style.animation = "none";
34-
block.style.display = "none";
35-
alert("Uh..Oh, you lose.");
35+
block.style.animation = 'none';
36+
block.style.display = 'none';
37+
alert('Uh..Oh, you lose.');
3638
clearInterval(checkDead); // Stop checking for collisions
3739
}
3840
}, 100);

‎Source-Code/DinosaurGame/style.css

+50-46
Original file line numberDiff line numberDiff line change
@@ -1,74 +1,78 @@
11
* {
2-
margin: 0;
3-
padding: 0;
4-
background-color: rgb(27, 75, 133);
2+
margin: 0;
3+
padding: 0;
4+
background-color: rgb(27, 75, 133);
55
}
66

77
.game-heading {
8-
text-align: center;
9-
font-family: Arial, Helvetica, sans-serif;
10-
color: rgb(0, 247, 255);
11-
text-shadow: 3px 2px rgb(128, 0, 0);
12-
font-size: 5em;
13-
margin: 40px 0;
8+
text-align: center;
9+
font-family: Arial, Helvetica, sans-serif;
10+
color: rgb(0, 247, 255);
11+
text-shadow: 3px 2px rgb(128, 0, 0);
12+
font-size: 5em;
13+
margin: 40px 0;
1414
}
1515

1616
.game {
17-
width: 800px;
18-
height: 300px;
19-
margin: 60px auto;
20-
display: flex;
21-
border: 3px solid rgb(0, 247, 255);
17+
width: 800px;
18+
height: 300px;
19+
margin: 60px auto;
20+
display: flex;
21+
border: 3px solid rgb(0, 247, 255);
2222
}
2323

2424
.cactus {
25-
height: 40px;
26-
object-fit: contain;
27-
position: relative;
28-
top: 261px;
29-
left: 670px;
30-
animation: block 3s infinite linear;
25+
height: 40px;
26+
object-fit: contain;
27+
position: relative;
28+
top: 261px;
29+
left: 670px;
30+
animation: block 3s infinite linear;
3131
}
3232

3333
.block {
34-
height: 40px;
34+
height: 40px;
3535
}
3636

3737
.character {
38-
height: 100px;
38+
height: 100px;
3939
}
4040

4141
.dino {
42-
height: 100px;
43-
object-fit: contain;
44-
position: relative;
45-
top: 200px;
42+
height: 100px;
43+
object-fit: contain;
44+
position: relative;
45+
top: 200px;
4646
}
4747

4848
.animate {
49-
animation: character 500ms;
49+
animation: character 500ms;
5050
}
5151

5252
@keyframes block {
53-
0% {
54-
left: 670px;
55-
}
56-
100% {
57-
left: -60px;
58-
}
53+
0% {
54+
left: 670px;
55+
}
56+
57+
100% {
58+
left: -60px;
59+
}
5960
}
6061

6162
@keyframes character {
62-
0% {
63-
top: 203px;
64-
}
65-
30% {
66-
top: 140px;
67-
}
68-
70% {
69-
top: 140px;
70-
}
71-
100% {
72-
top: 203px;
73-
}
74-
}
63+
0% {
64+
top: 203px;
65+
}
66+
67+
30% {
68+
top: 140px;
69+
}
70+
71+
70% {
72+
top: 140px;
73+
}
74+
75+
100% {
76+
top: 203px;
77+
}
78+
}

0 commit comments

Comments
 (0)