- Updating/creating ball ball
This commit is contained in:
Kum1ta
2024-08-20 17:37:06 +02:00
parent 886b65b397
commit f38df42715
3 changed files with 71 additions and 19 deletions

View File

@ -0,0 +1,45 @@
/* ************************************************************************** */
/* */
/* ::: :::::::: */
/* Ball.js :+: :+: :+: */
/* +:+ +:+ +:+ */
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/20 17:02:47 by edbernar #+# #+# */
/* Updated: 2024/08/20 17:23:41 by edbernar ### ########.fr */
/* */
/* ************************************************************************** */
import * as THREE from 'three';
const centerPos = {
x: 0,
y: 0.3,
z: -0.1
}
class Ball
{
object = null;
constructor(scene)
{
this.object = this.#createBall();
scene.add(this.object);
}
#createBall()
{
const geometry = new THREE.SphereGeometry(0.15);
const material = new THREE.MeshPhysicalMaterial({ color: 0xff5555 });
const mesh = new THREE.Mesh(geometry, material);
mesh.receiveShadow = true;
mesh.castShadow = true;
mesh.position.set(centerPos.x, centerPos.y, centerPos.z);
return (mesh);
}
}
export { Ball };

View File

@ -3,10 +3,10 @@
/* ::: :::::::: */ /* ::: :::::::: */
/* Player.js :+: :+: :+: */ /* Player.js :+: :+: :+: */
/* +:+ +:+ +:+ */ /* +:+ +:+ +:+ */
/* By: hubourge <hubourge@student.42.fr> +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/18 00:30:31 by edbernar #+# #+# */ /* Created: 2024/08/18 00:30:31 by edbernar #+# #+# */
/* Updated: 2024/08/20 16:00:24 by hubourge ### ########.fr */ /* Updated: 2024/08/20 17:01:01 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
@ -43,7 +43,7 @@ import * as THREE from 'three';
barre est en haut). Mais peut etre faire ça quand la barre aura des mouvements barre est en haut). Mais peut etre faire ça quand la barre aura des mouvements
définis sur la hauteur. (OK) définis sur la hauteur. (OK)
- Ajouter les mouvements définis sur l'axe y (OK) - Ajouter les mouvements définis sur l'axe y (OK)
- Faire une fonction qui change de camera quand il y a un but avec un fondu en noir - Faire une fonction qui change de camera quand il y a un but avec un fondu en noir (OK)
- Ajouter un zoom sur la camera de la fonction pointAnimation (OK) - Ajouter un zoom sur la camera de la fonction pointAnimation (OK)
*/ */
@ -136,7 +136,7 @@ class Player
document.getElementsByTagName('canvas')[0].style.filter = 'brightness(1)'; document.getElementsByTagName('canvas')[0].style.filter = 'brightness(1)';
}, 300) }, 300)
setTimeout(() => { setTimeout(() => {
tmpCamera.position.set(3, 3, 3); tmpCamera.position.set(-3, 3, -3);
this.isOnPointAnim = true; this.isOnPointAnim = true;
this.camera = tmpCamera; this.camera = tmpCamera;
interval = setInterval(() => { interval = setInterval(() => {
@ -150,21 +150,28 @@ class Player
}, 10); }, 10);
setTimeout(() => { setTimeout(() => {
clearInterval(interval); clearInterval(interval);
this.camera = tmp; document.getElementsByTagName('canvas')[0].style.animation = null;
this.object.material.color.copy(startColor); document.getElementsByTagName('canvas')[0].style.animation = 'fadeIn 0.19s';
this.isOnPointAnim = false; document.getElementsByTagName('canvas')[0].style.filter = 'brightness(0)';
if (!this.cameraFixed)
{
this.setCameraPosition(
this.object.position.x,
this.object.position.y - (this.object.position.y >= limits.up ? 0.7 : -0.7),
this.object.position.z + 1
);
}
document.getElementsByTagName('canvas')[0].style.animation = 'fadeIn 0.199s';
setTimeout(() => { setTimeout(() => {
this.camera = tmp;
this.object.material.color.copy(startColor);
this.isOnPointAnim = false;
if (!this.cameraFixed)
{
this.setCameraPosition(
this.object.position.x,
this.object.position.y - (this.object.position.y >= limits.up ? 0.7 : -0.7),
this.object.position.z + 1
);
}
document.getElementsByTagName('canvas')[0].style.animation = 'fadeOut 0.199s'; document.getElementsByTagName('canvas')[0].style.animation = 'fadeOut 0.199s';
}, 300) document.getElementsByTagName('canvas')[0].style.filter = 'brightness(1)';
}, 200);
// document.getElementsByTagName('canvas')[0].style.filter = 'brightness(0)';
// setTimeout(() => {
// document.getElementsByTagName('canvas')[0].style.animation = 'fadeOut 0.199s';
// }, 300)
}, 4000); }, 4000);
}, 200) }, 200)
} }

View File

@ -3,10 +3,10 @@
/* ::: :::::::: */ /* ::: :::::::: */
/* main.js :+: :+: :+: */ /* main.js :+: :+: :+: */
/* +:+ +:+ +:+ */ /* +:+ +:+ +:+ */
/* By: hubourge <hubourge@student.42.fr> +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/18 00:53:53 by edbernar #+# #+# */ /* Created: 2024/08/18 00:53:53 by edbernar #+# #+# */
/* Updated: 2024/08/20 17:28:36 by hubourge ### ########.fr */ /* Updated: 2024/08/20 17:36:47 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */