var bNS4;
var bNS6Comp;
var bMinIE4;
var bOpera;
var bExclude;
var imgs = new Array();
imgs[0]="images/angel01.jpg";imgs[1]="images/angel02.jpg";imgs[2]="images/angel03.jpg";imgs[3]="images/angel04.jpg";
var yposition;
var loadedcolor='#A0522D';
var unloadedcolor='white';
var barheight=16;
var barwidth=500; 
var bordercolor='#A0522D';
var imagesdone=false;
var blocksize=barwidth/(imgs.length);
var currentLink;
barheight=Math.max(barheight,25);
var loaded=0, perouter, perdone, images=new Array();
var txt=(bNS4)?'<layer name="perouter" bgcolor="'+bordercolor+'" visibility="hide">' : '<div id="perouter" style="position:absolute; visibility:hidden; background-color:'+bordercolor+'">';
txt+='<table cellpadding="0" cellspacing="1" border="0"><tr><td width="'+barwidth+'" height="'+barheight+'" valign="center">';
if(bNS4)txt+='<ilayer width="100%" height="100%"><layer width="100%" height="100%" bgcolor="'+unloadedcolor+'" top="0" left="0">';
txt+='<table cellpadding="0" cellspacing="0" border="0"><tr><td valign="center" width="'+barwidth+'" height="'+barheight+'" bgcolor="'+unloadedcolor+'"><center><font color="'+loadedcolor+'" size="1" face="sans-serif">Loading Image Gallery, Please Wait...</font></center></td></tr></table>';
if(bNS4) txt+='</layer>';
txt+=(bNS4)? '<layer name="perdone" width="100%" height="'+barheight+'" bgcolor="'+loadedcolor+'" top="0" left="0">' : '<div id="perdone" style="position:absolute; top:1px; left:1px; width:'+barwidth+'px; height:'+barheight+'px; background-color:'+loadedcolor+'; z-index:100">';
txt+='<table cellpadding="0" cellspacing="0" border="0"><tr><td valign="center" width="'+barwidth+'" height="'+barheight+'" bgcolor="'+loadedcolor+'"><center><font color="'+unloadedcolor+'" size="1" face="sans-serif">Loading Image Gallery, Please Wait...</font></center></td></tr></table>';
txt+=(bNS4)? '</layer></ilayer>' : '</div>';
txt+='</td></tr></table>';
txt+=(bNS4)?'</layer>' : '</div>';
document.write(txt);
function loadimages(iTop){
getBrowser();
yposition = iTop;
if(bNS4){
perouter=document.perouter;
perdone=document.perouter.document.layers[0].document.perdone;
}
if(bNS6Comp){
perouter=document.getElementById('perouter');
perdone=document.getElementById('perdone');
}
if(bMinIE4||bOpera){
perouter=document.all.perouter;
perdone=document.all.perdone;
}
cliplayer(perdone,0,0,barheight,0);
window.onresize=setouterpos;
setouterpos(barwidth);
for(n=0;n<imgs.length;n++){
images[n]=new Image();
images[n].src=imgs[n];
setTimeout('checkload('+n+')' ,n*100);
}
}
function setouterpos(bwidth){
var ww=(bMinIE4||bOpera)? document.body.clientWidth : window.innerWidth;
var objCell = getObject("cellImg");
var iCellXLeft = DL_GetElementLeft(objCell);
var iMainWidth = (ww*.98)-iCellXLeft;
var x=((iMainWidth/2)-(iCellXLeft/2));
if(bNS4){
perouter.moveTo(x,yposition);
perouter.visibility="show";
}
if(bMinIE4||bNS6Comp||bOpera){
perouter.style.left=x+'px';
perouter.style.top=yposition+'px';
perouter.style.visibility="visible";
}
}
function dispbars(){
loaded++;
cliplayer(perdone, 0, blocksize*loaded, barheight, 0);
if(loaded>=imgs.length)setTimeout('hideperouter()', 800);
}
function checkload(index){
(images[index].complete)? dispbars() : setTimeout('checkload('+index+')', 100);
}
function hideperouter(){
if(bNS4){
  perouter.visibility="hide";
}if(bNS6Comp){
  document.getElementById("perouter").style.visibility="hidden";
  document.getElementById("perouter").innerHTML="";
}else{
  document.all.perouter.style.visibility="hidden";
  document.all.perouter.innerHTML="";
}
imagesdone=true;
if(bNS4){
  document.imgGallery.src = "images/angel01.jpg";
  document.lnk1.style.color = "red";
  document.lnk1.style.textDecoration = "none";
  document.cellImg.visibility = "show";
}else if(bNS6Comp){
  objImgGallery = getObject("imgGallery");
  objLink = getObject("lnk1");
  objCell = getObject("cellImg");
  objImgGallery.src = "images/angel01.jpg";
  objLink.style.color = "red";
  objLink.style.textDecoration = "none";
  objCell.style.visibility = "visible";
}else{
  document.imgGallery.src = "images/angel01.jpg";
  document.all.lnk1.style.color = "red";
  document.all.lnk1.style.textDecoration = "none";
  document.all.cellImg.style.visibility = "visible";
}
  currentLink = "lnk1";
}
function cliplayer(layer, ct, cr, cb, cl){
if(bNS4){
layer.clip.left=cl;
layer.clip.top=ct;
layer.clip.right=cr;
layer.clip.bottom=cb;
}
if(bMinIE4||bNS6Comp||bOpera){
layer.style.clip='rect('+ct+' '+cr+' '+cb+' '+cl+')';
}
}
function getImage(index){
  var theImg = imgs[index];
  return theImg;
}
/* ---------------- Browser Detection Function -------------------*/
  function getBrowser(){
    var bKDE=false;
    bNS4=false;
    bNS6Comp=false;
    bMinIE4=false;
    bOpera=false;
    bExclude=false;
    var agt=navigator.userAgent.toLowerCase();
    var is_major = parseInt(navigator.appVersion);
    var is_minor = parseFloat(navigator.appVersion);
    var is_nav=((agt.indexOf('mozilla')!=-1) && (agt.indexOf('spoofer')==-1)
                && (agt.indexOf('compatible') == -1) && (agt.indexOf('opera')==-1)
                && (agt.indexOf('webtv')==-1) && (agt.indexOf('hotjava')==-1));
    var is_nav6=(is_nav && (is_major == 5));
    var is_nav6up=(is_nav && (is_major >= 5));
    var is_gecko=(agt.indexOf('gecko') != -1);
    var is_firefox=(is_gecko && agt.indexOf("Firefox")!=-1);
    var is_ie     = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1));
    bMinIE4  = (is_ie && (is_major >= 4));
    var is_opera = (agt.indexOf("opera") != -1);
    var is_opera2 = (agt.indexOf("opera 2") != -1 || agt.indexOf("opera/2") != -1);
    var is_opera3 = (agt.indexOf("opera 3") != -1 || agt.indexOf("opera/3") != -1);
    var is_opera4 = (agt.indexOf("opera 4") != -1 || agt.indexOf("opera/4") != -1);
    var is_opera5up = (is_opera && !is_opera2 && !is_opera3 && !is_opera4);
    if(typeof navigator.vendor!="undefined" && navigator.vendor=="KDE"){
      bKDE=true;
    }else if(is_nav && (is_major == 4)){
      bNS4=true;
    }else if(is_opera5up){
      bOpera=true;
    }else if(is_nav6||is_nav6up||is_firefox){
      bNS6Comp=true;
    }else if(is_ie && (is_major >= 4)){
      bMinIE4=true;
    }else if(is_nav && agt.indexOf('webtv')!=-1){
      bExclude=true;
    }else{
      bExclude=true;
    }
  }
  /* ---------------- Navigation Menu Functions -------------------*/
  function inCell(cell, newcolor, link){
    var objCell = getObject(cell);
    var objLink = getObject(link);
    objCell.bgColor = newcolor;
    objLink.style.color = "yellow";
    if(!bNS4){
      if(bNS6Comp){
        objLink.style.cursor = "pointer";
      }else{
        objLink.style.cursor = "hand";
      }
    }
  }
  function outCell(cell, newcolor, link){
    var objCell = getObject(cell);
    var objLink = getObject(link);
    objCell.bgColor = newcolor;
    objLink.style.color = "white";
    if(!bNS4){
      if(bNS6Comp){
        objLink.style.cursor = "default";
      }else{
        objLink.style.cursor = "auto";
      }
    } 
  }
  function onLink(link){
    var objLink = getObject(link);
    objLink.style.textDecoration = "underline";
    if(!bNS4){
      if(bNS6Comp){
        objLink.style.cursor = "pointer";
      }else{
        objLink.style.cursor = "hand";
      }
    }
  }
  function offLink(link){
    var objLink = getObject(link);
    objLink.style.textDecoration = "none";
    if(!bNS4){
      if(bNS6Comp){
        objLink.style.cursor = "default";
      }else{
        objLink.style.cursor = "auto";
      }
    } 
  }

