// Javascript to enable dynamic rollover pop-ups for the Whitemark course layout
//
//
// 
//
	var mapname ='';
	var imgname ='';
	var imgx = "?";
	var imgy = "?";
	var layout = '';
	var menuwidth='165px' //default menu width
	var menuborder='0px solid black'  //menu border
	var menubgcolor='transparent'  //menu bgcolor
	var disappeardelay=250  //menu disappear speed onMouseout (in miliseconds)
	var hidemenu_onclick="yes" //hide menu when user clicks within menu?
	//
	var haveWmViews = false;
	var wmViewsLoaded = false;  
	var wmViews = new Array(); // gets loaded after main image is complete
	// 

	//
	// diagnosis function
	//
	function mapdata(){
		return 'Image name = '+imgname+', Mapname= '+mapname+', layout origin '+imgx+','+imgy;
	}	
	function showMapdata(){
		alert (''+mapdata());
	}
	//
	function setMapdata(layout){
		imgx = layout.offsetLeft ;
		imgy = layout.offsetTop ;
		imgname = layout.name;
		mapname = layout.useMap;
		mapname = mapname.substr(1,mapname.length-1); // strip # sign 
		return mapname;
	}


	//
	//    showFeature()    onMouseover event handler for course layout image map
	//
	function showFeature(e) {
		pop = '';
		pcolor='lightgreen';  
		pwidth = 300;
		areaobj = (document.addEventListener) ? e.target : event.srcElement;// get area element
		href = areaobj.href;
		//
		// hrefs are specified in the hyperlink attributes of the elements in the Visio drawing
		//
		feats = href.lastIndexOf( '(' ) + 1; 
		feate = href.lastIndexOf( ')' );
		if (feats < feate) {
			feature = href.substr(feats, feate-feats);
			//
			// is it a request for target details
			//
			if (feature.substr(0,1) == 'T') {
				pop = '<DIV STYLE="background:#EEEE80;"><H2>'+areaobj.alt+'</H2>';
				pop += getSingleTarget(whitemark[feature])+'</DIV>'; 
			//
			// is it a request for photos of features
			//
			} else if (feature.substr(1,1) == 'v' ){
				viewCode = feature.substr(1,feature.length-2);
				//
				// see whether we can present thumbnails
				//
				if (pop = showThumbs(viewCode)) {
					pwidth='240px';  
				//
				//  check for pre-selected photos
				//
				} else if (url = wmURLs[viewCode]){
					if (url.substr(url.length-3,3) == 'jpg'){
						pop = '<IMG SRC="' +url+ '" CLASS="tviews" NAME="TN1"/>';
					//
					// or a collection of them
					//
					} else {
						pop = showHref(areaobj);
					}
				//  give the bad news
				} else {
					pop = '<SPAN STYLE="background:#88FF88;">Sorry, no views of this area</BR>are available at the moment </SPAN>';
				}
				// feature code is unrecognised
			} else {
				pop += 'Feature code '+feature+' for '+areaobj.alt+'<BR>has not been recognised. Please advise webmaster.';  //../photos/jan02-01_tn.jpg
			}
		} else {	
			pop = showHref(areaobj);
		}
		//alert(pop);
		targetDetails = new Array(pop);
		dropdownmenu(areaobj, e, targetDetails, pwidth, pcolor);
	}
	//
	// create a table of thumbnail views if data is available
	//
	function showThumbs(viewCode){
		if (viewSet = wmViews[viewCode]){
			html = '<TABLE CLASS="tviews"><TR CLASS="tviews">';
			for (a=0; a < viewSet.length; a++){
				view = viewSet[a];
				html += (a == 2 && viewSet.length == 4) ? '</TR><TR CLASS="tviews">' : ''; // make two rows if 4
				html += '<TD CLASS="tviews"><a href="show.php?ID=' +view['ID']+ '&from=range_layout.php" ALT="' +view['Caption']+'" TITLE="' +view['Caption']+'">'; 
				html += '<IMG SRC="' +view['img'].src+ '" CLASS="tviews" NAME="TN' +a+ '" /></a></TD>';
			}
			return html + '</TR></TABLE>';
		} else {
			return false;
		}
	}
	//
	// add views to wmviews 3D array
	//
	function  addView(viewCode, ID, srcpath, Caption){
		var view = new Array();
		var viewset = Array;
		view['img'] = new Image;
		view['img'].src = srcpath;
		view['ID'] = ID;
		view['Caption'] = Caption;
		if (viewSet = wmViews[viewCode]){
			wmViews[viewCode][viewset.length] = view;
		} else {
			var viewset = new Array(view);
			wmViews[viewCode] = viewset;
		}
	}
	//
	// just show the href using the alt to click on
	//
	function showHref(areaobj){
		return '<CENTER><A HREF=' +href+ ' CLASS="ul" STYLE="background:#EEEE80;" >' +areaobj.alt+'</A></CENTER><BR>';
	}


	//
	// Initialise image map 
	// called by <BODY onLoad> event
	// find image with USEMAP specified and add event handlers to each AREA within the MAP
	//
	function layoutInit(arg) {
		var diag = (arg == 'alert')? true: false;
		if (diag) doc = 'What: ';
		for (a=0; a <document.images.length; a++) {
			layout = document.images[a];
			if (!layout.useMap) continue;
			mapname = setMapdata(layout);
			if (diag) doc += nodeNames(layout)+ mapdata() +' \n'; 
			maps = document.getElementsByTagName('map');
			if (maps[mapname]){
				layoutMap = maps[mapname];
				for (b=0; b < layoutMap.areas.length; b++){
					area = layoutMap.areas[b];
					addMyHandler(area,'mouseover',areaMouseover);
					addMyHandler(area,'mouseout',areaMouseout);
					addMyHandler(area,'click',areaClick);
				}
				if (diag) doc += ' added handlers to '+layoutMap.areas.length + ' areas\n';
			}
		}
		if (diag) {alert(doc);} // for diagnosis
		//
		// start fetching thumbnails if we have the data - but only do it once
		//
		if (haveWmViews && !wmViewsLoaded) {
			buildViewTable();  
		}
	}
	//
	// get parent node names for diagnosis
	//
	function nodeNames (child) {
		var parentEl=child;
		var doc = '';
		if (document.addEventListener) { 
			while (parentEl!=null){
				doc += parentEl.toString()+' '+parentEl.offsetLeft+','+parentEl.offsetTop+'\n';
				parentEl=parentEl.parentNode;
				}
		} else {
			while (parentEl!=null){
				doc += parentEl.name+' '+parentEl.offsetLeft+','+parentEl.offsetTop+'\n';
				parentEl=parentEl.parentNode;
				}
		}
		return doc;
	}
	//
	// add event handler for IE5 or NN6
	//
	function addMyHandler (obj, type, handler) {
		//
		// add handler for netscape navigator
		//
		if ( obj.addEventListener ) {
			obj.addEventListener(type, handler, true);
		//
		// add handler for IE5
		//
		} else {
			obj.attachEvent('on' + type, handler);
		}
	}
	//
	// dynamically added event handlers for layout map rollovers
	//
	function areaMouseover(e) {showFeature(e);}
	// the following reference functions in DropDownMenu.js
	function areaMouseout(e) {delayhidemenu();}
	function areaClick(e) {return clickreturnvalue();}
	//