document.write("<TABLE></TABLE>");

var odRatio=largeImageWidth/smallImageWidth;
var odHeightRatio=largeImageHeight/smallImageHeight;

var bottomLayerImage = "/images/bottom_layer.gif";
var smallMapImage = "/images/map_small.gif";

var funding_organization_id = readCookie('funding_organization_id')
if (funding_organization_id) {
	bottomLayerImage = "/images/bottom_layer_" + funding_organization_id + ".gif";
	smallMapImage = "/images/map_small_" + funding_organization_id + ".gif";
}


var leftBorderWidth=0;
var popUpHeight = 175;
var popUpWidth = 250;
var popUpOffset = 10; //offsets the pop up this many pixels from the mouse over event
var detailWindowWidth=windowWidth()-rightMenuWidth-leftBorderWidth
var detailWindowHeight=windowHeight()-topbarHeight-bottombarHeight
var usableWidth = windowWidth()-leftBorderWidth;
var usableHeight = windowHeight()-topbarHeight;
var helpWidth = 90;

var mapLoaded=0;
var xPosition=0
var yPosition=0
var oldX=0
var oldY=0
var myTextCurrent = "";

// var i = 0;

//mybar is the overview window
// (x,y,width,height,boxW,boxH)
mybar=new ScrollBar(detailWindowWidth+5,5+topbarHeight,smallImageWidth,smallImageHeight,detailWindowWidth/odRatio,detailWindowHeight/odHeightRatio);
mybar.setImages(null,techmapURL + '/images/scrollbar-zoombox-resize.gif',smallMapImage)
mybar.build()
mybar.onScroll = moveBigImage
writeCSS(mybar.css+css('mycontentDiv',0,0,largeImageWidth,largeImageHeight,null,null,25))

document.write("<STYLE TEXT=\"text/css\">#hidepage { position: absolute; width: " + usableWidth + "; height: " + usableHeight + "; visibility:visible; left: 0; top: " + topbarHeight + "; background-color:#000000; layer-background-color:#000000; overflow: hidden; Z-INDEX:30; }</STYLE>");
document.write("<STYLE TEXT=\"text/css\">#mywindowDiv { position:absolute; width: " + usableWidth+ "; height: " + usableHeight + "; left:0; top:" + topbarHeight + "; background-color:#00235B; layer-background-color:#00235B; overflow: hidden; Z-INDEX:1 }\n</STYLE>");
document.write("<STYLE TEXT=\"text/css\">#sectorsDiv { position:absolute; width: " + smallImageWidth + "; background-color:#FFFFFF; overflow: hidden; Z-INDEX:2}\n</STYLE>");

function init() {
  if (document.layers || document.all) {
	mytext = new DynLayer('mytextDiv')
	mytext.hide()

	if (document.layers) {
		document.mywindowDiv.document.mycontentDiv.document.bottom.document.bottomlayer.src=bottomLayerImage;
		
		document.layers["legend"].left = leftBorderWidth;
		document.layers["legend"].top = detailWindowHeight+topbarHeight;
		document.layers["help"].left = detailWindowWidth-helpWidth;
		document.layers["help"].top = detailWindowHeight+topbarHeight;
		document.layers["mywindowDiv"].clip.width = detailWindowWidth;
		document.layers["mywindowDiv"].clip.height = detailWindowHeight;
		document.layers["mywindowDiv"].width = detailWindowWidth;
		document.layers["mywindowDiv"].height = detailWindowHeight;
		document.layers["sectorsDiv"].top = smallImageHeight+topbarHeight+10;
		document.layers["sectorsDiv"].left = detailWindowWidth+5;
		document.layers["hidepage"].visibility = 'hidden';
		
	} else if (document.all) {
		document.bottomlayer.src=bottomLayerImage;
		
		document.all.legend.style.pixelLeft = leftBorderWidth;
		document.all.legend.style.pixelTop = detailWindowHeight+topbarHeight;
		document.all.help.style.pixelLeft = detailWindowWidth-helpWidth;
		document.all.help.style.pixelTop = detailWindowHeight+topbarHeight;
		document.all.mywindowDiv.style.width = detailWindowWidth;
		document.all.mywindowDiv.style.height = detailWindowHeight;
		document.all.sectorsDiv.style.pixelTop = smallImageHeight+topbarHeight+10;
		document.all.sectorsDiv.style.pixelLeft = detailWindowWidth+5;
		document.all.hidepage.style.visibility = 'hidden';
		
	}
	
	mybar.activate()

	// initialize mouse events
	document.onmousedown = mouseDown
	document.onmousemove = mouseMove
	document.onmouseup = mouseUp
	if (is.ns) document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP)

	var xPos = readCookie('xPosition')
	var yPos = readCookie('yPosition')

	if (xPos!=null && yPos!=null ) {
		xPos = parseInt(xPos);
		yPos = parseInt(yPos);
		mimicBarDrag(xPos/odRatio, yPos/odRatio)


		if (document.layers) {
			document.layers["mywindowDiv"].document.layers["mycontentDiv"].document.layers["arrow"].left = xPos-35;
			document.layers["mywindowDiv"].document.layers["mycontentDiv"].document.layers["arrow"].top = yPos-35;
			document.layers["mywindowDiv"].document.layers["mycontentDiv"].document.layers["arrow"].visibility = 'show';
		}
		else {
			document.all.arrow.style.pixelLeft = xPos-35;
			document.all.arrow.style.pixelTop = yPos-35;
			document.all.arrow.style.visibility = 'visible';
		}

		deleteCookie('xPosition')
		deleteCookie('yPosition')
	}

	mapLoaded=1;
    }
}

