// JavaScript Document
<!--

// gh_layerPositioner.js
// v1.0, DR 29/11/04

// WARNING:
// This code needs customised settings entered below for each website.

// DESCRIPTION:
// When triggered, this code will position layers (whether Hidden or Visible)
// to align to an image (or a 'risky' non-image object) on the page, and allow
// an x,y offset to that image.
// Call it towards the end of a body tag, and on a Resize event to keep the layers
// over their correct content as the user resizes the browser window.

// USES:
// These layers can be used for anything!
//   - Transient Menus : triggered by onMouseOver onMouseOut, that set layer visiblity to
//                       temporarily see different menus
//   - State Menus : triggered by clicking events, set layer visibility to swap menu states
//   - Animated Layers : set them to follow an image around

// WHY:
// If content is LEFT justified in the page, setting the x/y of a layer works without needing
// this code.  However, if content is CENTRED, this code will be necessary to work out where
// a layer should appear.

// Ideas from vs2.65 of a project 7, P7 snap function. This GH code works more reliably, without breaking if the browser width gets close to or less than the content width.


//==========Start GH_SnapLayer
function GH_SnapLayer() {

 var GHx=0,GHy=0;
 if (!is_ie) {
	if (self.innerHeight) {// all except Explorer
		GHx = self.innerWidth;
		GHy = self.innerHeight;
		//alert("innerWidth");
		//alert(GHx);
	}
 } else {
	if (document.documentElement && document.documentElement.clientHeight) {
	// Explorer 6 Strict Mode
		GHx = document.documentElement.clientWidth;
		GHy = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
		GHx = document.body.clientWidth;
		GHy = document.body.clientHeight;
	}
 }
 //alert("GH_SnapLayer" +"\n\n" +"Inside page Width  = " + GHx + "\n" + "Inside page Height = " + GHy);
 
 // Start of original P7_Snap
 var x,y,ox,bx,oy,p,tx,a,b,k,d,da,e,el,tw,q0,xx,yy,w1,pa='px',args=GH_SnapLayer.arguments;a=parseInt(a);
 if(document.layers||window.opera){pa='';}for(k=0;k<(args.length);k+=4){
 if((g=MM_findObj(args[k]))!=null){if((el=MM_findObj(args[k+1]))!=null){
 
//==========Need exact pixel width of page content in next line, ie width of outer table.
//If our outer table was 771 pixels, next line should be <=771
 if(GHx<=771) { //GH - code added to fix some shortcomings
//==========Need top left position of all layers in next line.
	xx=0; yy=164;
 	//alert("xx = 0, Set");
	e=(document.layers)?el:el.style;
	e.left=xx+pa;e.top=yy+pa;
 } else {

 // Continuing original P7_Snap
 a=parseInt(args[k+2]);b=parseInt(args[k+3]);x=0;y=0;ox=0;oy=0;p="";tx=1;
 da="document.all['"+args[k]+"']";if(document.getElementById){
 d="document.getElementsByName('"+args[k]+"')[0]";if(!eval(d)){
 d="document.getElementById('"+args[k]+"')";if(!eval(d)){d=da;}}
 }else if(document.all){d=da;}if(document.all||document.getElementById){while(tx==1){
 p+=".offsetParent";if(eval(d+p)){x+=parseInt(eval(d+p+".offsetLeft"));y+=parseInt(eval(d+p+".offsetTop"));
 }else{tx=0;}}ox=parseInt(g.offsetLeft);oy=parseInt(g.offsetTop);tw=x+ox+y+oy;
 //GH:Next line was: if(tw==0||..
 if((tw==0&&!is_ie)||(navigator.appVersion.indexOf("MSIE 4")>-1&&navigator.appVersion.indexOf("Mac")>-1)){
  ox=0;oy=0;if(g.style.left){x=parseInt(g.style.left);y=parseInt(g.style.top);}else{
  w1=parseInt(el.style.width);bx=(a<0)?-5-w1:-10;a=(Math.abs(a)<1000)?0:a;b=(Math.abs(b)<1000)?0:b;
  x=document.body.scrollLeft+event.clientX+bx;y=document.body.scrollTop+event.clientY;}}
 }else if(document.layers){x=g.x;y=g.y;q0=document.layers,dd="";for(var s=0;s<q0.length;s++){
  dd='document.'+q0[s].name;if(eval(dd+'.document.'+args[k])){x+=eval(dd+'.left');y+=eval(dd+'.top');
  break;}}}e=(document.layers)?el:el.style;xx=parseInt(x+ox+a),yy=parseInt(y+oy+b);
 if(navigator.appVersion.indexOf("MSIE 5")>-1 && navigator.appVersion.indexOf("Mac")>-1){
  xx+=parseInt(document.body.leftMargin);yy+=parseInt(document.body.topMargin);}

 //alert("Next is  xx"); alert(xx); //alert(yy);
 e.left=xx+pa;e.top=yy+pa;}}}}
}

// Run once when page loads.
var agt=navigator.userAgent.toLowerCase();
var is_ie   = (agt.indexOf("msie") != -1);
var is_ns  = ((agt.indexOf('mozilla')!=-1) && (agt.indexOf('opera')==-1) && (agt.indexOf('webtv')==-1) && (agt.indexOf('spoofer')==-1) && (agt.indexOf('compatible') == -1));
var agt_major = parseInt(navigator.appVersion);
var agt_minor = parseFloat(navigator.appVersion);
var is_ns4down = (is_ns && (agt_major <= 4));
var is_mac= (agt.indexOf("mac")!=-1);

function GH_Resize() {
	if (is_ns4down || (is_mac && is_ie)) {
		// If NS 4.71 or less, or IE on Mac, then Refresh
		history.go(0);	
	} else {
		// Else reposition menu layers
//==========Need all layers and top left positions in next line.
//==========Also next line is duplicated as first command in the <body onLoad=".."> event.
//==========This line assumes as 'guide' image is called 'menumarker' and it's top edge is 164 pixels above where the menu layers should appear.
		GH_SnapLayer('menumarker','Layer1',0,164,'menumarker','Layer2',0,164);
	}
}
//==========2 more things to add to the <body .. > tag.
//==========1) Directly after the above GH_SnapLayer command in the onLoad event, turn the first layer on by adding: MM_showHideLayers('Layer1','','show');
//==========2) Lastly, ensure   onResize="GH_Resize();"   is set in the body tag.
//==========End GH_SnapLayer

//-->