diff --git a/MEHIAOUI/projet.js b/MEHIAOUI/projet.js new file mode 100644 index 0000000000000000000000000000000000000000..24463d697b7ec296385c591ea5370b2940ab9d31 --- /dev/null +++ b/MEHIAOUI/projet.js @@ -0,0 +1,137 @@ +"use strict"; // good practice - see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode +//////////////////////////////////////////////////////////////////////////////// +// Particle System +//////////////////////////////////////////////////////////////////////////////// +/*global THREE, document, window, $*/ +import * as THREE from 'three'; +import { OBJLoader } from 'three/addons/loaders/OBJLoader.js'; +import { OrbitControls } from 'three/addons/controls/OrbitControls.js'; +import {dat} from '../../lib/dat.gui.min.js'; + + +var camera, scene, renderer; + +var windowScale; +window.scene = new THREE.Scene(); + +import {Coordinates} from '../../lib/Coordinates.js'; + +var cameraControls; + +var clock = new THREE.Clock(); + +function fillScene() { + window.scene.fog = new THREE.Fog( 0x808080, 2000, 4000 ); + + // LIGHTS + var ambientLight = new THREE.AmbientLight( 0x222222 ); + var light = new THREE.DirectionalLight( 0xFFFFFF, 1.0 ); + light.position.set( 200, 400, 500 ); + + var light2 = new THREE.DirectionalLight( 0xFFFFFF, 1.0 ); + light2.position.set( -500, 250, -200 ); + + window.scene.add(ambientLight); + window.scene.add(light); + window.scene.add(light2); + + //Chargement textures + var texture_bowl = new THREE.TextureLoader().load('textures/bowl_texture.jpg'); + + // table + var table = new THREE.Mesh(new THREE.CylinderGeometry(10, 10, 1, 32), new THREE.MeshPhongMaterial({color: 0xE3963E})); + table.position.set(-10, 0, 5); + + // bol de fruits + var bolGeometry = new THREE.SphereGeometry(5, 32, 32, 0, Math.PI * 2, 0, Math.PI / 2); + var bolMaterial = new THREE.MeshPhongMaterial({side: THREE.DoubleSide, map: texture_bowl }); + var bol = new THREE.Mesh(bolGeometry, bolMaterial); + bol.position.set(-15, 5, 5); + bol.rotation.x = Math.PI; + + + + // pomme sur la table + //var apple = new THREE.Mesh(new THREE.SphereGeometry(1, 22, 22), new THREE.MeshPhongMaterial({color: 0x00ff00})); + //apple.position.set(-15, 1.5, 10); + // tige de la pomme + //var tige = new THREE.Mesh(new THREE.CylinderGeometry(0.1, 0.1, 1, 32), new THREE.MeshPhongMaterial({color: 0x8B4513})); + //tige.position.set(-15, 2.5, 10); + + // texture de la pomme + /*var texture = new THREE.TextureLoader().load('textures_Pommes/texture_pomme_rouge.jpg'); + var material = new THREE.MeshPhongMaterial({map: texture}); + apple.material = material;*/ + + // mur derrière la table + var mur = new THREE.Mesh(new THREE.BoxGeometry(50, 50, 1), new THREE.MeshPhongMaterial({color: 0x8B413})); + mur.position.set(0, 25, -5.5); + + // ajout des objets à la scène + //window.scene.add(tige); + //window.scene.add(apple); + window.scene.add(table); + window.scene.add(mur); + window.scene.add(bol); + + + Coordinates.drawGround({size:10000}); // width and height of ground plane + //Coordinates.drawGrid({size:10000,scale:0.01}); + //Coordinates.drawAllAxes({axisLength:200,axisRadius:1,axisTess:50}); +} + +function init() { + //var canvasWidth = 846; + //var canvasHeight = 494; + // For grading the window is fixed in size; here's general code: + var canvasWidth = window.innerWidth; + var canvasHeight = window.innerHeight; + var canvasRatio = canvasWidth / canvasHeight; + + // RENDERER + renderer = new THREE.WebGLRenderer( { antialias: true } ); + renderer = new THREE.WebGLRenderer( { clearAlpha: 1 } ); + renderer.gammaInput = true; + renderer.gammaOutput = true; + renderer.setSize(canvasWidth, canvasHeight); + renderer.setClearColor( 0xAAAAAA, 1.0 ); + + // CAMERA + camera = new THREE.PerspectiveCamera( 35, canvasRatio, 2, 8000 ); + camera.position.set(0, 5, 50 ); + camera.lookAt(new THREE.Vector3(0,5,50)); + // CONTROLS + cameraControls = new OrbitControls(camera, renderer.domElement); + cameraControls.target.set(0,5,0); + +} + +function addToDOM() { + var container = document.getElementById('webGL'); + var canvas = container.getElementsByTagName('canvas'); + if (canvas.length>0) { + container.removeChild(canvas[0]); + } + container.appendChild( renderer.domElement ); +} + +function animate() { + window.requestAnimationFrame(animate); + render(); +} + +function render() { + var delta = clock.getDelta(); + cameraControls.update(delta); + renderer.render(window.scene, camera); +} + +try { + init(); + fillScene(); + addToDOM(); + animate(); +} catch(e) { + var errorReport = "Your program encountered an unrecoverable error, can not draw on canvas. Error was:<br/><br/>"; + $('#webGL').append(errorReport+e); +} \ No newline at end of file