SHARE
TWEET

Untitled

a guest Feb 21st, 2019 71 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1.     var canvas = document.getElementById("myCanvas");
  2.         var ctx = canvas.getContext("2d");
  3.         var x = canvas.width / 2;
  4.         var y = canvas.height - 30;
  5.         var dx = -0.5;
  6.         var dy = -2;
  7.         var ballRadius = 10;
  8.         var paddleHeight = 10;
  9.         var paddleWidth = 75;
  10.         var paddleX = (canvas.width - paddleWidth) / 2;
  11.         var rightPressed = false;
  12.         var leftPressed = false;
  13.         var brickRowCount = 4;
  14.         var brickColumnCount = 5;
  15.         var brickWidth = 75;
  16.         var brickHeight = 20;
  17.         var brickPadding = 10;
  18.         var brickOffsetTop = 30;
  19.         var brickOffsetLeft = 30;
  20.         var bricks = [];
  21.         var brickStatus;
  22.  
  23.         for (var c = 0; c < brickColumnCount; c++) {
  24.             bricks[c] = [];
  25.             for (var r = 0; r < brickRowCount; r++) {
  26.                 bricks[c][r] = { x: 0, y: 0, state: 1 };
  27.             }
  28.         }
  29.  
  30.  
  31.  
  32.  
  33.         function draw() {
  34.             ctx.clearRect(0, 0, canvas.width, canvas.height);
  35.             drawBall();
  36.             drawPaddle();
  37.             collisionDetection();
  38.             drawBricks();
  39.  
  40.             x += dx;
  41.             y += dy;
  42.  
  43.             if (y + dy < ballRadius) {
  44.                 dy = -dy;
  45.             } else if (y + dy > canvas.height - ballRadius) {
  46.                 if (x > paddleX && x < paddleX + paddleWidth) {
  47.                     dy = -dy;
  48.                 }
  49.                 else {
  50.                     alert("GAME OVER");
  51.                     document.location.reload();
  52.                     clearInterval(interval); //Chrome shite
  53.                 }
  54.             }
  55.  
  56.             if (x + dx < ballRadius) {
  57.                 dx = -dx;
  58.             }
  59.  
  60.             if (x + dx > canvas.width - ballRadius) {
  61.                 dx = -dx;
  62.             }
  63.  
  64.             if (rightPressed && paddleX < canvas.width - paddleWidth) {
  65.                 paddleX += 7;
  66.             }
  67.  
  68.             else if (leftPressed && paddleX > 0) {
  69.                 paddleX -= 7;
  70.             }
  71.  
  72.  
  73.         }
  74.  
  75.         function drawBall() {
  76.             ctx.beginPath();
  77.             ctx.arc(x, y, ballRadius, 0, Math.PI * 2);
  78.             ctx.fillStyle = "#0095DD";
  79.             ctx.fill();
  80.             for (var c = 0; c < brickColumnCount; c++) {
  81.                 for (var r = 0; r < brickRowCount; r++) {
  82.             var b = bricks[c][r];
  83.             if (b.state == 1) {
  84.                 ctx.fillStyle = "green";
  85.             } else if (b.state == 0) {
  86.                 ctx.fillStyle = "#0095DD";
  87.             }
  88.             ctx.closePath();
  89.                 }
  90.  
  91.             }
  92.  
  93.         }
  94.  
  95.         function drawPaddle() {
  96.             ctx.beginPath();
  97.             ctx.rect(paddleX, canvas.height - paddleHeight, paddleWidth, paddleHeight);
  98.             ctx.fillStyle = "#0095DD";
  99.             ctx.fill();
  100.             ctx.closePath();
  101.         }
  102.  
  103.         document.addEventListener("keydown", keyDownHandler, false);
  104.         document.addEventListener("keyup", keyUpHandler, false);
  105.         function keyDownHandler(e) {
  106.             if (e.key == "Right" || e.key == "ArrowRight") {
  107.                 rightPressed = true;
  108.             }
  109.             else if (e.key == "Left" || e.key == "ArrowLeft") {
  110.                 leftPressed = true;
  111.             }
  112.         }
  113.  
  114.         function keyUpHandler(e) {
  115.             if (e.key == "Right" || e.key == "ArrowRight") {
  116.                 rightPressed = false;
  117.             }
  118.             else if (e.key == "Left" || e.key == "ArrowLeft") {
  119.                 leftPressed = false;
  120.             }
  121.         }
  122.         function collisionDetection() {
  123.             for (var c = 0; c < brickColumnCount; c++) {
  124.                 for (var r = 0; r < brickRowCount; r++) {
  125.                        var b = bricks[c][r];
  126.                     //Do stuff to detect the bricks
  127.                     if (b.state == 1) {
  128.                         if (x > b.x && x < b.x + brickWidth && y > b.y && y < b.y + brickHeight) {
  129.                             dy = -dy;
  130.                             b.state = 0;
  131.                         }
  132.  
  133.                     }
  134.                 }
  135.             }
  136.         }
  137.  
  138.         function drawBricks() {
  139.             for (var c = 0; c < brickColumnCount; c++) {
  140.                 for (var r = 0; r < brickRowCount; r++) {
  141.                     if (bricks[c][r].state == 1) {
  142.                         var brickX = (c * (brickWidth + brickPadding)) + brickOffsetLeft;
  143.                         var brickY = (r * (brickHeight + brickPadding)) + brickOffsetTop;
  144.                         bricks[c][r].x = brickX;
  145.                         bricks[c][r].y = brickY;
  146.                         ctx.beginPath();
  147.                         ctx.rect(brickX, brickY, brickWidth, brickHeight);
  148.                         ctx.fillStyle = "#0095DD";
  149.                         ctx.fill();
  150.                         ctx.closePath();
  151.                     }
  152.                 }
  153.             }
  154.         }
  155.  
  156.  
  157.  
  158.  
  159.         var interval = setInterval(draw, 10);
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