CSci 1101 Problem set 2

CSci 1101 Problem set 2. Due Tuesday Feb 21 at 10pm

Question 1

On the course blog post a comment to my post asking for two examples of well-designed web pages. Explain briefly what you liked about these pages. Feel free to comment on other students' suggestions.
Recall that your login name for wordpress is your last name, and your password is what it used to be on rynite before you reset it. You can chose a nickname for your post, just make sure that it's clear to others in the class who you are.

Question 2

You are given the following file with HTML and PHP code:


<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
Author: Elena Machkasova elenam@morris.umn.edu
Last modified: 2/7/06
-->
<?php
$color1 = "orange";
$color2 = "darkred";
?>
<html>
<head>
<title>
Alternating colors example
</title>
</head>
<body>
<ol>
<li>List element</li>
<li>Another list element</li>
<li>And another one</li>
<li>Finally, the last one</li>
</ol>
</body>
</html>

Copy-paste this code into a PHP file.
Add PHP code so that the text color of the list elements alternates between the two colors specified in the variables $color1 and $color2. Make sure that you are using the color variables, not the colors themselves. Upload your file into your public_html on rynite (or, better yet, its subfolder). Test your program. Correct mistakes if any.
Change the values of the two variables $color1 and $color2 to any other colors. Do not change anything else in the program. Upload the changed file and make sure that the list elements are now of the new colors.

Question 3

Your task is to write a PHP program that displays results of voting for two candidates as color bars of three different colors. The names of the candidates and the number of votes for each candidate are set in variables in the beginning of the program.

The code also shows a sample of displaying a color bar followed by the name of a candidate. The width of the color bar, the name of the candidate, and the votes are all fixed in the example, you need to change this so that all of them depend on the variables (for instance, if the number of votes changes from 15 to 20 in $votes1, the width of the color bar is automatically set to 100px). You also need to add another table to display the votes for the other person.

Format the page any way you like. Add a header to explain what the page is about.
Note that padding property for <td> in the embedded style sheet. Feel free to change it if you prefer a different formatting.

Make sure to check your page for several different names and numbers of votes.


<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
Author: Elena Machkasova elenam@morris.umn.edu
Last modified: 2/9/06
-->
<?php
$name1 = "Bart Simpson";
$name2 = "Lisa Simpson";
$votes1 = 15;
$votes2 = 12;
?>
<html>
<head>
<title>
Voting results
</title>
<style type="text/css">
td {padding: 3px}
</style>
</head>
<body>
<table>
<tr>
<td style="background: blue; height: 20px; width: 75px;" />
<td>
Bart Simpson 15
</td>
</tr>
</table>
</body>
</html>

Question 4

In the voting program in the previous question print out the name of the winner. If it's a tie, print out both names and a message saying that they got equal number of votes.

Question 5

Recall the program hours.php that prints a greeting based on the time of the day (the lecture examples are posted here). Change the program so that it prints out the time in a standard am/pm format. For instance, if the input is 13, the program should print 1pm. If the input is less than 0 or greater than 23, the program should print "Invalid time".

Question 6

You are given a PHP file that displays a table:


<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
Formatting a table in PHP
Author: Elena Machkasova elenam@morris.umn.edu
Last modified: 2/15/06
-->
<?php
$row = $_GET["input1"];
$column = $_GET["input2"];
$color = "lightgreen";
$r = 0;
$c = 0;
?>
<html>
<head>
<title>
Setting a table background to a specific color. 
</title>
</head>
<body>
<h3>
<?php print "Column $column in row $row of this table must be $color"; ?>
</h3>
<table border="2">
<tr <? $r++ ?> >
<td <? $c++ ?> >
<? print "row $r column $c\n"; ?>
</td>
<td <? $c++ ?> >
<? print "row $r column $c\n"; ?>
</td>
<td <? $c++ ?> >
<? print "row $r column $c\n"; ?>
</td>
</tr>
<tr>
<td>
TEXT 
</td>
<td>
TEXT 
</td>
<td>
TEXT 
</td>
</tr>
<tr>
<td>
TEXT 
</td>
<td>
TEXT 
</td>
<td>
TEXT 
</td>
</tr>
</table>
</body>
</html>

Copy the code into a file table.php and upload it on rynite. Check what the program displays. Note that it takes two inputs, input1 and input2.
In the rows and columns that display TEXT set php code to display the row and column number, similar to the first row. Upload the file to rynite, make sure it works as expected.
Add an if/else statement to each cell (copy/paste helps!) to set the background of the cell whose number is given by the variables $row and $column to the color in the variable $color. Upload your file, check it for several values of the inputs. If the $row or $column are not in the table, no table cell should be colored.

Testing and submitting your code

A form that generates some test cases for your programs (starting at question 3, since the first two programs don't require numbers as input) is located here: http://rynite.morris.umn.edu/csci1101/testing_form.html. Choose the problem number, enter your login name in lowercase letters and the path to your file from your public_html, then click Submit. Make sure that your program gets input as shown in the cascading if/else example here. If your program takes one input, its name is "input", if it takes two inputs, their names are "input1" and "input2".
To submit your programs, make sure that your current version is uploaded to rynite and send me an e-mail that lists all the file names and their locations.

This page is a part of CSci 1101 course web site.