var headerPicVisible = true;
var defaultHeaderPic = '';
var headerWidth = 960;
var headerHeight = 400;
var currentPicUrl = '';

function initHeaderPic(picUrl, animate) {
	defaultHeaderPic = picUrl;
	/*
	var el = getHeaderPic();
	el.style.height = '0px';
	headerPicVisible = false;
	*/
}

function documentLoadDone(event) {
	if (defaultHeaderPic != "") showHeaderPic(defaultHeaderPic, false);
}

function getHeaderPic() {
	return document.getElementById('headerPic');
}
function getHeaderPicImg() {
	return document.getElementById('headerPicImg');
}

function showHeaderPic(picUrl, animate) {
	if (picUrl == currentPicUrl) return;
	if (picUrl == "") return;
	
	currentPicUrl = picUrl;
	//alert('showHeaderPic("' + picUrl + '")');
	var el = getHeaderPic();
	//var imgEl = document.getElementById('headerPicImg');
	//imgEl.src = picUrl;
	//imgEl.onLoad = function(event) {alert('loaded!')};
	
	el.innerHTML = '<img src="' + picUrl + '" border="0" id="headerPicImg" onload="headerPicLoadDone();" />';
	/*
	el.innerHTML = '';
	el.style["backgroundImage"] = "url(" + picUrl + ")";
	el.style["backgroundPosition"] = "90px";
	*/
	
	if (animate == false) {
		//alert("don't animate!");
		el.style["width"] = headerWidth;
		el.style["height"] = headerHeight;
	}
}
function showHeaderPics(imgs) {
	//TODO: Pre-load...
}

function headerPicLoadDone() {
	//if (headerPicVisible == true) return;
	var el = getHeaderPic();
	
	var h = el.style['height'];
	if (h.length >= 3) h = h.substr(0, h.length-2);
	else h = 0;
	
	JSTweener.clear();
	
	if (h == 0) {
		JSTweener.addTween(el.style, {
			time: 1.0,
			transition: 'easeInOutCubic',
			onComplete: showHeaderPicDone,
			width: headerWidth,
			height: headerHeight
		});
	}
	
	startScroll();
}

function showHeaderPicDone() {
	headerPicVisible = true;
}

function hideHeaderPic() {
	if (!headerPicVisible) return;
	
	var el = getHeaderPic();
	JSTweener.addTween(el.style, {
		time: 1.5,
		transition: 'easeInOutCubic',
		onComplete: hideHeaderPicDone,
		height: 0
	});
}
function hideHeaderPicDone() {
	headerPicVisible = false;
}

function startScroll() {
	var el = getHeaderPicImg();
	el.style['position'] = 'relative';
	
	var y = el.style['top'];
	if (y.length >= 3) y = y.substr(0, y.length-2);
	else y = 0;
	
	
	JSTweener.addTween(el.style, {
		time: 5.0 + (el.height - headerHeight) / 100,
		transition: 'easeInOutQuad',
		onComplete: startScroll,
		top: ((y==0) ? -(el.height - headerHeight) : 0)
	});
	
}