var arrTimeouts;
var varLastSlideIndex;
var varSpeed;
var varSlideTotal;

function clearAllTimeouts() {
    for (key in arrTimeouts) {
        clearTimeout(arrTimeouts[key]);
    }
}

function showSlide(varSlideIndexIn) {

    if (varSlideIndexIn > varSlideTotal) {
        varSlideIndexIn = 1;
    }

    clearAllTimeouts();
    arrTimeouts["changeSlideID"] = setTimeout("showSlide(" + (varSlideIndexIn + 1) + ")", varSpeed * 1000);

    blendImage("imgSlide", 500);

    //set the current image as background
    document.getElementById("divSlide").style.backgroundImage = "url(upload/images/slideshow/slide_" + varLastSlideIndex + ".jpg)";
    document.getElementById("imgSlide").src = "upload/images/slideshow/slide_" + varSlideIndexIn + ".jpg";
    document.getElementById("imgSlide").style.left = '-617px';
    var intCounter = 1;
    for (intCounter = 1; intCounter <= varSlideTotal; intCounter++) {
        document.getElementById("btnSlide" + intCounter).style.backgroundPosition = "top";
    }
    document.getElementById("btnSlide" + varSlideIndexIn).style.backgroundPosition = "bottom";
    varLastSlideIndex = varSlideIndexIn;
}

function slideImage(imageid, millisec,width) {
    var speed = Math.round(millisec / 100);
    var timer = 0;

    //move image to default position
    changePos(0, imageid);

    //start sliding image
    for (i = (width); i >= 0; i--) {
        arrTimeouts["fadeSlide" + i] = setTimeout("changePos(" + i + ",'" + imageid + "')", (timer * speed));
        timer++;
    }
}

//change the position of the object
function changePos(x, id) {
    var object = document.getElementById(id).style;
    object.left = x + 'px';
    object.position = 'absolute';
}

function blendImage(imageid, millisec) {
    var speed = Math.round(millisec / 100);
    var timer = 0;

    //make image transparent
    changeOpac(0, imageid);

    //fade in image
    for (i = 0; i <= 100; i++) {
        arrTimeouts["fadeSlide" + i] = setTimeout("changeOpac(" + i + ",'" + imageid + "')", (timer * speed));
        timer++;
    }
}

//change the opacity for different browsers
function changeOpac(opacity, id) {
    var object = document.getElementById(id).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
}

function startSlideShow(slideTotalIn, speedIn) {
    arrTimeouts = new Array();
    varSpeed = speedIn;
    varSlideTotal = slideTotalIn;
    varLastSlideIndex = 1;
    document.getElementById("imgSlide").src = "upload/images/slideshow/slide_1.jpg";
    showSlide(1);
}