This site applies only to CMPT 165 C1 (Distance Ed) in Spring 2011. See the CMPT 165 sections page for other sections.

Dice in a hand In this assignment, you will create an interactive web page using Python web scripts. The pages you create will implement a simple “dice” game.

The game itself is very simple:

  1. The user makes a bet on the next throw of the dice.

  2. The user throws one die, and so does their opponent.

  3. If the user's die is higher than their opponent's, they win their bet. If it's lower, they lose their bet. If the two dice are the same, the user wins double their bet.

This “game” will be played online. If you're not clear on how the game is played (or of any other details later on), have a look at an example working dice game.

Be sure to test your (partially completed) game regularly: at least after each of these steps.

Step 1: The Form

Create an XHTML form that asks the user for their name and their bet. It should also have a submit button.

The “action” of this form should be the Python program you create in the next step.

Step 2: Program Basics

Create a Python web script that reads the input from the form in the previous step. Start by generating these fragments of the output (replacing the values the user entered and wrapping it in appropriate XHTML markup, of course):

Thanks for playing, Name. Your roll:
Your opponent's roll:

You can add the code for the later steps into this skeleton.

Step 3: Rolling the Dice

Rolling dice is basically a way to generate random numbers from 1 to 6. We can simulate this with a computer program by just coming up with some randomly generated numbers. Before you can do this, you will have to import the Python module that contains random number functions:

import random

Then to generate a random number from a to b, use its randint function:

die = random.randint(a,b)

Use this function to generate the values of the user's and the opponent's dice. Just print out the numbers for now—we will worry about the dice images later. Create output like this (assuming the dice roll 3 and 2—you should display the randomly generated numbers that change with each play):

Thanks for playing, Name. Your roll:
3
Your opponent's roll:
2

(You can do the next two steps in either order.)

Step 4: Winning and Losing

You should now have both die values in separate variables. You now have to check who won. Use an if statement to output whichever of these statements is appropriate:

You win $bet!
You lose $bet.
You win double! $bet×2

Of course, you should substitute the value the user bet in the first two, and twice that in the last. You can assume the user bet an even number of dollars (i.e., that the input is an integer with no decimal part).

Step 5: Dice Images

If you are generating the random numbers and just printing them (as suggested above), you should at this point be able to tell that your game is working: random numbers from 1 to 6 are generated, and they are checked to see who won. But, it doesn't look like a dice game yet.

Fortunately, once we have the random numbers, displaying the corresponding images is fairly easy. Remember: we're generating XHTML in the program, and all you have to do to display an image in XHTML is use the <img> tag.

You can download and use the provided dice images.

If the random number generated is 2, you would want to create XHTML like this:

<img src="dice-2.gif" alt="2" width="107" height="107" />

So, for each die, you need to generate the random number (which you should already be doing), and then print a line like the above with the generated number substituted in the file name and alt text.

Validation

The XHTML code that your program generates should be valid XHTML. You can check this in one of two ways.

When your game is online and functioning, you can copy and paste the URL with the query string to the validator. In the working example, the URL would be something like this:

http://cmpt165.csil.sfu.ca/~ggbaker/demos/dice-vs/dice.py?name=Your%20Name&bet=20

The other option is to play the game, view the page source in your browser, and copy and paste this into the “enter HTML code directly” option in a validator.

Submitting

Upload all of your files to the course web server: XHTML and Python, with all images and stylesheets. Test the game on the server to make sure it's working.

When you're done, submit the URL of the front XHTML page (with the form) to the Course Management System.

The dice images have been converted from SVG images distributed with Gnome Games. They can be redistributed under the terms of version 2 of the GNU General Public License (and are for this assignment). The dice-in-hand image is used with permission.