var mapImg;
var mapform;
var dragBoxDiv;
var minX;
var minY;
var maxX;
var maxY;
var startX;
var startY;
var upDown = 0;

function mouseDown(evt) {
  // If it's not the left mouse button ignore
  if ((browser.ns && evt.which != 1) || (browser.ie && event.button != 1)) return true;

  var x = (browser.ns) ? evt.pageX : event.clientX;
  var y = (browser.ns) ? evt.pageY : event.clientY;

  // If it's IE we need to add the scroll offset to the x and y
  if (browser.ie) {
    x = x + document.body.scrollLeft;
    y = y + document.body.scrollTop;
  }

  upDown = 1;
  startRubber(x, y);
  if (browser.ie) {
    mapImg.onmousemove = mouseMove;
    mapImg.onmouseup = mouseUp;
  }
  else {
    document.onmousemove = mouseMove;
    document.onmouseup = mouseUp;
  }
  return false;
}

function mouseMove(evt) {
  if (upDown == 1) {
    var x = (browser.ns) ? evt.pageX : event.clientX;
    var y = (browser.ns) ? evt.pageY : event.clientY;

    // If it's IE we need to add the scroll offset to the x and y
    if (browser.ie) {
      x = x + document.body.scrollLeft;
      y = y + document.body.scrollTop;
    }

    if (!isOnMap(x,y)) return false;
    moveRubber(x, y);
    return false; }
  else
    return false;
}

function mouseUp(evt) {
  var x = (browser.ns) ? evt.pageX : event.clientX;
  var y = (browser.ns) ? evt.pageY : event.clientX;

  // If it's IE we need to add the scroll offset to the x and y
  if (browser.ie) {
    x = x + document.body.scrollLeft;
    y = y + document.body.scrollTop;
  }

  stopRubber(x, y);
  upDown = 0;
  changeMap();
  return false;
}

function startRubber (x,y) {
  minX = x;
  minY = y;
  maxX = x;
  maxY = y;
  startX = x;
  startY = y;

  var r = dragBoxDiv;
  r.style.width = 0;
  r.style.height = 0;
  r.style.left = x + 'px';
  r.style.top = y + 'px';
  r.style.visibility = 'visible';
}

function moveRubber (x,y) {
  var r = dragBoxDiv;
  if (x < startX) {
    minX = x;
    maxX = startX;
    r.style.left = x + 'px'; }
  else {
    minX = startX;
    maxX = x; }
  if (y < startY) {
    minY = y;
    maxY = startY;
    r.style.top = y + 'px'; }
  else {
    minY = startY;
    maxY = y; }
  r.style.width = maxX - minX;
  r.style.height = maxY - minY;
}

function stopRubber (x,y) {
  var r = dragBoxDiv;
  rbX1 = parseInt(r.style.left) - findPosX(mapImg);
  rbY1 = parseInt(r.style.top) - findPosY(mapImg);
  rbX2 = rbX1 + parseInt(r.style.width);
  rbY2 = rbY1 + parseInt(r.style.height);
  var input = mapform.xy;
  input.setAttribute('value', rbX1 + " " + rbY1 + " " + rbX2 + " " + rbY2);
}

function isOnMap(x,y) {
  var mapLeft = findPosX(mapImg);
  var mapTop = findPosY(mapImg);
  var mapRight = mapLeft + parseInt(mapImg.width);
  var mapBottom = mapTop + parseInt(mapImg.height);

  if (x < mapLeft) return false;
  if (x > mapRight) return false;
  if (y < mapTop) return false;
  if (y > mapBottom) return false;
  return true;
}


function findPosX(obj) {
  var curleft = 0;
  while(1) {
    curleft += obj.offsetLeft;
    if(!obj.offsetParent)
      break;
    obj = obj.offsetParent; }
  return curleft;
}

function findPosY(obj) {
  var curtop = 0;
  while(1) {
    curtop += obj.offsetTop;
    if(!obj.offsetParent)
      break;
    obj = obj.offsetParent; }
  return curtop;
}

// BrowserCheck Object
function BrowserCheck() {
  var b = navigator.appName;
  if ((navigator.userAgent.indexOf("Opera 6")!=-1) || (navigator.userAgent.indexOf("Opera/6")!=-1)) {
    this.b='op'; }
  if (b == "Netscape") this.b = "ns";
  else if (b == "Microsoft Internet Explorer") this.b = "ie";
  else this.b = b;
  this.version = navigator.appVersion;
  this.v = parseInt(this.version);
  this.ns = (this.b == "ns" && this.v >= 4);
  this.ns4 = (this.b == "ns" && this.v == 4);
  this.ns5 = (this.b == "ns" && this.v == 5);
  this.ie = (this.b == "ie" && this.v >= 4);
  this.ie4 = (this.version.indexOf('MSIE 4')>0);
  this.ie5 = (this.version.indexOf('MSIE 5')>0);
  this.min = (this.ns||this.ie);
}

var browser = new BrowserCheck();

function initMapScript() {
  mapImg = document.getElementById('mapimg');
  mapform = document.getElementById('mapframeform');
  dragBoxDiv = document.getElementById('dragBox');

  mapImg.style.cursor = "crosshair";
  mapImg.onmousedown = mouseDown;
}