// panoramascroll.js
// Winfried Beer, http://www.w-beer.de
//


var debug=false;          // debug mode
var mD=false;             // false: no mouse move in progress
var mX=0, mY=0;           // coordinates of mouse down
var pX=0, pY=0;           // coordinates of page at mouse down
var tX=-9999, tY=-9999;   // target coordinates
var scrollSpeedup=1;      // speedup scroll factor
var img1Id="", img2Id=""; // image ids
var overlayId=""; scrollId="";  
var scrollMode=0;         // 0: scoll page
                          // 1: scroll inside div, define scrollId as (set width 100%. With "auto" IE would be too large): 
                          //    <div id="scrollmap" style="position:relative; overflow:scroll; width:100%; height:730px;">
                          // 2: move element, define scrollId as (give width!):
                          //    <div id="scrollmap" style="position:relative; width:18000px; height:730px">


// --------------------------------------------------------------------
function getElementById(id) {
  if (document.getElementById) {
    ele=document.getElementById(id);
  }else if (document.all) {
    ele=document.all(id);
  }else if (document.layers) {
    ele=document[id];
  }else{
    ele=false;
  }
  return ele;
}

// --------------------------------------------------------------------
function initPanoramaScrolling(p_speedup, p_img1Id, p_overlayId, p_img2Id, p_scrollId, p_scrollMode, p_debug) {
  if (p_speedup) scrollSpeedup=p_speedup;
  if (p_img1Id) img1Id=p_img1Id;
  if (p_overlayId) overlayId=p_overlayId;
  if (p_img2Id) img2Id=p_img2Id;
  if (p_scrollId) scrollId=p_scrollId;
  if (p_scrollMode) scrollMode=p_scrollMode;
  if (p_debug) debug=p_debug;

  initMouseable(img1Id);
  initMouseable(img2Id);
  initMouseable(overlayId);
}

// --------------------------------------------------------------------
function initMouseable(id) {
  element=getElementById(id);
  if (!element) return;
  element.onmousemove = mouseMove;
  element.onmousedown = mouseDown;
  element.onmouseup   = mouseUp;
  element.style.cursor="move";
  if (typeof element.ondragstart != "undefined") element.ondragstart = function () { return false; };  // IE, suppress drag&drop
}

// --------------------------------------------------------------------
function showOverlay() {
  o=getElementById(overlayId);
  if (!o) return;
  o.style.visibility="visible";
}

// --------------------------------------------------------------------
function hideOverlay() {
  o=getElementById(overlayId);
  if (!o) return;
  o.style.visibility="hidden";
}

// --------------------------------------------------------------------
function toggleOverlay() {
  o=getElementById(overlayId);
  if (!o) return;
  if (o.style.visibility=="visible") {
    o.style.visibility="hidden";
  }else{
    o.style.visibility="visible";
  }
}

// --------------------------------------------------------------------
function mouseDown(ev) {
  if (!ev) {
    if (window.event) {
      ev=window.event;
    }else{
      return false;
    }
  }
  // check if mouse really is down on a image within document
  // (eg. don't grab scrollbar or margin clicks)
  var tg = (window.event) ? ev.srcElement : ev.target;
  //if (tg.nodeName != 'IMG') return;
  //if (tg.id != img1Id && tg.id != img2Id && tg.id != overlayId) return;

  mX=0;
  mY=0;
  pX=0;
  pY=0;
  mD=true;
  if (typeof ev.screenX == "number") { // Netscape
    mX=ev.screenX;
    mY=ev.screenY;
  }else if (typeof ev.offsetX == "number") { // Microsoft
    mX=ev.offsetX;
    mY=ev.offsetY;
  }else{
    mD=false;
  }
  if (scrollMode==0) {  // scroll page
    if (typeof window.pageXOffset == "number") { // Netscape
      pX=window.pageXOffset;
      pY=window.pageYOffset;
    }else if (typeof document.body.scrollLeft == "number") { // IE 4
      pX=document.body.scrollLeft;
      pY=document.body.scrollTop;
    }else if (typeof document.documentElement.scrollLeft == "number") { // IE 6 standard
      pX=document.documentElement.scrollLeft;
      pY=document.documentElement.scrollTop;
    }else{
      mD=false;
    }
  }else if (scrollMode==1) {  // scroll inside div
    e=getElementById(scrollId);
    if (e) {
      pX=e.scrollLeft;
      pY=e.scrollTop;
    }else{
      mD=false;
    }
  }else if (scrollMode==2) {  // move element
    e=getElementById(scrollId);
    if (e) {
      //pX=e.scrollLeft;
      //pY=e.scrollTop;
      pX=parseInt(e.style.left);   if (isNaN(pX)) pX=0;
      pY=parseInt(e.style.top );   if (isNaN(pY)) pY=0;
    }else{
      mD=false;
    }
  }
  tX=pX;
  tY=pY;
  if (debug) window.status="mouse down: "+pX+","+pY+" "+tX+","+tY+" "+mX+","+mY;
  return false;  // keep Mozilla from start dragging
}

