script.js

class Game {

	constructor(t,w,h){

		this.taille = t;
		this.case = {w : w, h : h};
		this.max = {x : w*t, y : h*t};

		this.data_mur = [];
		this.data_bonus = [];

		this.translate = { x : this.max.x/2, y : this.max.y/2 };
		this.state = 'Game';

		this.color = {
			white : 'rgb(255,255,255)',
			green : 'rgb(0,255,0)',
			blue : 'rgb(0,255,255)',
			red : 'rgb(255,0,0)'
		}

	}

	// fonctions qui gèrent les éléments du jeu :

	update(){

		switch (this.state) {
			case 'Game':
				for (var i = 0; i < this.data_mur.length; i++) {
					if (snake.x == this.data_mur[i].x && snake.y == this.data_mur[i].y) this.data_mur[i].collision();
				}

				for (var i = 0; i < this.data_bonus.length; i++) {
					if (snake.x == this.data_bonus[i].x && snake.y == this.data_bonus[i].y) this.data_bonus[i].collision();
				}

				for (var i = 2; i < snake.tail.length; i++) {
					if (snake.x == snake.tail[i].x && snake.y == snake.tail[i].y) snake.collision();
				}

				this.draw();
				if (Date.now() - snake.time > snake.vitesse) {
					snake.time = Date.now();
					snake.moove()
				}
			break;
			case 'GameOver':
				console.log('Perdu !');
			break;
		}

		this.clavier();

	}

	draw(){
		canvas.width = window.innerWidth;
	  canvas.height = window.innerHeight;

		ctx.translate(window.innerWidth/2-this.max.x/2,window.innerHeight/2-this.max.y/2);

		ctx.fillStyle = '#7F7650';
		ctx.fillRect(0, 0, game.max.x,game.max.y);

		switch (this.state) {
			case 'Game':
				ctx.font = '30px Verdana';
				ctx.textAlign = 'left';
				ctx.fillStyle = game.color.white;
				ctx.fillText(snake.point,0,this.max.y+30);
				// murs
				for (var i = 0; i <  this.data_mur.length; i++) {
					this.data_mur[i].draw();
				}
				// bonus
				for (var i = 0; i <  this.data_bonus.length; i++) {
					this.data_bonus[i].draw();
				}

				snake.draw();
			break;
			case 'GameOver':
				ctx.font = '30px Verdana';
				ctx.textAlign = 'center';
				ctx.fillStyle = game.color.white;
				ctx.fillText('Game Over !',this.max.x/2,this.max.y/2 - 20);
				ctx.font = '20px Verdana';
				ctx.fillText('Appuyez sur espace pour rejouer !',this.max.x/2,this.max.y/2 + 20);

			break;
		}

	}

	clavier(){

		switch (this.state) {
			case 'Game':

				if ((keyState[37] || keyState[81]) && snake.dir !== 'd'){
					snake.dir = 'g';
				}

				if ((keyState[39] || keyState[68]) && snake.dir !== 'g'){
					snake.dir = 'd';
				}

				if ((keyState[38] || keyState[90]) && snake.dir !== 'b') {
					snake.dir = 'h';
				}

				if ((keyState[40] || keyState[83]) && snake.dir !== 'h') {
					snake.dir = 'b';
				}

				// triche
				if (keyState[32]) {
					snake.add_tail();
					keyState[32] = false;
				}

			break;
			case 'GameOver':
				if (keyState[32]) {
					game.reset();
					game.ini();
				}
			break;
		}

	}

	// fonctions pour ajouter des éléments au jeu :

	add_Snake(x,y,color,v,dir){
		new Snake(x,y,color,v,dir);
	}

	add_Bonus(x,y,color,name,b){
		this.data_bonus.push(new Bonus(x,y,color,name,b));
	}

	add_Mur(x,y,color){
		this.data_mur.push(new Murs(x,y,color));
	}

	// fonctions qui génere ou reset les éléments du jeu :

