Stuff

<html>
<style type="text/css">
<!--
.backStyle {
        position: absolute;
        width: 269px;
        height: 250px;
        left: 0px;
        top: 0px;
        z-index: 0;
        visibility: visible;
}

.textStyle {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #000000;
        position: absolute;
        z-index: 1;
        left: 67px;
        top: 68px;
}

.inputStyle{
        position: absolute;
        z-index: 2;
        left: 67px;
        top: 87px;
        visibility: visible;
}

.outputStyle{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 10px;
	position: absolute;
	z-index: 1;
	width: 200px;
	Height: 45px;
	left: 68px;
	top: 115px;
}
.outputStyleFrame{
        font-family: Arial, Helvetica, sans-serif;
        font-size: 10px;
	position: absolute;
	z-index: 1;
	width: 180px;
	Height: 75px;
	left: 0px;
	top: 0px;
}

A:link{
	color: black;
	text-decoration: none;
}
A:visited{
	color: black;
	text-decoration: none;
}
A:active{
	color: black;
	text-decoration: none;
}
A:hover{
	color: black;
	text-decoration: none;
}

iframe {
	background-color: transparent;
}

-->
</style>

<script language="javascript">
var xmlhttp=false;

if (!xmlhttp && typeof XMLHttpRequest!='undefined') {

	try {
      xmlhttp = new XMLHttpRequest();
    } catch (e) {
      xmlhttp = false;
    }

}

function loadDoc(docname) {

	if (xmlhttp) {
	
	xmlhttp.open("GET", docname,true);
	 xmlhttp.onreadystatechange=function() {
	  if (xmlhttp.readyState==4) {

		if (xmlhttp.responseXML == null) {
			var parser = new DOMParser();
			var myXml = parser.parseFromString(xmlhttp.responseText, "text/xml");
		} else {
			var myXml = xmlhttp.responseXML;
		}
		var nameArray = myXml.getElementsByTagName('fileName');
		var displayNameArray = nameArray
		var recipeType = myXml.getElementsByTagName('type');
		var typeFolder = recipeType[0].firstChild.nodeValue;

	     function writeArray() {
		var returnString = '';
		for(var i = 0; i < nameArray.length; i++)
		{
		   var displayName = nameArray[i].firstChild.nodeValue;
 		   returnString += '<li> <a href="http://linux.lifeware.com/mark/ToolSweet.wdgt/recipes/' +typeFolder+ '/' +nameArray[i].firstChild.nodeValue+ '" style="">' +displayName.replace(/.doc/,"")+ '</a></li>\n';
		}
		var resultsFrame = document.getElementById('myFrame');
                var doc = resultsFrame.contentDocument;
                if (doc == undefined || doc == null)
                    doc = resultsFrame.contentWindow.document;
                doc.open();
                doc.write('<html>\n<style type="text/css"><!-- body {background-color: transparent;}A:link{text-decoration:none;color:black;}A:visited{color: black;text-decoration: none;}A:active{color: black;text-decoration: none;}A:hover{color: black;text-decoration: none;}li{line-height:12px;font-size:11px;font-family="arial,Helvetica,sans-serif";margin-left:0;} --></style>\n<body>\n<p>\n');
                doc.write(returnString);
                doc.write('</p>\n</body>\n</html>');
                doc.close();       

                document.getElementById('myFrame').style.visibility="visible";
	     }	   
		   document.getElementById('myFrame').innerHTML = writeArray();

	  }
	 }
	 xmlhttp.send(null)

	 }

}


</script>

<body>
<div id="BackgroundLayer" class="backStyle">
  <center>
        <img src="./default.png" width="269" height="250">
  </center>
        <div id="TextLayer" class="textStyle">

                <div align="center">Search for Recipes:</div>
        </div>
</div>

<div id="InputLayer" class="inputStyle">
	<form action="http://mark.boycommathat.com/test.php" method="get" name="recipeType">
	 <select name="type" id="recipeName" onChange="loadDoc('http://mark.boycommathat.com/test.php?type='+this.value)" size="1" border="0">
	  <option value="null" selected> </option>
	  <option value="appetizer" name="appetizer">Appetizers</option>

	  <option value="lunch" name="lunch">Lunches</option>
	  <option value="dinner" name="dinner">Dinners</option>
	  <option value="dessert" name="dessert">Desserts</option>
	 </select>
	</form>
</div>

<div id="OutputLayer" class="outputStyle">
<iframe allowtransparency="true"  id="myFrame"  frameborder="0"  vspace="0"  hspace="0"  marginwidth="0"
marginheight="0"  width="100"  scrolling=auto height="100"
 class="outputStyleFrame" 
style="visibility:hidden"></iframe>

</div>





</body>
</html>