function reloadWindow() {
	document.location.reload();
}

function hideMyText() {
	if (mapLoaded) {
		mytext.hide()
	}
}

function loadMyText(name, year, description) {
	loadMyText(name, year, description, '', '', '', '', '', '', '', '');
}

function loadMyText(name, year, description, www, email, phone, fax, address, city, province, postal, href, surveyed) {
	if (mapLoaded) {
		var myString = "";
		myString = '<TABLE CELLPADDING=2 CELLSPACING=0 BORDER=0 HEIGHT=' + popUpHeight + ' WIDTH=' + popUpWidth + '>';
		myString = myString + '<TR><TD valign=top><font color="#000000" STYLE="font-size: 10px;" face="Verdana, Arial, Helvetica, sans-serif"><a href="#" onClick="javascript:hideMyText();"><img alt="close description" HEIGHT="18" WIDTH="18" HSPACE="5" align="right" border="0" src="' + techmapURL + '/images/close_layer.gif"></a><b>' + name + '</b>&nbsp;' + year + '<br>' + description + '<br><hr size=1 noshade>';
		if (surveyed == 'Y') {
			if (www) { myString = myString + '<a target="new" href="' + www + '"><font color="#FF0000">' + www + '</font></a><br>';	}
			if (email) { myString = myString + '<a href="mailto:' + email + '"><font color="#FF0000">' + email + '</font></a><br>'; }
			if (phone) { myString = myString + 'phone:' + phone + '<br>'; }
			if (fax) { myString = myString + 'fax:' + fax + '<br>'; }
			if (address) { myString = myString + address + '<br>'; }
			if (city) { myString = myString + city + ', ' + province + '&nbsp;&nbsp;'; }
			if (postal) { myString = myString + postal; }
		} else {
			myString = myString + "This organization has not yet been surveyed.<BR><BR>";
		}
		myString = myString + '</font></TD></TR><TR><TD valign=bottom align=right><A HREF="' + href + '"><img alt="more info" align="right" border="0" src="' + techmapURL + '/images/more_info_for_organization_popup.gif" VSPACE=5></A></TD></TR></TABLE>';
		
		mytext.write(myString);
		mytext.width = popUpWidth;

		if (document.layers) {
			if (document.layers["mytextDiv"].visibility=="show" && myTextCurrent==name) {
				hideMyText();
			}
			else {
				var wWidth = document.layers["mywindowDiv"].clip.width;
				var wHeight = document.layers["mywindowDiv"].clip.height + topbarHeight;
				
				if (xPosition + popUpWidth + popUpOffset > wWidth) {
					document.layers["mytextDiv"].left = xPosition-popUpWidth-popUpOffset;
				} else {
					document.layers["mytextDiv"].left = xPosition+popUpOffset;
				}
				
				
				
				if (yPosition + popUpHeight + popUpOffset > wHeight) {
					// make sure it doesn't go into the topbar
					if ((yPosition-popUpHeight-popUpOffset) < topbarHeight) {
						document.layers["mytextDiv"].top = topbarHeight;
					} else {
						document.layers["mytextDiv"].top = yPosition-popUpHeight-popUpOffset;
					}
				} else {
					document.layers["mytextDiv"].top = yPosition+popUpOffset;
				}
				myTextCurrent=name;
				mytext.show()
			}
		}
		else {
			if (document.all.mytextDiv.style.visibility=="visible" && myTextCurrent==name) {
				hideMyText();
			}
			else {
				var wWidth = document.all.mywindowDiv.style.width;
				wWidth = parseInt(wWidth.substring(0, wWidth.length - 2));
	
				var wHeight = document.all.mywindowDiv.style.height;
				wHeight = parseInt(wHeight.substring(0, wHeight.length - 2)) + topbarHeight;
				
				if (xPosition + popUpWidth + popUpOffset  > wWidth) {
					document.all.mytextDiv.style.pixelLeft = xPosition-popUpWidth-popUpOffset;
				} else {
					document.all.mytextDiv.style.pixelLeft = xPosition+popUpOffset;
				}
				
				if (yPosition + popUpHeight + popUpOffset  > wHeight) {
					// make sure it doesn't go into the topbar
					if ((yPosition-popUpHeight-popUpOffset) < topbarHeight) {
						document.all.mytextDiv.style.pixelTop = topbarHeight;
					} else {
						document.all.mytextDiv.style.pixelTop = yPosition-popUpHeight-popUpOffset;
					}
				} else {
					document.all.mytextDiv.style.pixelTop = yPosition+popUpOffset;
				}
				myTextCurrent=name;
				mytext.show()
			}
		}
	}
	return false;
}

