var gecko=false;
var ua=navigator.userAgent.toLowerCase();
if (ua.indexOf("gecko")>0) gecko=true;
var maparray=new Array(9);
var mapzoom;
var mapwidth;
var mapheight;

function Map(parent,width,height,base,zoom) {
  for (var i=1; i<10; i++) {
    maparray[i]=new Image();
    maparray[i].src="/map/"+base+"-"+i+".png";
  }
  mapzoom=zoom;
  mapwidth=width;
  mapheight=height;
  parent.style.position="relative";
  var mapbg=document.createElement("div");
  mapbg.id="mapbg";
  mapbg.style.position="absolute";
  mapbg.style.zIndex=1000;
  mapbg.style.left=0;
  mapbg.style.top=0;
  mapbg.style.width=width;
  mapbg.style.height=height;
  mapbg.style.border="1px solid #404040";
  mapbg.style.background="url("+maparray[zoom].src+") top left no-repeat";
  parent.appendChild(mapbg);
  var zoom=document.createElement("div");
  zoom.style.position="absolute";
  zoom.style.zIndex=1001;
  zoom.style.left=5;
  zoom.style.top=5;
  zoom.style.width=31;
  zoom.style.height=150;
  if (gecko) zoom.style.background="url(/map/zoom.png) top left no-repeat";
  else zoom.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/map/zoom.png,sizingmethod=image)";
  parent.appendChild(zoom);
  var zoomin=document.createElement("div");
  zoomin.style.position="absolute";
  zoomin.style.zIndex=1002;
  zoomin.style.left=11;
  zoomin.style.top=11;
  zoomin.style.width=19;
  zoomin.style.height=19;
  zoomin.style.cursor="pointer";
  zoomin.style.background="url(/map/zoomin.gif) top left no-repeat";
  zoomin.onmouseover=function() { this.style.backgroundPosition="right"; }
  zoomin.onmouseout=function() { this.style.backgroundPosition="left"; }
  parent.appendChild(zoomin);
  var zoomout=document.createElement("div");
  zoomout.style.position="absolute";
  zoomout.style.zIndex=1002;
  zoomout.style.left=11;
  zoomout.style.top=130;
  zoomout.style.width=19;
  zoomout.style.height=19;
  zoomout.style.cursor="pointer";
  zoomout.style.background="url(/map/zoomout.gif) top left no-repeat";
  zoomout.onmouseover=function() { this.style.backgroundPosition="right"; }
  zoomout.onmouseout=function() { this.style.backgroundPosition="left"; }
  parent.appendChild(zoomout);
  var scrubber=document.createElement("div");
  scrubber.id="mapscrub";
  scrubber.style.position="absolute";
  scrubber.style.zIndex=1002;
  scrubber.style.left=11;
  scrubber.style.top=34+((mapzoom-1)*10);
  scrubber.style.width=19;
  scrubber.style.height=13;
  scrubber.style.cursor="pointer";
  scrubber.style.background="url(/map/scrubber.gif) top left no-repeat";
  parent.appendChild(scrubber);
  zoomin.onmousedown=function() {
    if (mapzoom<2) return;
    mapzoom--;
    document.getElementById("mapbg").style.background="url("+maparray[mapzoom].src+") top left no-repeat";
    document.getElementById("mapscrub").style.top=34+((mapzoom-1)*10);
  }
  zoomout.onmousedown=function() {
    if (mapzoom>8) return;
    mapzoom++;
    document.getElementById("mapbg").style.background="url("+maparray[mapzoom].src+") top left no-repeat";
    document.getElementById("mapscrub").style.top=34+((mapzoom-1)*10);
  }
  scrubber.onmousedown=function() {
    document.body.onmousemove=function(e) {
      if (window.event) e=window.event;
      var y;
      if (e.y) y=parseInt(e.y);
      else if (e.pageY) y=parseInt(e.pageY);
      else if (e.clientY) y=parseInt(e.clientY);
      y=parseInt((y-34)/10)+1;
      if (y<1) y=1;
      if (y>9) y=9;
      mapzoom=y;
      document.getElementById("mapbg").style.background="url("+maparray[mapzoom].src+") top left no-repeat";
      document.getElementById("mapscrub").style.top=34+((mapzoom-1)*10);
    }
    this.onmouseup=function() {
      document.body.onmousemove=null;
    }
    document.body.onmouseup=function() {
      document.body.onmousemove=null;
    }
  }
  var print=document.createElement("div");
  print.style.position="absolute";
  print.style.zIndex=1002;
  print.style.left=10;
  print.style.top=height-32;
  print.style.width=51;
  print.style.height=21;
  print.style.cursor="pointer";
  if (gecko) print.style.background="url(/map/print.png) top left no-repeat";
  else print.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/map/print.png,sizingmethod=image)";
  print.onclick=function() {
    var html="<html><head><title>Map</title></head><body onload=\"window.print()\" style=\"margin:0px\"><img src=\""+maparray[mapzoom].src+"\" /></body></html>";
    var w=window.open("","Map","width="+mapwidth+",height="+mapheight+",menu=false,statusbar=false,navigation=false");
    w.document.write(html);
  }
  parent.appendChild(print);
  var balloon=document.createElement("div");
  balloon.style.position="absolute";
  balloon.style.zIndex=1003;
  balloon.style.left=222;
  balloon.style.top=112;
  balloon.style.width=190;
  balloon.style.height=91;
  balloon.style.cursor="pointer";
  if (gecko) balloon.style.background="url(/map/balloon.png) top left no-repeat";
  else balloon.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/map/balloon.png,sizingmethod=image)";
  balloon.onclick=function() {
    this.parentNode.removeChild(this);
  }
  parent.appendChild(balloon);
}
