daily pastebin goal
14%
SHARE
TWEET

Untitled

a guest Dec 14th, 2018 62 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. // JavaScript Pinball
  2. // Rhys Powell (rp996)
  3.  
  4. // Constants
  5. var BALL_SIZE = 32;
  6. var WIDTH = 400;
  7. var HEIGHT = 600;
  8.  
  9. // Our shared variables
  10. var score = 0;
  11.  
  12. var ball;
  13. var posX , posY, velX, velY;
  14. var paddle;
  15. var bumpers = [];
  16. var currentTime, previousTime, deltaTime;
  17. var gameInterval; // Used to stop the update loop
  18.  
  19. function getBumpers() {
  20.   for (var i = 0; i < 3; i++) {
  21.     bumper = document.getElementById("bumper-" + (i + 1));
  22.     bumper.style.top = (Math.random() * (HEIGHT - 100 - BALL_SIZE) ) + "px";
  23.     bumper.style.left = (Math.random() * (WIDTH - BALL_SIZE)) + "px";
  24.  
  25.     bumpers.push(bumper);
  26.   }
  27. }
  28.  
  29. function checkCollisions() {
  30.   // Check for collisions against the edge of the playfield
  31.  
  32.   // Bounce off the sides
  33.   if (posX + BALL_SIZE > WIDTH || posX < 0) {
  34.     velX = -velX;
  35.     velX *= 1 + (Math.random() * 0.1);
  36.     velY *= 1 - (Math.random() * 0.5);
  37.  
  38.     score += 2;
  39.   }
  40.  
  41.   // Bounce off the top
  42.   if (posY < 0) {
  43.     velY = -velY;
  44.  
  45.     score += 5;
  46.   };
  47.  
  48.   // Stop the ball if we get a game over.
  49.   if (posY > HEIGHT) {
  50.     velX = 0;
  51.     velY = 0;
  52.  
  53.     gameOver();
  54.   };
  55.  
  56.   // Paddle collision
  57.   if (posY + BALL_SIZE >= paddle.offsetTop &&
  58.       posY <= paddle.offsetTop + 30 &&
  59.       posX + BALL_SIZE > paddle.offsetLeft &&
  60.       posX < paddle.offsetLeft + 100) {
  61.     velY = -((Math.random() * 300) + 100);
  62.  
  63.     score += 20;
  64.   };
  65.  
  66.   // Bounce off the bumpers
  67.   for (var i = 0; i < bumpers.length; i++) {
  68.     var radius = BALL_SIZE / 2
  69.     var x = (bumpers[i].offsetLeft + radius) - (ball.offsetLeft + radius);
  70.     var y = (bumpers[i].offsetTop + radius) - (ball.offsetTop + radius);
  71.     var distance = Math.sqrt(x*x + y*y);
  72.  
  73.     if (distance < radius * 2) {
  74.       velY = -velY;
  75.       velX = -velX;
  76.       velY *= 1 + (Math.random() * 0.1);
  77.       velX *= 1 + (Math.random() * 0.1);
  78.       console.log(distance);
  79.  
  80.       bumpers[i].style.background = "#B0D18D";
  81.       window.setTimeout(unflashBumper, 200, i);
  82.  
  83.  
  84.       score += 10;
  85.     }
  86.   }
  87.  
  88.   if (velX > 600) {
  89.     velX = 600;
  90.   } else if (velX < -600) {
  91.     velX = -600;
  92.   } else if (velX < 100 && velX > 0) {
  93.     velX = 100
  94.   } else if (velX > -100 && velX < 0) {
  95.     velX = -100;
  96.   }
  97.  
  98.   if (velY > 600) {
  99.     velY = 600;
  100.   } else if (velY < -600) {
  101.     velY = -600;
  102.   } else if (velY < 100 && velY > 0) {
  103.     velY = 100
  104.   } else if (velY > -100 && velY < 0) {
  105.     velY = -100;
  106.   }
  107. }
  108.  
  109. function unflashBumper(n) {
  110.   bumpers[n].style.background = "#3B86B7";
  111. }
  112.  
  113. function update() {
  114.   // Calculate time elapsed since last frame
  115.   previousTime = currentTime;
  116.   currentTime = Date.now();
  117.   deltaTime = (currentTime - previousTime) / 1000;
  118.  
  119.   checkCollisions();
  120.  
  121.  
  122.   // Update position of ball
  123.   posX += velX * deltaTime;
  124.   posY += velY * deltaTime;
  125.  
  126.   // 'redraw' so to speak
  127.   ball.style.left = posX + "px";
  128.   ball.style.top = posY + "px";
  129.  
  130.   document.getElementById("score").innerHTML = "Score: " + score;
  131. }
  132.  
  133. function setup () {
  134.   ball = document.getElementById("ball");
  135.   paddle = document.getElementById("paddle");
  136.   getBumpers();
  137.  
  138.   posX = (Math.random() * (HEIGHT - 100 - BALL_SIZE) );
  139.   posY = (Math.random() * (WIDTH - BALL_SIZE));
  140.  
  141.   velX = (Math.random() * 800) - 400;
  142.   velY = (Math.random() * 800) - 400;
  143.  
  144.   document.onmousemove = function(e) {
  145.     paddle.style.left = (e.clientX - 50)+ "px";
  146.   };
  147.   console.log(posX + ", " + posY);
  148.  
  149.   ball.style.top = posY;
  150.   ball.style.left = posX;
  151.  
  152.   currentTime = Date.now();
  153.   previousTime = Date.now();
  154.   deltaTime = 0;
  155. }
  156.  
  157. function game() {
  158.   setup();
  159.  
  160.   gameInterval = setInterval(update, 1000/50);
  161. }
  162.  
  163. function gameOver() {
  164.   clearInterval(gameInterval);
  165.  
  166.   document.getElementById("board").style.display = "none";
  167.   document.getElementById("gameOver").style.display = "block";
  168.   document.getElementById("finalScore").innerHTML = score.toString();
  169.  
  170.   window.setTimeout(close, 4000);
  171. }
  172.  
  173. function countdown(n) {
  174.   if (n > 0) {
  175.     document.getElementById("seconds").innerHTML = n.toString();
  176.     window.setTimeout(countdown, 1000, n-1);
  177.   } else {
  178.     document.getElementById("board").style.display = "block";
  179.     document.getElementById("countdown").style.display = "none";
  180.     game();
  181.   };
  182. }
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