daily pastebin goal
65%
SHARE
TWEET

untitled.js

RandomGuy32 Jul 11th, 2014 233 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. var game = {
  2.         isRunning: false,
  3.         ticks: 60
  4. };
  5. var arena = {
  6.         width: 480,
  7.         height: 320             // might be useful
  8. };
  9. var backgroundLayer1 = {
  10.         posY: 0
  11. };
  12. var backgroundLayer2 = {
  13.         posY: 0
  14. };                                                              // ever heard of classes? yeah, me neither
  15. var ship = {
  16.         posX: 0,
  17.         posY: 0,
  18.         width: 16,
  19.         height: 16,             // just in case I ever change my mind
  20.         hitpoints: 10,
  21.         dir: "up",
  22.         spritePosX: 0,  // I didn't have to do this when I was still using <div>s; I'm not sure whether I need to do this now
  23.         spritePosY: 0
  24. };
  25.  
  26. // sprite sources
  27. var spriteShip = new Image();
  28. spriteShip.src = "..\/assets\/ship.png";        // I hope this works, otherwise html5canvastutorials.com is going to feel my wrath
  29.  
  30. // /*setting up*/ initiating <canvas>, or something
  31. var c, ctx;
  32.  
  33. // pretty important, yep
  34. document.addEventListener('DOMContentLoaded', init, false);
  35.  
  36. function init() {
  37.         // _now_ setting up <canvas>
  38.         c = document.getElementById('arena');
  39.         ctx = c.getContext("2d");
  40.         // key thingy
  41.         document.onkeydown = function(event) {
  42.                 // how convenient that I can just copy and paste this everywhere
  43.                 if (!game.isRunning) {
  44.                         // enter key
  45.                         if (event.keyCode === 13) {
  46.                                 event.preventDefault();
  47.                                 // starting game
  48.                                 game.isRunning = true;
  49.                                 tick();
  50.                                 render();
  51.                         }
  52.                 }
  53.                 // left arrow key
  54.                 if (event.keyCode === 37) {
  55.                         event.preventDefault();
  56.                         // möp
  57.                 }
  58.                 // up arrow key
  59.                 if (event.keyCode === 38) {
  60.                         event.preventDefault();
  61.                         // möp
  62.                 }
  63.                 // right arrow key
  64.                 if (event.keyCode === 39) {
  65.                         event.preventDefault();
  66.                         // möp
  67.                 }
  68.                 // down arrow key
  69.                 if (event.keyCode === 40) {
  70.                         event.preventDefault();
  71.                         // möp
  72.                 }
  73.         }
  74. }
  75. function tick() {
  76.         // everything calculate-y happens here
  77.         window.setTimeout(tick, 1000/game.ticks);
  78. }
  79. function render() {
  80.         // clearing <canvas> for next animation frame
  81.         ctx.clearRect(0, 0, arena.width, arena.height);
  82.         // everything render-y happens here
  83.         renderShip();           // test, test
  84.         // calling next animation frame
  85.         window.requestAnimationFrame(render);
  86. }
  87. function renderShip() {
  88.         // this looks horrible, but it's just for testing, so it's fine I guess
  89.         spriteShip.onload = function() {
  90.                 ctx.drawImage(spriteShip, ship.spritePosX * 16, ship.spritePosY * 16, ship.width, ship.height, ship.posX, ship.posY, ship.width, ship.height);
  91.         }
  92. }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top