﻿/***********************************************
* Ultimate Fade-In Slideshow (v1.51): © Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

var fadebgcolor;

////NO need to edit beyond here/////////////

var fadearray = new Array() //array to cache photoSlideShow instances
var fadeclear = new Array() //array to cache corresponding clearinterval pointers
 
var dom = (document.getElementById) //modern dom browsers
var iebrowser = document.all

function photoSlideShow(theimages, fadebgcolor, fadewidth, fadeheight, borderwidth, delay)//, pause, displayorder)
{
    this.fadebgcolor = fadebgcolor
    this.pausecheck = 0
    this.mouseovercheck = 0
    this.delay = delay
    this.degree = 10 //initial opacity degree (10%)
    this.curimageindex = 0

    if (theimages.length > 1)
        this.nextimageindex = 1
    else
        this.nextimageindex = 0    
    
    fadearray[fadearray.length] = this
    this.slideshowid = fadearray.length-1
    this.canvasbase = "canvas"+this.slideshowid
    this.curcanvas = this.canvasbase+"_0"
    //if (typeof displayorder != "undefined")
    //    theimages.sort(function() {return 0.5 - Math.random();}) //thanks to Mike (aka Mwinter) :)
    this.theimages = theimages
    this.imageborder = parseInt(borderwidth)
    this.postimages = new Array() //preload images
    for (p = 0;p<theimages.length;p++)
    {
        this.postimages[p] = new Image()
        this.postimages[p].src = theimages[p][0]
    }
     
    var fadewidth = fadewidth + this.imageborder * 2
    var fadeheight = fadeheight + this.imageborder * 2
     
    if (iebrowser&&dom||dom) //if IE5+ or modern browsers (ie: Firefox)
        document.write('<div id = "master'+this.slideshowid+'" style = "position:relative;width:'+fadewidth+'px;height:'+fadeheight+'px;overflow:hidden;"><div id = "'+this.canvasbase+'_0" style = "position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;left:0;filter:progid:DXImageTransform.Microsoft.alpha(opacity = 10);opacity:0.1;-moz-opacity:0.1;-khtml-opacity:0.1;background-color:'+fadebgcolor+'"></div><div id = "'+this.canvasbase+'_1" style = "position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;left:0;filter:progid:DXImageTransform.Microsoft.alpha(opacity = 10);opacity:0.1;-moz-opacity:0.1;-khtml-opacity:0.1;background-color:'+fadebgcolor+'"></div></div>')
    else
        document.write('<div><img name = "defaultslide'+this.slideshowid+'" src = "'+this.postimages[0].src+'"></div>')
     
    if (iebrowser&&dom||dom) //if IE5+ or modern browsers such as Firefox
        this.startit()
    else
    {
        this.curimageindex++
        if (this.delay == 0)
            this.rotateImageForward();
        else
            setInterval("fadearray[" + this.slideshowid + "].rotateImageForward()", this.delay)
    }

    return this;
}

function fadepic(obj)
{
    if (obj.degree<100)
    {
        obj.degree += 10
        if (obj.tempobj.filters&&obj.tempobj.filters[0])
        {
            if (typeof obj.tempobj.filters[0].opacity == "number") //if IE6+
                obj.tempobj.filters[0].opacity = obj.degree
            else //else if IE5.5-
                obj.tempobj.style.filter = "alpha(opacity = "+obj.degree+")"
        }
        else if (obj.tempobj.style.MozOpacity)
            obj.tempobj.style.MozOpacity = obj.degree/101
        else if (obj.tempobj.style.KhtmlOpacity)
            obj.tempobj.style.KhtmlOpacity = obj.degree/100
        else if (obj.tempobj.style.opacity&&!obj.tempobj.filters)
            obj.tempobj.style.opacity = obj.degree/101
    }
    else
    {
        clearInterval(fadeclear[obj.slideshowid])
        obj.nextcanvas = (obj.curcanvas == obj.canvasbase+"_0") ? obj.canvasbase+"_0" : obj.canvasbase+"_1"
        obj.tempobj = iebrowser ? iebrowser[obj.nextcanvas] : document.getElementById(obj.nextcanvas)
        obj.populateslide(obj.tempobj, obj.nextimageindex)
        obj.nextimageindex = (obj.nextimageindex < obj.postimages.length-1) ? obj.nextimageindex + 1 : 0
        if (obj.delay != 0)
            setTimeout("fadearray["+obj.slideshowid+"].rotateImageForward()", obj.delay)
    }
}

photoSlideShow.prototype.goToImage = function(index)
{
    if (this.pausecheck == 1) //if pause onMouseover enabled, cache object
    {
        var cacheobj = this
    }

    if (this.mouseovercheck == 1)
    {
        setTimeout(function() { cacheobj.rotateImageForward() }, 100)
    }
    else if (iebrowser && dom || dom)
    {
        this.populateslide(fadearray[this.slideshowid].tempobj, index)
        this.nextimageindex = (index < this.postimages.length - 1) ? index + 1 : 0
        
        this.resetit()
        var crossobj = this.tempobj = iebrowser ? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
        crossobj.style.zIndex++
        fadeclear[this.slideshowid] = setInterval("fadepic(fadearray[" + this.slideshowid + "])", 50)
        this.curcanvas = (this.curcanvas == this.canvasbase + "_0") ? this.canvasbase + "_1" : this.canvasbase + "_0"
    }
    else
    {
        var ns4imgobj = document.images['defaultslide' + this.slideshowid]
        ns4imgobj.src = this.postimages[this.curimageindex].src
    }

    this.curimageindex = index
}
 
photoSlideShow.prototype.populateslide =  function(picobj, picindex)
{
    var slideHTML = ""
    
    if (this.theimages[picindex][2] != "") //if associated link exists for image
        slideHTML = '<a href = "'+this.theimages[picindex][2]+'" target = "'+this.theimages[picindex][3]+'">'
    
    slideHTML += '<img src = "'+this.postimages[picindex].src+'" border = "'+this.imageborder+'px" />'
    
    if (this.theimages[picindex][2] != "") //if associated link exists for image
        slideHTML += '</a>'

    if (this.theimages[picindex][1] != "") //if associated text exists for image
        slideHTML += '<br /><center>' + this.theimages[picindex][1] + '</center>'

    picobj.innerHTML = slideHTML
}

photoSlideShow.prototype.resetit = function() 
{
    this.degree = 10
    var crossobj = iebrowser ? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
    
    if (crossobj.filters && crossobj.filters[0]) 
    {
        if (typeof crossobj.filters[0].opacity == "number") //if IE6+
            crossobj.filters(0).opacity = this.degree
        else //else if IE5.5-
            crossobj.style.filter = "alpha(opacity = " + this.degree + ")"
    }
    else if (crossobj.style.MozOpacity)
    {
        crossobj.style.MozOpacity = this.degree / 101
    }
    else if (crossobj.style.KhtmlOpacity) {
        crossobj.style.KhtmlOpacity = this.degree / 100
    }
    else if (crossobj.style.opacity && !crossobj.filters)
    {
        crossobj.style.opacity = this.degree / 101
    }
}

photoSlideShow.prototype.rotateImageBackwards = function()
{
    if (this.pausecheck == 1) //if pause onMouseover enabled, cache object
    {
        var cacheobj = this
    }

    if (this.mouseovercheck == 1)
    {
        setTimeout(function() { cacheobj.rotateImageForward() }, 100)
    }
    else if (iebrowser && dom || dom)
    {
        this.nextimageindex = (this.curimageindex > 0) ? this.curimageindex - 1 : this.postimages.length - 1
        this.populateslide(fadearray[this.slideshowid].tempobj, this.nextimageindex)
        this.nextimageindex = (this.nextimageindex < this.postimages.length - 1) ? this.nextimageindex + 1 : 0

        this.resetit()
        var crossobj = this.tempobj = iebrowser ? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
        crossobj.style.zIndex++
        fadeclear[this.slideshowid] = setInterval("fadepic(fadearray[" + this.slideshowid + "])", 50)
        this.curcanvas = (this.curcanvas == this.canvasbase + "_0") ? this.canvasbase + "_1" : this.canvasbase + "_0"
    }
    else
    {
        var ns4imgobj = document.images['defaultslide' + this.slideshowid]
        ns4imgobj.src = this.postimages[this.curimageindex].src
    }

    this.curimageindex = (this.curimageindex > 0) ? this.curimageindex - 1 : this.postimages.length - 1
}

photoSlideShow.prototype.rotateImageForward = function() 
{
    if (this.pausecheck == 1) //if pause onMouseover enabled, cache object
    {
        var cacheobj = this
    }

    if (this.mouseovercheck == 1)
    {
        setTimeout(function() { cacheobj.rotateImageForward() }, 100)
    }
    else if (iebrowser && dom || dom)
    {
        this.resetit()
        var crossobj = this.tempobj = iebrowser ? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
        crossobj.style.zIndex++
        fadeclear[this.slideshowid] = setInterval("fadepic(fadearray[" + this.slideshowid + "])", 50)
        this.curcanvas = (this.curcanvas == this.canvasbase + "_0") ? this.canvasbase + "_1" : this.canvasbase + "_0"
    }
    else 
    {
        var ns4imgobj = document.images['defaultslide' + this.slideshowid]
        ns4imgobj.src = this.postimages[this.curimageindex].src
    }
    
    this.curimageindex = (this.curimageindex < this.postimages.length - 1) ? this.curimageindex + 1 : 0
}

photoSlideShow.prototype.startit = function()
{
    var crossobj = iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
    this.populateslide(crossobj, this.curimageindex)
    if (this.pausecheck == 1)
    { //IF SLIDESHOW SHOULD PAUSE ONMOUSEOVER
        var cacheobj = this
        var crossobjcontainer = iebrowser? iebrowser["master"+this.slideshowid] : document.getElementById("master"+this.slideshowid)
        crossobjcontainer.onmouseover = function(){cacheobj.mouseovercheck = 1}
        crossobjcontainer.onmouseout = function(){cacheobj.mouseovercheck = 0}
    }
    this.rotateImageForward()
}