/**
* (c) Copyright 2006. iReed Web Design.
*  http://ireed.net
*  
*  Modified by Adam at Webspec Design in 2007 to add the smooth fading.
*  Andrew: This script sucks. Insert the arrows with DOM?  Are you serious?!  I fixed that.
*
*/

var interval = 2000; // 2 second delay between pictures (default)
var ImageNum = 0;

imageArray = new Array();

function imageItem(url, caption) {
	this.image_item 	= new Image();
	this.image_item.src = url;
	this.caption		= caption;
}

function get_ImageItemLocation(imageObj) {
	return(imageObj.image_item.src)
}

function get_ImageHeight(imageObj) {
	return(imageObj.image_item.height)
}

function get_ImageCaption(imageObj) {
	return(imageObj.caption)
}

function getPrevImage() {
	ImageNum = (ImageNum - 1) % number_of_image;
	var new_image = get_ImageItemLocation(imageArray[ImageNum]);
	return(new_image);
}

function getPrevImageCaption() {
	img = new Array();

	ImageNum = (ImageNum - 1) % number_of_image;

	if(ImageNum < 0) {
		ImageNum = imageArray.length - 1;
	}

	// Set current
	img.image = get_ImageItemLocation(imageArray[ImageNum]);
	img.caption = get_ImageCaption(imageArray[ImageNum]);
	
	// Set next.
	ImageNum2 = (ImageNum - 1) % number_of_image;
	if(ImageNum2 < 0) {
		ImageNum2 = imageArray.length - 1;
	}
	img.next_image = get_ImageItemLocation(imageArray[ImageNum2]);
	img.next_caption = get_ImageCaption(imageArray[ImageNum2]);

	return(img);
}

function getNextImageCaption() {
	img = new Array();

	// Set current.
	ImageNum = (ImageNum+1) % number_of_image;
	img.image = get_ImageItemLocation(imageArray[ImageNum]);
	img.caption = get_ImageCaption(imageArray[ImageNum]);

	// Set next.
	ImageNum2 = (ImageNum + 1) % number_of_image;
	img.next_image = get_ImageItemLocation(imageArray[ImageNum2]);
	img.next_caption = get_ImageCaption(imageArray[ImageNum2]);

	return(img);
}

function getNextCaption() {
	ImageNum = (ImageNum+1) % number_of_image;
	return(new_caption);
}

function nextImg() {
	// user if flipping manually, stop automatic timer
	stopTimer();

	var array_index = ImageNum + 1;
	if(array_index >= number_of_image)
	{
		array_index = 0;
	}

	var image = get_ImageItemLocation(imageArray[array_index]);
	var caption = get_ImageCaption(imageArray[array_index]);
	
	document.getElementById('flipbook_second_image').src = image;
	document.getElementById('flipbook_second_image').alt = caption;
	document.getElementById('flipbook_second_comment').innerHTML = caption;

	var timer = 0;
	for(i = 100; i >= 0; i--){
		setTimeout("changeOpac("+ i + ",'primary')",(timer*5));
		timer++;
	}

	setTimeout("finishNextImg()",((timer*5) + 1));
}

function finishNextImg()
{
	var new_image_caption = getNextImageCaption();

	// New first (the current second) values
	var flipbook_image = document.getElementById('flipbook_image');
	var flipbook_comment = document.getElementById('flipbook_comment');

	// Second values.
	var flipbook_next_image = document.getElementById('temp-photo');
	var flipbook_next_comment = document.getElementById('temp-caption');

	flipbook_image.src = new_image_caption.image;
	flipbook_image.alt = new_image_caption.caption;
	flipbook_comment.innerHTML = new_image_caption.caption;

	changeOpac(100,'primary');

	flipbook_next_image.innerHTML = new_image_caption.next_image;
	flipbook_next_comment.innerHTML = new_image_caption.next_caption;
	
	setTimeout(TempToSecond, 25);
	
}	

