function loadjscssfile(filename, filetype){
 if (filetype=="js"){ //if filename is a external JavaScript file
  var fileref=document.createElement('script')
  fileref.setAttribute("type","text/javascript")
  fileref.setAttribute("src", filename)
 }
 else if (filetype=="css"){ //if filename is an external CSS file
  var fileref=document.createElement("link")
  fileref.setAttribute("rel", "stylesheet")
  fileref.setAttribute("type", "text/css")
  fileref.setAttribute("href", filename)
 }
 if (typeof fileref!="undefined")
  document.getElementsByTagName("head")[0].appendChild(fileref)
}

function hasAttribute(element, attr) {
return typeof element.attributes[attr] != "undefined";
};


function changeLinks(id){

		//after an asynch page load, we need to go through the links
		//on that page and swap them out
		
		if(Effect.Opacity && Ajax.Updater){
		
		var divobj=$(id)
		
		var alist=divobj.getElementsByTagName("a") //array containing the A elements within DIV
	
		for (var x=0; x<alist.length; x++){ //loop through each A element

				if(alist[x].getAttribute("rel") && alist[x].getAttribute("rel") != "" && alist[x].getAttribute("rel").substring(0,8) != "lightbox"){//skip lightbox links
				
					alist[x].setAttribute("href", "#");
				
					alist[x].onclick=function(){
					
						browse(this.getAttribute("rel"), false);
						
					}//end onclick
				
					if(hasAttribute(alist[x], "rev")){
					
						alist[x].onclick=function(){
						
							browse(this.getAttribute("rel"), this.getAttribute("rev"));
						
						}//end onclick
					
					}//end if has rev
				
				}//end if has rel attr
				
			if(alist[x].className == 'pulse')
				{
					(alist[x]).onmouseover=function(){

						new Effect.Pulsate(this,{duration:2, from:.4, to:1, pulses:3});									
					
					}
				}
				
				if(alist[x].className == 'backbutton')
				{
				
					alist[x].onmouseover=function(){
				
						imgOn('button_back','.gif');
					
					}
				
					alist[x].onmouseout=function(){
				
						imgOff('button_back','.gif');
					
					}
				
				}
				
				if(alist[x].className == 'nextbutton')
				{
				
					alist[x].onmouseover=function(){
				
						imgOn('button_next','.gif');
					
					}
					
					alist[x].onmouseout=function(){
				
						imgOff('button_next','.gif');
						
					}
				
				}
				
		}//end inner for loop
		
		
	}//end if browse function supported
}//end function

function IsNumeric(sText)

{
   var ValidChars = "0123456789";
   var IsNumber=true;
   var Char;

   for (i = 0; i < sText.length && IsNumber == true; i++) 
      { 
      Char = sText.charAt(i); 
      if (ValidChars.indexOf(Char) == -1) 
         {
         IsNumber = false;
         }
      }
   return IsNumber;
   
   }

function browse(section,page,xargs){  // SG|extra xargs for map/index initialization

	//change the cursor and display the loading div
	document.body.style.cursor = 'progress';
	document.getElementById("navintransit").className = "loading-visible";

if(page){
	
		if(IsNumeric(page)){
	
			var url = '/exhibitions/water/includes/pages/content/' + section + '.php?page=' + page;
		
		}else{
			//alert(page);
			//var prev_ul=$('div_' + document.getElementById("section").innerHTML + '_body');
			
			if($('div_' + document.getElementById("section").innerHTML + '_body')){
			
				var li_list=$('div_' + document.getElementById("section").innerHTML + '_body').getElementsByTagName("li") //array containing the LI elements within the previous section UL
	
				for (var x=0; x<li_list.length; x++){ //loop through each LI element

					Element.removeClassName(li_list[x].getAttributeNode("id").value, 'selected');
								
					Element.addClassName(li_list[x].getAttributeNode("id").value, 'unselected');
						
				}//end turning off previous 
			
			}//end if 
			
			Element.removeClassName($('li_' + page), 'unselected');
								
					Element.addClassName($('li_' + page), 'selected');
			
			var url = '/exhibitions/water/includes/pages/content/' + page + '.php?section=' + section + '&page=' + page;
		
		}
		
	
	}else{
	
		var url = '/exhibitions/water/includes/pages/content/' + section + '.php';
		page = section;
		
	}
	
	if(url != $('status').innerHTML){
							
			$('status').innerHTML = url;
			
			/*need code to handle nav tracking*/

			new Ajax.Updater('standby', url, {method:'get', asynchronous: true, evalScripts: false, onSuccess: fadeOutIn(section, page, 'innercontent',xargs)});
    	
    	
		}//end if the clicked link doesn't lead to this same page
}//end function: browse

