HW 7

in-class section: due 5/17 (by midnight)
DL section: due 5/18 (by midnight)

1. [Escher.html, 20pt] Modify the example escher.html (the original version we started with in the lab, the other versions are online as well, see the class web-page) so it works as follows:

• clicking on one of the small pictures brings up a larger version of the picture below the top three pictures (in the lab we did onMouseOver instead)

• when double-clicking on any of the small pictures, the large picture should turn back to the empty picture (http://condor.depaul.edu/~mschaefe/pictures/square1.gif)

2.[Tracing, 15pt] Tracing a program means writing down the current value of each variable before and after each step taken by the program. Here is a small example, suppose our program is:

var x,y,z;

x = 10;
y = 20;
z= (x+y)/2;
if (2*x > y) {
   z = z + 1;
}
else {
   z = z - 1;
   x = x - 1;
}

We follow the program flow step by step recording the value of each variable; if there is a conditional (if and else), we follow the branch of the conditional statement which is true;. below is an example; the current values of the variables are interleaved with the program (and in red, to set them off from the rest of the program).

var x,y,z;

  [x = undefined, y = undefined, z = undefined]
x = 10;
  [x = 10, y = undefined, z = undefined]
y = 20;
  [x = 10, y = 20, z = undefined]
z= (x+y)/2;
  [x = 10, y = 20, z = 15]
if (x > 3*y) {
   z = z + 1;
}
else {
    [x = 10, y = 20, z = 15]
   z = z - 1;
    [x = 10, y = 20, z = 14]
   x = x - 1;
    [x = 9, y = 20, z = 14]
}
  [x = 9, y = 20, z = 14]

var item_cost, nr_items, cost, item_shipping, tax_rate

item_cost = 11; // the cost per item
nr_items = 5; // the number of items bought
item_shipping = 2; // the cost of shipping per item
tax_rate = 7; // the sales tax

cost = nr_items * item_cost; // total cost of items
cost = cost * (1 + tax_rate/100); // total cost of items with tax 
if (cost < 100) {
   // if the cost is less than $100 charge shipping per item 
   cost = cost + nr_items * item_shipping;
}
else {
   // otherwise charge flat shipping rate of $10
   cost = cost + 10;
}

var item_cost, nr_items, cost, item_shipping, tax_rate

    [item_cost =     , nr_items =     , item_shipping =     , tax_rate =     , cost =      ]
item_cost = 11; // the cost per item
    [item_cost =     , nr_items =     , item_shipping =     , tax_rate =     , cost =      ]
nr_items = 5; // the number of items bought
    [item_cost =     , nr_items =     , item_shipping =     , tax_rate =     , cost =      ]
item_shipping = 2; // the cost of shipping per item
    [item_cost =     , nr_items =     , item_shipping =     , tax_rate =     , cost =      ]
tax_rate = 7; // the sales tax
    [item_cost =     , nr_items =     , item_shipping =     , tax_rate =     , cost =      ]

cost = nr_items * item_cost; // total cost of items
    [item_cost =     , nr_items =     , item_shipping =     , tax_rate =     , cost =      ]
cost = cost * (1 + tax_rate/100); // total cost of items with tax 
    [item_cost =     , nr_items =     , item_shipping =     , tax_rate =     , cost =      ]
if (cost < 100) {
   // if the cost is less than $100 charge shipping per item 
   cost = cost + nr_items * item_shipping;
}
else {
   // otherwise charge flat shipping rate of $10
   cost = cost + 10;
}
    [item_cost =     , nr_items =     , item_shipping =     , tax_rate =     , cost =      ]

3. [Income tax, 15pt] In class we did a flow-chart for computing the income tax with itemized and standardized deductions. Redo the flow-chart adding the following check at the end (after computing taxable income and before computing taxes due): if the taxable income (computed as income - deduction) is less than zero, then the taxable income should be set to zero. Modify tax1.html to include this check. Test your program by running it on income = 2000, itemized deduction = 3000. The taxable income and the tax due should be zero in this case. For this problem include your flowchart on your web-page (as a scanned page or using HTML or some other format) as well as your new tax program.

4. [Extra Credit] Finish the tossing a coin example we started on in class. You want a web-page showing two pictures of a coin: heads and tails; there also should be two counters, one for heads one for tails. Every click on the tails picture should increase the tails counter and every click on heads should increase the heads counter.

5. [Extra Credit] Extend your program for part 1 (Escher) as follows: when clicking on the large picture, double it's size. When double-clicking on it, it should go back to normal size. (Figuring out how to change the size of the picture is part of the problem.)