Advertisement
CCCSuffolk

Untitled

Feb 22nd, 2018
71
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.24 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>My First Webpage</title>
  6. <meta name="description" content="Creative Computing Club Ping Pong">
  7. <meta name="author" content="Creative Computing Club">
  8.  
  9. <script language="javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
  10. <script language="javascript" src="javascripts/jquery.hotkeys.js" type="text/javascript"></script>
  11. <script language="javascript" src="javascripts/key_status.js" type="text/javascript"></script>
  12.  
  13. </head>
  14.  
  15. <body>
  16. <script type='text/javascript'>
  17. var gameMode=1;
  18. var ballX = 240;
  19. var ballY = 160;
  20. var speed=3;
  21. var player1y= 160;
  22. var player2y= 160;
  23. var ballvSpeed=speed;
  24. var ballhSpeed=speed;
  25. var player1Score=0;
  26. var player2Score=0;
  27.  
  28. var canvasElement = $("<canvas width='480' height='320'></canvas>");
  29. var canvas = canvasElement.get(0).getContext("2d");
  30. canvasElement.appendTo('body');
  31. setInterval(function( ) {
  32.  
  33. if(gameMode==1){
  34. updateGame( );
  35. drawGame( );
  36. }
  37.  
  38. }, 1000/60);
  39.  
  40. <!--Update Game Logic-->
  41. function updateGame( ) {
  42.  
  43. <!--Update Ball-->
  44. ballX=ballX+ballhSpeed;
  45. ballY=ballY+ballvSpeed;
  46.  
  47. <!--Ball Out of Play-->
  48. if (ballX>475){player1Score+=1; ballX=240;ballhSpeed=-speed;}
  49. if (ballX<0){player2Score+=1; ballX=240;ballhSpeed=speed;}
  50.  
  51. <!--Checks Score-->
  52. if (player1Score==5 || player2Score==5){
  53. player1y=160; player2y=160; player1Score=0; player2Score=0; speed=3; gameMode=0;
  54. }
  55.  
  56. <!--Bounce Ball off of Paddles-->
  57. if (ballX>445 && ballX<455 && ballY>player2y-20 && ballY<player2y+20) {
  58. ballhSpeed=-speed;
  59. }
  60.  
  61. if (ballX<30 && ballX>20 && ballY>player1y-20 && ballY<player1y+20) {
  62. ballhSpeed=speed;
  63. }
  64.  
  65. <!--Bounce Ball off of Ceiling and Floor-->
  66. if (ballY>300){ballvSpeed=-speed;}
  67. if (ballY<10) {ballvSpeed=speed;}
  68.  
  69. <!--Player 1 Controls-->
  70. if(keydown.q) {
  71. player1y -= 5;
  72. }
  73. if(keydown.a) {
  74. player1y += 5;
  75. }
  76. <!--Limit Player 1-->
  77. if(player1y<30){player1y=30;}
  78. if(player1y>290){player1y=290;}
  79.  
  80. <!--Player 2 Controls-->
  81. if(keydown.p) {
  82. player2y -= 5;
  83. }
  84. if(keydown.l) {
  85. player2y += 5;
  86. }
  87. <!--Limit Player 2-->
  88. if(player2y<30){player2y=30;}
  89. if(player2y>290){player2y=290;}
  90.  
  91. }
  92.  
  93. <!--Displays the Game Screen-->
  94. function drawGame( ) {
  95.  
  96. <!--Clears Screen-->
  97. canvas.fillStyle = "#000";
  98. canvas.fillRect(0,0,480,320);
  99.  
  100. <!--Draws Top and Bottom Bars-->
  101. canvas.fillStyle = "#08F";
  102. canvas.fillRect(0,0,480,10);
  103. canvas.fillRect(0,310,480,10);
  104.  
  105. <!--Draws Score-->
  106. canvas.strokeStyle = "#08F";
  107. canvas.font = "30px Arial";
  108. canvas.fillText(player1Score,120,50);
  109. canvas.fillText(player2Score,360,50);
  110.  
  111. <!--Draws Net and Ball-->
  112. canvas.fillStyle = "#FFF";
  113. canvas.fillRect(245,10,5,300);
  114. canvas.fillRect(ballX,ballY,8,8);
  115.  
  116. <!--Draws Players-->
  117. canvas.fillRect(20,player1y-20,10,40);
  118. canvas.fillRect(450,player2y-20,10,40);
  119.  
  120. }
  121.  
  122. </script>
  123. </body>
  124. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement