/* Controls the speed of fading in and out */
var speed = '.75';

function changeImage(div, caption) {
    
    // Fade out the current image
    $$('.current').each(function(elem) {
        elem.removeClassName('current');
        Effect.Fade(elem, {duration:speed});
    });
   
    // Fade in the new image
    Effect.Appear(div, {duration:speed});
   
    // Give the new image the 'current' class
    div.addClassName('current'); 
   
    // Update caption
    $('caption').innerHTML = '<p>' + caption + '</p>'; 

	var prevDiv = $$('div.current')[0].previous();
	var nextDiv = $$('div.current')[0].next();
	
	// Update nav
	if (!nextDiv) {
	    $('gallery-nav-next').hide();
	} else {
	    $('gallery-nav-next').show();
	}

	if (!prevDiv) {
	    $('gallery-nav-prev').hide();
	} else {
	    $('gallery-nav-prev').show();
	}
}

function rotateImage(imgDiv, caption) {
    div = $('gallery-banner-' + imgDiv);
        
    /* Ensure we're not working on the current image so it doesn't break when trying to swap with itself */
    if (!div.hasClassName('current')) {
        changeImage(div, caption);
    }
}

function previousImage() {

	// get previous image div
	var prevDiv = $$('div.current')[0].previous();
	var prev = prevDiv.identify();
	
	// make sure previous div is an image div we want to display, then do it.
	if (prev) {
		
		//get "title" attribute text from image for caption
		var caption = prevDiv.readAttribute('title');
		
		//change the image
		changeImage(prevDiv, caption);
	};
}

function nextImage() {

	// get previous image div
	var nextDiv = $$('div.current')[0].next();
	var next = nextDiv.identify();
	
	// make sure previous div is an image div we want to display, then do it.
	if (next) {
		
		//get "title" attribute text from image for caption
		var caption = nextDiv.readAttribute('title');
		
		//change the image
		changeImage(nextDiv, caption);
	};
}