	reset(){
		this.data_mur = [];
		this.data_bonus = [];
		snake.tail = [];

		snake.x = 2;
		snake.y = 2;
		snake.dir = 'd';

		snake.point = 0;
	}

	ini(){

		for (var x = 2; x < 13; x++) {
			this.add_Mur(x,7,game.color.white);
		}

		this.generate_bonus()

		snake.tail.push({x : snake.x, y : snake.y});

		this.state = 'Game';

	}

	generate_bonus(){
		var x = this.Random(0,game.case.w-1);
		var y = this.Random(0,game.case.h-1);

		var test = false;

		// pour que le bonus ne se coince pas dans un mur
		for (var i = 0; i <  this.data_mur.length; i++) {
				if (this.data_mur[i].x == x && this.data_mur[i].y == y) {
					this.generate_bonus();
					test = true;
					break;
				}
		}

		if (!test) this.add_Bonus(x,y,game.color.red,'Pomme',1);

	}

	// fonctions utiles :

	Random(min, max) {
	  min = Math.ceil(min);
	  max = Math.floor(max);
   	return Math.floor(Math.random() * (max - min +1)) + min;
	}

}

// classe mère des éléments affichés
class Assets {

	constructor(x,y,color) {
		this.x = x;
		this.y = y;
		this.color = color || 'rgb(255,255,255)';
	}

	draw() {
		ctx.fillStyle = this.color;
		ctx.fillRect(this.x*game.taille,this.y*game.taille,game.taille,game.taille)
	}

}

// classe snake
class Snake extends Assets {

	constructor(x,y,color,v,dir) {
		super(x,y,color);
		this.vitesse = v || 200;
		this.point = 0;
		this.dir = dir || 'd';
		this.tail = [];
		this.time = 0;
	}

	draw(){
		super.draw();

		for (var i = 0; i < this.tail.length; i++) {
			ctx.fillStyle = game.color.green;
			ctx.fillRect(this.tail[i].x*game.taille,this.tail[i].y*game.taille,game.taille,game.taille)
		}

	}

	moove(){

		this.moove_tail();

		switch (this.dir) {
			case 'd':
				this.x += 1;
			break;
			case 'g':
				this.x -= 1;
			break;
			case 'b':
				this.y += 1;
			break;
			case 'h':
				this.y -= 1;
			break;
		}

		this.test_tp();

	}

	test_tp(){

		if (this.x == game.case.w) {
			this.x = 0;
		}
		else if (this.x == -1) {
			this.x = game.case.w-1;
		}
		else if (this.y == game.case.h) {
			this.y = 0;
		}
		else if (this.y == -1) {
			this.y = game.case.h-1;
		}

	}

	moove_tail(){

		for (var i = this.tail.length-1; i > 0; i--) {
      this.tail[i].x = this.tail[i-1].x;
      this.tail[i].y = this.tail[i-1].y;
    }
		this.tail[0].x = snake.x;
		this.tail[0].y = snake.y;

	}

	add_tail(){
		if (this.tail.length > 0) { this.tail.push({x : this.tail[this.tail.length-1].x, y : this.tail[this.tail.length-1].y}); }
	}

	collision(){
		game.state = 'GameOver';
	}

}

// classe des bonus
class Bonus extends Assets {

	constructor(x,y,color,name,b) {
		super(x,y,color);
		this.name = name;
		this.bonus = b || 1;
	}

	collision(){
		snake.point += this.bonus;
		snake.add_tail();

		for (var i = 0; i < game.data_bonus.length; i++) {
			game.data_bonus.splice(i,1);
		}

		game.generate_bonus();
	}

}

// classe des murs
class Murs extends Assets {

	constructor(x,y,color) {
		super(x,y,color);
	}

	collision(){
		game.state = 'GameOver';
	}

}

// key controle (pas réussi à intégré cette fonction dans la classe game)
let keyState = [];
document.addEventListener(
    'keydown',
    (event)=>{
        keyState[event.keyCode || event.which] = true;
    }
);

document.addEventListener(
    'keyup',
    (event)=>{
        keyState[event.keyCode || event.which] = false;
    }
);