var id=null;
var urlI = "http://officestreet.com/newsite/img/";
var nameButton = "";
var smName;
var activeFlag = 0;
var afSPage;
var smFlag = 1;
var loadedImages = new Array (
  "btn_Home_on.gif",
  "btn_OurListings_on.gif",
  "btn_AboutUs_on.gif",
  "btn_ClientExtranet_on.gif",
  "btn_RecommendedLinks_on.gif",
  "btn_Services_on.gif",
  "btn_Team_on.gif",
  "btn_Clients_on.gif",
  "btn_Company_on.gif",
  "bg_Point_on.gif",
  "btn_List_on.gif"
  );
  
function preloadImages() {
  var xImages = new Array ();
                      
    for (i=0; i < loadedImages.length; i++) {
      xImages[i] = new Image ();
      xImages[i].src = urlI + loadedImages[i];
    }
}

function doPoint(pnumb,pflag) {
  varLlink = "llink"+pnumb;
  varLpoint = "lpoint"+pnumb;
  varInfo = "info"+pnumb;
  document.getElementById(varLlink).className = (pflag) ? "on" : "off";
  document.getElementById(varLpoint).className = (pflag) ? "on" : "off";
  document.getElementById(varInfo).style.display = (pflag) ? "block" : "none";
}

function DoOver(iname,smenu,aflag){ 

  if (nameButton != "") {
    smFlag = 1;
    DoHide();
  }
  
  if (iname == nameButton) smFlag = 0;
  else {
    nameButton = iname;
    document.images[nameButton].src = urlI+nameButton+"_on.gif";
  
    smName = smenu;
    if(smName != undefined) {
      document.getElementById(smName).className = "smenu-bar-on";
      activeFlag = 1;
    }
    
    afSPage = (aflag != undefined)? aflag : 0 ;
  } 
  
}

function killtimer(){

  if(id!=null){
    clearTimeout(id);
    id=null;    
  }

  return true;
}

function DoHide(){  

  if (smFlag) {

    if(id!=null) {
      killtimer();    
    }
  
    if (afSPage != 1) document.images[nameButton].src = urlI+nameButton+"_off.gif";
    nameButton = "";
    
    if(smName != undefined) {   
      document.getElementById(smName).className = "smenu-bar-off";
      smName = undefined;
      activeFlag = 0;   
    }
  
  }

}

function reset(){
  
  killtimer();
  
  if (activeFlag) {   
    id = setTimeout('DoHide()', 500);
  }
  else {
    if ((afSPage != 1)&&(nameButton != "")) document.images[nameButton].src = urlI+nameButton+"_off.gif";
    nameButton = "";
  }
    
}

function  DoOut(aSMflag,siname) {
  if (aSMflag) {
    smFlag = 1;
    if (siname != undefined) document.images[siname].src = urlI+siname+"_off.gif";
    reset();
  }
  else {
    smFlag = 0;
    if (siname != undefined) document.images[siname].src = urlI+siname+"_on.gif";
  }
}

function doList() {
var llinkStr = "";
  
  llinkStr = llinkStr + "<span>Our Listings:</span><ul>";
  for (i=0; i < xyPoint.length; i=i+5) {
    llinkStr = llinkStr + "<li><a href=\""+ xyPoint[i+2] +"\" id=\"llink"+ (i/5+1) +"\" onmouseover=\"doPoint("+ (i/5+1) +",1);\" onmouseout=\"doPoint("+ (i/5+1) +",0);\">"+ xyPoint[i+3] +"</a></li>";                  
  }
  llinkStr = llinkStr + "</ul>";
  document.getElementById("left-blocks-cont2").innerHTML = llinkStr;
  
}

function doListI() {
var llinkStr = "";
  
  llinkStr = llinkStr + "Listings <ul>";
  for (i=0; i < xyPoint.length; i=i+5) {
    llinkStr = llinkStr + "<li><a href=\""+ xyPoint[i+2] +"\" id=\"llink"+ (i/5+1) +"\" >"+ xyPoint[i+3] +"</a></li>";                  
  }
  llinkStr = llinkStr + "</ul>";
  document.getElementById("left-blocks-cont2").innerHTML = llinkStr;
  
}

function doPointInfo() {
var pointsStr = "";
var infoStr = "";
var pointInfoStr ="";

  pointInfoStr = "<img src=\"../img/ill_Map_01.gif\" id=\"illMap\" name=\"illMap\" width=\"460\" height=\"460\" />";
  
  
  for (i=0; i < xyPoint.length; i=i+5) {
    pointsStr = pointsStr + "<div id=\"point"+ (i/5+1) +"\" class=\"point\"><a href=\""+ xyPoint[i+2] +"\" id=\"lpoint"+ (i/5+1) +"\" onmouseover=\"doPoint("+ (i/5+1) +",1);\" onmouseout=\"doPoint("+ (i/5+1) +",0);\">"+ (i/5+1) +"</a></div>";
  } 
                  
  for (j=0; j < xyPoint.length; j=j+5) {
    infoStr = infoStr + "<div id=\"info"+ (j/5+1) +"\" class=\"info\"><table><tr><td><img src=\"img/ill_InfoBlock_tl.gif\" width=\"3\" height=\"3\" /></td><td class=\"all\"></td><td><img src=\"img/ill_InfoBlock_tr.gif\" width=\"3\" height=\"3\" /></td></tr><tr><td class=\"all\"></td><td class=\"all\">";
    infoStr = infoStr + "<img src=\""+ xyPoint[j+4] +"\" width=\"173\" height=\"134\" /><span>"+ xyPoint[j+3] +"</span>";
    infoStr = infoStr + "</td><td class=\"all\"></td></tr><tr><td><img src=\"img/ill_InfoBlock_bl.gif\" width=\"3\" height=\"3\" /></td><td class=\"all\"></td><td><img src=\"img/ill_InfoBlock_br.gif\" width=\"3\" height=\"3\" /></td></tr></table></div>";
  }
                    
  pointInfoStr = pointInfoStr+pointsStr+infoStr;
  document.getElementById("maper").innerHTML = pointInfoStr;
  
  for (i=0; i < xyPoint.length; i=i+5) {
    varPoint = "point" + (i/5+1);
    topPoint = xyPoint[i]-7;
    leftPoint = xyPoint[i+1]-9;
    topPoint = (topPoint<0)? 0 : topPoint;
    topPoint = (topPoint>442)? 442 : topPoint;
    leftPoint = (leftPoint<0)? 0 : leftPoint;
    leftPoint = (leftPoint>440)? 440 : leftPoint;
    document.getElementById(varPoint).style.top = ""+ topPoint + "px";
    document.getElementById(varPoint).style.left = ""+ leftPoint + "px";
  }
  
  for (j=0; j < xyPoint.length; j=j+5) {
    varInfo = "info" + (j/5+1);
    topInfo = xyPoint[j]-7;
    leftInfo = xyPoint[j+1]-190;                    
    topInfo = (topInfo+160>460)? xyPoint[j]-153 : topInfo;                
    leftInfo = (leftInfo<0)? xyPoint[j+1]+11 : leftInfo;
    document.getElementById(varInfo).style.top = ""+ topInfo + "px";
    document.getElementById(varInfo).style.left = ""+ leftInfo + "px";
  }
}