Game
This commit is contained in:
@ -3,10 +3,10 @@
|
|||||||
/* ::: :::::::: */
|
/* ::: :::::::: */
|
||||||
/* Map.js :+: :+: :+: */
|
/* Map.js :+: :+: :+: */
|
||||||
/* +:+ +:+ +:+ */
|
/* +:+ +:+ +:+ */
|
||||||
/* By: hubourge <hubourge@student.42.fr> +#+ +:+ +#+ */
|
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
|
||||||
/* +#+#+#+#+#+ +#+ */
|
/* +#+#+#+#+#+ +#+ */
|
||||||
/* Created: 2024/08/28 12:23:48 by edbernar #+# #+# */
|
/* 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;
|
vec3.z += 0.1;
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
|
||||||
scoreElement.innerHTML = score.player1 + " - " + score.player2;
|
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
ground.position.copy(groundBody.position);
|
ground.position.copy(groundBody.position);
|
||||||
@ -185,7 +182,15 @@ class Map
|
|||||||
onUpdate = true;
|
onUpdate = true;
|
||||||
document.getElementsByTagName('canvas')[3].style.animation = 'fadeIn 0.199s';
|
document.getElementsByTagName('canvas')[3].style.animation = 'fadeIn 0.199s';
|
||||||
document.getElementsByTagName('canvas')[3].style.filter = 'brightness(0)';
|
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(() => {
|
setTimeout(() => {
|
||||||
speed = 3;
|
speed = 3;
|
||||||
if (dirLeft)
|
if (dirLeft)
|
||||||
@ -206,11 +211,6 @@ class Map
|
|||||||
}, 1500);
|
}, 1500);
|
||||||
|
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
if (dirLeft)
|
|
||||||
score.player2++;
|
|
||||||
else
|
|
||||||
score.player1++;
|
|
||||||
|
|
||||||
ballBody.velocity.set(0,0,0);
|
ballBody.velocity.set(0,0,0);
|
||||||
ballBody.position.set(0, 0.15, 0);
|
ballBody.position.set(0, 0.15, 0);
|
||||||
ball.position.copy(ballBody.position);
|
ball.position.copy(ballBody.position);
|
||||||
@ -219,10 +219,11 @@ class Map
|
|||||||
player2Body.position.set(12, 0.4, 0);
|
player2Body.position.set(12, 0.4, 0);
|
||||||
player2.position.copy(player2Body.position);
|
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)';
|
document.getElementsByTagName('canvas')[3].style.filter = 'brightness(1)';
|
||||||
scoreElement.innerHTML = score.player1 + " - " + score.player2;
|
scoreElement.style.animation = 'fadeOutText 0.399s';
|
||||||
}, 800);
|
scoreElement.style.color = 'rgb(255, 255, 255, 0.1)';
|
||||||
|
}, 1000);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -3,9 +3,12 @@
|
|||||||
<head>
|
<head>
|
||||||
<title>Page</title>
|
<title>Page</title>
|
||||||
<link rel='stylesheet' type='text/css' href='style.css'>
|
<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>
|
<script src="./main.js" type="module"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<p id="score" ></p>
|
<p id="score">0 - 0</p>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
@ -6,7 +6,7 @@
|
|||||||
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
|
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
|
||||||
/* +#+#+#+#+#+ +#+ */
|
/* +#+#+#+#+#+ +#+ */
|
||||||
/* Created: 2024/08/28 12:05:53 by edbernar #+# #+# */
|
/* 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 */
|
||||||
/* */
|
/* */
|
||||||
/* ************************************************************************** */
|
/* ************************************************************************** */
|
||||||
|
|
||||||
@ -14,4 +14,4 @@ import { MultiGame } from "./class/MultiGame";
|
|||||||
import { SoloGame } from "./class/SoloGame";
|
import { SoloGame } from "./class/SoloGame";
|
||||||
|
|
||||||
// MultiGame.create();
|
// MultiGame.create();
|
||||||
SoloGame.create();
|
SoloGame.create();
|
@ -3,10 +3,10 @@
|
|||||||
/* ::: :::::::: */
|
/* ::: :::::::: */
|
||||||
/* style.css :+: :+: :+: */
|
/* style.css :+: :+: :+: */
|
||||||
/* +:+ +:+ +:+ */
|
/* +:+ +:+ +:+ */
|
||||||
/* By: hubourge <hubourge@student.42.fr> +#+ +:+ +#+ */
|
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
|
||||||
/* +#+#+#+#+#+ +#+ */
|
/* +#+#+#+#+#+ +#+ */
|
||||||
/* Created: 2024/08/20 11:23:41 by edbernar #+# #+# */
|
/* 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 {
|
body {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#score {
|
#score {
|
||||||
|
line-height: 1.75;
|
||||||
|
vertical-align: top;
|
||||||
|
font-family: 'Poppins';
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top : 5%;
|
font-size: 30vh;
|
||||||
|
top: 0;
|
||||||
|
bottom : 50%;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
transform: translateX(-50%);
|
transform: translate(-50%, 50%);
|
||||||
z-index: 1000;
|
z-index: 800;
|
||||||
font : Blippo, fantasy;
|
margin: 0;
|
||||||
font-weight: 900;
|
padding: 0;
|
||||||
font-size: 5vh;
|
white-space: nowrap;
|
||||||
|
/* font-weight: 900; */
|
||||||
|
color: rgb(255, 255, 255, 0.1);
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user