317 lines
11 KiB
JavaScript
317 lines
11 KiB
JavaScript
let clicked = false,
|
|
sounds = $.map(["ko.wav", "ok.wav", "undefined.wav", "gameover.wav", "welldone.wav"], function(sound) {
|
|
return 'assets/sounds/'+sound;
|
|
}),
|
|
boardbg = '#FFFFFF',
|
|
score = 0,
|
|
time = 0,
|
|
compte, nbsnd, oksnd, kosnd, nosnd, failsnd, level, left, top, bottom, right, currentPosition, toleft, toright, totop, tobot;
|
|
//console.log('level :'+level);
|
|
$(document).ready(function(){
|
|
|
|
$('#start').live('click', function(e){
|
|
e.preventDefault();
|
|
clicked = true;
|
|
$('#board').html('');
|
|
compte = setInterval(startChrono,100);
|
|
playKey();
|
|
});
|
|
|
|
$('#instruction').live('click', function(e){
|
|
e.preventDefault();
|
|
if($('#manual').length != 0) $('#manual').html('Use arrow keys to direct yourself to exit. <br/>To do so, you\'ll hear sounds in that order : left, top, right, bottom<br/>3 differents sounds : <br/><a href="#" id="ok" title="play good path sound">sound for good path</a><br/><a href="#" id="ko" title="bad path sound">sound for bad path</a><br/><a href="#" id="unknown" title="play wall sound">sound for wall</a><br/><br/>If a bad path is taken or a wall is chosen, it\'s gameover!<br/>Good luck!');
|
|
else
|
|
$('#board').append('<div id="manual">Use arrow keys to direct yourself to exit. <br/>To do so, you\'ll hear sounds in that order : left, top, right, bottom<br/>3 differents sounds : <br/><a href="#" id="ok" title="play good path sound">sound for good path</a><br/><a href="#" id="ko" title="bad path sound">sound for bad path</a><br/><a href="#" id="unknown" title="play wall sound">sound for wall</a><br/><br/>If a bad path is taken or a wall is chosen, it\'s gameover!<br/>Good luck!</div>');
|
|
});
|
|
|
|
$('#instructionfr').live('click', function(e){
|
|
e.preventDefault();
|
|
//console.log($('#manual').length);
|
|
if($('#manual').length != 0) $('#manual').html('Utiliser les flèches de votre clavier pour vous diriger vers la sortie. <br/>Pour se faire, vous allez entendre les sons dans cet ordre : gauche, haut, droite, bas<br/>3 sons différents : <br/><a href="#" id="ok" title="jouer le son du bon chemin">son pour le bon chemin</a><br/><a href="#" id="ko" title="jouer le son du mauvais chemin">son du mauvais chemin</a><br/><a href="#" id="unknown" title="jouer le son vers un mur">son pour un mur</a><br/><br/>Si un mauvais chemin est pris ou un mur choisi, c\'est le game over !<br/>Bonne chance!');
|
|
else
|
|
$('#board').append('<div id="manual">Utiliser les flèches de votre clavier pour vous diriger vers la sortie. <br/>Pour se faire, vous allez entendre les sons dans cet ordre : gauche, haut, droite, bas<br/>3 sons différents : <br/><a href="#" id="ok" title="jouer le son du bon chemin">son pour le bon chemin</a><br/><a href="#" id="ko" title="jouer le son du mauvais chemin">son du mauvais chemin</a><br/><a href="#" id="unknown" title="jouer le son vers un mur">son pour un mur</a><br/><br/>Si un mauvais chemin est pris ou un mur choisi, c\'est le game over !<br/>Bonne chance!</div>');
|
|
});
|
|
|
|
$('#ok').live('click', function(e){
|
|
e.preventDefault();
|
|
playSound(1);
|
|
});
|
|
$('#ko').live('click', function(e){
|
|
e.preventDefault();
|
|
playSound(0);
|
|
});
|
|
$('#unknown').live('click', function(e){
|
|
e.preventDefault();
|
|
playSound(2);
|
|
});
|
|
|
|
$('#retry').live('click', function(e){
|
|
e.preventDefault();
|
|
chargement();
|
|
});
|
|
|
|
$('#next').live('click', function(e){
|
|
e.preventDefault();
|
|
loadNextLevel();
|
|
});
|
|
|
|
function chargement(){
|
|
time = 0;
|
|
nbsnd = sounds.length;
|
|
//console.log('loading '+nbsnd+' sounds');
|
|
oksnd = new Audio(sounds[1]);
|
|
kosnd = new Audio(sounds[0]);
|
|
nosnd = new Audio(sounds[2]);
|
|
failsnd = new Audio(sounds[3]);
|
|
endsnd = new Audio(sounds[4]);
|
|
|
|
left = 2;
|
|
right = 2;
|
|
top = 2;
|
|
bottom = 2;
|
|
|
|
$('body').html('').append('<nav><a href="editor.html" title="Create your own labyrinth" class="left pill button">Create your own labyrinth</a><a href="list" title="Custom laby list" class="right pill button">Custom laby list</a></nav>').append('<div id="board"></div>');
|
|
$('#board').append('<a href="#" id="start" title="click to start" class="primary positive button">Start?</a><br/><a href="#" id="instruction" title="Instructions to play" class="left button">Instruction</a> <a href="#" id="instructionfr" title="Instructions pour jouer" class="right button">Instructions en français</a>');
|
|
if(custom){
|
|
$('head').append('<script src="custom/'+niveau+'.js"></script>');
|
|
}else{
|
|
$('head').append('<script src="level'+niveau+'.js"></script>');
|
|
}
|
|
//generateLevel();
|
|
//console.log('loading done');
|
|
}
|
|
|
|
function startChrono(){
|
|
time++;
|
|
}
|
|
|
|
function play(t){
|
|
playSound(t);
|
|
playColor(t);
|
|
}
|
|
|
|
function playSound(sound){
|
|
playColor(sound);
|
|
switch(sound){
|
|
case 0: kosnd.play(); break;
|
|
case 1: oksnd.play(); break;
|
|
case 2: nosnd.play(); break;
|
|
case 3: failsnd.play(); break;
|
|
case 4: endsnd.play(); break;
|
|
default: /*failsnd.play();*/ break;
|
|
}
|
|
}
|
|
|
|
function playColor(color){
|
|
//b = $('#board');
|
|
b = $('body');
|
|
//console.log(color);
|
|
switch(color){
|
|
case 0: b.animate({'background-color':'#FF0000'}, '600', function() { b.css('background-color', boardbg); }); break;
|
|
case 1: b.animate({'background-color':'green'}, '600', function() { b.css('background-color', boardbg); }); break;
|
|
case 2: b.animate({'background-color':'#CCCCCC'}, '600', function() { b.css('background-color', boardbg); }); break;
|
|
case 3: b.animate({'background-color':'purple'}, '600', function() { b.css('background-color', boardbg); }); break;
|
|
case 4: b.animate({'background-color':'yellow'}, '600', function() { b.css('background-color', boardbg); }); break;
|
|
default: b.css('background-color', boardbg); break;
|
|
}
|
|
}
|
|
|
|
function playKey(){
|
|
if(isWon()){
|
|
winningGame();
|
|
return true;
|
|
}
|
|
if(isLost()){
|
|
gameover();
|
|
return true;
|
|
}
|
|
clearTimeout(totop);
|
|
clearTimeout(toright);
|
|
clearTimeout(tobot);
|
|
left = level[currentPosition[1]][currentPosition[0]-1] == undefined ? 2 : level[currentPosition[1]][currentPosition[0]-1];
|
|
shikitop = level[currentPosition[1]-1] == undefined ? 2 : level[currentPosition[1]-1][currentPosition[0]];
|
|
right = level[currentPosition[1]][currentPosition[0]+1] == undefined ? 2 : level[currentPosition[1]][currentPosition[0]+1];
|
|
bottom = level[currentPosition[1]+1] == undefined ? 2 : level[currentPosition[1]+1][currentPosition[0]];
|
|
playSound(left); // left
|
|
totop = setTimeout(playSound, 800, shikitop); // top
|
|
toright = setTimeout(playSound, 1600, right); // right
|
|
tobot = setTimeout(playSound, 2400, bottom); // bottom
|
|
}
|
|
|
|
function check1caseOnLeft(){
|
|
return currentPosition[0] > 0;
|
|
}
|
|
|
|
function check1caseOnTop(){
|
|
return currentPosition[1] > 0;
|
|
}
|
|
function check1caseOnRight(){
|
|
return currentPosition[0] + 1 < level[0].length;
|
|
}
|
|
function check1caseOnBottom(){
|
|
return currentPosition[1] + 1 <= level.length;
|
|
}
|
|
function check2caseOnLeft(){
|
|
return !(currentPosition[0] <= 1 || level[currentPosition[1]][currentPosition[0] - 1] == 1);
|
|
}
|
|
function check2caseOnTop(){
|
|
return !(currentPosition[1] <= 1 || level[currentPosition[1] - 1][currentPosition[0]] == 1);
|
|
}
|
|
function check2caseOnRight(){
|
|
|
|
}
|
|
function check2caseOnBottom(){
|
|
|
|
}
|
|
function generateLevel(){
|
|
// generer largeur / hauteur
|
|
var min = 5;
|
|
var max = 15;
|
|
var largeur = Math.floor(Math.random() * (max - min + 1)) + min;
|
|
var hauteur = Math.floor(Math.random() * (max - min + 1)) + min;
|
|
|
|
// remplir de 0
|
|
var array = new Array(largeur);
|
|
for(i = 0; i < largeur; i++){
|
|
array[i] = new Array(hauteur);
|
|
for(j = 0; j < hauteur; j++){
|
|
array[i][j] = 0;
|
|
}
|
|
}
|
|
|
|
|
|
// creation des chemins de 1
|
|
/*currentPosition = [Math.floor(Math.random() * (hauteur + 1)),Math.floor(Math.random() * (largeur + 1))];
|
|
finalPosition = [Math.floor(Math.random() * (hauteur + 1)),Math.floor(Math.random() * (largeur + 1))];
|
|
array[currentPosition[1]][currentPosition[0]] = 1;
|
|
tmpPosition = currentPosition;
|
|
var dir;
|
|
while(tmpPosition[0] != finalPosition[0] && tmpPosition[1] != finalPosition[1]){
|
|
dir = Math.floor(Math.random() * (3 + 1));
|
|
switch(dir){
|
|
case 0:
|
|
if(tmpPosition[0] <= 0 && array[tmpPosition[1]][tmpPosition[0] -1] != 1){
|
|
array[tmpPosition[1]][tmpPosition[0]-1] = 1;
|
|
tmpPosition[0] -=1;
|
|
}
|
|
break;
|
|
case 1:
|
|
if(tmpPosition[1] <= 0 && array[tmpPosition[1]-1][tmpPosition[0]] != 1){
|
|
array[tmpPosition[1]-1][tmpPosition[0]] = 1;
|
|
tmpPosition[1] -=1;
|
|
}
|
|
break;
|
|
case 2:
|
|
if(tmpPosition[0] +1 >= array[0].length && array[tmpPosition[1]][tmpPosition[0]+1] != 1){
|
|
array[tmpPosition[1]][tmpPosition[0]+1] = 1;
|
|
tmpPosition[0] +=1;
|
|
}
|
|
break;
|
|
case 3:
|
|
if(tmpPosition[1] +1 > array.length && array[tmpPosition[1]+1][tmpPosition[0]] != 1){
|
|
array[tmpPosition[1]+1][tmpPosition[0]] = 1;
|
|
tmpPosition[1] +=1;
|
|
}
|
|
break;
|
|
}
|
|
}
|
|
level = array;*/
|
|
}
|
|
|
|
/*function getLeft(){
|
|
return 0;
|
|
}
|
|
|
|
function getTop(){
|
|
return 1;
|
|
}
|
|
|
|
function getRight(){
|
|
return 2;
|
|
}
|
|
|
|
function getBottom(){
|
|
return 3;
|
|
}*/
|
|
|
|
function gameover(){
|
|
clearInterval(compte);
|
|
clicked = false;
|
|
//console.log('game over');
|
|
playSound(3);
|
|
var finalTime = parseFloat(time/10);
|
|
$('#board').html('You lost... <a href="#" id="retry" title="Click to try again">Do you want to try again?</a> You played : '+finalTime+'seconds');
|
|
}
|
|
|
|
function isLost(){
|
|
return level[currentPosition[1]][currentPosition[0]] == 0;
|
|
|
|
}
|
|
|
|
function isWon(){
|
|
return currentPosition[0] == finalPosition[0] && currentPosition[1] == finalPosition[1];
|
|
|
|
}
|
|
|
|
function winningGame(){
|
|
clicked = false;
|
|
//console.log('You won !');
|
|
playSound(4);
|
|
$('#board').html('<a href="#" id="next" title="Load next level">Load next level</a>');
|
|
}
|
|
|
|
function loadNextLevel(){
|
|
niveau++;
|
|
chargement();
|
|
}
|
|
|
|
chargement();
|
|
|
|
$(document).keydown(function(event) {
|
|
if(clicked){
|
|
switch (event.keyCode) {
|
|
case 37:
|
|
//console.log('gauche');
|
|
if(currentPosition[0] <= 0){
|
|
gameover();
|
|
}else{
|
|
currentPosition[0] = currentPosition[0] -1;
|
|
playKey();
|
|
}
|
|
break;// gauche
|
|
case 38:
|
|
//console.log('haut');
|
|
if(currentPosition[1] <= 0){ //
|
|
gameover();
|
|
}else{
|
|
currentPosition[1] = currentPosition[1] -1;
|
|
playKey();
|
|
}
|
|
break; // haut
|
|
case 39:
|
|
//console.log('droite');
|
|
if(currentPosition[0] +1 >= level[0].length){
|
|
gameover();
|
|
}else{
|
|
currentPosition[0] = currentPosition[0] +1;
|
|
playKey();
|
|
}
|
|
break; // droite
|
|
case 40:
|
|
//console.log('bas');
|
|
if(currentPosition[1] +1 > level.length){
|
|
gameover();
|
|
}else{
|
|
currentPosition[1] = currentPosition[1] +1;
|
|
playKey();
|
|
}
|
|
break; // bas
|
|
case 32: // barre espace
|
|
playKey();
|
|
break;
|
|
default: break;
|
|
}
|
|
}
|
|
});
|
|
|
|
}); |