EXAM 2 MIS 3371 Parks Spring 2017

NAME___________________________________________________________________ LAST 4 PSID __________________

1. (50 points) The textarea to the left contains the rosters for the two 2016 Major League Allstar teams (American League and National league) organzized in XML with to the following DTD:
     <DOCTYPE allstars [
     <ELEMENT allstars(league+)>
     <ELEMENT league(leaguename,team+)>
     <ELEMENT leaguename(#PCDATA)>
     <ELEMENT team(teamname,players+)>
     <ELEMENT teamname(#PCDATA)>
     <ELEMENT players(name,position)>
     <ELEMENT name(#PCDATA)>
     <ELEMENT position(#PCDATA)>]
When the button labelled execute p1 is clicked the javascript function named p1() is executed. Assume this function loads the XML from the textarea (DO NOT write this part. Assume root is the <allstars> tag). This function then produces:
  • two rosters -- one for the "American" League and one for the "National" league. These rosters will appear in a table with a single row with two cells (the first cell contains the "American" league roster (a table) and the second cell contains the "National" league roster (a table).
  • each roster is a table containing two columns:
    • the leaguename is in the first row centered across the two columns
    • a row for each team containing two columns:      
      1. the teamname in the first column      
      2. a list of players on team in the second column:               
      (name followed by position each on a line by itself)
  • following the tables show the teamname with the largest number of allstar players.
  • place the results in a DIV block with id="p1out". Show only the javascript for p1
           [this is the DIV with id='p1out']
Problem 1 (continued) The following definitions apply:
     league loop:   for ( i=0; i < root.childNodes.length; i++ )
     team loop:     for ( j=1; j < root.childNodes[i].childNodes.length; j++)
     players loop: for ( k=1; k < root.childNodes[i].childNodes[j].childNodes.length; k++)
     leaguename: root.childNodes[i].childNodes[0].childNodes[0].nodeValue
     teamname:   root.childNodes[i].childNodes[j].childNodes[0].childNodes[0].nodeValue
     name:           root.childNodes[i].childNodes[j].childNodes[k].childNodes[0].childNodes[0].nodeValue
     position:       root.childNodes[i].childNodes[j].childNodes[k].childNodes[1].childNodes[0].nodeValue
Rosters from: http://m.mlb.com/news/article/188241564/2016-mlb-all-star-rosters/


2. (50 points) The textarea to the left is named ta2 and is in a form named f2. The textarea contains information to be placed placed in a crossword puzzle containing 169 squares (13 lines of squares each with 13 squares -- this is NOT a table). The data is divided into 13 groups separated by a semicolons. Each group contains 13 characters to be placed in a line of 13 squares. The "#" character indicates black squares and the letters are to be placed in white squares. Each square is made with DIV block that starts with the following string named startdiv [use -- but DO NOT write this string]:

start_div = "<DIV style='position:absolute;border:solid black 1px;margin:0px;width:18px;height:18px;padding:6px 1px 1px 6px;font-weight:bold;font-size:14px;";

Squares on the 1st row have top:0px, the 2nd row have top:20px;, 3rd row have top:40px; etc.
Squares in the 1st column have left:0px;, the 2nd columns have left:20px;, the 3rd columns have left:40px;, etc.
Append these top and left values to the start_div.
For squares that are to contain a letter:
   Append background-color:white; to the style attributes and end the beginning DIV tag.
   Append an uppercase version of the letter (use .toUpperCase() ) and then place the ending DIV tag.
For squares which are to be black (i.e., the data is "#"):
   Append background-color:black; to the style attributes and end the beginning DIV tag.
   Append the "#" and then place the ending DIV tag.
Place the 169 DIV blocks into the DIV with id="p2out". Show no HTML. Show only the javascript for p2
Puzzle from: https://www.boatloadpuzzles.com/playcrossword
         [this is the DIV with id="p2out"]