/*
 * alternative's portfolio script
 * @requires 	prototype.js <http://prototype.conio.net/>
 * @requires 	effects.js <http://script.aculo.us>
 * @license		free (as in freedom), without any warranties of any kind 
 */ 

WIDTH = 960;
NO = 1;
TOTAL = 8;
DURATION = 0.6 // effect duration in seconds
DIRECTION = null;

NEXT = 'next';
PREV = 'prev';
STOP = 'stop';
START = 'start';
NEWBOX = null;
BOXES = new Array();
LINKS = new Array();

function init()
{
	initNumbers();
	initBoxes(); // create 3 boxes
	setBoxesLinks();
	setNavLinks();

	var il = $('info-link');
	if (il) il.target = '_blank';
	updateImages(); // update the images in the 2 invisible boxes
	enableBoxesLinks();

}

function initNumbers()
{
	// never use parseInt with leading 0 (08 == octal value)
	// use parseFloat instead 
	NO = parseFloat($('no').firstChild.nodeValue);
	TOTAL = parseFloat($('total').firstChild.nodeValue);
}

function updateNo()
{
	NO = (DIRECTION == NEXT) ? NO + 1 : NO - 1;

	if (NO < 1) NO = TOTAL;
	if (NO > TOTAL) NO = 1;
	
	var n = NO < 10 ? '0' + NO.toString() : NO.toString();
	$('no').update(n);
}

function setBoxesLinks()
{
	for (var i = 0; i < BOXES.length; i++) {
		BOXES[i].enabled = false;
		BOXES[i].href = document.URL;
		BOXES[i].onclick = function() {
			movePhoto(NEXT);
			// don't go to href
			return false;
		};
	}
}

function setNavLinks()
{
	LINKS = $('next', 'prev');
	for (var i = 0; i < LINKS.length; i++) {
		LINKS[i].href = document.URL;
		LINKS[i].onclick = function() {
			movePhoto(this.id);
			return false;
		};
	}

}

function enableBoxesLinks()
{
	for (var i = 0; i < BOXES.length; i++) {
		BOXES[i].enabled = true;
	}
}

function disableBoxesLinks()
{
	for (var i = 0; i < BOXES.length; i++) {
		BOXES[i].enabled = false;
	}
}

function initBoxes()
{
	var container = $('photo-container');
	var photo = $('photo');

	var node1 = photo.cloneNode(false);
	var node2 = photo;
	var node3 = photo.cloneNode(false);

	node1.id = 'box-1';
	node2.id = 'box-2';
	node3.id = 'box-3';
	
	node1.setStyle({left: -WIDTH + 'px'});
	node2.setStyle({left: 0 + 'px'});
	node3.setStyle({left: WIDTH + 'px'});

	container.insertBefore(node1, node2);
	container.insertBefore(node3, null);
	
	BOXES = [node1, node2, node3];
}

function updateImages()
{
	updateImage(NO - 1, BOXES[0]);
	updateImage(NO + 1, BOXES[2]);
}


function updateImage(no, box)
{
	var par = 'image&no=' + no;
	var myAjax = new Ajax.Updater(
			box, 
			document.URL, 
			{
				method: 'get', 
				parameters: par
			});
}

function movePhoto(dir)
{
	if (BOXES[1].enabled) {
	DIRECTION = dir;
	NEWBOX = BOXES[0];
	var w = WIDTH;
	if (dir == NEXT) {
		NEWBOX = BOXES[2];
		w = -WIDTH;
	}
	new Effect.Parallel(
		[
			new Effect.MoveBy(BOXES[1], 0, w, {sync: true}),
			new Effect.MoveBy(NEWBOX, 0, w, {sync: true})
	
		],
		{ 
			duration: DURATION,
			beforeStart: function (e) { 
				hideObjects();
				disableBoxesLinks();
				var now = new Date();
				this.start = now.getTime();
			},
			afterUpdate: function (e) {
				if (!e.options.updated) {
					var d = DURATION * 1000 / 2;
					var now = new Date();
					
					if (now.getTime() - d >= e.options.start) {
						updateNo();
						e.options.updated = true;
					}
				}
			},
			afterFinish: function (e) {
				afterMove(); 
				updateExtra();
			}
		}
	);
	} 
}

function updateExtra()
{	
	var infos = NEWBOX.getElementsByTagName('span');
	//console.log(infos);
	//var txt = '<a href="' + infos[0].innerHTML + '" id="info-link">' + infos[1].innerHTML + '</a>';
	var txt = '<a href="' + infos[0].innerHTML + '" id="info-link">' + infos[0].innerHTML + '</a>';
	$('info').update(txt);
	//$('info-link').target = '_blank';
}

function afterMove()
{
	if (DIRECTION == NEXT) {
		var box = BOXES[0];
		BOXES[0] = BOXES[1];
		BOXES[1] = BOXES[2];
		BOXES[2] = box;
		
	} else if (DIRECTION == PREV) {
		var box = BOXES[2];
		BOXES[2] = BOXES[1];
		BOXES[1] = BOXES[0];
		BOXES[0] = box;
	}
	BOXES[0].setStyle({left: -WIDTH + 'px'});
	BOXES[2].setStyle({left: WIDTH + 'px'});
	BOXES[0].update('');
	BOXES[2].update('');
	displayObjects();
	updateImages();
	enableBoxesLinks();
}

function displayObjects()
{
	var objs = BOXES[1].getElementsByTagName('object');
	for (var i = 0; i < objs.length; i++) {
		objs[i].setStyle({visibility: 'visible'});
	}
	
}

function hideObjects()
{
	var objs = BOXES[1].getElementsByTagName('object');
	for (var i = 0; i < objs.length; i++) {
		objs[i].setStyle({visibility: 'hidden'});
	}	
}


window.onload = init;