jsstar/js/star.js

304 lines
12 KiB
JavaScript
Raw Normal View History

2011-07-05 09:54:13 +02:00
var LEVEL_HEIGHT = 9;
var LEVEL_WIDTH = 16;
2011-07-05 09:54:13 +02:00
var cell= {
2011-07-05 13:46:17 +02:00
WALL : '#',
BALL : '@',
CUBE : 'H',
VOID : ' ',
GIFT : 'x'
2011-07-04 21:10:44 +02:00
};
2011-07-05 09:54:13 +02:00
var direction = {
2011-07-05 13:46:17 +02:00
UP : 'u',
DOWN : 'd',
LEFT : 'l',
RIGHT : 'r'
2011-07-04 21:10:44 +02:00
};
2011-07-05 09:54:13 +02:00
var css_classes = {
2011-07-05 13:46:17 +02:00
"@" : "ball",
"H" : "cube",
"#" : "wall",
" " : "void",
"x" : "gift"
};
2011-07-05 09:54:13 +02:00
var options = {
starting_level : 0,
dom_place : ""
2011-07-04 21:10:44 +02:00
};
2011-07-05 09:54:13 +02:00
var state = {
2011-07-05 13:46:17 +02:00
moving : cell.BALL,
2011-07-06 23:42:40 +02:00
distance_travelled : 0,
2011-07-05 13:46:17 +02:00
level : 0,
board : ""
2011-07-04 21:10:44 +02:00
};
2011-07-05 09:54:13 +02:00
var levels = [ "#################@## x#H## x #### ##x ## ## x #### x x x ## x x## x ## ##x x#################",
2011-07-05 13:45:13 +02:00
" # # # # # ### x @# #x #x x # # x x # # # x # # #H# x # # # # #xx## # # # # ",
"################# x#@## ## ##H## #x x ## x x## x## #x x x# x### ##x #x x x####x ##x #################",
"################# #H## # ###x#x x#x#x#x#x## # #x x# # # ####x#x#x x#x#x#x## # ## # #@ #################",
" ############## #@ # # # ## #x # x x # ### # # ##x #x# #### # x # ##x# # # # #H## # x# #x# ############## ",
" ############ # x #x x# # x # ## # x ##@ x ### x # ### x # ##H # x ##x #################",
"################# # ## ### #x ##x# #x #x # # # # # # ### ## ## # #x# #x# # ## @#x H #x#################",
"############### # x## ### #x ## x ## x## # #x ### ## #x# ### # x#x ##xHx# x #@# ### # ###############",
" # ########### #x#x # @##x x# x # # # x## x# ## #x #xHx x## x## # #x#x # # # ############ ",
" ########### #### x ## H ###x x# x## x #x #x # # # x # x##x#x # x# #@# #x ### ### # # # # ######### # #",
"################# # @## #xx xx #### x ## x##x #x#xx ##### ## ## ##x x# x H x###x### # ## ## ########### ",
"## ## #### #@#####x ### x### xx x ## ## ##x #x# ## # x ###x ## ## ## ## #H# ## x ## x #################",
" ############## # @# x ### # #x x## ## x # ## x #x## # x ### x x #x##H # x # # # ############## ",
"#################x#x x#x## x#@ ## ## H x ## x# ## x ## x# # ##x#x x#x#################",
" ###### ####### # x# x ## # x # # x ## @# #xx #x # # # # x H# ##x # #x # # x # #x x# ############## ",
"################## H#x x x##x @x#x #### ### x #### x#x# ##xx x#x ### x ####x ###x# # #################",
"################# x# #@ ## # x#xx#x # ## #x##x# x ## x# x# ## x#x x# ## # # ##x# # ## x #x H #################",
"################# x x H# ## #x#x #x ## #x# #x ## x # x#x ## #x# # x# ## x#x # x # ##x#@ # # #################",
"#################x ## ##x## # # #x ## x# x## x ## # #x ## # x# ## ## x# ##x #H## x# #x ##@#################",
"################# x#x ###x x# ##x ### # # x # # ## H # ## # @x## # # x # # ### x## #x x### x#x #################",
"################# ### x ### # # ### ##x x ## x x x ### # ###x ## x x @ H x xx################# ",
"#################x# #x# #x # ## # ##x # #x x ### #x x #### x # ###x ## #@#H x ################# ",
" ############## # # #x# #x # ## x # ### # x #x ## #x # xx x ###x # ## x ## #@#H x # ############## ",
"################# # ### ##x x ##x### #x x# #### xx x# ## ## #x x # ## ## ## @#H###xx################# ",
"################# # ## x ##x x ## #x x ## ## x ## #x ## #x x# x ## ##x #@ H ################# " ];
function count_gifts( state ) {
2011-07-05 09:54:13 +02:00
var n = 0;
2011-07-05 11:37:15 +02:00
for ( var i = LEVEL_HEIGHT * LEVEL_WIDTH ; i-- ; ) {
if ( state.board[ i ] == cell.GIFT ) {
n++;
}
}
return n;
}
function get_pos( state, actor ) {
2011-07-05 09:54:13 +02:00
var p = state.board.indexOf( actor, state.board );
var pos = {};
pos[ 1 ] = Math.floor( p / LEVEL_WIDTH ); /* y */
pos[ 0 ] = p - ( pos[ 1 ] * LEVEL_WIDTH ); /* x */
return pos;
}
function get_cell( state, x, y ) {
2011-07-05 09:18:27 +02:00
return state.board[ x + ( y * LEVEL_WIDTH ) ];
}
function set_cell( state, x, y, value ) {
2011-07-05 09:54:13 +02:00
var p = x + ( y * LEVEL_WIDTH );
state.board = [ state.board.substring( 0, p ), value, state.board.substring( p+1, state.board.length ) ].join( '' );
2011-07-04 16:40:15 +02:00
return state;
}
2011-07-04 16:40:15 +02:00
function switch_actor( state ) {
state.moving = ( state.moving == cell.BALL ) ? cell.CUBE : cell.BALL;
return state;
}
function won_or_not( state ) {
2011-07-05 11:12:30 +02:00
return count_gifts( state ) === 0;
}
function format_level( state, text ) {
function Replacer( conversionObject ) {
var regexpStr = '';
for ( var k in conversionObject ) {
regexpStr += ( regexpStr.length ? '|' : '' ) + k;
2011-07-04 17:53:00 +02:00
}
var regexpr = new RegExp( regexpStr, 'mig' ); // g: global, m:multi-line i: ignore case
return function(s) {
return s.replace( regexpr, function(str, p1, p2, offset, s) {
var a = conversionObject[ str ];
return a == undefined ? str : a;
} );
};
}
var substitutions = {
'#': '<span class="starcell wall">#</span>',
'x': '<span class="starcell gift">x</span>',
2011-07-05 10:39:56 +02:00
' ': '<span class="starcell void"> </span>',
'H': '<span class="starcell cube">H</span>',
'@': '<span class="starcell ball">@</span>'
};
2011-07-06 22:47:58 +02:00
substitutions[ state.moving ] = substitutions[ state.moving ].replace( '">', '_selected">' );
if ( text == false ) {
for ( var c in substitutions ) {
substitutions[ c ] = substitutions[ c ].replace( />.</, '><' );
}
}
var myReplacer = Replacer( substitutions );
return myReplacer( state.board );
}
2011-07-06 23:28:36 +02:00
function format_infos( state ) {
var infos = "<h1>Star5</h1><br />";
infos += "Level " + (state.level+1) + " of " + levels.length + "<br />";
infos += count_gifts( state ) + " gifts left<br />";
infos += state.distance_travelled + " meters travelled";
return infos;
}
2011-07-07 09:16:32 +02:00
function format_help( ) {
2011-07-07 14:31:09 +02:00
var help = "<em>←↑→↓</em> to move around<br />";
help += "<em>Space</em> to switch actor<br />";
help += "<em>r</em> to reload<br />";
help += "<em>n</em> to pass to the next level<br />";
help += "<em>p</em> to go back to the previous level<br />";
2011-07-07 09:16:32 +02:00
return help;
}
2011-07-06 23:28:36 +02:00
function display_level( state, elt ) {
2011-07-07 14:23:35 +02:00
var starhtml = '<div class="gstar">';
2011-07-07 14:26:29 +02:00
starhtml += '<aside id="help">' + format_help( state ) + '</aside>';
2011-07-07 14:23:35 +02:00
starhtml += '<div id="blackboard">' + format_level( state, false ) + '</div>';
starhtml += '<aside id="infos">' + format_infos( state ) + '</aside>';
starhtml += '</div>';
$( elt ).html( starhtml );
}
function load_level( levelset, nb ) {
2011-07-04 21:10:44 +02:00
state.level = nb;
2011-07-04 16:40:15 +02:00
state.board = levelset[ state.level ];
2011-07-06 13:46:01 +02:00
state.distance_travelled = 0;
state.moving = cell.BALL;
return state;
}
function make_a_move( state, where ) {
2011-07-05 09:54:13 +02:00
var motion = [ 0, 0 ];
var item_coord = get_pos( state, state.moving );
2011-07-04 17:19:39 +02:00
/* Setup the motion vector according to direction.*/
switch( where ) {
case direction.UP:
motion[ 1 ]--;
break;
case direction.DOWN:
motion[ 1 ]++;
break;
case direction.LEFT:
motion[ 0 ]--;
break;
case direction.RIGHT:
motion[ 0 ]++;
break;
default: break;
}
/* Calculating arrival coordinates */
while ( /* Hairy conditions ahead */
/* target cell is within level's boundaries */
( ( item_coord[ 0 ] + motion[ 0 ] >= 0 ) && ( item_coord[ 0 ] + motion[ 0 ] < LEVEL_WIDTH ) ) &&
( ( item_coord[ 1 ] + motion[ 1 ] >= 0 ) && ( item_coord[ 1 ] + motion[ 1 ] < LEVEL_HEIGHT ) ) &&
/* and target cell is empty */
( get_cell( state, item_coord[ 0 ] + motion[ 0 ], item_coord[ 1 ] + motion[ 1 ] ) == cell.VOID )
/* or, the ball will eat gifts so we can move it on one */
|| ( state.moving == cell.BALL && ( get_cell( state, item_coord[ 0 ] + motion[ 0 ], item_coord[ 1 ] + motion[ 1 ] ) == cell.GIFT ) )
)
{
state = set_cell( state, item_coord[ 0 ], item_coord[ 1 ], cell.VOID ); /* void the origin cell */
item_coord[ 0 ] += motion[ 0 ]; /* move coordinate */
item_coord[ 1 ] += motion[ 1 ]; /* to those of target cells */
state = set_cell( state, item_coord[ 0 ], item_coord[ 1 ], state.moving ); /* move actor into target cell */
2011-07-06 13:46:01 +02:00
state.distance_travelled++; /* increment distance_travelled */
}
return state;
}
2011-07-04 16:40:15 +02:00
function start_loop( state, elt ) {
options.dom_place = elt;
display_level( state, options.dom_place );
2011-07-04 16:40:15 +02:00
2011-07-12 16:46:04 +02:00
$(document).focus( );
2011-07-12 17:31:09 +02:00
$(document).click(
function( e ) {
var board_infos = {};
board_infos.position = $("#blackboard").offset();
board_infos.dimensions = {};
board_infos.dimensions.width = $("#blackboard").width();
board_infos.dimensions.height = $("#blackboard").height();
board_infos.cell_dimensions = {};
board_infos.cell_dimensions.width = board_infos.dimensions.width / LEVEL_WIDTH;
board_infos.cell_dimensions.height = board_infos.dimensions.height / LEVEL_HEIGHT;
2011-07-12 18:17:13 +02:00
var movingpos = get_pos( state, state.moving );
var notmovingpos = get_pos( state, ( state.moving != cell.BALL ) ? cell.BALL : cell.CUBE );
var click = {};
click.x = e.pageX - board_infos.position.left;
click.y = e.pageY - board_infos.position.top;
if ( ( 0 <= click.x && click.x < board_infos.dimensions.width )
&& ( 0 <= click.y && click.y < board_infos.dimensions.height ) ) {
2011-07-12 18:05:52 +02:00
// coordinates in cell indexes
click.x = Math.floor( click.x / board_infos.cell_dimensions.width );
click.y = Math.floor( click.y / board_infos.cell_dimensions.height );
2011-07-12 18:05:52 +02:00
// We're inside the board
if ( click.x == notmovingpos[0] && click.y == notmovingpos[1] ) {
state.moving = ( state.moving != cell.BALL ) ? cell.BALL : cell.CUBE;
} else if ( click.x == movingpos[0] ) {
if ( click.y > movingpos[1] ) {
state = make_a_move( state, direction.DOWN );
} else if ( click.y < movingpos[1] ) {
state = make_a_move( state, direction.UP );
}
} else if ( click.y == movingpos[1] ) {
if ( click.x > movingpos[0] ) {
state = make_a_move( state, direction.RIGHT );
2011-07-12 17:31:09 +02:00
} else {
2011-07-12 18:05:52 +02:00
state = make_a_move( state, direction.LEFT );
2011-07-12 17:31:09 +02:00
}
}
display_level( state, options.dom_place );
}
});
$(document).keydown(
function( e ) {
switch( e.keyCode ) {
case 38: // UP
state = make_a_move( state, direction.UP );
break;
case 40: // DOWN
state = make_a_move( state, direction.DOWN );
break;
case 37: // LEFT
state = make_a_move( state, direction.LEFT );
break;
case 39: // RIGHT
state = make_a_move( state, direction.RIGHT );
break;
case 32: // SPACE
state = switch_actor( state );
break;
case 78: // n
if ( state.level < levels.length - 1 ) {
state = load_level( levels, state.level + 1 );
}
break;
case 80: // p
if ( state.level > 0 ) {
state = load_level( levels, state.level - 1 );
}
break;
case 82: // r
state = load_level( levels, state.level );
break;
default:
break;
}
2011-07-12 17:31:09 +02:00
if ( won_or_not( state ) ) {
if ( state.level < levels.length - 1 ) {
state = load_level( levels, state.level + 1 );
}
else {
alert( "You won!" );
}
}
2011-07-04 16:40:15 +02:00
2011-07-12 17:31:09 +02:00
display_level( state, options.dom_place );
});
2011-07-04 16:40:15 +02:00
}