Game
This commit is contained in:
@ -3,10 +3,10 @@
|
||||
/* ::: :::::::: */
|
||||
/* Map.js :+: :+: :+: */
|
||||
/* +:+ +:+ +:+ */
|
||||
/* By: hubourge <hubourge@student.42.fr> +#+ +:+ +#+ */
|
||||
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
|
||||
/* +#+#+#+#+#+ +#+ */
|
||||
/* Created: 2024/08/28 12:23:48 by edbernar #+# #+# */
|
||||
/* Updated: 2024/09/03 17:18:13 by hubourge ### ########.fr */
|
||||
/* Updated: 2024/09/03 18:13:18 by edbernar ### ########.fr */
|
||||
/* */
|
||||
/* ************************************************************************** */
|
||||
|
||||
@ -125,9 +125,6 @@ class Map
|
||||
vec3.z += 0.1;
|
||||
break;
|
||||
}
|
||||
|
||||
scoreElement.innerHTML = score.player1 + " - " + score.player2;
|
||||
|
||||
});
|
||||
|
||||
ground.position.copy(groundBody.position);
|
||||
@ -185,7 +182,15 @@ class Map
|
||||
onUpdate = true;
|
||||
document.getElementsByTagName('canvas')[3].style.animation = 'fadeIn 0.199s';
|
||||
document.getElementsByTagName('canvas')[3].style.filter = 'brightness(0)';
|
||||
|
||||
scoreElement.style.animation = 'fadeInText 0.199s';
|
||||
scoreElement.style.color = 'rgb(255, 255, 255, 1)';
|
||||
setTimeout(() => {
|
||||
if (dirLeft)
|
||||
score.player2++;
|
||||
else
|
||||
score.player1++;
|
||||
scoreElement.innerHTML = score.player1 + '-' +score.player2;
|
||||
}, 300);
|
||||
setTimeout(() => {
|
||||
speed = 3;
|
||||
if (dirLeft)
|
||||
@ -206,11 +211,6 @@ class Map
|
||||
}, 1500);
|
||||
|
||||
setTimeout(() => {
|
||||
if (dirLeft)
|
||||
score.player2++;
|
||||
else
|
||||
score.player1++;
|
||||
|
||||
ballBody.velocity.set(0,0,0);
|
||||
ballBody.position.set(0, 0.15, 0);
|
||||
ball.position.copy(ballBody.position);
|
||||
@ -219,10 +219,11 @@ class Map
|
||||
player2Body.position.set(12, 0.4, 0);
|
||||
player2.position.copy(player2Body.position);
|
||||
|
||||
document.getElementsByTagName('canvas')[3].style.animation = 'fadeOut 0.199s';
|
||||
scoreElement.style.animation = 'fadeOut 0.199s';
|
||||
document.getElementsByTagName('canvas')[3].style.filter = 'brightness(1)';
|
||||
scoreElement.innerHTML = score.player1 + " - " + score.player2;
|
||||
}, 800);
|
||||
scoreElement.style.animation = 'fadeOutText 0.399s';
|
||||
scoreElement.style.color = 'rgb(255, 255, 255, 0.1)';
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -3,9 +3,12 @@
|
||||
<head>
|
||||
<title>Page</title>
|
||||
<link rel='stylesheet' type='text/css' href='style.css'>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
|
||||
<script src="./main.js" type="module"></script>
|
||||
</head>
|
||||
<body>
|
||||
<p id="score" ></p>
|
||||
<p id="score">0 - 0</p>
|
||||
</body>
|
||||
</html>
|
||||
|
@ -6,7 +6,7 @@
|
||||
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
|
||||
/* +#+#+#+#+#+ +#+ */
|
||||
/* Created: 2024/08/28 12:05:53 by edbernar #+# #+# */
|
||||
/* Updated: 2024/08/28 14:30:05 by edbernar ### ########.fr */
|
||||
/* Updated: 2024/09/03 17:24:36 by edbernar ### ########.fr */
|
||||
/* */
|
||||
/* ************************************************************************** */
|
||||
|
||||
|
@ -3,10 +3,10 @@
|
||||
/* ::: :::::::: */
|
||||
/* style.css :+: :+: :+: */
|
||||
/* +:+ +:+ +:+ */
|
||||
/* By: hubourge <hubourge@student.42.fr> +#+ +:+ +#+ */
|
||||
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
|
||||
/* +#+#+#+#+#+ +#+ */
|
||||
/* Created: 2024/08/20 11:23:41 by edbernar #+# #+# */
|
||||
/* Updated: 2024/09/03 17:13:58 by hubourge ### ########.fr */
|
||||
/* Updated: 2024/09/03 18:19:30 by edbernar ### ########.fr */
|
||||
/* */
|
||||
/* ************************************************************************** */
|
||||
|
||||
@ -28,20 +28,46 @@
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadeInText {
|
||||
from {
|
||||
color: rgb(255, 255, 255, 0.1);
|
||||
}
|
||||
to {
|
||||
color: rgb(255, 255, 255, 1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadeOutText {
|
||||
from {
|
||||
color: rgb(255, 255, 255, 1);
|
||||
}
|
||||
to {
|
||||
color: rgb(255, 255, 255, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
}
|
||||
|
||||
#score {
|
||||
line-height: 1.75;
|
||||
vertical-align: top;
|
||||
font-family: 'Poppins';
|
||||
position: absolute;
|
||||
top : 5%;
|
||||
font-size: 30vh;
|
||||
top: 0;
|
||||
bottom : 50%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
z-index: 1000;
|
||||
font : Blippo, fantasy;
|
||||
font-weight: 900;
|
||||
font-size: 5vh;
|
||||
transform: translate(-50%, 50%);
|
||||
z-index: 800;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
white-space: nowrap;
|
||||
/* font-weight: 900; */
|
||||
color: rgb(255, 255, 255, 0.1);
|
||||
}
|
||||
|
Reference in New Issue
Block a user