// --------------------------------------------------------------------
function mouseUp(ev) {
  if (!ev) {
    if (window.event) {
      ev=window.event;
    }else{
      return;
    }
  }
  // check if mouse really is down on a image within document
  // (eg. don't grab scrollbar or margin clicks)
  var tg = (window.event) ? ev.srcElement : ev.target;
  // check for simple click on foto or overlay
  while (tg) {
    if (tg.id==img1Id || tg.id==overlayId) {
      if (Math.abs(tX-pX)<3*scrollSpeedup && Math.abs(tY-pY)<3*scrollSpeedup) {
        toggleOverlay();
      }
      break;
    }else{
      tg=tg.parentNode;
    }
  }

  // stop move move
  mD=false;
  if (debug) window.status="mouse up: "+pX+","+pY+" "+tX+","+tY+" "+mX+","+mY;
}

// --------------------------------------------------------------------
function mouseMove(ev) {
  if (mD==false) return;
  if (!ev) {
    if (window.event) { // Microsoft
      ev=window.event;
    }else{
      return;
    }
  }
  if (ev.screenX) {   // Netscape
    deltaX=mX-ev.screenX;
    deltaY=mY-ev.screenY;
  }else if (ev.offsetX) { // Microsoft
    deltaX=mX-ev.offsetX;
    deltaY=mY-ev.offsetY;
  }else{
    deltaX=0;
    deltaY=0;
  }
  if (scrollMode==0) {       // scroll whole html page
    tX=pX+scrollSpeedup*deltaX;
    tY=pY+scrollSpeedup*deltaY;
    window.scrollTo(tX,tY);
  }else if (scrollMode==1){  // scroll inside div 
    e=getElementById(scrollId);
    if (e) {
      tX=pX+scrollSpeedup*deltaX;
      tY=pY+scrollSpeedup*deltaY;
      e_width =e.scrollWidth;
      e_height=e.scrollHeight;
      viewport_width=e.offsetWidth;
      viewport_height=e.offsetHeight;
      if (tX<0) tX=0;
      if (tY<0) tY=0;
      if (tX>e_width-viewport_width)   tX=e_width -viewport_width;
      if (tY>e_height-viewport_height) tY=e_height-viewport_height;
      e.scrollLeft=tX;
      e.scrollTop=tY;
    }
  }else if (scrollMode==2){  // move element 
    e=getElementById(scrollId);
    if (e) {
      tX=pX-scrollSpeedup*deltaX;
      tY=pY-scrollSpeedup*deltaY;

      e_width =e.offsetWidth;
      e_height=e.offsetHeight;
      viewport_width=e.parentNode.offsetWidth;
      viewport_height=e.parentNode.offsetHeight;
      tX_max=Math.max(0,viewport_width-e_width);
      tY_max=Math.max(0,viewport_height-e_height);
      tX_min=Math.min(0,viewport_width-e_width);
      tY_min=Math.min(0,viewport_height-e_height);
      if (tX>tX_max) tX=tX_max;
      if (tY>tY_max) tY=tY_max;
      if (tX<tX_min) tX=tX_min;
      if (tY<tY_min) tY=tY_min;
//alert(""+e_height+" "+viewport_height);
//      if (tX<-e_width+viewport_width)   tX=-e_width +viewport_width;
//      if (tY<-e_height+viewport_height) tY=-e_height+viewport_height;
      e.style.left =String(tX)+"px";
      e.style.top  =String(tY)+"px";
      //e.style.clip="rect(" + tY + "px, " + (tX+viewport_width) + "px, " + (tY+viewport_height) + "px, " + tY + "px)" ;
      //e.style.clip="rect(20px, 120px, 120px, 20px)";

      //img=getElementById(overlayId);
      //if (img) {
      //  x=parseInt(img.style.left);   if (isNaN(x)) x=0;
      //  y=parseInt(img.style.top );   if (isNaN(y)) y=0;
      //  img.style.left=String(x+(tX-tX_old))+"px";
      //  img.style.top =String(y+(tY-tY_old))+"px";
      //}
    }
  }
  if (debug) window.status="mouse move: "+pX+","+pY+" "+tX+","+tY+" "+mX+","+mY+" "+deltaX+","+deltaY;
}