From 108e753d2294ea425aff54f85dc9bc853135fb07 Mon Sep 17 00:00:00 2001
From: Kum1ta <eddydhj@gmail.com>
Date: Mon, 19 Aug 2024 23:57:19 +0200
Subject: [PATCH] Game     - Update player class (all info in player.js in
 comment)

---
 site/real_game/class/Player.js   | 122 +++++++++++++++++++++++--------
 site/real_game/main.js           |  17 +++--
 site/real_game/package-lock.json |   2 +-
 site/real_game/package.json      |   1 +
 4 files changed, 106 insertions(+), 36 deletions(-)

diff --git a/site/real_game/class/Player.js b/site/real_game/class/Player.js
index 6b27134..c925688 100644
--- a/site/real_game/class/Player.js
+++ b/site/real_game/class/Player.js
@@ -6,11 +6,10 @@
 /*   By: edbernar <edbernar@student.42angouleme.    +#+  +:+       +#+        */
 /*                                                +#+#+#+#+#+   +#+           */
 /*   Created: 2024/08/18 00:30:31 by edbernar          #+#    #+#             */
-/*   Updated: 2024/08/19 00:42:13 by edbernar         ###   ########.fr       */
+/*   Updated: 2024/08/19 23:55:40 by edbernar         ###   ########.fr       */
 /*                                                                            */
 /* ************************************************************************** */
 
-import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
 import * as THREE from 'three';
 
 /*
@@ -21,7 +20,7 @@ import * as THREE from 'three';
 		- Les lignes avec cleanup sont l'êquivalent d'un destructeur en CPP
 		- Pour appliquer des actions sur les touches, il suffit de faire ça dans la fonction
 		  update en regardant si la touche voulue est dans la variable "pressedButton"
-		- Par défaut, la caméra est accroché, si on veut qu'elle ne bouge plus, il faut
+		- Par défaut, la caméra est accrochée, si on veut qu'elle ne bouge plus, il faut
 		  modifier "cameraFixed" à true (se fait avec la touche 'm' en jeu)
 		- Si on utilise une touche qui ne sera utilisée que pour un appui simple, il faudra la
 		  mettre dans 'addEventListerner('keypress') et pas dans update() pour eviter les
@@ -29,6 +28,11 @@ import * as THREE from 'three';
 		- La variable "limits" sert à délimiter les mouvements de la barre
 */
 
+/*
+	Information :
+		- La map devra faire maximum 8 largueur car ça pose des problèmes avec la caméra fixe
+
+
 /*
 	Todo (Eddy) :
 		- Ajouter une camera sur l'object (OK)
@@ -37,15 +41,18 @@ import * as THREE from 'three';
 		- Corriger bug quand changement de caméra (camera qui se remet au dessus
 		  quand on repasse au dessus alors qu'elle devrait être en dessous vu que la
 		  barre est en haut). Mais peut etre faire ça quand la barre aura des mouvements
-		  définis sur la hauteur.
+		  définis sur la hauteur. (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
+		- Ajouter un zoom sur la camera de la fonction pointAnimation (OK)
 */
 
 let playerExist = false;
 const limits = {
-	up : 2,
+	up : 3,
 	down: 0.2,
-	left: -4,
-	right: 4,
+	left: -3,
+	right: 3,
 }
 
 class Player
@@ -55,15 +62,21 @@ class Player
 	camera			= null;
 	speed			= 0.1;
 	cameraFixed		= false;
+	interval		= null;
+	isOnPointAnim	= false;
 
-	constructor (object, renderer)
+	constructor (object)
 	{
 		if (playerExist)
 			throw Error("Player is already init.");
 		playerExist = true;
 		this.object = object;
 		this.camera = new THREE.PerspectiveCamera(80, window.innerWidth / window.innerHeight, 0.1, 10000);
-
+		this.setCameraPosition(
+			this.object.position.x,
+			this.object.position.y + 0.7,
+			this.object.position.z + 1
+		);
 		this.cleanup = new FinalizationRegistry((heldValue) => {
 			playerExist = false;
 		})
@@ -90,60 +103,110 @@ class Player
 		});
 
 		document.addEventListener('keypress', (e) => {
-			if (e.key == 'm')
+			if (e.key == 'm' && !this.isOnPointAnim)
 			{
 				this.cameraFixed = !this.cameraFixed;
 				if (!this.cameraFixed)
 				{
 					this.setCameraPosition(
 						this.object.position.x,
-						this.object.position.y + 0.5,
+						this.object.position.y - (this.object.position.y >= limits.up ? 0.7 : -0.7),
 						this.object.position.z + 1
 					);
 					this.camera.rotation.set(0, 0, 0);
 				}
 				else
-					this.setCameraPosition(0, 1, 0.7)
-			}
+					this.setCameraPosition(0, 1.5, 2.6);
+			}				
 		});
 	}
 