function fadeOutIn(section, page, div_id,xargs) {
	new Effect.Opacity
				(div_id, {to: 0.0, from: 1.0, duration: 0.4, afterFinish: function()
					{																										
						
						//this is sloppy
						//for some reason the two assignments break IE6
						//not necessary to get this working but nice to have
						/* SG|index:  actually, I do depend on these values getting set.
						if(!Prototype.Browser.IE){
						
							document.getElementById("sessionSection").value = section;
					  	document.getElementById("sessionPage").value = page;
						
						}
						*/
						// SG|index: jQuery seems to do it OK.
						//jQuery('#sessionSection').html(section);
						//jQuery('#sessionPage').html(page);
						
						
						if(IsNumeric(page)){
		
							var header_img_id = 'hd_gallery';
		
						}else{
		
							var header_img_id = 'hd_' + page;
							
						}
					
	if(!$(header_img_id)){//if we do not find the expected id, the page did not load and we will try a redirect 

							//alert('asynch fail');					
							window.location = "/exhibitions/water/?section=" + section + "&page=" + page;
							// SG|index:
							initializeIndex(section,page,xargs);
						
						}else{
						
							$(div_id).innerHTML = $('standby').innerHTML;
							
								changeLinks(div_id);	
								// SG|index:
								jQuery('#standby').empty();  // having duplicate IDs confuses everything...
								initializeIndex(section,page,xargs);

								new Effect.Opacity(div_id,{to: 1.0, from: 0.0, duration: 0.4, afterFinish: function(){document.body.style.cursor = 'default'; document.getElementById("navintransit").className = "loading-invisible";}});				
  						
						}
  				}
  			});

}//end function

function imgOn(id, extension) {
//alert(id);
	document.getElementById(id).src = '/exhibitions/water/graphics/' + id + '_over' + extension;

}

function imgOff(id, extension) {

	document.getElementById(id).src = '/exhibitions/water/graphics/' + id + extension;

}


function initialize() {
    var sessionSection = 
              document.getElementById("sessionSection");
    var sessionPage = 
              document.getElementById("sessionPage");
   
    var return_to_section = '';
    var return_to_page = '';
    
    if (sessionSection.value != "empty") {
    	
    	return_to_section = sessionSection.value;
    	
    	if (sessionPage.value != "empty") {
    	
    		return_to_page = sessionPage.value;
    		
    	}else{
    	
    		return_to_page = false;
    	
    	}

    	window.location = "/exhibitions/water/?section=" + return_to_section + "&page=" + return_to_page;
    
    } 
   
		// SG|index: initialize() seems to happen on first load and page reloads, and browse() on internal navigation
		//   We want to do index initialization regardless of what the session values are...
		//   But how do I find that out?  In other words, what page am I initializing here?  Where am I going?
		if (!return_to_section) {
			var tmp = window.location.search.split('?')[1];
			tmp = tmp.split('&');
			for (var i=0;i<tmp.length;i++) {
				var arg = tmp[i].split('=');
				switch (arg[0]) {
					case 'section': return_to_section = arg[1]; break;
					case 'page': return_to_page = arg[1]; 
					default: break;
				}
			}
		}
		if (return_to_section) initializeIndex(return_to_section,return_to_page);
	}
	function initializeIndex(s,p,x) {
		// SG|index:    this looks at the section s and does index initialization accordingly; functions are in exfunctions.js
		switch(s) {
			case "exindex":
				indexinit(x);    // function defined in exfunctions.js
				break;
			case "exmap":
				mapinit(x);		// function defined in exfunctions.js
				break;
			default:
				highlightPageTopics(s,p);   // function defined in exfunctions.js
				break;
		}
	}

