// init variables
var thisAd = 0;
var thisAd2 = 0;

// set up the array of images
var exampleImageArray = new Array ("/images/rotator/work/black_jack_pest_control_back.jpg", 
                                   "/images/rotator/work/black_jack_pest_control_door.jpg", 
                                   "/images/rotator/work/woodys_chicago_style_hotdogs_and_espresso.jpg", 
                                   "/images/rotator/work/woodys_corner_used_cars_and_trucks.jpg", 
                                   "/images/rotator/work/the_desert_lounge_bar.jpg",
                                   "/images/rotator/work/robertHaleBoat.jpg",
                                   "/images/rotator/work/the_cake_walk_01.jpg",
                                   "/images/rotator/work/the_cake_walk_02.jpg");
                                   
var possibilitiesImageArray = new Array ("/images/rotator/possibilities/work1.jpg");

window.onload = go();
 
function go() {
setTimeout("rotateTop()", 5 * 1000);
//setTimeout("rotateBottom()", 4 * 1000);
}
 
function rotateTop() {
    var arrayLength = exampleImageArray.length;
       thisAd++;
       if (thisAd == arrayLength) {
            thisAd = 0;
       }
    var imageHolderElem = document.getElementById('topImage');
    
    opacity('topImage', 0, 100, 800);
    
    document.getElementById('topImage').src = exampleImageArray[thisAd];
    document.getElementById('imageNumberTop').innerHTML = thisAd + 1;
    document.getElementById('imageTotalTop').innerHTML = arrayLength;
    setTimeout("opacity('topImage', 100, 0, 800)", 4 * 1000);
    setTimeout("rotateTop()", 5 * 1000);    
}

function rotateBottom() {
    var arrayLength = possibilitiesImageArray.length;
       thisAd2++;
       if (thisAd2 == arrayLength) {
            thisAd2 = 0;
       }
    var imageHolderElem = document.getElementById('bottomImage');
        document.getElementById('bottomImage').src = possibilitiesImageArray[thisAd];
    document.getElementById('imageNumberBottom').innerHTML = thisAd2 + 1;
    document.getElementById('imageTotalBottom').innerHTML = arrayLength;
    setTimeout("opacity('bottomImage', 0, 100, 800)", 0 * 1000);
    setTimeout("opacity('bottomImage', 100, 0, 800)", 4 * 1000);
    setTimeout("rotateBottom()", 5 * 1000);    
}

function opacity(id, opacStart, opacEnd, millisec) {
    //speed for each frame
    var speed = Math.round(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("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    } else if(opacStart < opacEnd) {
        for(i = opacStart; i <= opacEnd; i++)
            {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(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 + ")";
}