function TempToSecond()
{
	var temp_photo = document.getElementById('temp-photo');
	var temp_caption = document.getElementById('temp-caption');
	var photo = document.getElementById('flipbook_second_image');
	var comment = document.getElementById('flipbook_second_comment');
	photo.src = temp_photo.innerHTML;
	photo.alt = temp_caption.innerHTML;
	comment.innerHTML = temp_caption.innerHTML;
}


function prevImg() {
	//user if flipping manually, stop automatic timer
	stopTimer();
	
	var array_index = ImageNum - 1;
	if(array_index < 0)
	{
		array_index = number_of_image - 1;
	}
	
	var image = get_ImageItemLocation(imageArray[array_index]);
	var caption = get_ImageCaption(imageArray[array_index]);
	
	document.getElementById('flipbook_second_image').src = image;
	document.getElementById('flipbook_second_image').alt = caption;
	document.getElementById('flipbook_second_comment').innerHTML = caption;
	
	var timer = 0;
	for(i = 100; i >= 0; i--){
		setTimeout("changeOpac("+ i + ",'primary')",(timer*5));
		timer++;
		}

	setTimeout(finishPrevImg, ((timer*5) +1 ) );
	}

function finishPrevImg()
{
	var new_image_caption = getPrevImageCaption();

	// New first (the current second) values
	var flipbook_image = document.getElementById('flipbook_image');
	var flipbook_comment = document.getElementById('flipbook_comment');

	// Second values.
	var flipbook_next_image = document.getElementById('temp-photo');
	var flipbook_next_comment = document.getElementById('temp-caption');

	flipbook_image.src = new_image_caption.image;
	flipbook_image.alt = new_image_caption.caption;
	flipbook_comment.innerHTML = new_image_caption.caption;

	changeOpac(100,'primary');

	flipbook_next_image.innerHTML = new_image_caption.next_image;
	flipbook_next_comment.innerHTML = new_image_caption.next_caption;
	
	setTimeout(TempToSecond, 25);
}

function stopTimer() {
   if(timerID) {
      clearTimeout(timerID);
      timerID  = 0;
   }

   tStart = null;
}

function rotateImage(vari) {
	if(vari == 1) {
		nextImg();
	}

	var recur_call = "rotateImage('1')";
	timerID = setTimeout(recur_call, interval);
}

function insertPrevNextArrows() {
	//inserts code for prev/next arrows into DOM
	//purpose? we can leave the arrows out of the HTML so those 
	//without javascript will never see them
	
	var div   	 = document.createElement("div");
	var ul       = document.createElement("ul");
	var li1   	 = document.createElement("li");
	var li1_a	 = document.createElement("a");
	var li1_span = document.createElement("span");

	var li2      = document.createElement("li");
	var li2_a    = document.createElement("a");
	var li2_span = document.createElement("span");
	
	var prevButtonText = document.createTextNode("Previous Image");
	var nextButtonText = document.createTextNode("Next Image");
	
	//set attributes
	div.setAttribute("class", "arrows");
	div.className = 'arrows'; // IE 6
	li1_a.setAttribute("href", "javascript:prevImg();");
	li1_a.setAttribute("class", "prevImg");
	li1_a.className = 'prevImg'; // IE 6
	li2_a.setAttribute("href", "javascript:nextImg();");
	li2_a.setAttribute("class", "nextImg");
	li2_a.className = 'nextImg'; // IE 6
	
	//append everything together
	li1_span.appendChild(prevButtonText);
	li2_span.appendChild(nextButtonText);
	
	li1_a.appendChild(li1_span);
	li2_a.appendChild(li2_span);
	
	li1.appendChild(li1_a);
	li2.appendChild(li2_a);
	
	ul.appendChild(li1);
	ul.appendChild(li2);
	
	div.appendChild(ul);
	
	//everything is together, insert into arrows after the image...
	var comment = document.getElementById("flipbook_comment");
	var comment2 = document.getElementById("flipbook_second_comment");
//	insertAfter(div, comment);
}

/* Following code from:
 * 		http://brainerror.net/scripts/javascript/blendtrans/
 */

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 + ")";
}