Game
Nelze vybrat více než 25 témat Téma musí začínat písmenem nebo číslem, může obsahovat pomlčky („-“) a může být dlouhé až 35 znaků.

game.js 5.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250
  1. var keymap = {
  2. 32: "jump",
  3. touch: "jump"
  4. };
  5. /*
  6. * Collision box
  7. */
  8. function Box(width, height, pos) {
  9. pos = pos || {};
  10. this.width = width;
  11. this.height = height;
  12. this.pos = new Vec2(pos.x, pos.y);
  13. }
  14. Box.prototype.collidesWith = function(box, ent1pos, ent2pos) {
  15. var x1 = ent1pos.x + this.pos.x;
  16. var x2 = ent2pos.x + box.pos.x;
  17. var y1 = ent1pos.y + this.pos.y;
  18. var y2 = ent2pos.y + box.pos.y;
  19. var w1 = this.width;
  20. var w2 = box.width;
  21. var h1 = this.height;
  22. var h2 = box.height;
  23. return ((x1 + w1 >= x2 && x1 <= x2 + w2) &&
  24. (y1 + h1 >= y2 && y1 <= y2 + h2));
  25. }
  26. Box.prototype.trace = function(ctx) {
  27. ctx.beginPath();
  28. ctx.moveTo(this.pos.x, this.pos.y);
  29. ctx.lineTo(this.pos.x, this.pos.y + this.height);
  30. ctx.lineTo(this.pos.x + this.width, this.pos.y + this.height);
  31. ctx.lineTo(this.pos.x + this.width, this.pos.y);
  32. ctx.closePath();
  33. }
  34. /*
  35. * Collision shape
  36. */
  37. function Shape(ent) {
  38. this.ent = ent;
  39. this.boxes = [];
  40. this._height = -1;
  41. this._width = -1;
  42. }
  43. Shape.prototype.push = function(box) {
  44. this._height = -1;
  45. this._width = -1;
  46. this.boxes.push(box);
  47. }
  48. Shape.prototype.pop = function() {
  49. this._height = -1;
  50. this._width = -1;
  51. return this.boxes.pop();
  52. }
  53. Shape.prototype.draw = function(ctx) {
  54. for (var i = 0; i < this.boxes.length; ++i) {
  55. var box = this.boxes[i];
  56. box.trace(ctx);
  57. ctx.stroke();
  58. ctx.fill();
  59. }
  60. }
  61. Shape.prototype.collidesWith = function(shape) {
  62. for (var i = 0; i < this.boxes.length; ++i) {
  63. var box = this.boxes[i];
  64. for (var j = 0; j < shape.boxes.length; ++j) {
  65. var otherBox = shape.boxes[j];
  66. if (box.collidesWith(otherBox, this.ent.pos, shape.ent.pos))
  67. return true;
  68. }
  69. }
  70. return false;
  71. }
  72. Shape.prototype.width = function() {
  73. if (this._width !== -1)
  74. return this._width;
  75. var minX = 0;
  76. var maxX = 0;
  77. this.boxes.forEach(function(box) {
  78. if (box.pos.x < minX)
  79. minX = box.pos.x;
  80. if (box.pos.x + box.width > maxX)
  81. maxX = box.pos.x + box.width;
  82. });
  83. this._width = Math.abs(maxX - minX);
  84. return this._width;
  85. }
  86. Shape.prototype.height = function() {
  87. if (this._height !== -1)
  88. return this._height;
  89. var minY = 0;
  90. var maxY = 0;
  91. this.boxes.forEach(function(box) {
  92. if (box.pos.y < minY)
  93. minY = box.pos.y;
  94. if (box.pos.y + box.height > maxY)
  95. maxY = box.pos.y + box.height;
  96. });
  97. this._height = Math.abs(maxY - minY);
  98. return this._height;
  99. }
  100. // Make entity from object
  101. function makeEnt(obj, game, mass) {
  102. obj.pos = new Vec2();
  103. obj.vel = new Vec2();
  104. obj.force = new Vec2();
  105. obj.game = game;
  106. obj.shape = new Shape(obj);
  107. obj.moves = false;
  108. this.dead = false;
  109. obj.mass = mass || 0;
  110. obj.forceScalar = 1 / obj.mass;
  111. }
  112. /*
  113. * Game
  114. */
  115. function Game(canvas) {
  116. this.canvas = canvas;
  117. this.ctx = canvas.getContext("2d");
  118. this.raf = null;
  119. this.prevTime = null;
  120. this.stopped = true;
  121. this.camera = new Vec2();
  122. this.worldgen = null;
  123. this.entities = [];
  124. this.keys = {};
  125. this.presses = {};
  126. this.onkey = function onkey(evt) {
  127. var down = (evt.type === "keydown" || evt.type === "touchstart");
  128. var code = evt.keyCode || "touch";
  129. var name = keymap[code];
  130. if (name) {
  131. this.keys[name] = down;
  132. if (down)
  133. this.presses[name] = true;
  134. }
  135. }.bind(this);
  136. }
  137. Game.prototype.start = function(worldgen) {
  138. window.addEventListener("keydown", this.onkey);
  139. window.addEventListener("keyup", this.onkey);
  140. window.addEventListener("touchstart", this.onkey);
  141. window.addEventListener("touchend", this.onkey);
  142. this.prevTime = new Date().getTime();
  143. this.stopped = false;
  144. this.worldgen = worldgen;
  145. this.update();
  146. }
  147. Game.prototype.update = function() {
  148. var time = new Date().getTime();
  149. var dt = time - this.prevTime;
  150. if (this.stopped)
  151. return;
  152. // Go through and update
  153. var xRatio = 1 / (1 + (dt * 0.005));
  154. for (var i = 0; i < this.entities.length; ++i) {
  155. var ent = this.entities[i];
  156. // Remove dead entities, replace them with the last entity
  157. if (ent.dead) {
  158. if (i + 1 === this.entities.length) {
  159. this.entities.pop();
  160. } else {
  161. this.entities[i] = this.entities.pop();
  162. var ent = this.entities[i];
  163. }
  164. }
  165. if (ent.update)
  166. ent.update();
  167. if (ent.moves) {
  168. ent.force.scale(ent.forceScalar * dt);
  169. ent.vel.add(ent.force);
  170. ent.force.set({ x: 0, y: 0 });
  171. ent.vel.scale(xRatio);
  172. ent.pos.add(ent.vel.clone().scale(dt));
  173. }
  174. if (ent.move)
  175. ent.move();
  176. }
  177. // Exit if stopped
  178. if (this.stopped)
  179. return;
  180. // Tick worldgen
  181. this.worldgen.update();
  182. // Go through and draw
  183. this.canvas.width = this.canvas.width;
  184. for (var i = 0; i < this.entities.length; ++i) {
  185. var ent = this.entities[i];
  186. if (ent.dead)
  187. continue;
  188. if (ent.pos.x + ent.shape.width() < this.camera.x)
  189. continue;
  190. if (ent.pos.x > this.camera.x + this.canvas.width)
  191. continue;
  192. this.ctx.save();
  193. this.ctx.translate(
  194. ent.pos.x - this.camera.x,
  195. ent.pos.y - this.camera.y);
  196. ent.draw(this.ctx);
  197. this.ctx.restore();
  198. }
  199. // Clear presses
  200. for (var i in this.presses) {
  201. this.presses[i] = false;
  202. }
  203. this.prevTime = time;
  204. if (!this.stopped)
  205. this.raf = reqAnimFrame(this.update.bind(this));
  206. }
  207. Game.prototype.stop = function() {
  208. this.stopped = true;
  209. cancelAnimFrame(this.raf);
  210. window.removeEventListener("keyup", this.onkey);
  211. window.removeEventListener("keydown", this.onkey);
  212. if (this.onstop)
  213. this.onstop();
  214. }