// Cover Flow

var timer = 0;
var numPanels = 5;


window.onresize = function() { refresh(); }
refresh();

function windowWidth()
{
	var width;
	if(document.layers) {
		width = window.innerWidth;
	} else {
		width = document.body.clientWidth;
	}
	return width;
}

function step()
{
	if (target < current-1 || target > current+1)
	{
		moveTo(current + (target-current)/5);
		window.setTimeout(step, 50);
		timer = 1;
	}
	else
	{
		timer = 0;
		var thisPanel = document.getElementById(currentPanel);
		fadePanel(thisPanel);
	}
}

function flowTo(x, newCaptionId,element)
{
		 
	var opac;
	resetPanels();
	
	target = x;
	if (timer == 0)
	{
		window.setTimeout(step, 50);
		timer = 1;
	}
	
	/* if(element) {
		fadeOut(element);
	} else {
		var firstElement = document.getElementById('panel3');
		fadeOut(firstElement);
	} */
	
	/* captionId = newCaptionId;
	var caption = document.getElementById(captionId);
	captionTarget.innerHTML = caption.innerHTML; */
}


function moveTo(x)
{
	current = x;
	var div = document.getElementById("panels");
	var top = div.offsetTop  + 225;
	var width = windowWidth();
	// var size = width * 0.5;
	var size = width * 0.5;
	var biggest = width * 0.55;
	var zIndex = div.childNodes.length;
	for (index = 0; index < div.childNodes.length; index++)
	{
		var panel = div.childNodes.item(index);
		if (panel.nodeType == 1)
		{
			var z = Math.sqrt(10000 + x * x) + 100;
			var xs = x / z * size + size;
			panel.style.left = xs - 100 / z * biggest;
			panel.style.top = -40 / z * size + top;
			panel.style.width = 200 / z * biggest;
			// image.style.height = 110.25 / z * biggest;
			// image.style.height = 120 / z * biggest;
			panel.style.fontSize = .3 / z * biggest + 'em';
			
			var thisWidth = 200 / z * biggest;
			// changePanelImgElements(panel,thisWidth)
			
			var thisfontSize = 4 / z * biggest;

			// doOutput(panel.id + ":" + panel.style.fontSize);
			panel.style.zIndex = zIndex;
			// doOutput(panel.id + ":" + panel.style.zIndex);
			
			if ( x < -50 ) {
				zIndex++;
			} else {
				zIndex--;
			}
			x += 150;
			x += 1;
		}
	}
}

function refresh()
{
	var width = windowWidth();
	var height = width * 0.3;
	var images = document.getElementById("panels");
	images.style.height = height;

	/* var captionTarget = document.getElementById("captionTarget");
	// captionTarget.style.top = images.offsetTop + height;
	captionTarget.style.top = height * 1.0;
	captionTarget.style.height = height * 0.4;
	captionTarget.style.zIndex = 100;

	var caption = document.getElementById(captionId);
	captionTarget.innerHTML = caption.innerHTML; */

	moveTo(current);
}

function setCurrent (curPan) {
	currentPanel = curPan;
}