Pong - HackMD

# Pong :::danger Due Date: Monday, September 23rd, 11:59 pm EST ::: Watch the demo [here](https://www.youtube.com/watch?v=27lTwEkk_k4)! # Assignment Roadmap :::info [Silly Premise](#Silly-Premise) [Collaboration Policy Reminder](#Collaboration-Policy-Reminder) [New Concepts Covered](#New-Concepts-Covered) [Helpful Resources](#Helpful-Resources) [Installing Stencil Code](#Installing-Stencil-Code) [Grading](#Grading) ### **[FUNCTIONALITY](#Functionality)** [Coding Incrementally](#Coding-Incrementally)     [Compiling and Running Your Code](#Compiling-and-Running-Your-Code)     [Suggested Order for Incremental Coding](#Suggested-Order-for-Incremental-Coding)     [Saving Your Work on GitHub](#Saving-Your-Work-on-Github) \*\*[Minimum Functionality Requirements](#Minimum-Functionality-Requirements)** [Full Functionality Requirements](#Full-Functionality-Requirements) ### **[IMPLEMENTATION](#Implementation)** [Stencil Code vs. Support Code](#Stencil-Code-vs.-Support-Code)     [Stencil Methods](#Stencil-Methods) [*\*Javadocs**](#Javadocs) [Boolean Type](#Boolean-Type) [Tip: Printlines](#Tip:-Printlines) ### **[DESIGN](#Design)** [Writing a Helper Method](#Writing-a-Helper-Method) [Association](#Association) ### **[STYLE](#Style)** ### **[HANDING IN](#Handing-in)** [README](#README) [Handin](#Handin) ::: ## Silly Premise Aang and his old friend Bumi had a game that they loved to play back in the good ol' days in Omashu. It involved a paddle and a cabbage that they would hit back and forth, using airbending. That was over 100 years ago, so Aang wonders if there is any way to modernize his favorite game. Instead of airbending, you'll be using Java to power your very own game of Pong. ![MV5BMzcwMWExM2YtYmU1Ni00MzdkLWI5ZTMtYTkyNmVmNWQ3YjA4XkEyXkFqcGdeQXVyMjgyOTI4Mg@@._V1_](https://hackmd.io/_uploads/Bk1k1Sz30.jpg) Reference: Avatar the Last Airbender, Nickelodeon ## Collaboration Policy Reminder If you ever have questions about [the collaboration policy](https://docs.google.com/document/d/10rbbd0Y6s1JUzPe8VmoWcL_Mz26XczX-i7p2LUFa9vc/edit?usp=sharing), refer to the collaboration policy or ask a TA! <img style="display: block; margin: auto; padding-top: 15px;" src=https://hackmd.io/_uploads/BkSOpo1nC.png width=600px> ## New Concepts Covered <img width="300px" style="float: right; margin-right: 30px;" src="https://hackmd.io/_uploads/SyRdPHf3R.gif"></img> * Parameters * Top-level class * Instance variables * Writing a method ## Helpful Resources * This handout! * [Writing Classes Code-along](https://drive.google.com/file/d/1Pb_UzUQegJI4D3I1t_XiAYPTnJW74Evu/view?usp=sharing) and [Code-along Recording](https://cs.brown.edu/courses/cs015/) * [ Pong Demo](https://www.youtube.com/watch?v=27lTwEkk_k4) * [Pong JavaDocs](https://cs.brown.edu/courses/cs015/javadocs/cs15/prj/pongSupport/package-summary.html) * **The Javadocs contain information that you cannot find in this handout - you will have much trouble implementing this project if you haven’t thoroughly read the Javadocs. When in doubt, first check the handout, then the Javadocs.** * [Working with Objects: Part 1 Lecture](https://cs.brown.edu/courses/cs015/lecture/pdf/CS15.Lecture_4_Working_With_Objects.9.17.24.pdf) * [Project Setup Video](https://www.youtube.com/watch?v=qjBdrj-ivbY) * [Style Guide](https://docs.google.com/document/d/1olSJxbrhuIystA_kVbmKu4V8JfN7HE-eDzM5blkoeFw/edit) * [GitHub Guide](https://docs.google.com/document/d/1tSxfUIn-Ro6Pr1X4y21BbYKdsiK-nlWW3pGDfyh7SQ8/edit) * [Understanding Support Code Handout](https://docs.google.com/document/d/1mWR-huHi6PqizbFlghQrRXGnyJRZaClu_pkY7PFQYqY/edit#heading=h.ac49hi2p43ww) * [README Guide](https://docs.google.com/document/d/1QJPit-_8ZC3r4l_f5F3ydMK34-NchBYgwtm0c21iwsU/edit) * [TA Hours](https://cs.brown.edu/courses/csci0150/) and [Ed](https://edstem.org/us/courses/63887/discussion/) ## Installing Stencil Code Click [here](https://classroom.github.com/a/m_ghhpWq) to get the stencil from GitHub - refer to the [CS15 GitHub Guide](https://docs.google.com/document/d/1tSxfUIn-Ro6Pr1X4y21BbYKdsiK-nlWW3pGDfyh7SQ8/edit) for help with GitHub and GitHub Classroom. Once you have the URL of your personal GitHub repository, open the IntelliJ terminal. Move into the **`src/`** folder, then use the command **`git clone <URL>`** Once you’ve cloned your personal repository from GitHub, you’ll need to rename the folder from **`pong-<yourGitHubLogin>`** to just **`pong`**. You will have issues running your code until you make the change. ## Grading The grade for this assignment will be determined by [functionality](#Functionality) (60%), [design](#Design) (25%), and [style](#Style) (15%). An ‘A’ project would meet mostly all [full functionality requirements](#Full-Functionality-Requirements) with good design and style. --- # Functionality Watching the [demo](https://www.youtube.com/watch?v=27lTwEkk_k4) will give you a better understanding of your task; we **strongly** recommend you do this as soon as you can. <img style="display: block; margin: auto; padding-bottom: 10px" src="https://hackmd.io/_uploads/rkx7WURsA.png" alt="Step 1" width="300"> For this assignment you’ll implement a version of one of the earliest arcade video games: Pong! The 2-player game consists of 2 **`CS15Paddle`** s and a **`CS15Ball`** that bounces across the screen. When the ball collides with a paddle, the ball rebounds in the opposite direction. The left player controls the left paddle by using the W key for up and the S key for down. The right player controls the right paddle by using the Up arrow key for up and the Down arrow key for down. Whenever the ball moves offscreen, the player on the opposite side from which the ball exited gets one point (i.e., if the ball moves off the right side, the left player gets one point, and vice versa). The next round then starts immediately with a new ball that moves toward the player who just received a point (e.g., if the ball moves off the right side, the new ball starts moving toward the left side, and vice versa). Once one player reaches five points, that player wins and the game ends! ## Coding Incrementally After you’ve watched the demo, *++thoroughly read this handout and the [Javadocs](#Javadocs) in full++* to make sure you understand the project. Once you’re ready, start coding! It is important to code **incrementally**, meaning you completely accomplish one logical task before moving on to the next one. ## Compiling and Running Your Code Most importantly, incremental coding means that you **run your code after each step** to ensure it’s working as you want it to! Refer to the [Rattytouille handout](https://hackmd.io/@Fall2024-CS15/Sy5evK8NA) for more detailed instructions on how to compile and run your code. Here is a summary: 1. `cd pong` 2. `javac *.java` 3. `cd ..` 4. `java pong.App` 5. Repeat! ## Suggested Order for Incremental Coding Step 1. Run the stencil code to see the empty game screen. **Step 2.** Instantiate the top-level **`PongGame`** class for the score labels to appear. * Not sure where to do this? Think about what class should **instantiate** the top-level class, and look through the [Javadocs](https://cs.brown.edu/courses/cs015/javadocs/cs15/prj/pongSupport/package-summary.html) for a hint. **Step 3.** Instantiate one paddle so that it appears on-screen. *Make sure to import the necessary class!* * The paddle should show up right when the game starts — which method is called whenever the game is first created? **Step 4.** Make the paddle respond to key presses to move up and down. * Make sure to call methods on the same instance of paddle that you already created, so the **scope** of the paddle can’t be limited to one method! **Step 5.** Repeat steps 3 and 4 for the other paddle. **Step 6.** Add a ball to the game. * When instantiating a ball, you’ll need to determine in which direction (right or left) it should start moving. For the first ball, either [**`boolean`**](#Boolean-Type) is fine! **Step 7.** Get the ball to move across the screen. * Since the ball moves incrementally, you should make sure to update its position each second. * As with the paddle, the **scope** of the ball can’t be limited to one method, so you can call methods on the same ball throughout the game! **Step 8.** Make each of the paddles check collisions with the ball so that the ball rebounds on contact. * Since the ball and paddles could intersect at any moment, you should check for collisions each second. **Step 9.** When the ball goes offscreen, you should update the score labels so that the opposite side receives one point, create a new ball that moves in the direction of the player who received a point, and check if a player has won. * The support code already figures out **when** the ball goes off screen - ++you just need to define what should happen (as listed above) when it does so++. * Be sure to read [the section below on helper methods](#Writing-a-Helper-Method) to achieve this functionality. * When creating a new ball, think about “variable reassignment” from the [Working with Objects: Part 1](https://cs.brown.edu/courses/cs015/lecture/pdf/CS15.Lecture_4_Working_With_Objects.9.17.24.pdf) lecture. * You should come up with a way to keep track of the scores yourself! :::spoiler **Hint** Use the **`int`** type. You can think of the score as a “property” of the game. ::: * **You *do not* need to code starting a new ++game++ (with resetting score to 0), just starting a new “++round++”.** ## Saving Your Work on Github Refer to the [CS15 GitHub Guide](https://docs.google.com/document/d/1tSxfUIn-Ro6Pr1X4y21BbYKdsiK-nlWW3pGDfyh7SQ8/edit) for more detailed instructions on how to save snapshots of your work to GitHub. We recommend doing this around once an hour to make sure you’re maintaining a copy of your code. Here is a summary: <img src="https://hackmd.io/_uploads/Bk6IGvfnC.png" width="200px" align: left style="display: block; float: right; padding-right: 20px;"></img> 1. Move into the pong directory 2. `git add -A` 3. `git commit -m “<some descriptive message>”` 4. `git push` 5. Repeat! ## Minimum Functionality Requirements MF Policy Summary: *In order to pass CS15, you will have to meet minimum functionality requirements for all projects. If you don’t meet them the first time around, you may hand the project in again until you succeed, but you will keep your original grade. MF requirements are not the same as the requirements for full credit on the project. You should attempt the full requirements on every project to keep pace with the course material. An ‘A’ project would meet all of the requirements on the handout and have good design and code style. To meet MF for Pong:* * Two paddles appear (one on the left side and one on the right side) and can move up and down * One score label updates throughout the game * Balls appear, move continuously, and rebound off both paddles * A new ball is spawned once the previous ball moves off screen ## Full Functionality Requirements Beyond the minimum functionality requirements, the rest of the functionality grade will depend on the following criteria: * Score labels increase by one whenever the ball goes off screen on the opposite side * Each ball spawns by moving in the opposite direction of the side the previous ball went off screen * Game declares winner when one player reaches 5 points * No minor bugs --- # Implementation ## Stencil Code vs. Support Code We provide you with both stencil code and support code. **Stencil code** refers to incomplete or partially written classes and methods which comprise the skeleton/framework of the program. **You should never delete code that was given to you as stencil code — it is there to help you!** You will be adding your own code to the stencil code that we provide. For this project, the stencil classes that you should fill out are **`App`** and **`PongGame`**. <img src="https://hackmd.io/_uploads/SJaA5HXhR.png" width="300px" align: left style="display: block; float: right; padding-right: 20px; padding-left: 20px"></img> On the other hand, **support code** is “black box” code that you must use but won’t be able to change and whose internals you won’t even be able to see. In other words, we’ve written “invisible” classes and methods for you that you should use according to the [Javadocs](https://cs.brown.edu/courses/cs015/javadocs/cs15/prj/pongSupport/package-summary.html) provided! Some classes (**`PongGame`**) have support code methods that you should call from methods within those classes (like **`MazeSolver`** in AndyBot!). There are also entire support classes that are “invisible” to you (**`CS15Paddle`** and **`CS15Ball`**), but you will have to create instances of those classes (like **`CS15Robot`**). The Javadocs describe what the support code does and how to utilize it. More on [Javadocs](https://cs.brown.edu/courses/cs015/javadocs/cs15/prj/pongSupport/package-summary.html) below! **++In short, we’ve written most of the code for a pong game to operate in the support code. Your job is to connect all the pieces together by filling in the stencil code.++** **++Very Important:++** You should never rewrite support code. *It is pre-written (and “invisible”) so that you can use it without worrying about how it actually works. It’s the ✨ magic ✨ we love!* ## Stencil Methods The stencil methods in **`PongGame`** are automatically called by the support code for you in specific scenarios. That means for *this* project, you should **never** call any of the stencil methods yourself! Again, because each of these 7 methods is called by the support code, ++you should not call the methods. You should just **define** these methods.++ You can find which methods are specifically stencil methods in the [Javadocs](https://cs.brown.edu/courses/cs015/javadocs/cs15/prj/pongSupport/package-summary.html). ## \*\*Javadocs** The [Javadocs](https://cs.brown.edu/courses/cs015/javadocs/cs15/prj/pongSupport/package-summary.html) have a list of all the classes and what they do, including support classes and methods, which you cannot see but must use! **The Javadocs contain information that you cannot find in this handout - you will have much trouble implementing this project if you haven’t thoroughly read the Javadocs. When in doubt, first check the handout, then the Javadocs.** Notice that since **`CS15Paddle`** and **`CS15Ball`** are support *classes*, they have no stencil methods at all. Also notice that both the **`CS15Paddle`** and **`CS15Ball`** constructors are considered support methods since you should instantiate those classes yourself. ## Boolean Type In computer science, the data type known as **`boolean`** refers to a piece of data that can either have the value **`true`** or **`false`**. Just like we can declare and initialize a variable of type integer like: **`int x = 3;` `int numObstacles = 20;`** We can similarly declare and initialize a variable of type boolean like: **`boolean x = false;` `boolean playerIsAlive = true;`** You’ll notice that the constructor of both the **`CS15Paddle`** and **`CS15Ball`** require an argument of type **`boolean`**, to denote left or right! The Javadocs provide more guidance on exactly when to use **`true`** or **`false`**. We’ll learn more about the **`boolean`** type later in the semester during the “Math and Making Decisions” lecture. ## Tip: Printlines If you find yourself confused about when a particular method is called by the support code, fill the method body with a printline! By using the **`System.out.println()`** method, you can see what’s printed in the terminal to understand when particular methods are called. <img src="https://hackmd.io/_uploads/B1p8sS7hC.gif" width="400px" style="display: block; margin: auto; padding: 15px"></img> --- # Design ## Writing a Helper Method When implementing the functionality for starting the next round of Pong, you’ll notice there will be a few lines of code repeated in the **`ballOffScreenLeft`** and **`ballOffScreenRight`** methods (creating a new ball, updating the score labels, and checking for a winner). A good coding practice is to factor out repeated lines of code into “helper methods”. Although not used to avoid repeating code, the **`solveRoadblock`** method from AndyBot is one example of a helper method. To practice writing your own methods, for this project you **++must++** write a helper method as part of the round restart functionality, and you must call the method from the **`ballOffScreenLeft`** and **`ballOffScreenRight`** methods. :::spoiler **Hint** The method may need to take in a parameter to indicate in which direction the next ball should start moving. Think about what parameter type the **`CS15Ball`** and **`CS15Paddle`** constructors use to denote left or right. ::: Refer to the [coding incrementally step 9](#Suggested-Order-for-Incremental-Coding) about specifically what should happen to start the next round. **The use of this helper method (and avoiding redundantly repeating lines of code) will be factored into the “design” portion of the grade.** ## Association Later in the course, you’ll have to plan your own design for programs, using concepts we cover in these early projects. One of those most important concepts is association! For this assignment, there is a correct way to implement the hierarchical structure of your program (since we provide you with support code that simulates most of the game), but soon the modeling and delegation decisions will be up to you! ++As practice for future projects, you’ll need to create a class diagram that represents the design of this program and submit it in your final submission.++ Be sure to include both stencil classes and support classes in the diagram. **This diagram will be factored into the “design” portion of the grade.** To make your diagram, we recommend using Google Docs/Slides/Drawing or paper and pencil. Be sure to upload your diagram to your GitHub repository. In your Pong GitHub repository, choose Add file and then Upload Files. Upload your diagrams here. Make sure your diagram is a **.pdf**, **.jpg**/**.jpeg**, or **.png** file. If you submit a different file format, it may be unsupported by Gradescope so you will receive no credit for the diagram. --- # Style Refer to the [CS15 Style Guide](https://docs.google.com/document/d/1olSJxbrhuIystA_kVbmKu4V8JfN7HE-eDzM5blkoeFw/edit#heading=h.b1nvuu1nggmv) for the specific style guidelines along which your code will be graded for the “style” portion. Starting with this assignment, you should **++add method comments for all public methods++** as well as class comments for all classes. We’ve provided class comments for **`App`** and **`PongGame`**, as well as a method comment for **`onWPressed`**, which you can use as an example for your own method comments. **Be sure to read the** [CS15 Style Guide](https://docs.google.com/document/d/1olSJxbrhuIystA_kVbmKu4V8JfN7HE-eDzM5blkoeFw/edit#heading=h.b1nvuu1nggmv) **in order to apply proper comment formatting!** # Handing in ## README In CS15, you’re **++required to hand in a README file++** (must be named README) that documents any notable design choices or known bugs in your program. Remember that clear, detailed, and concise READMEs best allow your TAs to understand your thought process, helping them better understand your project as well. <img src="https://hackmd.io/_uploads/rJ_u3r72C.gif" width="400px" style="display: block; margin: auto; padding: 15px"></img> You are expected to create your own README file. Please refer to the [README guide](https://docs.google.com/document/d/1QJPit-_8ZC3r4l_f5F3ydMK34-NchBYgwtm0c21iwsU/edit) for information on how to create a README, what information your README should contain, and how you must format it. At the bottom of your README, add the approximate number of hours you spent on this homework. This will be used only to average how long the homeworks are taking students this semester, and it is completely anonymous. ## Handin To hand in your assignment, follow these steps: 1. In a terminal, move into the **`pong`** folder as if you were about to compile your code 2. Type the command **`rm *.class`** (Mac) or **`del *.class`** (Windows) * This will remove the **`.class`** files that are created when compiling so that your submission only includes **`.java`** code files. 4. [Add, commit, and push your code to GitHub](#Saving-Your-Work-on-Github) 5. Add your class diagram to your GitHub repository a. In your Pong GitHub repository, select *Add file*, then *Upload Files*. Upload your diagram here and click *Commit Changes*. **Make sure that you see your diagram in your repository.** 5. Go to CS15 2024 on [Gradescope](https://www.gradescope.com/). 6. In the submission for Pong on Gradescope, click on GitHub. 7. Select your **Pong** repository and the **main** branch 8. Upload! **Please do not include any identifying information on your hand-in (name, login, Banner ID) as we grade anonymously. **Including identifying information will result in a deduction from your assignment.**** If you submit before the deadline and again after the deadline, the submission will be counted as late.