+	pointAnimation(scene, ...lights)
+	{
+		const	tmpCamera	= new THREE.PerspectiveCamera(80, window.innerWidth / window.innerHeight, 0.1, 10000);
+		const	tmp			= this.camera;
+		let		interval	= null;
+		const	startColor	= this.object.material.color.clone();
+		let		hue			= 0;
+
+		tmpCamera.position.set(3, 3, 3);
+		this.isOnPointAnim = true;
+		this.camera = tmpCamera;
+		interval = setInterval(() => {
+			tmpCamera.lookAt(this.object.position);
+			hue += 0.01;
+			if (hue > 1)
+				hue = 0;
+			this.object.material.color.setHSL(hue, 1, 0.5);
+			tmpCamera.fov -= 0.05;
+			tmpCamera.updateProjectionMatrix();
+		}, 10);
+		setTimeout(() => {
+			clearInterval(interval);
+			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
+				);
+			}
+		}, 4000);
+	}
+
 	update()
 	{
 		let i;
 
 		i = 0;
-		if (this.cameraFixed)
-			this.camera.lookAt(new THREE.Vector3(this.object.position.x / 4, (this.object.position.y + 1) / 1.75, this.object.position.z - 1.5));
 		while (i < this.pressedButton.length)
 		{
 			if (this.pressedButton[i] == 'w' && this.object.position.y < limits.up)
 			{
-				this.object.position.y += this.speed;
-				if (!this.cameraFixed)
-					this.camera.position.y += (this.speed / 2);
+				if (this.interval)
+					clearInterval(this.interval);
+				this.interval = setInterval(() => {
+					this.object.position.y += this.speed;
+					if (!this.cameraFixed && !this.isOnPointAnim)
+						this.camera.position.y += (this.speed / 2);
+					if (this.object.position.y >= limits.up)
+					{
+						clearInterval(this.interval);
+						this.interval = null;
+					}
+				}, 5);
 			}
 			if (this.pressedButton[i] == 's' && this.object.position.y > limits.down)
 			{
-				this.object.position.y -= this.speed;
-				if (!this.cameraFixed)
-					this.camera.position.y -= (this.speed / 2);
+				if (this.interval)
+					clearInterval(this.interval);
+				this.interval = setInterval(() => {
+					this.object.position.y -= this.speed;
+					if (!this.cameraFixed && !this.isOnPointAnim)
+						this.camera.position.y -= (this.speed / 2);
+					if (this.object.position.y <= limits.down)
+					{
+						clearInterval(this.interval);
+						this.interval = null;
+					}
+				}, 5);
 			}
 			if (this.pressedButton[i] == 'd' && this.object.position.x < limits.right)
-				{
-					this.object.position.x += this.speed;
-					if (!this.cameraFixed)
-						this.camera.position.x += this.speed;
-				}
+			{
+				this.object.position.x += this.speed;
+				if (!this.cameraFixed && !this.isOnPointAnim)
+					this.camera.position.x += this.speed;
+			}
 			if (this.pressedButton[i] == 'a' && this.object.position.x > limits.left)
 			{
 				this.object.position.x -= this.speed;
-				if (!this.cameraFixed)
+				if (!this.cameraFixed && !this.isOnPointAnim)
 					this.camera.position.x -= this.speed;
 			}
 			i++;
-
-
 		}
 	}
 
@@ -153,5 +216,4 @@ class Player
 	}
 };
 
-
 export { Player };
\ No newline at end of file
diff --git a/site/real_game/main.js b/site/real_game/main.js
index eee5917..2c60732 100644
--- a/site/real_game/main.js
+++ b/site/real_game/main.js
@@ -6,7 +6,7 @@
 /*   By: edbernar <edbernar@student.42angouleme.    +#+  +:+       +#+        */
 /*                                                +#+#+#+#+#+   +#+           */
 /*   Created: 2024/08/18 00:53:53 by edbernar          #+#    #+#             */
-/*   Updated: 2024/08/19 00:37:34 by edbernar         ###   ########.fr       */
+/*   Updated: 2024/08/19 23:08:38 by edbernar         ###   ########.fr       */
 /*                                                                            */
 /* ************************************************************************** */
 
@@ -42,17 +42,24 @@ function createMap()
 
 const scene			= new THREE.Scene();
 const bar			= createBarPlayer(0xed56ea);
-const renderer		= new THREE.WebGLRenderer();
-const player		= new Player(bar, renderer);
-const spotLight		= new THREE.SpotLight(0xffffff, 1000, 0, Math.PI / 4);
+const renderer		= new THREE.WebGLRenderer({antialias: true});
+const player		= new Player(bar);
+const spotLight		= new THREE.SpotLight(0xffffff, 10000, 0, Math.PI / 4);
+const ambiantLight	= new THREE.AmbientLight(0xffffff, 1);
 const map			= createMap();
 
 scene.add(player.object);
+scene.add(ambiantLight);
 spotLight.position.set(0, 100, 0);
 scene.add(spotLight);
 scene.add(map);
 scene.background = new THREE.Color(0x1a1a1a);
 renderer.setSize(window.innerWidth, window.innerHeight);
 document.body.appendChild(renderer.domElement);
-player.setCameraPosition(0, 0.5, 1)
+
+document.addEventListener('keypress', (e) => {
+	if (e.key == 'g')
+		player.pointAnimation(scene);
+})
+
 renderer.setAnimationLoop(loop)
diff --git a/site/real_game/package-lock.json b/site/real_game/package-lock.json
index 2d7a4c0..a6a2112 100644
--- a/site/real_game/package-lock.json
+++ b/site/real_game/package-lock.json
@@ -5,6 +5,7 @@
   "packages": {
     "": {
       "dependencies": {
+        "@rollup/rollup-darwin-arm64": "^4.21.0",
         "rollup": "^4.21.0",
         "three": "^0.167.1",
         "vite": "^5.4.1"
@@ -412,7 +413,6 @@
         "arm64"
       ],
       "license": "MIT",
-      "optional": true,
       "os": [
         "darwin"
       ]
diff --git a/site/real_game/package.json b/site/real_game/package.json
index 98df8eb..fe9ee82 100644
--- a/site/real_game/package.json
+++ b/site/real_game/package.json
@@ -3,6 +3,7 @@
     "dev": "vite"
   },
   "dependencies": {
+    "@rollup/rollup-darwin-arm64": "^4.21.0",
     "rollup": "^4.21.0",
     "three": "^0.167.1",
     "vite": "^5.4.1"