Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title>My First Webpage</title>
- <meta name="description" content="Creative Computing Club Ping Pong">
- <meta name="author" content="Creative Computing Club">
- <script language="javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
- <script language="javascript" src="javascripts/jquery.hotkeys.js" type="text/javascript"></script>
- <script language="javascript" src="javascripts/key_status.js" type="text/javascript"></script>
- </head>
- <body>
- <script type='text/javascript'>
- var gameMode=1;
- var ballX = 240;
- var ballY = 160;
- var speed=3;
- var player1y= 160;
- var player2y= 160;
- var ballvSpeed=speed;
- var ballhSpeed=speed;
- var player1Score=0;
- var player2Score=0;
- var canvasElement = $("<canvas width='480' height='320'></canvas>");
- var canvas = canvasElement.get(0).getContext("2d");
- canvasElement.appendTo('body');
- setInterval(function( ) {
- if(gameMode==1){
- updateGame( );
- drawGame( );
- }
- }, 1000/60);
- <!--Update Game Logic-->
- function updateGame( ) {
- <!--Update Ball-->
- ballX=ballX+ballhSpeed;
- ballY=ballY+ballvSpeed;
- <!--Ball Out of Play-->
- if (ballX>475){player1Score+=1; ballX=240;ballhSpeed=-speed;}
- if (ballX<0){player2Score+=1; ballX=240;ballhSpeed=speed;}
- <!--Checks Score-->
- if (player1Score==5 || player2Score==5){
- player1y=160; player2y=160; player1Score=0; player2Score=0; speed=3; gameMode=0;
- }
- <!--Bounce Ball off of Paddles-->
- if (ballX>445 && ballX<455 && ballY>player2y-20 && ballY<player2y+20) {
- ballhSpeed=-speed;
- }
- if (ballX<30 && ballX>20 && ballY>player1y-20 && ballY<player1y+20) {
- ballhSpeed=speed;
- }
- <!--Bounce Ball off of Ceiling and Floor-->
- if (ballY>300){ballvSpeed=-speed;}
- if (ballY<10) {ballvSpeed=speed;}
- <!--Player 1 Controls-->
- if(keydown.q) {
- player1y -= 5;
- }
- if(keydown.a) {
- player1y += 5;
- }
- <!--Limit Player 1-->
- if(player1y<30){player1y=30;}
- if(player1y>290){player1y=290;}
- <!--Player 2 Controls-->
- if(keydown.p) {
- player2y -= 5;
- }
- if(keydown.l) {
- player2y += 5;
- }
- <!--Limit Player 2-->
- if(player2y<30){player2y=30;}
- if(player2y>290){player2y=290;}
- }
- <!--Displays the Game Screen-->
- function drawGame( ) {
- <!--Clears Screen-->
- canvas.fillStyle = "#000";
- canvas.fillRect(0,0,480,320);
- <!--Draws Top and Bottom Bars-->
- canvas.fillStyle = "#08F";
- canvas.fillRect(0,0,480,10);
- canvas.fillRect(0,310,480,10);
- <!--Draws Score-->
- canvas.strokeStyle = "#08F";
- canvas.font = "30px Arial";
- canvas.fillText(player1Score,120,50);
- canvas.fillText(player2Score,360,50);
- <!--Draws Net and Ball-->
- canvas.fillStyle = "#FFF";
- canvas.fillRect(245,10,5,300);
- canvas.fillRect(ballX,ballY,8,8);
- <!--Draws Players-->
- canvas.fillRect(20,player1y-20,10,40);
- canvas.fillRect(450,player2y-20,10,40);
- }
- </script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement