/**
 * Returns a bezier-curved fraction based on a lineair one.
 */
function getPos(t) {
	return 4.5*t*t*t*t*t + -11.25*t*t*t*t + 7.5*t*t*t + 0.25*t;
}


/** Dom helper **/
function element(type) { return document.createElement(type); }
function plainElement(type, text) { var e = element(type); e.appendChild(document.createTextNode(text)); return e; }

/**
 * Slides an image link in if it is not visible already
 */
function slideIn(a) {
	holder = document.getElementById('imageholder');
	if (holder.firstChild != a && holder.childNodes.length == 1) {
		current = holder.firstChild;
		holder.appendChild(a);
		slide(current, 0);  
	}
}
/**
 * Slidesteps
 */
function slide(current, step) {
	i = (step/50); //determine the number of steps (more steps means smoother animation)
	var margin = Math.round(getPos(i)*-400); //bezier curved movement
	current.style.marginLeft = margin + 'px';
	if (i == 1) {
		document.getElementById('lightboxlinks').appendChild(current);
		current.style.marginLeft = 0;
	} else {
	   window.setTimeout(function(){slide(current, step+1);}, 10);
	}
  }


/**
 * Initalisation, sets the first image link in position
 */
function setFirstLink(a) {
	var holder = document.getElementById('imageholder');
	while(holder.firstChild) {
	  holder.removeChild(holder.firstChild);
	}
	holder.appendChild(a);
	holder.style.whiteSpace = 'nowrap';
	holder.style.overflow = 'hidden'; 
}
function initSliderLinks() {
	var container = document.getElementById('lightboxlinks');
	var slideMenu = element('ul');
	slideMenu.id="sliderlinks";
	
	container.style.display = 'none';
	var as = container.getElementsByTagName('a');
	for (var i=0; i< as.length; i++) {
		var a = as[i];
		if (a.getAttribute('rel') == 'lightbox[slide]') {
			slideMenu.appendChild(createSlideLink(a, i+1));
		}
	}
    document.getElementById('slideMenu').appendChild(slideMenu);
	setFirstLink(as[0]);
}
function createSlideLink(a,num) {
	var img = a.getElementsByTagName('img')[0];
	img.width = 400;	
	img.height = 266;

	var li = plainElement('li', num);
	li.style.cursor = 'pointer';
	if (num==1){
		li.className="active";
	} 
	li.onclick = function(){ slideIn(a); setNoActive();this.className="active"; }
	return li;
}
function setNoActive() {
	var slideMenu = document.getElementById('sliderlinks');
	
	for (i=0;i<slideMenu.childNodes.length;i++){
		if (slideMenu.childNodes[i].nodeName=="LI"){
			slideMenu.childNodes[i].className="";
		}
	}
}