function mimicBarDrag(x,y) {
	wadj=detailWindowWidth/10/2;
	hadj=detailWindowHeight/10/2-6;

	x = x-wadj;
	y = y-hadj;

	mybar.mousedown(0,0);
	mybar.mousemoveabsolute(x,y);
	mybar.mouseup();
}

function mtrack(e) {
   var Text= 'Coordinates: ';
   if (document.layers) Text += e.pageX+','+e.pageY
   else Text += event.x+','+event.y;
   alert(Text);
}

function mouseDown(e) {
	if (is.ns && e.target!=document) routeEvent(e)
		return true
}

function mouseMove(e) {
	if (document.layers) {
	    xPosition=e.pageX
	    yPosition=e.pageY
	}
	else {
		xPosition=event.x
		yPosition=event.y
	}	

	if (is.ns && e.target!=document) routeEvent(e)
	return true
}
function mouseUp(e) {
	if (is.ns && e.target!=document) routeEvent(e)
	return true
}

function moveBigImage() {
	//careful - there is a bit of math here!
	//The Xfactor and Yfactor are kinda wierd - their values are between 0 and 1 based on the position of the 
	//viewfinder.  However, when the value is 0, it means that the TOP LEFT corner is in the top left corner of the overview image.
	//When the value is 1, it means that the BOTTOM RIGHT corner is in the bottom right corner of the overview image.
	//The math results from the coordinate system for the large image working differently.
	//The large image coordinates refer only to the position of the top left corner of the viewable region.
	//Ask Jeff for details if this makes no sense to you.

	// optimiation - only do this every 4th time - this makes the overview viewfinder jerky, but faster
//	if (i%4 == 0) {
	
		var x = -mybar.getXfactor()*(largeImageWidth-detailWindowWidth)
		var y = -mybar.getYfactor()*(largeImageHeight-detailWindowHeight)
		
		mycontent.moveTo(x,y)
//	}
//	i++;
}

function windowWidth ()
{
    if (document.all) {
        return (document.body.clientWidth);
	}
    else if (document.layers)
        return (window.innerWidth)
    else
        return (0);
}

function windowHeight ()
{
    if (document.all)
        return (document.body.clientHeight);
    else if (document.layers)
        return (window.innerHeight)
    else
        return (0);
}


function WM_netscapeCssFix() {
  /*
    Source: Webmonkey Code Library
    (http://www.hotwired.com/webmonkey/javascript/code_library/)

    Author: Taylor
    Author Email: taylor@wired.com
    Author URL: http://www.taylor.org/
    */

  // This part was inspired by Matthew_Baird@wayfarer.com
  // It gets around another unfortunate bug whereby Netscape 
  // fires a resize event when the scrollbars pop up. This 
  // checks to make sure that the window's available size 
  // has actually changed.
  if (document.WM.WM_netscapeCssFix.initWindowWidth != window.innerWidth || document.WM.WM_netscapeCssFix.initWindowHeight != window.innerHeight) {
    document.location = document.location;
  }
}

