Advertisement
Guest User

ERROR HTML5 HELP ME

a guest
Jul 13th, 2014
410
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. var canvas = document.getElementById("cvs"),
  2.     context = canvas.getContext("2d"),
  3.     GAME = GAME || {},
  4.     fps = 10,
  5.     drawInterval,
  6.     playersImg = new Image(),
  7.     keysDown = {};
  8.  
  9. playersImg.src = "source/img/players.png";
  10.  
  11. canvas.width = 800,
  12. canvas.height = 400;
  13.  
  14. // Disable blurring when images get resized
  15. context.webkitImageSmoothingEnabled = false;
  16. context.mozImageSmoothingEnabled = false;
  17. context.imageSmoothingEnabled = false;
  18.  
  19. // The game namespace
  20. GAME = {
  21.     gen: {
  22.         x: canvas.width,
  23.         y: canvas.height
  24.     },
  25.     player: {
  26.         x: canvas.width /2,
  27.         y: canvas.height /2,
  28.         X: 13
  29.     },
  30.     players: {
  31.         messi: [75, 25],
  32.         ronaldo: [50, 50],
  33.         balotelli: [25, 75]
  34.     },
  35.     team1: {
  36.         goals: 0
  37.     },
  38.     team2: {
  39.         goals: 0
  40.     },
  41.     func: {
  42.         // Draws the soccer field
  43.         drawField: function (x, y) {
  44.             // Drawing grass
  45.             context.beginPath();
  46.             context.rect(0, 0, x, y);
  47.             context.fillStyle = "#526F35";
  48.             context.fill();
  49.             context.closePath();
  50.  
  51.             // Drawing middle white circles
  52.             context.beginPath();
  53.             context.arc(x / 2, y / 2, 50, 0, 2 * Math.PI, false);
  54.             context.moveTo(x / 2, y / 2);
  55.             context.arc(x / 2, y / 2, 5, 0, 2 * Math.PI, false);
  56.  
  57.             // Drawing all the white lines
  58.             context.moveTo(800, 100);
  59.             context.lineTo(725, 100);
  60.             context.lineTo(725, 300);
  61.             context.lineTo(800, 300);
  62.             context.moveTo(0, 100);
  63.             context.lineTo(75, 100);
  64.             context.lineTo(75, 300);
  65.             context.lineTo(0, 300);
  66.             context.moveTo(x / 2, 0);
  67.             context.lineTo(x / 2, y);
  68.  
  69.             // How all the lines and circles are styled
  70.             context.lineWidth = 5;
  71.             context.strokeStyle = "#ffffff";
  72.             context.stroke();
  73.             context.closePath();
  74.         },
  75.         drawPlayer: function (x, y, posX, posY) {
  76.             context.drawImage(playersImg, x, y, 6, 8, posX, posY, 24, 32);
  77.         },
  78.         checkInput: function (e) {
  79.             if (keysDown[e] === 65) {
  80.                 GAME.player.x = GAME.player.x - GAME.players.messi[0];
  81.                 game.player.X = 7;
  82.                 console.log("left");
  83.             } else if (keysDown[e] === 68) {
  84.                 GAME.player.x = GAME.player.x + GAME.players.messi[0];
  85.                 game.player.X = 0;
  86.                 console.log("right");
  87.             } else if (keysDown[e] === 83) {
  88.                 GAME.player.y = GAME.player.y + GAME.players.messi[0];
  89.                 console.log("down");
  90.             } else if (keysDown[e] === 87) {
  91.                 GAME.player.y = GAME.player.y - GAME.players.messi[0];
  92.                 console.log("up");
  93.             } else {
  94.                 GAME.player.X = 13;
  95.                 console.log();
  96.             }
  97.         },
  98.         startDraw: function () {
  99.             GAME.func.stopDraw();
  100.             drawInterval = setInterval(GAME.func.draw, fps);
  101.         },
  102.         stopDraw: function () {
  103.             clearInterval(drawInterval);
  104.         },
  105.         draw: function () {
  106.             context.clearRect(0,0, GAME.gen.x, GAME.gen.y);
  107.             GAME.func.drawField(GAME.gen.x, GAME.gen.y);
  108.             GAME.func.drawPlayer(GAME.player.X, GAME.player.x, GAME.player.y);
  109.         }
  110.     }
  111. };
  112.  
  113. addEventListener("keydown", function (e) {
  114.     keysDown[e.keyCode] = true;
  115.     GAME.func.checkInput(e);
  116. }, false);
  117.  
  118. addEventListener("keyup", function (e) {
  119.     delete keysDown[e.keyCode];
  120. }, false);
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement