MIS 3371 Fall 2018 Exam 2 Parks

Last Name, First Name _____________________________________________________ Last 4 digits of PSID _____________

 1. (50 points) The textarea shown to the left contains data on awards given to company employees each of the past twenty years. The DTD for the data is shown below. 
<?xml version="1.0"?>
<!DOCTYPE companyAwards [      
<!ELEMENT companyAwards(year+)>
<!ELEMENT year (yearValue,employeeName+)>   
<!ELEMENT yearValue (#PCDATA)>              
<!ELEMENT employeeName (#PCDATA)> 
<]>
When the "Execute p1" button is clicked:
  1. roll the XML data into a 20 row 2 column table. The first column contains the year value. The second column contains the employee names who received awards in that year (place each employee name on a line by itself)
  2. after the table, report the year with the greatest number of employee awards and the number of awards in that year
  3. also report the total number of awards shown for all years
  4. place: the table; the year with the maximum awards and the number; and the total number of awards in the DIV with id="p1_out"
Notes:
The number of years for the outer loop is: root.childNodes.length
The yearValue is: root.childNodes[i].childNodes[0].childNodes[0].nodeValue
The employee loop is: for (j=1;j<root.childNodes[i].childNodes.length;j++)
The employeeName is: root.childNodes[i].childNodes[j].childNodes[0].nodeValue

Provide NO table heading row. Assume the code to load the XML data from the textarea into root object in javascript has already been written. (Don't write this code. just start using root). Show no HTML. Show only the javascript for p1.

This is the DIV with id='p1_out'


id="g1"Fuel top left width & height
id="g2"Temp top left width & height
id="g3"Voltstop left width & height
id="g4"Oil top left width & height
id="g5"Speedtop left width & height
id="g6"RPM top left width & height

      
 2. (50 points) The DIV block to the left contains the square images for six gauges. This DIV is 200 pixels tall and 400 pixels wide. When the "refresh" button is clicked, the function p2 is executed. The table shown below and to the left contains:
      1. a form named "f2"
      2. three textboxes for each of the six images' top, left
         and width properties.
When the "refresh" button is clicked, the function named p2 sets the top, left and width style properties for each of the six images. The values in the textboxes are:

      document.f2.elements[ some_integer ].value

where some_integer ranges from 0 to 17.
The form elements 0,1 and 2 (i.e., the textboxes) refer to top, left and width/height for the 1st image, elements 3,4,and 5 refer to top, left and width/height for the 2nd image, etc.). The six images have "id" values as shown in the first column of the table. Use:

      document.getElementById( id_value ).style.property

where id_value are the six strings: "g1", "g2", "g3", ... , "g6"
The .property values to be used are: top, left, and width/height. You will need to reset all 18 property values (six top, six left and six width/height). Remember to convert integer property values to strings and add the "px" suffix.
Note: setting width or setting height is sufficient. You need not set both.
Show no HTML. Show only the javascript for p2.