docker-compose.yml

@@ -3,22 +3,10 @@ services:
     build:
       context: .
       dockerfile: dockerfile
-      network: host
+    container_name: web
-    container_name: nuitdelinfo
     restart: always
+    ports:
+      - 8080:2486
     volumes:
       - ./back/data:/app/data
-    networks:
-      - traefik
-    labels:
-      - "traefik.enable=true"
-      - "traefik.http.routers.nuitdelinfo.rule=Host(`nuitdelinfo.leizour.fr`)"
-      - "traefik.http.routers.nuitdelinfo.entrypoints=websecure"
-      - "traefik.http.routers.nuitdelinfo.tls=true"
-      - "traefik.http.routers.nuitdelinfo.tls.certresolver=myresolver"
-      - "traefik.http.services.nuitdelinfo.loadbalancer.server.port=2486"
-
-networks:
-  traefik:
-    external: true
 

front/src/components/3d/Axes.tsx

@@ -1,4 +1,6 @@
+import React from 'react'
 import { LineBasicMaterial, Line, Group } from 'three'
+import { useFrame } from '@react-three/fiber'
 import * as THREE from 'three'
 
 export default function Axes() {

front/src/components/3d/Character.tsx

@@ -1,10 +1,11 @@
+import { Group, Mesh, MeshStandardMaterial, BufferGeometry } from 'three'
 import { useGLTF } from '@react-three/drei'
 
 export default function Character() {
     // import glb file
 
     // load the glb file in "/models/BASEmodel.glb"
-    const { scene } = useGLTF('/models/man.glb')
+    const { nodes, materials, scene } = useGLTF('/models/man.glb')
     
     // rotate the character
     scene.rotation.x = -Math.PI / 2

front/src/components/3d/Floor.tsx

@@ -1,3 +1,5 @@
+
+import React from 'react'
 import { Group } from 'three'
 import * as THREE from 'three'
 

front/src/components/3d/Marker.tsx

@@ -1,4 +1,5 @@
 import React from 'react'
+import { Group } from 'three'
 import * as THREE from 'three'
 
 interface MarkerProps {
@@ -14,7 +15,7 @@ export default function Marker({ position, color, onClick }: MarkerProps) {
     // Return the marker object
     // return <primitive object={marker}  />
     return (
-        <mesh position={positionState} rotation={[Math.PI,0,0]} onClick={onClick} onPointerOver={() => setPositionState(positionState.clone().setZ(positionState.z + 0.1))} onPointerOut={() => setPositionState(new THREE.Vector3(...position))}>
+        <mesh position={positionState} rotation={[Math.PI,0,0]} onClick={onClick} onPointerOver={(e) => setPositionState(positionState.clone().setZ(positionState.z + 0.1))} onPointerOut={(e) => setPositionState(new THREE.Vector3(...position))}>
             <coneGeometry args={[0.15, 0.6, 6]} />
             <meshStandardMaterial color={color} side={THREE.DoubleSide} />
         </mesh>

front/src/components/3d/Ocean.tsx

@@ -2,6 +2,7 @@
 import React, { useEffect, useRef } from 'react';
 import * as THREE from 'three';
 import { Water, WaterOptions } from 'three/examples/jsm/objects/Water.js';
+import { WaterMesh, WaterMeshOptions } from 'three/examples/jsm/objects/Water2Mesh.js';
 
 const Ocean: React.FC = () => {
 

front/src/components/Button.tsx

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import { ReactNode, MouseEventHandler } from 'react';
 
 interface ButtonProps {
     color: 'primary' | 'secondary';

front/src/components/FstSection.tsx

@@ -1,4 +1,5 @@
 import Button from "./Button";
+import ButtonLink from "./ButtonLink";
 import NavBar from "./NavBar";
 
 export default function FstSection () {

front/src/components/NavBar.tsx

@@ -1,3 +1,4 @@
+import LogoButton from '../components/LogoButton.tsx'
 import ClickableLink from './ClickableLink.tsx';
 import RoundButton from './RoundButton.tsx';
 

front/src/pages/GamePage.tsx

@@ -1,7 +1,9 @@
 import { Canvas } from "@react-three/fiber";
 import { OrbitControls, PerspectiveCamera, Sky } from "@react-three/drei";
-import { useEffect,  useState } from "react";
+import * as THREE from "three";
+import React, { useEffect, useRef, useState } from "react";
 import Ocean from "../components/3d/Ocean";
+import Axes from "../components/3d/Axes";
 import Character from "../components/3d/Character";
 import Floor from "../components/3d/Floor";
 import Marker from "../components/3d/Marker";