pacman-ui.js~ 6.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246
  1. var SOUND_ACTIVATED = false;
  2. var WIDTH_TILE_COUNT = 28;
  3. var HEIGHT_TILE_COUNT = 34;
  4. var TILE_SIZE = 16;
  5. var HALF_TILE_SIZE = 8;
  6. var ACTOR_SIZE = 32;
  7. var PLAYGROUND_WIDTH = WIDTH_TILE_COUNT * TILE_SIZE;
  8. var PLAYGROUND_HEIGHT = HEIGHT_TILE_COUNT * TILE_SIZE;
  9. var ACTOR_SPEED = 4;
  10. var LOOP_COUNT_REFRESH = 66;
  11. var loopCount = 0;
  12. var REFRESH_RATE = 15;
  13. //1: up, 2: left, 3:down, 4: right
  14. var UP = 1;
  15. var LEFT = 2;
  16. var DOWN = 3;
  17. var RIGHT = 4;
  18. var BONUS_TILE = 77;
  19. var eatenBonus = new Array();
  20. var INFINITY = 9999999999;
  21. $(function(){
  22. //Playground Sprites
  23. $("#playground").playground({height: PLAYGROUND_HEIGHT, width: PLAYGROUND_WIDTH, keyTracker: true});
  24. Sound.init(function(){
  25. $.playground().startGame( function() {
  26. Game.init();
  27. });
  28. });
  29. $.playground({refreshRate: 60}).addGroup("background", {posx: 0, posy: 0, width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT})
  30. .end()
  31. .addGroup("dots", {width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT})
  32. .end()
  33. .addGroup("actors", {width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT})
  34. .end()
  35. .addGroup( "hud", {width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT})
  36. .end();
  37. var hud = $("#hud");
  38. hud.append("<div id='scoreboard' class='scoreboard'><div class='subScoreboard'></div></div>");
  39. hud.append("<div id='lives' ><div id='life3' class='life'></div><div id='life2' class='life'></div><div id='life1' class='life'></div></div>");
  40. hud.append("<div id='scoreMessage'></div>");
  41. hud.append("<div id='message'></div>'");
  42. hud.append("<div id='level'></div>'");
  43. hud.append("<div id='levelNumber'></div>'");
  44. GUI.updateLevel( "Level" );
  45. var background = $("#background");
  46. var dotsGroup = $("#dots");
  47. var maze = Game.maze.structure;
  48. for( var i = 0; i < maze.length; i++ ) {
  49. var clazz = "";
  50. switch( maze[i]) {
  51. case -2:
  52. clazz = "bigDot";
  53. Game.dots[i] = "bigDot";
  54. break;
  55. case -1:
  56. clazz = "dot";
  57. Game.dots[i] = "dot";
  58. break;
  59. case 1:
  60. clazz = "corner1";
  61. break;
  62. case 2:
  63. clazz = "corner2";
  64. break;
  65. case 3:
  66. clazz = "corner3";
  67. break;
  68. case 4:
  69. clazz = "corner4";
  70. break;
  71. case 5:
  72. clazz = "squareCornerTopLeft";
  73. break;
  74. case 6:
  75. clazz = "squareCornerTopRight";
  76. break;
  77. case 7:
  78. clazz = "squareCornerBottomLeft";
  79. break;
  80. case 8:
  81. clazz = "squareCornerBottomRight";
  82. break;
  83. case 9:
  84. clazz = "horizontalMidDown";
  85. break;
  86. case 10:
  87. clazz = "verticalMidLeft";
  88. break;
  89. case 11:
  90. clazz = "verticalMidRight";
  91. break;
  92. case 12:
  93. clazz = "gate";
  94. break;
  95. }
  96. background.append('<div id="'+ i + '" class="tile ' + clazz +'"></div>');
  97. if(i % 28 == 27 ) {
  98. background.append('<div class="clear"></div>');
  99. }
  100. }
  101. // this is the function that control most of the game logic
  102. $.playground().registerCallback(function(){
  103. if(jQuery.gameQuery.keyTracker[37]){ //this is left! (a)
  104. Game.hero.left();
  105. }
  106. if(jQuery.gameQuery.keyTracker[38]){ //this is up! (w)
  107. Game.hero.up();
  108. }
  109. if(jQuery.gameQuery.keyTracker[39]){ //this is right! (d)
  110. Game.hero.right();
  111. }
  112. if(jQuery.gameQuery.keyTracker[40]){ //this is down! (s)
  113. Game.hero.down();
  114. }
  115. $.each(Game.actors, function(index, actor ) {
  116. actor.move();
  117. });
  118. for( var i = Math.max(0, eatenBonus.length - 6), j = 0; i < eatenBonus.length; i++, j++) {
  119. $("#" +( BONUS_TILE + j)).removeClass().addClass("tile").addClass( eatenBonus[i] );
  120. }
  121. }, REFRESH_RATE);
  122. });
  123. var Sound = {
  124. soundList : [],
  125. init : function(callback) {
  126. if( SOUND_ACTIVATED ) {
  127. soundManager.setup({
  128. url: 'swf/'
  129. });
  130. Sound.soundList = {
  131. opening : new $.gameQuery.SoundWrapper('sound/opening.mp3', false),
  132. waka : new $.gameQuery.SoundWrapper('sound/wakawaka.mp3', false),
  133. fruit : new $.gameQuery.SoundWrapper('sound/eatingfruit.mp3', false),
  134. ghost : new $.gameQuery.SoundWrapper('sound/eatingghost.mp3', false),
  135. dies : new $.gameQuery.SoundWrapper('sound/dies.mp3', false)
  136. };
  137. soundManager.onready( callback );
  138. } else
  139. callback();
  140. },
  141. play: function( sound ) {
  142. if( SOUND_ACTIVATED )
  143. Sound.soundList[sound].play();
  144. },
  145. stop: function( sound ) {
  146. if( SOUND_ACTIVATED )
  147. Sound.soundList[sound].stop();
  148. },
  149. }
  150. var GUI = {
  151. updateMessage : function( message ) {
  152. GUI.drawText( $("#message"), message, true );
  153. },
  154. updateScoreMessage : function( message ) {
  155. GUI.drawText( $("#scoreMessage"), message, false, "red" );
  156. },
  157. updateLevel : function( message ) {
  158. GUI.drawText( $("#level"), message, false );
  159. },
  160. updateLevelNumber: function( message ) {
  161. GUI.drawText( $("#levelNumber"), message + "", false, "", true );
  162. },
  163. drawText : function( divHTML, message, center, customClazz, forceSmall) {
  164. var html = "";
  165. var clazz = "clock";
  166. var letterSize = 32;
  167. if( typeof customClazz !== "undefined" ) {
  168. clazz = " clock " + customClazz;
  169. }
  170. var count = 0;
  171. var width = 0;
  172. var height = 0;
  173. for( var i = 0; i < message.length; i++ ) {
  174. var letter = message[i];
  175. var iLetter = (message.charCodeAt(i) - 97);
  176. if( letter == " " ) {
  177. html += "<div class='blank'></div>";
  178. width += 16;
  179. count++;
  180. } else if( letter.charCodeAt(0) > 47 && letter.charCodeAt(0) < 58 ) {
  181. var letterSize = 32;
  182. if( forceSmall ) {
  183. letterSize = 16;
  184. }
  185. html += "<div class='" + clazz + (forceSmall ? "small" : "") + "' style='top: -50%;background-position: -" + ( parseInt( letter ) * letterSize) + "px -" + (forceSmall > -1 ? 128 : 0) +"px'></div>";
  186. count++;
  187. } else if( ( letter.charCodeAt(0) >= 'a'.charCodeAt(0) && letter.charCodeAt(0) <= 'z'.charCodeAt(0)) ) {
  188. if( height < 16 )
  189. height = 16;
  190. width += 16;
  191. var lineSize = 20;
  192. var x = (iLetter % lineSize) * 16;
  193. var y = Math.floor(iLetter / lineSize) * 16 + 144;
  194. html += "<div class='" + clazz + " small' style='background-position: -" + x + "px -" + y + "px'></div>";
  195. count++;
  196. } else if( letter.charCodeAt(0) >= 'A'.charCodeAt(0) && letter.charCodeAt(0) <= 'Z'.charCodeAt(0)) {
  197. iLetter = letter.charCodeAt(0) - 'A'.charCodeAt(0);
  198. if( height < 32 )
  199. height = 32;
  200. width += 32;
  201. var lineSize = 10;
  202. var x = (iLetter % lineSize) * 32;
  203. var y = Math.floor(iLetter / lineSize) * 32 + 32;
  204. html += "<div class='" + clazz + "' style='background-position: -" + x + "px -" + y + "px'></div>";
  205. count++;
  206. }
  207. }
  208. divHTML.empty();
  209. divHTML.css( "width", width + "px");
  210. divHTML.css( "height", height + "px");
  211. if( center )
  212. divHTML.css( "margin-left", "-" + (message.length * letterSize / 2) + "px");
  213. divHTML.append( html );
  214. }
  215. }