Lab 2: Advanced Arithmetic and Object-Oriented-Programming

Table of Contents:

Goals

After the lab, you should know how to

  1. solve more advanced arithmetic problems
  2. get user input
  3. use an API to solve problems
  4. create basic web pages to display images

Objective: Review

Objective: Set Up

Run labhelp

Linux: Set up for Lab 2

  1. Create a directory called lab2 in your cs111 directory. Your programs and the output for this lab will all be saved in the lab2 directory.
  2. Copy graphics.py from the directory /csci/courses/cs111/handouts/lab2 into your lab2 directory.

Objective: Programming in Python

We'll practice writing several Python programs, each in their own text file. Name the files lab2_1.py through lab2_7.py.

Your programs will be graded on correctness, style, and how well you tested them. Make sure you adhere to the good development and testing practices we discussed in class. Your code should be readable and your output should be useful and well-formatted.

After you've developed a correct solution to each program, restart IDLE or close and reopen the IDLE "shell" by running the program again (using F5), demonstrate that the program works using several good test cases, and save the output to a file named lab2_x.out, where x is the problem number.

You can use Python Visualizer to help you see what is happening in your program. This is the visualizer used in the text book.

  1. (8 pts) Copy problem 1 from lab 1 (lab1_1.py) and save in this directory as lab2_1.py. Modify your program so that the program prompts the user for values of i and j. Update the output as appropriate, keeping in mind that we want clear output for the user.

    When you demonstrate your program, think about what are good test cases for this program. What answers do you know? Keep this in mind whenever you test a program that has input.
    In general, you do not need to test anything that is a user error, e.g., entering a negative age or year or entering floats when you expect integers. The goal is to reveal bugs in your program, not user errors because we can't handle those (yet). It's good to think about those problems, but you don't need to demo your code with them (because your program will crash or produce strange results).

    This is good development practice: write your program first with fixed values. (It's easier to just run your program rather than getting user input.) Then, after that is working, add getting user input to your program so that your program is more useful.

    In summary: Recommended development process:
    1. Consider how the program should work/test cases for the program.
    2. Write algorithm in comments
    3. Implement algorithm, a few lines of code at a time, and execute your code to make sure those next few lines work. Repeat until you have implemented everything.
    4. "Hardcode" values for the inputs to start. Then, after making sure your algorithm works, add getting user input.
    5. Test the program, using the test cases you came up with in the first step.

    This is always the recommended practice. Getting user input will become routine. Focus on the test cases/expected behavior, algorithms and implementing the algorithms first.

    Bringing it all together, your final progarm should output something like: 

    This program calculates the result of i^2 + 3j - 5.

Enter the value of i: 7
Enter the value of j: 2

i^2 + 3j - 5 = 50

    As the instructions above state, you should demonstrate your program running multiple times, with a variety of inputs to show that it works. See instructions above.

  2. (12 pts) Write a program to help a party of friends split a restaurant bill equally. The program should ask for the total bill amount, the percent tip to add, and how many people are splitting the bill.

    Note: what the program should do in its final submitted version is not necessarily what your program will do during the development process. Your final product is what matters. Don't worry about user input to start!

    Here is what two runs of your final program should look like: 

    Bill amount in dollars: 55.34
Percent tip: 20
Number of people: 3

The tip is 11.068000000000001 dollars
The total cost is 66.408 dollars
The cost per person is 22.136 dollars


    Bill amount in dollars: 162.29
Percent tip: 15
Number of people: 8

The tip is 24.3435 dollars
The total cost is 186.6335 dollars
The cost per person is 23.3291875 dollars
  3. (15 pts) Write a program that demonstrates the importance of operator precedence. Your program will prompt the user for values for the variables a, b, and c. Then, print the result of a Python expression that has no parentheses, using those three variables. Then, show a different result from the same expression with one added pair of parentheses.

    Example output (with fake numbers--this isn't a real equation): 

    Enter a: 12
Enter b: 34
Enter c: 5
The result of <display your equation here> is 51
The result of <display your equation with parentheses here> is 15
  4. (13 pts) Distributing Greatest Hits Albums. A band is putting out their Greatest Hits album and needs to know how many cds their album requires because the physical disks are where the money is made. Bands like the Ramones can fit a lot more tracks on a cd than a band like Led Zeppelin.

    Write a program that takes the number of greatest hits and the size of the cds (in terms of the number of tracks) and determines how many cds are needed and how many tracks will have to wait for the next Greatest Hits album.

    This program determines the number of CDs in a Greatest Hits album.

How many greatest hits/tracks do you have? 24
How many tracks fit on a cd? 10

Your album requires 2 cds.
4 tracks will have to wait for the next Greatest Hits album.

    Note: you may have some grammar issues in your output. We don't know how to fix those yet.

    5. Reference Material for Graphics Programming

  5. (12) Using the graphics module, draw a yellow circle with radius 30 and a red square of width 50 in a window that is 400x200 with the title "Practice". Position the circle in the upper-left quadrant of the canvas and the square in the lower-right quadrant.

    Please add two calls--one to getMouse() and one to close()--on your GraphWin object at the end of the program. It won't make a difference for you in IDLE, but it does make a difference for me when I run the programs automatically.

    There will be no IDLE output for this program.

  6. (12) Using the graphics module, draw the beginning of a snow-person. Create a canvas with the title "Snow Person". Draw a white circle of radius 50. Clone the circle and move the cloned circle above the first circle (so that the circle appears to be sitting on top of the original circle). Repeat with a third cloned circle. Draw two black, filled-in circles for eyes in the top circle. Note that you should draw one eye, then clone the eye and move it to the appropriate place.

    Please add two calls--one to getMouse() and one to close()--on your GraphWin object at the end of the program. It won't make a difference for you in IDLE, but it does make a difference for me when I run the programs automatically.

    There will be no IDLE output for this program.

  7. (20) Create a program that draws "something significant", such as a scene, a house, or a face, using the graphics library. Here are some guidelines to follow:
    • Use a variety of colors and several different types of shapes.
    • For symmetrical features (such as eyes or ears), remember to use the clone method to make a copy of the original shape. Then draw the cloned shape in the window and move it to the desired location.
    • Keep in mind that next week, we're going to animate part of your image, so that may influence what you want to make today.
    • You may want to use the setCoords method of the GraphWin object to adjust the coordinates of the window. (See the reference above for more information about setCoords.)

    Again, please add the calls to getMouse() and close() on your GraphWin object at the end of your program.

    Some previously created images to inspire you:

    Screen Capture: To save the image you created

      If you are in lab, click on "Activities" in the upper left and search for "Screenshot". Click on the "Screenshot" application.

      If you are remote, you will need to take a screenshot on your computer, and email it to me.

    • Select the "Grab the current window" option.
    • Click "Take Screenshot"
    • Click on your image. You gotta be quick! If it's not what you expect, click the left arrow button to go back. You can set a short delay to give you a little more time to move your mouse to the right window. Just make sure that you click on the image's title bar; otherwise, it might close.
    • Give the image a simple name, e.g, myHouse.png
    • Click the dropdown for "Save in folder", select "Other...". Click on cs111 and then click "Open". Save in folder should now say "cs111". Finally, click "Save".

    You've saved the image!

Objective: Creating a New Web Page (8)

It's time to revisit our web pages. Note that there are links in the directions for more info.

If you had errors/issues in your web page, fix them first.

  1. Open a new terminal. We want one terminal to be on a lab machine. The other terminal is going to be on the computer science department's web server.
  2. Go into your cs111 directory. Copy your screenshot from the lab machine to the computer science department's web server using:
    scp *.png username@cs.wlu.edu:public_html

    Instead of *.png, you can use the name of your file, specifically, e.g., myHouse.png

  3. ssh into the computer science department's web server using
    ssh -XY cs.wlu.edu

    You don't need to include your username because it's the same.

    You are now in your home directory of the web server. View the contents of your home directory. You should see your public_html directory that you created in a previous lab.

  4. Go into your public_html directory.
  5. Confirm that you copied your image into this directory. (How?)
  6. Copy your index.html file into a file called lab2.html, still in the public_html directory (i.e., not in a new directory)
  7. Open lab2.html in emacs.
  8. Modify the Lab 2 web page to have an appropriate title, heading, and information about the image you created during this lab.
  9. View your lab2 web page in the browser. Recall the URL for this page. You may want to review the lab when we made the web pages.
  10. Modify your Lab 2 web page to display the image you created.
  11. Clean up your Lab 2 page so that it only contains the image, a link to your home page, and any appropriate text. In other words, get rid of the stuff that should only be on your index.html page.

    You want the link back to your home page in case someone gets to your page from a search engine, and they want to learn more about the artist!

  12. Modify your index.html page to link to your Lab 2 web page.
  13. Verify your web pages look correct in a browser.

Finishing up: What to turn in for this lab

Review the Unix commands for submitting your lab.

Note that each command below links to a page with more information about using the command.

  1. Make sure you're in your lab2 directory.

    Clean up

    1. Some text editors make backup files and appends "~" to the name of your file. Delete any "~" files from your lab directory.
    2. Move graphics.py out of your lab2 directory and into your cs111 directory. (See mv. Note where the cs111 directory is with respect to where you're running this command from.)
    3. Delete any image files that are in your lab2 directory because they'll screw up your printing.

    In other words, at this point, your lab2 directory should only have the .py files you wrote, the .out files you created, and a __pycache__ directory in your directory when you print. (The latter is not printed.)

  2. Now, go into your cs111 directory.
  3. Create the printable lab assignment, using the command:
    createPrintableLab <labname>

    The file will be in your cs111 directory.

    If you see a message about an "unescaped sequence", that probably means you still have an image in the lab3 directory. Remove the image from the directory and repeat this step.

  4. View your file using the evince command. The file should be in your cs111 directory (e.g., ~/cs111/lab2.pdf). It should only be a few pages. If there are issues with your printout (most commonly, images or graphics.py in your lab2 directory), go back and fix them.
  5. Print out your lab submission. In evince, select the print icon and choose to print to HPLaserJetIntroLab
  6. Write out and sign the honor pledge on the print out. Staple all pages together.
  7. Move graphics.py back into your lab2 directory after printing.
  8. Submit your lab2 directory for grading by running the turnin lab2 command. If you have every thing set up correctly, this will copy your lab2 directory into your turnin directory so that you and I (only) can see your submission. If you run the turnin script again, it will copy the current directory and create a backup of the previous submission.

Labs are due at the beginning of Friday's class. The electronic version should be in the turnin directory before 9:40 a.m. on Friday.

Ask well before the deadline if you need help turning in your assignment!

Grading (100 pts)