﻿function photofader(nm, mainDiv, imgArr){
    this.name        = nm;
    this.imgArr = imgArr;
    this.curImg = 0;
    this.curDiv = 1;
    
    var mainDv = document.getElementById(mainDiv);
    
    document.pfObj = this;
    
    document.write("<style type='text/css'>\n");
    document.write("#pf_photo1 span { visibility:hidden; }\n");
    document.write("#pf_photo1 { position:absolute; top: 0; left: 0; z-index: 1; height: 126px; width: 100%; }\n");
    document.write("#pf_photo2 { position:absolute; top: 0; left: 0; z-index: 0; height: 126px; width: 100%; }\n");
    document.write("</style>");
    
    this.initImages = function() {
        document.write("<scr");
        document.write("ipt type='text/javascript'>\n");
        for(var i=0; i<this.imgArr.length; i++){
            document.write("var img"+i+" = new Image();\n");
            document.write("img"+i+".src = '"+ this.imgArr[i] +"';\n");
        }
        document.write("document.pfObj.start();\n");
        document.write("</scr");
        document.write("ipt>\n");
        
    }
    
    this.start = function(){
        var hldr1 = "pf_photo1";
        var hldr2 = "pf_photo2";
        
        var dv1 = document.createElement("div");
                dv1.id = "pf_photo1";
                dv1.innerHTML = "<span class=\"innerheader\" style=\"background-image: url('"+ imgArr[0] +"'); background-repeat: no-repeat;\" />";
        var dv2 = document.createElement("div");
                dv2.id = "pf_photo2";
        
        mainDv.appendChild(dv1);
        mainDv.appendChild(dv2);
        
        image1 = document.getElementById(hldr1).childNodes[0];
        
        setOpacity(image1, 0);
        image1.style.visibility = 'visible';
        setTimeout("fadeIn('"+hldr1+"',0)",delay*1000);
    }
    
    this.initImages();
}
    
function setOpacity(obj, opacity) {
  opacity = (opacity == 100)?99.999:opacity;
  
  // IE/Win
  obj.style.filter = "alpha(opacity:"+opacity+")";
  
  // Safari<1.2, Konqueror
  obj.style.KHTMLOpacity = opacity/100;
  
  // Older Mozilla and Firefox
  obj.style.MozOpacity = opacity/100;
  
  // Safari 1.2, newer Firefox and Mozilla, CSS3
  obj.style.opacity = opacity/100;
}

function fadeIn(objId,opacity) {
  if (document.getElementById) {
    obj = document.getElementById(objId).childNodes[0];
    if (opacity < 100) {
            speed = (speed < 2)?2:speed;
            setOpacity(obj, opacity);
            opacityDif = Math.ceil((100-opacity)/speed);
            opacity += opacityDif;
      //opacity += 2;
      window.setTimeout("fadeIn('"+objId+"',"+opacity+")", 100);
    }
        else {           
            setTimeout("swapImages()",delay*1000);
            obj.style.removeAttribute('filter');
        }
  }
}

function swapImages(){
    // find out which 
    if(document.pfObj.curImg == document.pfObj.imgArr.length-1)
        document.pfObj.curImg = 0;
    else 
        ++document.pfObj.curImg;
    // now get the div to hld the new image
    var dvName    = (document.pfObj.curDiv == 1)?"pf_photo2":"pf_photo1";
    var eDivName        = (document.pfObj.curDiv == 1)?"pf_photo1":"pf_photo2";
    document.pfObj.curDiv = (document.pfObj.curDiv == 1)?2:1;
    
    var tgtDiv = document.getElementById(dvName);
    var eDiv = document.getElementById(eDivName);
    
    // now fill the target div
    tgtDiv.innerHTML = "<span class=\"innerheader\" style=\"background-image: url('"+ document.pfObj.imgArr[document.pfObj.curImg] +"'); visibility:hidden; background-repeat: no-repeat;\" />";
    
    //move the divs around in z-index
    eDiv.style.zIndex = 0;
    tgtDiv.style.zIndex = 1;
    
    // And finally fade in the image
    
  var img = tgtDiv.childNodes[0];
    
  setOpacity(img, 0);
  img.style.visibility = 'visible';
  fadeIn(tgtDiv.id,0);
}