diff --git a/docker-compose/requirements/nginx/static/javascript/filesLoader.js b/docker-compose/requirements/nginx/static/javascript/filesLoader.js
index 863cc89..c710ff3 100644
--- a/docker-compose/requirements/nginx/static/javascript/filesLoader.js
+++ b/docker-compose/requirements/nginx/static/javascript/filesLoader.js
@@ -6,7 +6,7 @@
 /*   By: edbernar <edbernar@student.42angouleme.    +#+  +:+       +#+        */
 /*                                                +#+#+#+#+#+   +#+           */
 /*   Created: 2024/09/29 22:36:43 by edbernar          #+#    #+#             */
-/*   Updated: 2024/10/06 16:42:07 by edbernar         ###   ########.fr       */
+/*   Updated: 2024/10/09 14:40:52 by edbernar         ###   ########.fr       */
 /*                                                                            */
 /* ************************************************************************** */
 
@@ -31,10 +31,42 @@ const	url_files = {
 
 	wallTexture: '/static/img/multiOnlineGamePage/wallTexture.jpg',
 	planeTexture: '/static/img/multiOnlineGamePage/pastel.jpg',
-	skinOneTexture: '/static/img/skin/1.jpg',
-	skinTwoTexture: '/static/img/skin/2.jpg',
-	skinThreeTexture: '/static/img/skin/3.jpg',
-	skinFourTexture: '/static/img/skin/4.jpg',
+	skinOneTexture: {
+		left: '/static/img/skin/1/left.jpg',
+		right: '/static/img/skin/1/right.jpg',
+		top: '/static/img/skin/1/top.jpg',
+		bottom: '/static/img/skin/1/bottom.jpg',
+		front: '/static/img/skin/1/front.jpg',
+		back: '/static/img/skin/1/back.jpg',
+		show: '/static/img/skin/1/back.jpg',
+	},
+	skinTwoTexture: {
+		left: '/static/img/skin/1/left.jpg',
+		right: '/static/img/skin/1/right.jpg',
+		top: '/static/img/skin/1/top.jpg',
+		bottom: '/static/img/skin/1/bottom.jpg',
+		front: '/static/img/skin/1/front.jpg',
+		back: '/static/img/skin/1/back.jpg',
+		show: '/static/img/skin/1/back.jpg',
+	},
+	skinThreeTexture: {
+		left: '/static/img/skin/1/left.jpg',
+		right: '/static/img/skin/1/right.jpg',
+		top: '/static/img/skin/1/top.jpg',
+		bottom: '/static/img/skin/1/bottom.jpg',
+		front: '/static/img/skin/1/front.jpg',
+		back: '/static/img/skin/1/back.jpg',
+		show: '/static/img/skin/1/back.jpg',
+	},
+	skinFourTexture: {
+		left: '/static/img/skin/1/left.jpg',
+		right: '/static/img/skin/1/right.jpg',
+		top: '/static/img/skin/1/top.jpg',
+		bottom: '/static/img/skin/1/bottom.jpg',
+		front: '/static/img/skin/1/front.jpg',
+		back: '/static/img/skin/1/back.jpg',
+		show: '/static/img/skin/1/back.jpg',
+	},
 }
 
 let	files = {
@@ -56,6 +88,18 @@ async function loadFiles()
 		});
 	});
 	Object.entries(url_files).forEach(([key, value]) => {
+		if (typeof value === 'object')
+		{
+			files[key] = {};
+			Object.entries(value).forEach(([k, v]) => {
+				fetch(v)
+				.then(response => response.blob())
+				.then(blob => {
+					files[key][k] = URL.createObjectURL(blob);
+				});
+			});
+			return;
+		}
 		fetch(value)
 		.then(response => response.blob())
 		.then(blob => {
diff --git a/docker-compose/requirements/nginx/static/javascript/lobbyPage/3d.js b/docker-compose/requirements/nginx/static/javascript/lobbyPage/3d.js
index 846bf27..db24a49 100644
--- a/docker-compose/requirements/nginx/static/javascript/lobbyPage/3d.js
+++ b/docker-compose/requirements/nginx/static/javascript/lobbyPage/3d.js
@@ -6,11 +6,12 @@
 /*   By: edbernar <edbernar@student.42angouleme.    +#+  +:+       +#+        */
 /*                                                +#+#+#+#+#+   +#+           */
 /*   Created: 2024/09/13 13:59:46 by edbernar          #+#    #+#             */
-/*   Updated: 2024/10/03 21:15:40 by edbernar         ###   ########.fr       */
+/*   Updated: 2024/10/09 15:24:50 by edbernar         ###   ########.fr       */
 /*                                                                            */
 /* ************************************************************************** */
 
 import { createStar, createBox, createRectangle, createRing, colorList } from '/static/javascript/multiOnlineGame/Map.js'
+import { createBarPlayer } from '/static/javascript/multiOnlineGame/multiOnlineGamePage.js'
 import * as THREE from '/static/javascript/three/build/three.module.js'
 import { files } from '/static/javascript/filesLoader.js';
 
@@ -42,7 +43,7 @@ class barSelecter
 	camera			= null;
 	spotLight		= new THREE.SpotLight(0xffffff, 5);
 	selected		= lastSelected ? lastSelected : availableSkins[0];
-	bar				= this.createBarPlayer(this.selected.color ? this.selected.color : this.selected.texture);
+	bar				= this.createBarPlayer(this.selected);
 	boundChangeSkin = this.changeSkin.bind(this);
 
 
@@ -82,7 +83,7 @@ class barSelecter
 				if (availableSkins[i].color != null)
 					skins[i].style.backgroundColor = `#${availableSkins[i].color.toString(16)}`;
 				else
-					skins[i].style.backgroundImage = `url("${availableSkins[i].texture}")`
+					skins[i].style.backgroundImage = `url("${availableSkins[i].texture.show}")`
 				skins[i].removeEventListener('click', this.boundChangeSkin);
 				skins[i].addEventListener('click', this.boundChangeSkin);
 			}
@@ -105,28 +106,45 @@ class barSelecter
 	
 		const id = event.target.getAttribute('skinId');
 		popup.style.display = 'none';
-		this.bar.material.dispose();
-		lastSelected = availableSkins[id];
-		if (availableSkins[id].color != null)
-			this.bar.material = new THREE.MeshPhysicalMaterial({color: availableSkins[id].color});
+		if (Array.isArray(this.bar.material))
+		{
+			this.bar.material.forEach(material => {
+				if (material.map)
+					material.map.dispose();
+				material.dispose();
+			});
+		}
 		else
-			this.bar.material = new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(availableSkins[id].texture)});
+		{
+			if (this.bar.material.map)
+				this.bar.material.map.dispose();
+			this.bar.material.dispose();
+		}
+		lastSelected = availableSkins[id];
+		if (availableSkins[id].color)
+			this.bar.material = new THREE.MeshPhysicalMaterial({color: skin.color});
+		else
+		{
+			if (typeof availableSkins[id].texture !== 'object')
+				this.bar.material = new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(skin.texture)});
+			else
+			{
+				this.bar.material = [
+					new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(availableSkins[id].texture.left)}),
+					new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(availableSkins[id].texture.right)}),
+					new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(availableSkins[id].texture.top)}),
+					new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(availableSkins[id].texture.bottom)}),
+					new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(availableSkins[id].texture.front)}),
+					new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(availableSkins[id].texture.back)}),
+				]
+			}
+		}
 		this.selected = availableSkins[id];
 	}
 
 	createBarPlayer(color)
 	{
-		const	geometry	= new THREE.BoxGeometry(1, 0.1, 0.1);
-		let		material	= null;
-
-		if (typeof(color) == 'number')
-			material = new THREE.MeshPhysicalMaterial({color: color});
-		else
-			material = new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(color)});
-		const	mesh		= new THREE.Mesh(geometry, material);
-
-		mesh.castShadow = true;
-		return (mesh);
+		return (createBarPlayer(color));
 	}
 
 	#loop()
