﻿/* Create fadeImage Object */
function fadeImage() {
    this.divid = '';
    this.imageid = '';
    this.imagefile = '';
    this.millisec = 300;
    this.fadestarted = 0;
}

/************************************************************************************************/
/* Functions */
/************************************************************************************************/
//change the opacity for different browsers
function changeOpac(opacity, imageid) {
    //alert(opacity);
    //alert(imageid);

    var object = document.getElementById(imageid).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
}

function blendimage(fadeImageObj) {
    if (fadeImageObj.fadestarted == 0) {
        fadeImageObj.fadestarted = 1;

        var speed = Math.round(fadeImageObj.millisec / 100);
        var timer = 0;

        //set the current image as background
        document.getElementById(fadeImageObj.divid).style.backgroundImage = "url(" + document.getElementById(fadeImageObj.imageid).src + ")";

        //make image transparent
        changeOpac(0, fadeImageObj.imageid);

        //make new image
        document.getElementById(fadeImageObj.imageid).src = fadeImageObj.imagefile;

        //fade in image
        for (var i = 0; i <= 100; i++) {
            setTimeout("changeOpac(" + i + ",'" + fadeImageObj.imageid + "')", (timer * speed));
            timer++;
        }

        setTimeout(function() {
            fadeTransComplete(fadeImageObj)
        }, (timer * speed));
    }
    else {
        setTimeout(function() {
            fadeTransComplete(fadeImageObj)
        }, (timer * speed));
    }
}

function fadeTransStart(fadeImageObj) {
    if (fadeImageObj.fadestarted == 0) {
        blendimage(fadeImageObj);
    }
}

function fadeTransComplete(fadeImageObj) {
    fadeImageObj.fadestarted = 0;
}

/*
function currentOpac(fadeImageObj, opacEnd, millisec) {
//standard opacity is 100
var currentOpac = 100;

//if the element has an opacity set, get it
if (document.getElementById(fadeImageObj.imageid).style.opacity < 100) {
currentOpac = document.getElementById(fadeImageObj.imageid).style.opacity * 100;
}

//call for the function that changes the opacity
opacity(fadeImageObj, currentOpac, opacEnd);
}

function opacity(fadeImageObj, opacStart, opacEnd) {
//speed for each frame
var speed = Math.round(fadeImageObj.millisec / 100);
var timer = 0;

//determine the direction for the blending, if start and end are the same nothing happens
if (opacStart > opacEnd) {
for (i = opacStart; i >= opacEnd; i--) {
setTimeout(function() {
changeOpac(i, fadeImageObj);
}, (timer * speed));
timer++;
}
} else if (opacStart < opacEnd) {
for (i = opacStart; i <= opacEnd; i++) {
setTimeout(function() {
changeOpac(i, fadeImageObj);
}, (timer * speed));
timer++;
}
}
}

function shiftOpacity(fadeImageObj) {
//if an element is invisible, make it visible, else make it ivisible
if (document.getElementById(fadeImageObj.imageid).style.opacity == 0) {
opacity(fadeImageObj, 0, 100);
} else {
opacity(fadeImageObj, 100, 0);
}
}
*/