diff --git a/ALVARIZA-BILLAR_DESERT_KANY/projet.js b/ALVARIZA-BILLAR_DESERT_KANY/projet.js
index 64165111f44477a2f31b10f6d7f182d544781bc5..c77e6dc2f46c94d009d86ccd1f8122d739e55aec 100644
--- a/ALVARIZA-BILLAR_DESERT_KANY/projet.js
+++ b/ALVARIZA-BILLAR_DESERT_KANY/projet.js
@@ -11,8 +11,6 @@ import * as dat from 'https://cdn.jsdelivr.net/npm/dat.gui@0.7.9/build/dat.gui.m
import {MTLLoader} from 'three/addons/loaders/MTLLoader.js';
import Stats from 'https://cdn.jsdelivr.net/npm/three@0.130.1/examples/jsm/libs/stats.module.js';
-
-
window.scene = new THREE.Scene();
// Variables globales
@@ -21,6 +19,7 @@ var cameraControls;
var clock = new THREE.Clock();
var beton;
var car;
+
var stats = new Stats();
stats.showPanel(0); // 0: afficher le panneau des FPS
document.body.appendChild(stats.dom);
@@ -31,7 +30,21 @@ window.carMoving = true;
function fillScene() {
scene = new THREE.Scene();
- // LIGHTS
+ light();
+ ground();
+ road();
+ loadCar();
+ capsuleBeton();
+ dalleBeton();
+ poleAndFlag();
+ // house(); // TODO
+ forest();
+}
+
+/**
+ * Fonction qui gère les lumières
+ */
+function light() {
scene.add(new THREE.AmbientLight(0x222222));
var light = new THREE.DirectionalLight(0xFFFFFF, 0.9);
light.position.set(200, 500, 500);
@@ -39,8 +52,12 @@ function fillScene() {
light = new THREE.DirectionalLight(0xFFFFFF, 10);
light.position.set(-200, -100, -400);
scene.add(light);
+}
- // GROUND
+/**
+ * Function qui gère le sol
+ */
+function ground() {
var texture = new THREE.TextureLoader();
var grassTexture = texture.load('textures/grass.png');
grassTexture.wrapS = THREE.RepeatWrapping;
@@ -57,8 +74,13 @@ function fillScene() {
scene.background = new THREE.CubeTextureLoader()
.setPath('textures/skybox/')
.load(['px.jpg', 'nx.jpg', 'py.jpg', 'ny.jpg', 'pz.jpg', 'nz.jpg']);
+}
- // ROUTE
+/**
+ * Fonction qui gère la route
+ */
+function road() {
+ var texture = new THREE.TextureLoader();
var roadTexture = texture.load('textures/road.jpg');
roadTexture.wrapS = THREE.RepeatWrapping;
roadTexture.wrapT = THREE.RepeatWrapping;
@@ -78,29 +100,49 @@ function fillScene() {
road.position.y = 10;
road.position.z = 10;
scene.add(road);
+}
+
+/**
+ * Fonction qui charge la voiture
+ */
+function loadCar() {
+ new OBJLoader().load('car.obj', function (object) {
+ car = object;
+ car.scale.setScalar(200);
+ car.position.set(0, 30, -9000);
+ car.rotation.y = 0;
- // DALLE DE BÉTON (sous la maisonnette)
+ car.traverse(function (child) {
+ if (child.isMesh) {
+ child.material = new THREE.MeshStandardMaterial({color: 0xff0000});
+ }
+ });
+
+ scene.add(car);
+ });
+}
+
+/**
+ * Function qui crée la texture de béton
+ */
+function createBetonTexture() {
+ var texture = new THREE.TextureLoader();
var betonTexture = texture.load('textures/beton.jpg');
betonTexture.wrapS = THREE.RepeatWrapping;
betonTexture.wrapT = THREE.RepeatWrapping;
betonTexture.repeat.set(1, 1);
- var betonMaterial = new THREE.MeshLambertMaterial({map: betonTexture});
-
- beton = new THREE.Mesh(
- new THREE.BoxGeometry(5500, 350, 5500),
- betonMaterial
- );
- beton.position.set(-8000, 0, 1850);
- beton.rotation.y = 0.2225;
- scene.add(beton);
-
-
-
+ return betonTexture;
+}
+/**
+ * Fonction qui gère la casquette de béton (sous les pompes à essence)
+ */
+function capsuleBeton() {
+ // Récupérer la texture béton via la fonction dédiée
+ var betonTexture = createBetonTexture();
- // CAPSULE EN BÉTON (sous les pompes à essence)
var capsuleLength = 5700; // Longueur de la capsule
var capsuleHeight = 800; // Largeur de la capsule
var radius = capsuleHeight / 2; // Rayon des extrémités arrondies
@@ -126,12 +168,35 @@ function fillScene() {
capsuleMesh.position.set(-2750, 0, 650);
scene.add(capsuleMesh);
+}
+
+/**
+ * Fonction qui gère la dalle de béton (sous la maisonnette)
+ */
+function dalleBeton() {
+ // Récupérer la texture béton via la fonction dédiée
+ var betonTexture = createBetonTexture();
+
+ var betonMaterial = new THREE.MeshLambertMaterial({map: betonTexture});
+
+ beton = new THREE.Mesh(
+ new THREE.BoxGeometry(5500, 350, 5500),
+ betonMaterial
+ );
+ beton.position.set(-8000, 0, 1850);
+ beton.rotation.y = 0.2225;
+ scene.add(beton);
+}
- // Matériaux
+/**
+ * Fonction qui gère le poteau et son drapeau
+ */
+function poleAndFlag() {
+ // Matériaux
const redMaterial = new THREE.MeshStandardMaterial({ color: 0xff0000 }); // Rouge
const grayMaterial = new THREE.MeshStandardMaterial({ color: 0x888888 }); // Gris
- // Bas du poteau (rouge)
+ // Bas du poteau (rouge)
const bottomPoleGeometry = new THREE.CylinderGeometry(30, 30, 1000, 32);
const bottomPole = new THREE.Mesh(bottomPoleGeometry, redMaterial);
bottomPole.position.set(-5000, 750, 6000);
@@ -150,75 +215,60 @@ function fillScene() {
const sign = new THREE.Mesh(signGeometry, signMaterial);
// enseigne comme un drapeau
- sign.position.set(-4800, 2500, 6000);
- sign.rotation.y = 0;
+ sign.position.set(-4800, 2750, 6000);
+ sign.rotation.y = 0;
// Ajouter l'enseigne
scene.add(sign);
-
- // ARBRES
- new MTLLoader()
- .load('tree_bonus.mtl', function (materials) {
- materials.preload();
- new OBJLoader()
- .setMaterials(materials)
- .load('tree_bonus.obj', function (object) {
- object.traverse(function (child) {
- if (child.isMesh) {
- child.material = new THREE.MeshLambertMaterial({color: 0x006600});
- }
- });
-
- // Arbres à gauche de la route
- var numTreesX = 23, numTreesZ = 100, spacingX = 2000, spacingZ = 1000, startX = 3000,
- startZ = -50000;
- for (var x = 0; x < numTreesX; x++) {
- for (var z = 0; z < numTreesZ; z++) {
- var tree = object.clone();
- tree.position.set(startX + x * spacingX + Math.random() * spacingX, 0, startZ + z * spacingZ + Math.random() * spacingZ);
- tree.scale.setScalar(400);
- scene.add(tree);
- }
- }
-
- // Arbres à droite de la route
- var numTreesX = 19, numTreesZ = 100, spacingX = 2000, spacingZ = 1000, startX = 3000,
- startZ = -50000;
- startX = -10000;
- for (var x = 0; x < numTreesX; x++) {
- for (var z = 0; z < numTreesZ; z++) {
- var tree = object.clone();
- tree.position.set(startX - x * spacingX - 4000 + Math.random() * spacingX, 0, startZ + z * spacingZ + Math.random() * spacingZ);
- tree.scale.setScalar(400);
- scene.add(tree);
- }
- }
- });
- });
-
- // Voiture
- loadCar();
}
/**
- * Charge la voiture
+ * Fonction qui gère la maisonnette
*/
-function loadCar() {
- new OBJLoader().load('car.obj', function (object) {
- car = object;
- car.scale.setScalar(200);
- car.position.set(0, 30, -9000);
- car.rotation.y = 0;
+// function house() {}
- car.traverse(function (child) {
- if (child.isMesh) {
- child.material = new THREE.MeshStandardMaterial({color: 0xff0000});
- }
- });
+/**
+ * Fonction qui gère la forêt
+ */
+function forest() {
+ new MTLLoader().load('tree_bonus.mtl', function (materials) {
+ materials.preload();
+ new OBJLoader()
+ .setMaterials(materials)
+ .load('tree_bonus.obj', function (object) {
+ object.traverse(function (child) {
+ if (child.isMesh) {
+ child.material = new THREE.MeshLambertMaterial({color: 0x006600});
+ }
+ });
- scene.add(car);
+ // Arbres à gauche de la route
+ var numTreesX = 23, numTreesZ = 100, spacingX = 2000, spacingZ = 1000, startX = 3000,
+ startZ = -50000;
+ for (var x = 0; x < numTreesX; x++) {
+ for (var z = 0; z < numTreesZ; z++) {
+ var tree = object.clone();
+ tree.position.set(startX + x * spacingX + Math.random() * spacingX, 0, startZ + z * spacingZ + Math.random() * spacingZ);
+ tree.scale.setScalar(400);
+ scene.add(tree);
+ }
+ }
+
+ // Arbres à droite de la route
+ var numTreesX = 19, numTreesZ = 100, spacingX = 2000, spacingZ = 1000, startX = 3000,
+ startZ = -50000;
+ startX = -10000;
+ for (var x = 0; x < numTreesX; x++) {
+ for (var z = 0; z < numTreesZ; z++) {
+ var tree = object.clone();
+ tree.position.set(startX - x * spacingX - 4000 + Math.random() * spacingX, 0, startZ + z * spacingZ + Math.random() * spacingZ);
+ tree.scale.setScalar(400);
+ scene.add(tree);
+ }
+ }
+ });
});
}
@@ -282,3 +332,4 @@ try {
var errorReport = "Your program encountered an unrecoverable error, can not draw on canvas. Error was:<br/><br/>";
$('#webGL').append(errorReport + e);
}
+