@@ -204,6 +222,7 @@ class goalSelecter
 		const	goal	=	document.getElementsByClassName('color-box-goal');
 	
 		popup.style.display = 'flex';
+		
 		for (let i = 0; i < goal.length; i++)
 		{
 			const	canvas = goal[i].getElementsByTagName('canvas');
@@ -223,11 +242,11 @@ class goalSelecter
 	{
 		const	scene		= new THREE.Scene();
 		const	renderer	= new THREE.WebGLRenderer({antialias: true});
-		const	camera		= new THREE.PerspectiveCamera(60, (pos.width - 5) / (pos.height - 5));
+		const	camera		= new THREE.PerspectiveCamera(60, (pos.width - 8) / (pos.height - 8));
 		const	mesh		= func(colorList[Math.floor(Math.random() * 100 % colorList.length)]);
 		const	spotLight	= new THREE.SpotLight(0xffffff, 5000);
 		
-		renderer.setSize(pos.width - 5, pos.height - 5);
+		renderer.setSize(pos.width - 8, pos.height - 8);
 		scene.add(mesh);
 		camera.position.set(1.5, 1.5, 1.5);
 		spotLight.position.set(1.5, 1.5, 1.5);
@@ -238,7 +257,7 @@ class goalSelecter
 		this.sceneList.push(scene);
 		this.rendererList.push(renderer);
 		this.cameraList.push(camera);
-		return (renderer.domElement)
+		return (renderer.domElement);
 	}
 
 	changeGoal(event)
diff --git a/docker-compose/requirements/nginx/static/javascript/multiOnlineGame/multiOnlineGamePage.js b/docker-compose/requirements/nginx/static/javascript/multiOnlineGame/multiOnlineGamePage.js
index 48147d7..7ac73cd 100644
--- a/docker-compose/requirements/nginx/static/javascript/multiOnlineGame/multiOnlineGamePage.js
+++ b/docker-compose/requirements/nginx/static/javascript/multiOnlineGame/multiOnlineGamePage.js
@@ -6,7 +6,7 @@
 /*   By: edbernar <edbernar@student.42angouleme.    +#+  +:+       +#+        */
 /*                                                +#+#+#+#+#+   +#+           */
 /*   Created: 2024/08/18 00:53:53 by edbernar          #+#    #+#             */
-/*   Updated: 2024/10/08 18:54:22 by edbernar         ###   ########.fr       */
+/*   Updated: 2024/10/09 14:47:25 by edbernar         ###   ########.fr       */
 /*                                                                            */
 /* ************************************************************************** */
 
@@ -20,6 +20,7 @@ import { pageRenderer, isMobile } from '/static/javascript/main.js'
 import { Ball } from '/static/javascript/multiOnlineGame/Ball.js'
 import { Map } from '/static/javascript/multiOnlineGame/Map.js'
 import { sendRequest } from "/static/javascript/websocket.js";
+import { files } from '/static/javascript/filesLoader.js';
 /*
 Controls :
 	- w : monter
@@ -86,11 +87,16 @@ class MultiOnlineGamePage
 	static create(skin)
 	{
 		if (!skin)
-			skin = {player: 0, opponent: 0};
+		{
+			skin = {player: 4, opponent: 0};
+			availableSkins[4].texture = files.skinOneTexture;
+			availableSkins[5].texture = files.skinTwoTexture;
+			availableSkins[6].texture = files.skinThreeTexture;
+			availableSkins[7].texture = files.skinFourTexture;
+		}
 		const bar1		= createBarPlayer(availableSkins[skin.player]);
 		const bar2		= createBarPlayer(availableSkins[skin.opponent]);
 
-		console.log('skin : ', skin);
 		document.body.setAttribute('style', '');
 		scene					= new THREE.Scene()
 		map						= new Map(scene, 13, false, skin.pfp, skin.pfpOpponent);
@@ -284,13 +290,27 @@ class MultiOnlineGamePage
 
 function createBarPlayer(skin)
 {
-	const	geometry	= new THREE.BoxGeometry(1, 0.1, 0.1);
-	let		material	= null;
+	const	geometry		= new THREE.BoxGeometry(1, 0.1, 0.1);
+	let		material		= null;
 
 	if (skin.color)
 		material = new THREE.MeshPhysicalMaterial({color: skin.color});
 	else
-		material = new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(skin.texture)});
+	{
+		if (typeof skin.texture !== 'object')
+			material = new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(skin.texture)});
+		else
+		{
+			material = [
+				new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(skin.texture.left)}),
+				new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(skin.texture.right)}),
+				new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(skin.texture.top)}),
+				new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(skin.texture.bottom)}),
+				new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(skin.texture.front)}),
+				new THREE.MeshPhysicalMaterial({map: new THREE.TextureLoader().load(skin.texture.back)}),
+			]
+		}
+	}
 	const mesh		= new THREE.Mesh(geometry, material);
 
 	mesh.castShadow = true;
@@ -373,4 +393,4 @@ function configButton()
 }
 
 
-export { MultiOnlineGamePage, player, opponent, ball, map, scene, renderer, isInVrMode };
\ No newline at end of file
+export { MultiOnlineGamePage, player, opponent, ball, map, scene, renderer, isInVrMode, createBarPlayer };
\ No newline at end of file