/* ----------------  Image Handling Functions  -------------------------------*/
  function onView(link,cell){
    var objLink = getObject(link);
    var objCell = getObject(cell);
    objLink.className = "linkSelected";
    objCell.className = "cellSelected";
    if(!bNS4){
      if(bNS6Comp){
        objLink.style.cursor = "pointer";
      }else{
        objLink.style.cursor = "hand";
      }
    }
  }
  function offView(link,cell){
    var objLink = getObject(link);
    var objCell = getObject(cell);
    objLink.className = "linkSelect";
    objCell.className = "cellSelect";
    if(!bNS4){
      objLink.style.cursor = "auto";
    }
  }
  function show(imgID,lnkID){
    setLinkStyles();
    var objImg = getObject("imgGallery");
    var objLink = getObject(lnkID);
    objImg.src = imgID;
    objLink.style.textDecoration = "none";
    objLink.style.color = "red";
  }
  function setLinkStyles(){
    var objLink1 = getObject("lnk1");
    var objLink2 = getObject("lnk2");
    var objLink3 = getObject("lnk3");
    var objLink4 = getObject("lnk4");
    objLink1.style.textDecoration = "underline";
    objLink1.style.color = "blue";
    objLink2.style.textDecoration = "underline";
    objLink2.style.color = "blue";
    objLink3.style.textDecoration = "underline";
    objLink3.style.color = "blue";
    objLink4.style.textDecoration = "underline";
    objLink4.style.color = "blue";
  }
