README.md

PONG

Synopsis

I am sure that we all have played PONG before. PONG is a game that was very popular before these console games came out. I remember playing PONG when I was 6 years old.

I am bulding a game that should be fairly simple. There is gonna be two posts that will try to hit the ball before it goes off screen.

if the ball goes off screen it's a point for the other player. First to FIVE points wins the game.

Link to Project 1

https://abdallah1936.github.io/project-1/

WireFrame

My Approach

I started by laying out what I want the game to do first. And then I started to write the code and seeing if it worked live on the web. After I was about halfway done with the game, I figured that I had over two hundred lines of code, which made it hard to navigate when I was debugging. I then created a another folder for functions. Doing so made reading the code and navigating so much easier.

MVP

• Have a winner box at the bottom
• Have a score counter
• Render a ball when someone scores a point
• Have a reset button for when someone wins
• Find a way for two people to play at the same time

Stretch Goals

• Have the opposing post go up and down at a consitant speed
• Make levels of hardness
• Get the balls increse in numbers
• get an impossible to beat AI
• Have the ball move up in speed that makes sense; for example when someone gets to 4 points, have the ball going at a very fast speed

Tech Being Used

• Html/CSS
• JavaScript
• HTML5 Canvas

potential Roadblocks

• Finding a way to end the game after the score reaches 6
• Getting the ball to render back into the game after someone scores
• Getting the ball to go faster depanding on the score
• Finding a way to make the ball bounce
• collision and point scoring

Post-Project Reflection and unsolved probloms or growth areas

This project was a lot more challenging than I anticipated. I thought that it would be easier to have the post go up and down on a set timer. I also would have loved to make levels that could increse speed of either the ball or make the post slower. The thing I regret the most is not having an AI to beat. Hopefully I will do it sometime in the future.

sorces:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/PI

https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/closePath

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random

https://blog.thejaytray.com/canvas-game-tutorial-pong/

https://www.tutorialspoint.com/How-to-set-Heading-alignment-in-HTML#:~:text=To%20set%20the%20heading%20alignment,setting%20alignment%20for%20an%20element.

https:developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch