var oWindow;
var ImageTemp;
var PAN_SPEED = 10;
var WIN_WIDTH;
var LEFT_POSITION;
var LEFT_EXTREME;
var RIGHT_EXTREME;
var WIN_HEIGHT;
var IntervalID;
var PanningStatus = false;
var NAV_LEFT;
var IMAGE_PANEL;
var Screen_Height = screen.height;
var Screen_Width = screen.width;

function View360(IMAGE_URL,IMAGE_HEIGHT,IMAGE_WIDTH,RATIO) {

  var VIEW_TOP = (Screen_Height - IMAGE_HEIGHT) / 2;
  var VIEW_LEFT = (Screen_Width - IMAGE_WIDTH) / 2;

  if(oWindow){
    oWindow.close();
  }

  ImageTemp = new Image();
  ImageTemp.src = IMAGE_URL;
  WIN_WIDTH = (IMAGE_WIDTH / RATIO);
  WIN_HEIGHT = IMAGE_HEIGHT + 30;

  var VIEW_TOP = (Screen_Height - WIN_HEIGHT) / 2;
  var VIEW_LEFT = (Screen_Width - WIN_WIDTH) / 2;

  LEFT_POSITION = (IMAGE_WIDTH * 9);
  IMAGE_WIDTH = IMAGE_WIDTH * 20;

  var strImages = "";
  for(var iImageCounter = 0;iImageCounter < 20;iImageCounter++){
    strImages += "<td><img src='" + IMAGE_URL + "'></td>";
  }

  LEFT_POSITION = LEFT_POSITION * -1; 
  LEFT_EXTREME = LEFT_POSITION;
  RIGHT_EXTREME = WIN_WIDTH - IMAGE_WIDTH;
  NAV_LEFT = (WIN_WIDTH / 2) - 33;

  var strFeatures = "left=" + VIEW_LEFT + ",top=" + VIEW_TOP + ",height="
	+ WIN_HEIGHT + ",width=" + WIN_WIDTH + ",scrollbars=no";
  var strHTML = "";
  oWindow = window.open("","3D",strFeatures);

  strHTML += "<html><head><title>360 Viewer</title></head><body bgcolor=black style='Margin:0;'>";
  strHTML += "<div id=ImagePanel name=ImagePanel  style='position:absolute;left:" 
	+ LEFT_POSITION + ";top:0;width:" + IMAGE_WIDTH + ";height:" + IMAGE_HEIGHT + ">";
  strHTML += "<table border=0 cellspacing=0 cellpadding=0><tr>";
  strHTML += strImages; 
  strHTML += "</tr></table></div>";
  strHTML += "<div style='position:absolute;top:" + (IMAGE_HEIGHT + 6)  
	+ ";left:" + NAV_LEFT + ";'>";
  strHTML += "<a href='javascript:window.opener.PanLeft();' onmouseout='window.opener.StopPan();'><img border=0 src='panleft.gif' id=cmdPanLeft name=cmdPanLeft></a>";
  strHTML += "<a href='javascript:window.opener.PanMiddle();'><img border=0 src='pancentre.gif'></a>";
  strHTML += "<a href='javascript:window.opener.PanRight();' onmouseout='window.opener.StopPan();'><img border=0 src='panright.gif' id=cmdPanRight name=cmdPanRight></a>";
  strHTML += "</div></body></html>";

  oWindow.document.write(strHTML);
  IMAGE_PANEL = oWindow.document.all["ImagePanel"];
}

function PanLeft() {
  if (PanningStatus == false) {
    PanningStatus = true;
  } else {
    StopPan();
  }

  if (PanningStatus) { 
    oWindow.document.images["cmdPanLeft"].src = "panleft_on.gif";
    IntervalID = window.setInterval("MoveLeft()",PAN_SPEED);
  }
}

function PanRight() { 
  if(PanningStatus == false) {
    PanningStatus = true;
  } else { 
    StopPan();
  }

  if(PanningStatus) { 
    oWindow.document.images["cmdPanRight"].src = "panright_on.gif";
    IntervalID = window.setInterval("MoveRight()",PAN_SPEED);
  }
}

function MoveLeft() {
  if(LEFT_POSITION < 0) {
    LEFT_POSITION = LEFT_POSITION + 1;
    IMAGE_PANEL.style.left = LEFT_POSITION;
  } else { 
    StopPan();
  }
}

function MoveRight() {
  if(LEFT_POSITION > RIGHT_EXTREME) {
    LEFT_POSITION = LEFT_POSITION - 1;
    IMAGE_PANEL.style.left = LEFT_POSITION;
  } else {
    StopPan();
  }
}

function PanMiddle() {
  IMAGE_PANEL.style.left = LEFT_EXTREME;
  LEFT_POSITION = LEFT_EXTREME;
}

function StopPan() {
  oWindow.document.images["cmdPanLeft"].src = "panleft.gif";
  oWindow.document.images["cmdPanRight"].src = "panright.gif";
  window.clearInterval(IntervalID);
  PanningStatus = false;
}
