CSC111 Lab 11

From dftwiki3
Revision as of 18:13, 15 April 2010 by Thiebaut (talk | contribs) (Get the graphics.py module on your local Mac)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search





Today we work in Mac OS mode!






This lab deals with classes, objects, and graphics in local mode. It builds on the examples we saw in class recently. It does not involve inheritance.

Fileicon-pdf.png
You may find the following document describing the different graphic objects introduce in the Zelle's textbook useful.






Working on the Local Mac

Today you are going to work with large images, which will make our python programs very slow if they run on beowulf and display images on your Mac. All the pixels have to travel over the network from beowulf to your Mac. Instead you are going to login using your 111c-xx account to the Mac in front of you. You'll develop your program on the Mac, run them on the Mac, and display the graphics on the Mac. The only drawback is that your program and image files will be on the Mac and not in your beowulf account. You will be shown at the end of the lab how to transfer them to your 111c-xx account.


  • Open two terminal windows. Make them different background colors.
  • In the first window, which we'll call the beowulf terminal, ssh to beowulf using your 111c-xx account
  • In the other window, which we'll call the local terminal, don't do anything

Get the graphics.py module on your local Mac

  • in the local terminal, use emacs to create the file graphics.py. It will contain Zelle's graphics library.



  • Save the file and exit emacs.


  • Check that graphics.py is on your local Mac:
   ls -l
   total 64
   drwx------+  6 111c  24100    204 Apr 14 12:38 Desktop
   drwx------+  8 111c  24100    272 Apr 14 12:38 Documents
   drwx------+  5 111c  24100    170 Apr 14 12:38 Downloads
   drwx------+ 42 111c  24100   1428 Apr 14 12:38 Library
   drwx------+  4 111c  24100    136 Apr 14 12:38 Movies
   drwx------+  3 111c  24100    102 Apr 14 12:38 Music
   drwx------+  3 111c  24100    102 Apr 14 12:38 Pictures
   drwxr-xr-x+  4 111c  24100    136 Apr 14 12:38 Public
   drwxr-xr-x+  5 111c  24100    170 Apr 14 12:38 Sites
   -rw-r--r--   1 111c  24100  28760 Mar  3 13:30 graphics.py
  • You can now develop your python programs in the local terminal the exact same way you were on beowulf.

Fish (Reported from Lab 10)


  • See all the fish? Make a note of the name of one of the fish, and get a copy of its file in the local terminal.
  lwp-rget http://maven.smith.edu/~111c/fishxx.gif             (replace xx by the actual number of the fish you want)


  • Verify that the fish file is not in your directory, in the local terminal.


  • Write a new graphics program and copy/paste the following code in it:


.

from graphics import *
H = 400
W = 400

def waitForClick( win, message ):
    """ waitForClick: stops the GUI and displays a message.  
    Returns when the user clicks the window. The message is erased."""

    # wait for user to click mouse to start
    startMsg = Text( Point( win.getWidth()/2, win.getHeight()/2 ), message )
    startMsg.draw( win )    # display message
    win.getMouse()          # wait
    startMsg.undraw()       # erase


def main():
    global H, W
    win = GraphWin( "Fish Tank", W, H )
    waitForClick( win, "click to start" )

    fish = Image( Point( W/2, H/2 ), "fish15.gif" )  # replace 15 by the number of your fish
    fish.draw( win )

    waitForClick( win, "click to end" )
    win.close()

main()

 
.


  • Add a for loop and make the object fish move by dx, dy some fixed number of steps...


  • Create a an new class which is a fish, with its own file name, and its own dx (and maybe dy).


  • Create an object issued from the class. Verify that you can make the object move on the screen.


  • Create a school of several fish (the same fish replicated several times is fine for this exercise) that move around the screen. The fish may move in opposite directions, but we'll assume that all fish move in the direction of where their head points to!!!


  • In case your fish move too fast, look at the sleep() function in the time module. It allows you to pause for some fraction of seconds while going through the loop... It could be useful to slow things down...


  • Make the fish go up or down, slightly, randomly, as it moves forward...

Mirror Image of a Fish

  • If you have a fish that has its head to the left and you want to have the same image, but the mirror image with the head to the right, you can flop the image, as follows:


      convert  fish15.gif  -flop  fish15b.gif
  • Now fish15b.gif is the mirror image of fish15.gif.
  • The command should be available on the iMacs (to be verified), and allows you go mirror any image, in the horizontal direction.

Aquarium

In this section you will apply a background image to the window. It will be the image of a fish tank, and you will make your fish move about in the tank.

The steps will be:

  1. get the image of the tank
  2. find the image dimension
  3. define a graphics window with the same dimensions
  4. paste the tank image on the graphics window
  5. display a fish in the window
  6. move the fish around...




Tank2.gif




  • Get a copy of this image to the local terminal
  lwp-rget  http://cs.smith.edu/~111c/tank2.gif
  • Find the image dimension.
  identify  tank2.gif

the output will be something like:
  tank2.gif GIF wwwxhhh wwwxhhh+0+0 8-bit PseudoClass 256c 261kb 
  • Note the www and hhh integers, representing the width and height of the image.


  • Modify your python program and make the graphics window as wide and as high as the image.


  • Paste the image on your window as a background image:
   H = hhh   # use the same number as above
   W = www  # use the same number as above
  
   win = GraphWin( "111c-xx Aquarium", W, H  )
   background = Image( Point( W/2, H/2 ), "tank2.gif" )
   background.draw( win )


  • Verify that you get a nice aquarium and fish!

Your own aquarium

Aquarium3.gif
  • Use Google and search for other images of aquariums that you can use instead of tank2.gif. Use the advanced search feature to select only GIF files (or specify "aquarium filetype:gif" in the search bar).


  • Once you have the image showing by itself in the browser, full size, copy its URL.


  • At the Linux prompt, in the terminal window, type:


   lwp-rget  http://theUrlOfTheGifFileYouWantToGet.gif


  • Verify that your directory now contains a new gif file.


   ls -ltr 


  • To see it on the screen, try


   display yourFileName.gif
(It is possible that this command may not work... But give it a chance to run, as it takes a while to open up the image)


  • Repeat the steps of the section above to paste the aquarium into your graphics window.

Copying the Files from the Local Mac to your Beowulf Account

  • The simplest for right now is to mail your programs to yourself, as follows:
     mail yourname@smith.edu < lab11.py                (replace lab11.py by the actual name of your program)
  • Verify that you have the programs in your mailbox.


  • You're done!