diff --git a/ALGUL/index.html b/ALGUL/index.html
index 76e27dc119783f47da855d49712c43bab0798e9a..ef576cf084bf04ca60c1475ef5cecb5c16270f68 100644
--- a/ALGUL/index.html
+++ b/ALGUL/index.html
@@ -1 +1,46 @@
-Le travail n'a pas encore commencé!!!
\ No newline at end of file
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="UTF-8" />
+ <title>Projet WebGL</title>
+ <style>
+ body {
+ margin: 0;
+ }
+ canvas {
+ width: 100%;
+ height: 100%;
+ }
+ .centre {
+ text-align: center;
+ }
+ </style>
+ </head>
+ <body>
+ <!-- Chargement du polyfill pour les import maps -->
+ <script async src="https://unpkg.com/es-module-shims@1.3.6/dist/es-module-shims.js"></script>
+
+ <script type="importmap">
+ {
+ "imports": {
+ "three": "https://cdn.jsdelivr.net/npm/three@0.138.0/build/three.module.js",
+ "three/addons/controls/OrbitControls.js": "https://cdn.jsdelivr.net/npm/three@0.138.0/examples/jsm/controls/OrbitControls.js",
+ "three/addons/loaders/OBJLoader.js": "https://cdn.jsdelivr.net/npm/three@0.138.0/examples/jsm/loaders/OBJLoader.js",
+ "Coordinates": "./lib/Coordinates.js",
+ "dat.gui": "https://cdn.jsdelivr.net/npm/dat.gui@0.7.9/build/dat.gui.module.js"
+ }
+ }
+ </script>
+
+ <!-- JQuery pour afficher les erreurs -->
+ <script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
+
+ <h1 class="centre">Projet WebGL</h1>
+ <div id="webGL" class="centre"></div>
+
+ <!-- Votre script principal -->
+ <script type="module" src="index.js"></script>
+
+ <p class="centre">Projet réalisée par Sefer, Louis et Mehdi</p>
+ </body>
+</html>
diff --git a/ALGUL/index.js b/ALGUL/index.js
new file mode 100644
index 0000000000000000000000000000000000000000..be0a97a55180e63f0296e1fee99d98d787bd7aee
--- /dev/null
+++ b/ALGUL/index.js
@@ -0,0 +1,103 @@
+ import * as THREE from 'https://cdn.jsdelivr.net/npm/three@0.150.1/build/three.module.js';
+ import { GLTFLoader } from 'https://cdn.jsdelivr.net/npm/three@0.150.1/examples/jsm/loaders/GLTFLoader.js';
+ import { OrbitControls } from 'https://cdn.jsdelivr.net/npm/three@0.150.1/examples/jsm/controls/OrbitControls.js';
+
+ const scene = new THREE.Scene();
+ const camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 0.1, 1000);
+ const renderer = new THREE.WebGLRenderer({ antialias: true });
+
+ renderer.setSize(window.innerWidth, window.innerHeight);
+ document.body.appendChild(renderer.domElement);
+
+ const controls = new OrbitControls(camera, renderer.domElement);
+ controls.enableDamping = true;
+ controls.dampingFactor = 0.05;
+ controls.screenSpacePanning = false;
+ controls.maxDistance = 1000;
+ controls.minDistance = 50;
+ controls.target.set(0, 0, 0);
+
+ const light = new THREE.DirectionalLight(0xffffff, 1);
+ light.position.set(10, 10, 10);
+ scene.add(light);
+
+ const ambientLight = new THREE.AmbientLight(0x404040, 1);
+ scene.add(ambientLight);
+
+ camera.position.set(200, 150, 300);
+
+ const loader = new GLTFLoader();
+ loader.load('modeles/old_bridge.glb', function (gltf) {
+ const bridge = gltf.scene;
+ scene.add(bridge);
+
+ bridge.position.set(0, 100, 0);
+ bridge.scale.set(0.5, 0.5, 0.5);
+ bridge.rotation.y = Math.PI / 2;
+
+ controls.target.copy(bridge.position);
+ controls.update();
+
+ renderer.render(scene, camera);
+ }, undefined, function (error) {
+ console.error("Erreur de chargement du pont :", error);
+ });
+
+ loader.load('modeles/bateau.glb', function (gltf) {
+ const boat1 = gltf.scene.clone();
+ const boat2 = gltf.scene.clone();
+
+ boat1.position.set(-300, 1, - 500);
+ boat1.scale.set(0.3, 0.3, 0.3);
+
+ boat2.position.set(-200, 1, -600);
+ boat2.scale.set(0.3, 0.3, 0.3);
+ boat2.rotation.y = Math.PI / 4;
+
+ scene.add(boat1);
+ scene.add(boat2);
+
+ renderer.render(scene, camera);
+ }, undefined, function (error) {
+ console.error("Erreur de chargement des bateaux :", error);
+ });
+
+ const sunGeometry = new THREE.SphereGeometry(20, 32, 32);
+ const sunMaterial = new THREE.MeshBasicMaterial({ color: 0xffcc00 });
+ const sun = new THREE.Mesh(sunGeometry, sunMaterial);
+ sun.position.set(50, 300, -200);
+ scene.add(sun);
+
+ const sunLight = new THREE.DirectionalLight(0xffddaa, 2);
+ sun.add(sunLight);
+ scene.add(sunLight);
+
+ const textureLoader = new THREE.TextureLoader();
+ const groundTexture = textureLoader.load('textures/water.jpg');
+ groundTexture.wrapS = groundTexture.wrapT = THREE.RepeatWrapping;
+ groundTexture.repeat.set(10, 10);
+ groundTexture.offset.set(0, 0);
+
+ const groundMaterial = new THREE.MeshLambertMaterial({ map: groundTexture });
+
+ const solidGround = new THREE.Mesh(
+ new THREE.PlaneGeometry(10000, 10000, 100, 100),
+ groundMaterial
+ );
+ solidGround.rotation.x = -Math.PI / 2;
+ solidGround.position.y = -2;
+ scene.add(solidGround);
+
+ function animate() {
+ requestAnimationFrame(animate);
+ controls.update();
+ renderer.render(scene, camera);
+ }
+
+ animate();
+
+ window.addEventListener('resize', () => {
+ renderer.setSize(window.innerWidth, window.innerHeight);
+ camera.aspect = window.innerWidth / window.innerHeight;
+ camera.updateProjectionMatrix();
+ });
diff --git a/ALGUL/modeles/.gitkeep b/ALGUL/modeles/.gitkeep
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/ALGUL/textures/.gitkeep b/ALGUL/textures/.gitkeep
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/ALGUL/textures/water.jpg b/ALGUL/textures/water.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..4d619f380ac9421f5ecf80ba943e4b598563c659
Binary files /dev/null and b/ALGUL/textures/water.jpg differ
diff --git a/DUFOUR/INFOS.md b/DUFOUR/INFOS.md
new file mode 100644
index 0000000000000000000000000000000000000000..f26e8e3768875ea41a7469d7a2ad4e97a310cffc
--- /dev/null
+++ b/DUFOUR/INFOS.md
@@ -0,0 +1,55 @@
+# LA CHAMBRE DE VAN GOGH A ARLES
+*DUFOUR Louise et DE RYCKE Leanne, BUT2 INFO 2025*
+
+
+
+## Lire des maillages
+MeshLab
+
+## Importer des obj
+https://github.com/mrdoob/three.js/blob/master/examples/webgl_loader_obj_mtl.html
+
+
+
+
+
+# WebGL25 CONSIGNES
+
+## A faire :
+1. Mettre une image de sa peinture à la place de ``img.jpg``
+2. Mettre sa page web dans ``index.html``
+3. Mettre son fichier javascript avec :
+ - la partie modélisation (primitive + fichier 3D)
+ - la partie matériaux (*Phong* et *Gouraud* suivant le type d'objet)
+ - des boucles avec des transformations et des matrices comme vu en TP
+4. Mettre les bibliothèques **THREE.JS** et autres dans un dossier ``lib`` à la racine pour que tout le monde les utilise
+5. Commencer à écrire des explications dans le html
+
+## Notation :
+
+- Le fichier ``checklistProjet.md`` reprend les éléments notés
+- Vous pouvez copier ce fichier dans votre repertoire et cocher (``[ X]``) ce que vous pensez avoir accompli
+
+
+## CHECK LIST
+*(ajouter X pour cocher)*
+- [ ] Esthetisme
+- [ ] Mise en page de la page web
+- [ ] Paragraphe(s) d'explications techniques
+- [ ] Légèreté du dossier (<2Mo)
+- [ ] Géométrie
+- [ ] Couleur
+- [ ] Transparence
+- [ ] Eclairage
+- [ ] Ombres portées
+- [ ] Position de la caméra
+- [ ] Brouillard
+- [ ] Effet miroir
+- [ ] Texture classique
+- [ ] Texture avec transparence
+- [ ] Sprites
+- [ ] Environment map
+- [ ] Skybox
+- [ ] specular maps
+- [ ] normal maps
+- [ ] Interaction par GUI
diff --git a/DUFOUR/elements/wooden_bed.glb b/DUFOUR/elements/wooden_bed.glb
new file mode 100644
index 0000000000000000000000000000000000000000..13bc5cfb7294611afcc2486955e78c4708e0b984
Binary files /dev/null and b/DUFOUR/elements/wooden_bed.glb differ
diff --git a/DUFOUR/elements/wooden_chair.glb b/DUFOUR/elements/wooden_chair.glb
new file mode 100644
index 0000000000000000000000000000000000000000..b5f6e89936685824d7b6ec6199714c1f9676e875
Binary files /dev/null and b/DUFOUR/elements/wooden_chair.glb differ
diff --git "a/DUFOUR/La_Chambre_\303\240_Arles,_by_Vincent_van_Gogh,_from_C2RMF.jpg" b/DUFOUR/img.jpg
similarity index 100%
rename from "DUFOUR/La_Chambre_\303\240_Arles,_by_Vincent_van_Gogh,_from_C2RMF.jpg"
rename to DUFOUR/img.jpg
diff --git a/DUFOUR/index.html b/DUFOUR/index.html
index 76e27dc119783f47da855d49712c43bab0798e9a..4f33134e592066054ae8d9f791363f61d7500805 100644
--- a/DUFOUR/index.html
+++ b/DUFOUR/index.html
@@ -1 +1,95 @@
-Le travail n'a pas encore commencé!!!
\ No newline at end of file
+<template>
+ <div ref="container" style="width: 100%; height: 100vh;"></div>
+</template>
+
+<script>
+ import * as THREE from "three";
+ import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader.js";
+ import { OrbitControls } from "three/examples/jsm/controls/OrbitControls";
+
+ export default {
+ name: "Model",
+ data() {
+ return {
+ scene: null,
+ camera: null,
+ renderer: null,
+ control: null,
+ model: null,
+ };
+ },
+ methods: {
+ initScene() {
+ this.scene = new THREE.Scene();
+ },
+ initCamera() {
+ this.camera = new THREE.PerspectiveCamera(
+ 50,
+ window.innerWidth / window.innerHeight,
+ 0.01,
+ 1000
+ );
+ this.camera.position.set(0.02, 5, 10);
+ },
+ initRenderer() {
+ this.renderer = new THREE.WebGLRenderer({ antialias: true });
+ this.renderer.setSize(window.innerWidth, window.innerHeight);
+ this.$refs.container.appendChild(this.renderer.domElement);
+ },
+ initLight() {
+ const ambientLight = new THREE.AmbientLight(0xffffff, 1);
+ this.scene.add(ambientLight);
+
+ const directionalLight = new THREE.DirectionalLight(0xffffff, 0.5);
+ directionalLight.position.set(5, 5, 5);
+ this.scene.add(directionalLight);
+ },
+ initControl() {
+ this.control = new OrbitControls(this.camera, this.renderer.domElement);
+ this.control.enableDamping = true;
+ this.control.dampingFactor = 0.05;
+ this.control.autoRotate = true;
+ this.control.autoRotateSpeed = 2.0;
+ },
+ initModel() {
+ const loader = new GLTFLoader();
+ loader.load(
+ "elements/wooden_chair.glb",
+ (glb) => {
+ this.model = glb.scene;
+ this.scene.add(this.model);
+ },
+ (xhr) => {
+ console.log((xhr.loaded / xhr.total) * 100 + "% loaded");
+ },
+ (error) => {
+ console.log("An error happened:", error);
+ }
+ );
+ },
+ init() {
+ this.initScene();
+ this.initCamera();
+ this.initRenderer();
+ this.initLight();
+ this.initControl();
+ this.initModel();
+ },
+ animate() {
+ requestAnimationFrame(this.animate);
+ this.control.update();
+ this.renderer.render(this.scene, this.camera);
+ },
+ },
+ mounted() {
+ this.init();
+ this.animate();
+
+ window.addEventListener("resize", () => {
+ this.renderer.setSize(window.innerWidth, window.innerHeight);
+ this.camera.aspect = window.innerWidth / window.innerHeight;
+ this.camera.updateProjectionMatrix();
+ });
+ },
+ };
+</script>
\ No newline at end of file