/*
www.newnhamscouts.org.uk

Newnham Scouts Website knots-xmlhttp-script
by Ian Horsley 2006 
ian@newnhamscouts.org.uk

*/

// executed automatically when a message is received from the server
function handleServerResponse()
{
   // move forward only if the transaction has completed
   if (xmlHttp.readyState == 4)
   {
      // status of 200 indicates the transaction completed successfully
      if (xmlHttp.status == 200)
      {
         // extract the XML retrieved from the server
          xmlResponse = xmlHttp.responseXML;
		 // obtain the document element (the root element) of the XML structure
          xmlDocumentElement = xmlResponse.documentElement;
         // get the text message, which is in the first child of
         // the the document element
          //knot_name = xmlDocumentElement.getElementsByTagName('knot_name').data;
          //helloMessage = xmlDocumentElement.firstChild.data;
          knot_name = xmlDocumentElement.getElementsByTagName('knot_name')[0].firstChild.data;
          //knot_image = xmlDocumentElement.getElementsByTagName('knot_image')[0].firstChild.data;
          knot_about = xmlDocumentElement.getElementsByTagName('knot_about')[0].xml;
		if(xmlDocumentElement.getElementsByTagName('image_path')[0].firstChild){
			image_path = xmlDocumentElement.getElementsByTagName('image_path')[0].firstChild.data;
			document.getElementById("contentimage").innerHTML = '<img src="'+ image_path +'" width="209" alt="'+knot_name+'" title="'+knot_name+'" />'+ knot_name;
		}

          if(xmlDocumentElement.getElementsByTagName('stages')[0]){
			  stage_html = '</i><strong>Tying the knot</strong><i>';
	          stages = xmlDocumentElement.getElementsByTagName('stages')[0].childNodes.length;
          
	          for(var x = 0; x < stages; x++){
				instruction = xmlDocumentElement.getElementsByTagName('stages')[0].childNodes[x].firstChild.firstChild.data;    
				photo = xmlDocumentElement.getElementsByTagName('stages')[0].childNodes[x].lastChild.firstChild.data;    
				stage_html = stage_html + '<DIV class=\"instruction\"><DIV><IMG src=\"' + photo + '\"></DIV>' + instruction + '</DIV>\n';
			  }
		  }
		  else stage_html = '';
         // update the client display using the data received from the server
		 document.getElementById("contentdetail").innerHTML ='<p class=first><strong>' + knot_name + '</strong></p>' + knot_about + stage_html;
      }
      // a HTTP status different than 200 signals an error
      else
      {
         alert("There was a problem accessing the server: " + xmlHttp.statusText);
      }
   }
}