function WM_netscapeCssFixCheckIn() {
  // This function checks to make sure the version of Netscape 
  // in use contains the bug; if so, it records the window's 
  // width and height and sets all resize events to be handled 
  // by the WM_netscapeCssFix() function.
  if ((navigator.appName == 'Netscape') && (parseInt(navigator.appVersion) == 4)) {
    if (typeof document.WM == 'undefined'){
      document.WM = new Object;
    }
    if (typeof document.WM.WM_scaleFont == 'undefined') {
      document.WM.WM_netscapeCssFix = new Object;
      document.WM.WM_netscapeCssFix.initWindowWidth = window.innerWidth;
      document.WM.WM_netscapeCssFix.initWindowHeight = window.innerHeight;
    }
    window.onresize = WM_netscapeCssFix;
  }
}

WM_netscapeCssFixCheckIn()

function WM_checkIn(WM_id) { 

/*
WM_checkIn()
Takes the ID of a positioned HTML element and returns an object reference.

Source: Webmonkey Code Library
(http://www.hotwired.com/webmonkey/javascript/code_library/)

Author: Taylor
Author Email: taylor@wired.com
Author URL: http://www.taylor.org/

Usage: WM_checkIn('id')
*/

  // First we initialize all the variables.
  var theObj,ss,sr,i,j,WM_layers=new Array();
  // This chunk handles the IE portion of the checkIn code.
  if (document.all) {
    // This checks to see if the inline style declaration has 
    // a position property associated with it. If not, it will 
    // scan the global stylesheets for the ID.
    if((document.all[WM_id].style.position != 'absolute') && (document.all[WM_id].style.position != 'relative')){
      // This little loop I'm very proud of, because it's kinda 
      // slick and I wrote it all myself. It loops through all 
      // global stylesheets and all the rules in each stylesheet, 
      // tests for the selected ID, then returns that as the object.
      for (ss=0 ; ss < document.styleSheets.length; ss++) {
        for (sr=0 ; sr < document.styleSheets(ss).rules.length; sr++) { 
          if (document.styleSheets(ss).rules(sr).selectorText == '#' + WM_id) {
            theObj = document.styleSheets(ss).rules(sr).style;
            break;
          }
        }
      }
    } else {
      // This works the same as in the light version, so you can 
      // use inline styles.
      theObj = document.all[WM_id].style;
    }
  } else if(document.layers) {
    // Now we're in Netscapeland. The main problem here 
    // is finding the object in a maze of hierarchy.
    // I wish I could say that I'm proud of this code, 
    // because it's really slick. Unfortunately, I ripped 
    // it off from Macromedia Dreamweaver's drag layer code 
    // (with permission, of course :-) 
    // Dreamweaver/Configuration/Behaviors/Actions/Drag Layer.htm 
    // It works wonderfully and solves the problem.
    WM_layers = new Array();
    with (document) {
      for (i=0; i<layers.length; i++) WM_layers[i]=layers[i]; {
        for (i=0; i<WM_layers.length; i++) {
          if (WM_layers[i].document && WM_layers[i].document.layers) {
            for (j=0; j<WM_layers[i].document.layers.length; j++) {
              WM_layers[WM_layers.length] = WM_layers[i].document.layers[j];
            }
            if(WM_layers[i].name == WM_id){
              // So if the code matches the name of the layer, 
              // return the reference. 
              theObj = WM_layers[i];
            }
          }
        }
      }
    }
  }
  return theObj;
}


function toggleLayer(layername) {
	hideMyText();

	var daObj = WM_checkIn(layername);
	     
	if (document.all) {
		var visible = "visible";
		var hidden = "hidden";
	} else {
		var visible = "show";
		var hidden = "hide";
	}
	
	if (daObj.visibility == visible) {
		daObj.visibility = hidden;
	} else {
		daObj.visibility = visible;
	}
}

function setOrganization(selectBox) {
	hideMyText();
	var xy = selectBox.options[selectBox.selectedIndex].value;
	var x = parseInt(xy.substring(0,xy.indexOf(",")));
	var y = parseInt(xy.substring(xy.indexOf(",")+1));

	x;
	y;

    if (!isNaN(x)) {

		mimicBarDrag(x/odRatio,y/odRatio);
		if (mapLoaded) {
			if (document.layers) {
				document.layers["mywindowDiv"].document.layers["mycontentDiv"].document.layers["arrow"].left = x-35;
				document.layers["mywindowDiv"].document.layers["mycontentDiv"].document.layers["arrow"].top = y-35;
				document.layers["mywindowDiv"].document.layers["mycontentDiv"].document.layers["arrow"].visibility = 'show';
			}
			else {
				document.all.arrow.style.pixelLeft = x-35;
				document.all.arrow.style.pixelTop = y-35;
				document.all.arrow.style.visibility = 'visible';
			}
		}
    }
}


function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);