// Picture Rotator Script
// Written by Andrew Sayre
//
// initImages is defined on the page

//
// setup our main variables.... 
//
var imgS = new Array();
// we're not going to preload the big images
var imgL = new Array();
var blankImg = new Image(); blankImg.src = '/reslife/pictures/bg.gif';
var currentImage = 0;
var baseImgUrl = '/reslife/pictures/';

//attach our event
window.onload = browserLoad;

//
// functions
//
function initImages(imgCount, imgName, thumbSubDirectory) {
    //setup the thumbs
    for(i = 0; i <= (imgCount -1); i++) {
        imgS[i] = new Image();
        
        if (thumbSubDirectory == true) {
            imgS[i].src = baseImgUrl + imgName + '/thumbs/' + imgName + formatNumber(i) + 'thumb.jpg';
        } else {
            imgS[i].src = baseImgUrl + imgName + '/' + imgName + formatNumber(i) + 'thumb.jpg';
        }

    }
    
    // setup the pictures
    for(i = 0; i <= (imgCount -1); i++) {
        imgL[i] = baseImgUrl + imgName + '/' + imgName + formatNumber(i) + '.jpg';
    }
}

function formatNumber(numb) {
    var strnumb = (numb + 1) + ''
    if (strnumb.length == 1) { return '0' + strnumb } else { return strnumb }
}

function browserLoad() {
    generateThumbs();
    loadImage(currentImage);
}

function loadImage(number) {
    var imgRotator; imgRotator = document.getElementById('imgRotator');
    var imgLink; imgLink = document.getElementById('imgLink');
    var imgNumbers; imgNumbers = document.getElementById('imgNumbers');
    var loadingScreen; loadingScreen = document.getElementById('loadingScreen');

    imgRotator.src = blankImg.src;
    
    //highlight thumb..
    toggleThumb(number, true);
    
    imgNumbers.innerHTML = 'Picture <strong>' + (number + 1) + '</strong> of <strong>' + imgL.length + '</strong>.';
    imgRotator.src = imgL[number];
    imgLink.href = imgL[number];
}

function imageClick() {
    toggleThumb(currentImage, false);
    
    // adavance the image
    currentImage++;
    
    if ((currentImage) > (imgL.length -1)) { currentImage = 0; }
    loadImage(currentImage);
}

function generateThumbs() {
    var imgThumbs; imgThumbs = document.getElementById('imgThumbs');
    for(i = 0; i <= (imgS.length -1); i++) {
        imgThumbs.innerHTML += '<li><a href="' + imgL[i] + '" onclick="return false;"><img onclick="thumbClick(' + i + ');" id="thumb' + i + '" src="' + imgS[i].src + '" title="" alt="" /></a></li>'
    }
}

function toggleThumb(number, highlight) {
    var thumbImg; thumbImg = document.getElementById('thumb' + number);
    if (highlight) {
        thumbImg.style.borderColor = 'red';
    } else {
        thumbImg.style.borderColor = '';
    }
}

function thumbClick(theThumb) {
    toggleThumb(currentImage, false);
    currentImage = theThumb;
    loadImage(currentImage);
}