diff --git a/lab4/src/lab4.js b/lab4/src/lab4.js
index 87321c9a4b65a20f000804535a8135dab68af7aa..33bed85058a530cbb3e0a1ae3956ba9b7baaa78f 100644
--- a/lab4/src/lab4.js
+++ b/lab4/src/lab4.js
@@ -521,8 +521,6 @@ const KEYS = {
};
window.addEventListener("keydown", function (event) {
-
-
if (!KEYS[event.code] || currentCameraNum === 0) return;
let { direction, pos } = KEYS[event.code];
//currentLookAt[pos] += CAMERA_SPEED * direction;
diff --git a/lab5/src/GameManager.js b/lab5/src/GameManager.js
new file mode 100644
index 0000000000000000000000000000000000000000..66d47f46d1d850065fe363949902f40816070063
--- /dev/null
+++ b/lab5/src/GameManager.js
@@ -0,0 +1,123 @@
+
+const DIRECTION = {
+ UP: 'UP',
+ DOWN: 'DOWN',
+ RIGHT: 'RIGHT',
+ LEFT: 'LEFT',
+ NONE: 'NONE'
+};
+
+const MOVEMENT = {
+ LEFT: { x: -0.08, y: 0 },
+ RIGHT: { x: 0.08, y: 0 },
+ UP: { x: 0, y : 0.08 },
+ DOWN: { x: 0, y: -0.08 },
+ NONE: { x: 0, y: 0 }
+};
+
+const KEYS = {
+ ArrowLeft: DIRECTION.LEFT,
+ ArrowRight: DIRECTION.RIGHT,
+ ArrowUp: DIRECTION.UP,
+ ArrowDown: DIRECTION.DOWN
+};
+
+var scene;
+var camera;
+var renderer;
+var player;
+var enemies = [];
+var walls = [];
+var mapGenerator
+
+function main() {
+ mapGenerator = new MapGenerator();
+
+ mapGenerator.generateMap("maps/map1.png");
+
+ // init scene
+ scene = new THREE.Scene();
+ scene.background = new THREE.Color( 0x3f3f3f );
+ camera = new THREE.PerspectiveCamera(85, window.innerWidth / window.innerHeight, 0.1, 1000);
+ renderer = new THREE.WebGLRenderer();
+ renderer.setSize(window.innerWidth, window.innerHeight);
+ document.body.appendChild(renderer.domElement);
+
+ //create objects
+
+ var geometry = new THREE.BoxGeometry(1,1,1);
+ var material = new THREE.MeshBasicMaterial({color: 0x00ff00});
+ var cube = new THREE.Mesh(geometry, material);
+ var cube2 = new THREE.Mesh(geometry, material);
+ walls.push(cube);
+ walls.push(cube2);
+ scene.add(camera);
+ scene.add(cube);
+ scene.add(cube2);
+ scene.add(mapGenerator.generateMap("maps/map1.png"));
+ camera.position.z = 13;
+ camera.position.x = 0;
+ camera.position.y = 0;
+
+ cube.position.x = 0;
+ cube.position.x = 2;
+
+
+ // player
+ geometry = new THREE.SphereGeometry(0.45);
+ material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
+ var sphere = new THREE.Mesh( geometry, material );
+ sphere.name = 'player';
+ scene.add(sphere);
+ player = new Player(0,2,sphere);
+
+ console.log(sphere.position);
+
+ function render(){
+ checkCollision();
+ player.move();
+
+ requestAnimationFrame(render);
+ renderer.render(scene, camera);
+
+ }
+ render();
+
+}
+
+function checkCollision() {
+ /*walls.forEach(function (wall) {
+ wall.material.transparent = false;
+ wall.material.opacity = 1.0;
+ });*/
+ var playerObj = scene.getObjectByName('player');
+ var originPoint = playerObj.position.clone();
+ var originPointFastForward = originPoint;
+ let {x,y} = MOVEMENT[player.getDirection()];
+ originPointFastForward.x += x;
+ originPointFastForward.y += y;
+ for (var vertexIndex = 0; vertexIndex < playerObj.geometry.vertices.length; vertexIndex++) {
+ var localVertex = playerObj.geometry.vertices[vertexIndex].clone();
+ var globalVertex = localVertex.applyMatrix4(playerObj.matrix);
+ var directionVector = globalVertex.sub(playerObj.position);
+ var ray = new THREE.Raycaster(originPointFastForward, directionVector.clone().normalize());
+ var collisionResults = ray.intersectObjects(walls);
+ if (collisionResults.length > 0 && collisionResults[0].distance < directionVector.length()) {
+ console.log(collisionResults);
+ player.setDirection(DIRECTION.NONE);
+
+ /*collisionResults[0].object.material.transparent = true;
+ collisionResults[0].object.material.opacity = 0.4;*/
+ }
+ }
+}
+
+window.addEventListener("keydown", function (event) {
+
+ //change player direction
+ if (KEYS[event.code])
+ player.setDirection(KEYS[event.code]);
+
+
+});
+
diff --git a/lab5/src/MapGenerator.js b/lab5/src/MapGenerator.js
new file mode 100644
index 0000000000000000000000000000000000000000..96b5bf5491a0a5d56a4a838ac7af9296d23b643b
--- /dev/null
+++ b/lab5/src/MapGenerator.js
@@ -0,0 +1,35 @@
+class MapGenerator {
+ constructor() {
+ this.size = 21;
+ }
+ generateMap(filePath) {
+ var map;
+ /*var img = new Image(21,21);
+ img.src = filePath;
+ var canvas = document.createElement('canvas');
+ var context = canvas.getContext('2d');
+ context.drawImage(img, 0, 0, img.width, img.height);
+
+ console.log(img);
+ console.log(img.width);
+ console.log(img.height);
+ console.log(canvas);
+ document.body.appendChild(img);
+ document.body.appendChild(canvas);
+
+ for(var x = 0; x < img.width; x++){
+ for(var y = 0; y < img.height; y++){
+ console.log(context.getImageData(x, y, 1, 1).data);
+ }
+ }*/
+
+ // create ground
+ var geometry = new THREE.PlaneGeometry( this.size, this.size );
+ var material = new THREE.MeshBasicMaterial( {color: 0x000000, side: THREE.DoubleSide} );
+ var plane = new THREE.Mesh( geometry, material );
+ plane.position.z -= 0.5;
+
+ return plane;
+ }
+}
+
diff --git a/lab5/src/Player.js b/lab5/src/Player.js
new file mode 100644
index 0000000000000000000000000000000000000000..ce89b3c6f7f76c04f7821386222101b422250f41
--- /dev/null
+++ b/lab5/src/Player.js
@@ -0,0 +1,27 @@
+class Player {
+ constructor(posX, posY, obj) {
+ this.object = obj;
+ this.object.position.x = posX;
+ this.object.position.y = posY;
+ this.direction = DIRECTION.NONE;
+ }
+
+ move(){
+ let { x, y } = MOVEMENT[this.direction];
+ this.object.position.x += x;
+ this.object.position.y += y;
+
+ // TODO
+ //autoriser les movement uniquement lorsque la position x ou y est sur .5
+ // x % 1 == 0.5 -> change direction
+ }
+
+ setDirection(dir){
+ this.direction = dir;
+ }
+
+ getDirection(){
+ return this.direction;
+ }
+
+}
\ No newline at end of file
diff --git a/lab5/src/lab5.html b/lab5/src/lab5.html
index cf6a6db8fae8fc628f8b1abf98917f3bd0de19f3..1d9f911eef0f4d5db6e1746a6b1cc59db5908667 100644
--- a/lab5/src/lab5.html
+++ b/lab5/src/lab5.html
@@ -13,6 +13,8 @@
<div id="main">
</div>
<script src="lib/three.js"></script>
- <script src="lab5.js"></script>
+ <script src="GameManager.js"></script>
+ <script src="MapGenerator.js"></script>
+ <script src="Player.js"></script>
</body>
</html>
\ No newline at end of file
diff --git a/lab5/src/lab5.js b/lab5/src/lab5.js
deleted file mode 100644
index 4449da65b4aed4ce9310a8126a73f86f50d94b0c..0000000000000000000000000000000000000000
--- a/lab5/src/lab5.js
+++ /dev/null
@@ -1,30 +0,0 @@
-function main() {
- var scene = new THREE.Scene();
- var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
- var renderer = new THREE.WebGLRenderer();
- renderer.setSize(window.innerWidth, window.innerHeight);
- document.body.appendChild(renderer.domElement)
-
- var geometry = new THREE.BoxGeometry(1,1,1);
- var material = new THREE.MeshBasicMaterial({color: 0x00ff00});
- var cube = new THREE.Mesh(geometry, material);
- scene.add(camera);
- scene.add(cube);
- camera.position.z = 3;
- camera.position.x = 0;
- camera.position.y = 0;
-
- /*var light = new THREE.AmbientLight( 0xff0000 ); // soft white light
- scene.add( light );
- var directionalLight = new THREE.DirectionalLight( 0xffffff, 0.5 );
- scene.add( directionalLight );*/
-
- function render(){
- requestAnimationFrame(render);
- renderer.render(scene, camera);
- cube.rotation.x += 0.01;
- cube.rotation.y += 0.01;
- cube.rotation.z += 0.01;
- }
- render();
-}