]> HOUSE OF WESSEX Egbert802-839 Aethelbald 855-860 Aethelbert 860-866 Aethelred 866-871 Alfred the Great 871-899 Edward the Elder 899-925 Athelstan 925-940 Edmund the Magnificent 940-946 Eadred 946-955 Eadwig (Edwy) All-Fair 955-959 Edgar the Peaceable 959-975 Edward the Martyr 975-978 Æthelred II (Ethelred the Unready) 979-1013 and 1014-1016 Edmund II (Ironside) 1016 DANISH Svein Forkbeard 1014 Cnut (Canute) 1016-1035 Harold I 1035-1040 Hardicnut 1040-1042 SAXONS Edward (the Confessor) 1042-1066 Harold II 1066 NORMANS William I 1066-1087 William II 1087-1100 Henry I 1100-1135 Stephen 1135-1154 Empress Matilda (Queen Maud) 1141 PLANTAGENETS Henry II 1154-1189 Richard I 1189-1199 John 1199-1216 Henry III 1216-1272 Edward I 1272-1307 Edward II 1307-1327 Edward III 1327-1377 Richard II 1377-1399 HOUSE OF LANCASTER Henry IV 1399-1413 Henry V 1413-1422 Henry VI 1422-1461 HOUSE OF YORK Edward IV 1461-1483 Edward V 1483 Richard III 1483-1485 TUDORS Henry VII 1485-1509 Henry VIII 1509-1547 Edward VI 1547-1553 Jane Grey 1553 Mary I 1553-1558 Elizabeth I 1558-1603 STUARTS James I 1603-1625 Charles I 1625-1649 COMMONWEALTH Oliver Cromwell 1649-1658 Richard Cromwell 1658-1659 STUARTS (restored) Charles II 1660-1685 James II 1685-1688 William III 1689-1702 Mary II 1689-1694 Anne 1702-1714 HOUSE OF HANOVER George I 1714-1727 George II 1727-1760 George III 1760-1820 George IV 1820-1830 William IV 1830-1837 Victoria 1837-1901 SAXE-COBURG-GOTHA Edward VII 1901-1910 WINDSOR George V 1910-1936 Edward VIII 1936-1936 George VI 1936-1952 Elizabeth II 1952 - present
MIS 3371 Parks Fall 2009 Final Answers

<XML id="kingsandqueens">
<?xml version="1.0"?>
<!DOCTYPE englishmonarchs [
<!ELEMENT englishmonarchs (royalfamily+)>
<!ELEMENT royalfamily (familyname,monarch+)>
<!ELEMENT familyname (#PCDATA)>
<!ELEMENT monarch (name,reign)>
<!ELEMENT name (#PCDATA)>
<!ELEMENT reign (#PCDATA)>
]>
<englishmonarchs>
<royalfamily>
<familyname>HOUSE OF WESSEX</familyname>
<monarch>
<name>Egbert</name><reign>802-839</reign>
</monarch><monarch>
<name>Aethelbald</name><reign>855-860</reign>
</monarch><monarch>
<name>Aethelbert</name><reign>860-866</reign>
</monarch><monarch>
<name>Aethelred</name><reign>866-871</reign>
</monarch><monarch>
<name>Alfred the Great</name>
<reign>871-899</reign>
.
...lotsa lines omitted
.
<royalfamily>
<familyname>SAXE-COBURG-GOTHA</familyname>
<monarch>
<name>Edward VII</name><reign>1901-1910</reign>
</monarch>
</royalfamily>
<royalfamily>
<familyname>WINDSOR</familyname>
<monarch>
<name>George V </name><reign>1910-1936</reign>
</monarch><monarch>
<name>Edward VIII</name><reign>1936-1936</reign>
</monarch><monarch>
<name>George VI </name><reign>1936-1952</reign>
</monarch><monarch>
<name>Elizabeth II</name>
<reign>1952-present</reign>
</monarch>
</royalfamily>
</englishmonarchs>
</xml>
1. (50 points) An XML file shown to the left organizes the kings and queens of England into their royal families; provides their names; and years of their reign. The DTD is shown at the top and a portion of the XML is shown (just the beginning and end with lots left out). When the "GO" button is clicked, a javascript function named p1is executed. This function produces a two column table that shows:
  1. a row for each "royal family name" in bold that spans two columns, followed by
  2. a row for each monarch with the "name" in the first column and the years of their "reign" in the second column
  3. this format is repeated for each "royalfamily"
  4. show the count of monarchs and royal families at the end of the table (as shown below)
  5. place the resulting table (stored as a string) in the DIV block with id="kings"
A portion of the output table is shown below:
HOUSE OF WESSEX
Egbert802-839
Aethelbald855-860
Aethelbert860-866
Aethelred866-871
Alfred the Great871-899
...lotsa lines omitted...
SAXE-COBURG-GOTHA
Edward VII1901-1910
WINDSOR
George V1910-1936
Edward VIII1936-1936
George VI1936-1952
Elizabeth II1952 - present
TOTALS
Monarchs65
Royal Families14
NOTES:

The number of royal familes is:
   0 to root.childNodes.length (range of outside i loop)

The royal family names are:
   root.childNodes(i).childNodes(0).text

The range of monarchs is from:
   1 to root.childNodes(i).childNodes.length
   (range of inside j loop)

The king or queen names are:
   root.childNodes(i).childNodes(j).childNodes(0).text

The reigns are:
   root.childNodes(i).childNodes(j).childNodes(1).text

Shown NO HTML.
Show only the javascript for p1.

b9yel.jpg b9red.jpg b9grn.jpg b9blu.jpg b9str.jpg b9org.jpg b9mar.jpg b9brn.jpg b9blk.jpg
2. (50 points) Assume there is an array named b with 9 elements (0 thru 8) that stores strings that contains img tags with the names of the nine square images shown to the left with height='50' (e.g., b(0)="<img src='b9yel.jpg' height='50'>"; b(1)="<img src='b9red.jpg' height='50'>";...; b(8)="<img src='b9blk.jpg' height='50'>"). This array is stored in a javascript function named p2. Assume the array and the string assignments already exist in p2 (i.e., don't write them down). Create a new page on-the-fly that positions the nine images into five rows. The table below shows the information needed to position the images. There are three arrays: n; lft; and tp defined in p2. Their values are shown below (again don't write them down -- assume they are in p2 already.
RowNumber of images in the row
stored in array elements n(0) thru n(4)		Left position of first image in the row
stored in array elements lft(0) thru lft(4)		Top position of all the images in the row
stored in array elements tp(0) thru tp(4)
1 1 50 0
2 2 25 50
3 3 0 100
4 2 25 150
5 1 50 200
The images (i.e., the strings) in the b array should be placed in span blocks with three style properties that specify: (1) "position:absolute"; (2) "Top"; and (3) "Left". Top and Left values are specified by the arrays: tp and lft. The images should be placed in the order they appear in b (i.e, b(0) on the first row; b(1) and b(2) on the second row, etc.). Each image is 50 pixels to the right of the previous image on the row. Use the following body tag: <body bgcolor='rgb(175,175,175)'>. NOTE: There is NO table on the new page -- just nine images.
Show NO HTML. Show only the javascript for p2. This button causes p2 to be executed.