/* ---------------- DHTML API Functions -------------------*/
  function getObject(sObjID){
    var obj;
    var q = "\"";
    if(bNS4){
      obj = eval("document." + sObjID);
    }else if(bNS6Comp){
      var sID = q + sObjID.toString() + q;
      obj = eval("document.getElementById(" + sID + ")");
    }else if(bMinIE4||bOpera){
      obj = eval("document.all." + sObjID);
    }
    return obj;
  }
  function DL_GetElementLeft(eElement){
    if (!eElement && this){                     // if argument is invalid (not specified, is null or is 0)
      eElement = this;                          // and function is a method
    }                                           // identify the element as the method owner
    var DL_bIE = document.all ? true : false;   // initialize var to identify IE
    var nLeftPos = eElement.offsetLeft;         // initialize var to store calculations
    var eParElement = eElement.offsetParent;    // identify first offset parent element
    while (eParElement != null){                // move up through element hierarchy
      if(DL_bIE){                               // if browser is IE, then...
         if( (eParElement.tagName != "TABLE") && (eParElement.tagName != "BODY") ){ // if parent is not a table or the body
           nLeftPos += eParElement.clientLeft;  // append cell border width to calcs
         }
      }
      else{                                     // if browser is Gecko, then...
         if(eParElement.tagName == "TABLE"){    // if parent is a table, then get its border as a number
            var nParBorder = parseInt(eParElement.border);
            if(isNaN(nParBorder)){              // if no valid border attribute, then... 
               var nParFrame = eParElement.getAttribute('frame');  // check the table's frame attribute
               if(nParFrame != null){           // if frame has ANY value, then...
                  nLeftPos += 1;                // append one pixel to counter
               }
            }
            else if(nParBorder > 0){            // if a border width is specified, then...
               nLeftPos += nParBorder;          // append the border width to counter
            }
         }
      }
      nLeftPos += eParElement.offsetLeft;       // append left offset of parent
      eParElement = eParElement.offsetParent;   // and move up the element hierarchy
    }                                           // until no more offset parents exist
    return nLeftPos;                            // return the number calculated
  }
  function DL_GetElementTop(eElement){
    if (!eElement && this){                      // if argument is invalid (not specified, is null or is 0)
      eElement = this;                           // and function is a method
    }                                            // identify the element as the method owner
    var DL_bIE = document.all ? true : false;    // initialize var to identify IE
    var nTopPos = eElement.offsetTop;            // initialize var to store calculations
    var eParElement = eElement.offsetParent;     // identify first offset parent element
    while (eParElement != null){                 // move up through element hierarchy
      if(DL_bIE){                                // if browser is IE, then...
        if( (eParElement.tagName != "TABLE") && (eParElement.tagName != "BODY") ){ // if parent a table cell, then...
          nTopPos += eParElement.clientTop;      // append cell border width to calcs
        }
      }
      else{                                      // if browser is Gecko, then...
        if(eParElement.tagName == "TABLE"){      // if parent is a table, then get its border as a number
          var nParBorder = parseInt(eParElement.border);
          if(isNaN(nParBorder)){                 // if no valid border attribute, then...
            var nParFrame = eParElement.getAttribute('frame');  // check the table's frame attribute
            if(nParFrame != null){               // if frame has ANY value, then...
              nTopPos += 1;                      // append one pixel to counter
            }
          }
          else if(nParBorder > 0){               // if a border width is specified, then...
            nTopPos += nParBorder;               // append the border width to counter
          }
        }
      }
      nTopPos += eParElement.offsetTop;          // append top offset of parent
      eParElement = eParElement.offsetParent;    // and move up the element hierarchy
    }                                            // until no more offset parents exist
    return nTopPos;                              // return the number calculated
  }





