window.onload = prep;

var curindex = 0;
var thumblinks;
var flag = 1;
var swtch = 1;
var loadedArray = new Array();

function prep(){
	
	if (document.getElementsByTagName){
		/*prepMenus();
		var links = document.getElementsByTagName("a");
		for (var i=0; i<links.length; i++){
			if (links[i].className == "menu"){
				links[i].onclick = function(){
					return openClose(this);
				}
			}
		}*/
		
		var imgs = document.getElementsByTagName("img");
		var img_num = imgs.length;
		for (var a=0; a < img_num; a++){
			if ( imgs[a].className == 'tab' ){
				imgs[a].onmouseover = function(){
					return tabOn(this)
				}
				imgs[a].onmouseout = function(){
					return tabOff(this)
				}
				
			}
		}
		
		if ( document.getElementById('thumbnails') ){
			var thumbs = document.getElementById('thumbnails');
			thumblinks = thumbs.getElementsByTagName('a');
			var link_num = thumblinks.length;
			for ( var x=0; x < link_num; x++ ){
				thumblinks[x].onclick = function(){
					return showImg(this);
				}
				loadedArray[x] = false;
			}
		}
		
		/*if ( document.getElementById('video_thumbs') ){
			var vids = document.getElementById('video_thumbs');
			var vidlinks = vids.getElementsByTagName('a');
			var vid_num = vidlinks.length;
			
			for ( var n=0; n < vid_num; n++ ){
				vidlinks[n].onclick = function(){
					return wfhRequest(this);
				}
			}
			
		}
		
		if ( document.getElementById('work_for_hire') ){
			var vids = document.getElementById('work_for_hire');
			var vidlinks = vids.getElementsByTagName('a');
			var vid_num = vidlinks.length;
			
			for ( var n=0; n < vid_num; n++ ){
				vidlinks[n].onclick = function(){
					return wfhRequest(this);
				}
			}
		}*/
		
		if ( document.getElementById('press') ){
			var press = document.getElementById('press');
			var press_links = press.getElementsByTagName('a');
			var press_num = press_links.length;
			
			for ( var b=0; b < press_num; b++ ){
				press_links[b].onclick = function(){
					return showPress(this);
				}
			}
		}
		
		countdown();
	}
}

function makeOverlay()
{
	var overlay = document.createElement('div');
	overlay.setAttribute('id', 'overlay');
	//document.body.style.overflowY = 'hidden';
	document.body.appendChild(overlay);
	swtch = 1;
	return overlay;
}

function updateNav(index)
{
	var prev = getPrev(index);
	var next = getNext(index);
	if ( document.getElementById('prev_link') ){
		document.getElementById('prev_link').href = thumblinks[prev].href;
	}
	if ( document.getElementById('next_link') ){
		document.getElementById('next_link').href = thumblinks[next].href;
	}
}

function getClickedIndex(link)
{
	var link_num = thumblinks.length;
	for ( var x=0; x < link_num; x++ ){
		if ( thumblinks[x].href == link.href ){
			return x;
		}
	}
}

function showImg(link)
{
	var clickedIndex = getClickedIndex(link);
	var url = link.href;
	
	if (link.getAttribute('title') != ''){
		var captionText = document.createTextNode(link.getAttribute('title'));
		var caption = document.createElement('p');
		caption.setAttribute('id', 'caption');
		caption.appendChild(captionText);
	} else {
		var caption = '';
	}
	
	var overlay = makeOverlay();
	
	var img = new Image();
	img.onload = function(){
		
		var pic = document.createElement("img");
		pic.setAttribute("src", url);
		pic.setAttribute('id', 'slide');
		pic.setAttribute("alt", "");
		var imgheight = img.height;
		var imgwidth = img.width;
		
		centerImg(pic);
		
		var holder = document.createElement('div');
		holder.setAttribute('id', 'imgholder');
		overlay.appendChild(holder);
		
		//holder.style.width = imgwidth+'px';
		//holder.style.height = imgheight+'px';
		
		var close_img = new Image();
		close_img.setAttribute('title', 'Close');
		close_img.setAttribute('src', 'images/x.png');
		close_img.setAttribute('alt', 'Close');		
		close_img.src = 'images/x.png';
		
		var close = document.createElement('p');
		close.setAttribute('id', 'close');
		close.appendChild(close_img);
		close.onclick = function(){
			document.body.removeChild(overlay);
			//document.body.style.overflowY = 'auto';
		}
		
		
		holder.appendChild(pic);
		holder.appendChild(close);
		
		var imgNav = document.createElement('div');
		imgNav.setAttribute('id', 'img_nav');
		
		var prevIndex = getPrev(clickedIndex);
		var prevHref = thumblinks[prevIndex].href;
		var prev_link = document.createElement('a');
		prev_link.setAttribute('href', prevHref);
		prev_link.setAttribute('id', 'prev_link');
		prev_link.setAttribute('title', thumblinks[prevIndex].getAttribute('title'))
		var prev_text = document.createTextNode('< previous');
		prev_link.onclick = function (){
			return changeImg(this);
		}
		prev_link.appendChild(prev_text);
		
		var prev_p = document.createElement('p');
		prev_p.setAttribute('id', 'prev');
		prev_p.appendChild(prev_link);
		
		//Next Link
		var nextIndex = getNext(clickedIndex);
		var nextHref = thumblinks[nextIndex].href;
		var next_link = document.createElement('a');
		next_link.setAttribute('href', nextHref);
		next_link.setAttribute('id', 'next_link');
		next_link.setAttribute('title', thumblinks[nextIndex].getAttribute('title'))
		var next_text = document.createTextNode('next >');
		next_link.onclick = function (){
			return changeImg(this);
		}
		next_link.appendChild(next_text);
		
		var next_p = document.createElement('p');
		next_p.setAttribute('id', 'next');
		next_p.appendChild(next_link);
		
		imgNav.appendChild(prev_p);
		imgNav.appendChild(next_p);
		holder.appendChild(imgNav);
		holder.onmouseover = function(){
			return showControls();
		}
		holder.onmouseout = function(){
			return hideControls();
		}
		
		if ( caption != '' ){
			overlay.appendChild(caption);
		}
		loadedArray[clickedIndex] = true;
	}
	img.src = url;
	return false;
}

function updateCaption(index)
{
	var capText = thumblinks[index].getAttribute('title');

	if ( capText != '' ){
		//there is a caption, check if the caption paragraph is there
		if ( document.getElementById('caption') ){
			//it's there so replace the text
			var caption = document.getElementById('caption');
			removeChildren(caption);
			caption.appendChild( document.createTextNode(capText) );
		} else {
			//it's not there so create it, add the caption to it
			var caption = document.createElement('p');
			caption.setAttribute('id', 'caption');
			caption.appendChild( document.createTextNode(capText) );
			document.getElementById('overlay').appendChild(caption);
		}
	} else {
		var overlay = document.getElementById('overlay');
		if ( document.getElementById('caption') ){
			overlay.removeChild(document.getElementById('caption'));
		}
	}
	
}

function removeChildren(obj){
	while (obj.childNodes.length >= 1){
		obj.removeChild(obj.firstChild);
	}
}

function changeImg(link){
	try {
		var picholder = document.getElementById('imgholder');
		if (flag == 1){
			flag = 0;
			clickedIndex = getClickedIndex(link);
			if (loadedArray[clickedIndex] == false){
				showLoader();
			}
			if (swtch == 1){
				var newimg = new Image();
				newimg.onload = function(){	
					var pic = document.createElement("img");
					pic.setAttribute("id", "slide2");
					pic.setAttribute("src", link.href);
					pic.setAttribute("alt", "");
					centerImg(pic);
					setOpacity(pic, 0);
					picholder.appendChild(pic);
					fadein("slide2", 0);
					fadeout("slide", 100);
					hideLoader();
					curindex = clickedIndex;
					updateNav(curindex);
					updateCaption(curindex);
					
				}
				newimg.src = link.href;
				swtch = 2;	
			} else {
				var newimg2 = new Image();
				newimg2.onload = function(){	
					var pic2 = document.createElement("img");
					pic2.setAttribute("id", "slide");
					pic2.setAttribute("src", link.href);
					pic2.setAttribute("alt", "");
					centerImg(pic2);
					setOpacity(pic2, 0);
					picholder.appendChild(pic2);
					fadein("slide", 0);
					fadeout("slide2", 100);
					hideLoader();
					curindex = clickedIndex;
					updateNav(curindex);
					updateCaption(curindex);
				}
				newimg2.src = link.href;
				swtch = 1;	
				
			}
			loadedArray[clickedIndex] = true;
		}
	} catch (err){
		alert(err);
		return false;
	}
	
	return false;
	
}

function getPrev(index){
	if ( index == 0 ){
		var value = thumblinks.length - 1;
	} else {
		var value = index - 1;
	}
	
	return value;
}

function getNext(index)
{
	if (index == thumblinks.length - 1){
		var value = 0;
	} else {
		var value = index + 1;
	}
	return value;
}

function hideMenu()
{
	var lists = document.getElementsByTagName("ul");
	for (var n=0; n<lists.length; n++){
		if (lists[n].className == "submenu"){
			lists[n].style.display = "none";
		}
	}
}

function openClose(obj){
	var parent = obj.parentNode;
	var childList = parent.getElementsByTagName("ul");
	if (childList[0].style.display == "none"){
		childList[0].style.display = "block";
	} else {
		childList[0].style.display = "none";
	}
	return false;
}

function prepMenus(){
	if (document.getElementsByTagName){
		if ( document.getElementById('navigation') ){
			var menuTitles = new Array();
			menuTitles[0] = "Us";
			menuTitles[1] = "Studio";
			menuTitles[2] = "Studio Pictures";
			
			var menuUrls = new Array();
			menuUrls[0] = "info.php?s=about-us";
			menuUrls[1] = "info.php?s=studio";
			menuUrls[2] = "photos.php?cat=studio";
			
			var aboutMenu = document.createElement("ul");
			aboutMenu.style.display = "none";
			aboutMenu.setAttribute("class", "submenu");
			
			for (var i=0; i<menuTitles.length; i++){
				var item = document.createElement("li");
				var link = document.createElement("a");
				link.setAttribute("href", menuUrls[i]);
				var text = document.createTextNode(menuTitles[i]);
				link.appendChild(text);
				item.appendChild(link);
				aboutMenu.appendChild(item);
			}
			
			var subs = new Array();
			var lists = document.getElementsByTagName("a");
			var n=0;
			for (var i=0; i<lists.length; i++){
				if (lists[i].className == "menu"){
					subs[n] = lists[i].parentNode;
					n++;
				}
			}
			
			subs[0].appendChild(aboutMenu);
		}
	}
}

function showLoader(){
	
	
	var img_holder = document.getElementById('imgholder');
	
	var para = document.createElement('p');
	para.setAttribute('id', 'loading');
	
	var gif = new Image();
	gif.onload = function(){	
		var pic = document.createElement("img");
		pic.setAttribute("src", "images/load2.gif");
		pic.setAttribute("alt", "");
		para.appendChild( document.createTextNode('Loading') );
		para.appendChild( img_holder.appendChild(document.createElement('br')) );
		para.appendChild(pic);
	}
	gif.src = "images/load2.gif";
	img_holder.appendChild(para);
}

function hideLoader(){
	if ( document.getElementById('loading') ){
		var loader = document.getElementById('loading');
		loader.parentNode.removeChild(loader);
	}
}

function setOpacity(obj, opacity) {
	opacity = (opacity == 100)?99.999:opacity;
	// IE/Win
	obj.style.filter = "alpha(opacity:"+opacity+")";
	// Safari<1.2, Konqueror
	obj.style.KHTMLOpacity = opacity/100;
	// Older Mozilla and Firefox
	obj.style.MozOpacity = opacity/100;
	// Safari 1.2, newer Firefox and Mozilla, CSS3
	obj.style.opacity = opacity/100;
}

function fadein(objId,opacity) {
	if (document.getElementById) {
		obj = document.getElementById(objId);
		
		if (opacity == 0){
			obj.style.visibility = "visible";
		}
		
		if (opacity <= 100) {
			setOpacity(obj, opacity);
			opacity += 10;
			window.setTimeout("fadein('"+objId+"',"+opacity+")", 50);
		} else if (opacity > 100){
			flag = 1;
		}
	}
}

function fadeout(objId,opacity) {
	if (document.getElementById) {
		obj = document.getElementById(objId);
		if (opacity == 0){
			obj.style.visibility = "hidden";
			var picholder = document.getElementById('imgholder');	
			var trash = picholder.getElementsByTagName("img");
			for (var d=0; d<trash.length; d++){
				if (trash[d].getAttribute('id') == objId){
					picholder.removeChild(trash[d]);
				}
			}
			//changeCaption(curindex);
		}
		
		if (opacity >= 0) {
			setOpacity(obj, opacity);
			opacity = opacity - 10;
			window.setTimeout("fadeout('"+objId+"',"+opacity+")", 50);
		}
	}
}

function redirect(url)
{
	window.location = url;
}

function countdown()
{
	if ( document.getElementById('countdown') ){
		span = document.getElementById('countdown');
		//get the child element, which should be an integer
		var number = span.firstChild.data;
		
		if ( parseInt(number) == number - 0 && number > 0) {
			number -= 1;
			removeChildren(span);
			span.appendChild( document.createTextNode(number) )
			setTimeout('countdown()', 1000);
		}
		
	}
}

function showPress(link)
{
	url = link.href;
	if ( screen.width > 800 ){
		var width = 800;
	} else {
		var width = screen.width - 50;
	}
	
	if ( screen.height > 600) {
		var height = 700;
	} else {
		var height = screen.height - 50;
	}
	
	presswindow = window.open(url,'press','height='+height+',width='+width+',scrollbars=1');
	presswindow.focus();
	return false;
}

function tabOn(img)
{
	var source = img.getAttribute('src');
	var urlitems = source.split('/');
	
	var filename = urlitems[urlitems.length - 1];
	var nameitems = filename.split('.');
	//e.g. tab_current or tab_current_on
	
	var suffix = new RegExp('_on$');

	if ( nameitems[0].match(suffix) == null ){
		var new_filename = 'images/tabs/'+nameitems[0]+'_on.'+nameitems[1];
		img.setAttribute('src', new_filename);
	}
	
	
}

function tabOff(img)
{
	var source = img.getAttribute('src');
	var urlitems = source.split('/');
	
	var filename = urlitems[urlitems.length - 1];
	var nameitems = filename.split('.');
	//e.g. tab_current or tab_current_on
	
	var suffix = new RegExp('_on$');
	
	if ( nameitems[0].match(suffix) != null ){
		var new_filename = 'images/tabs/'+filename.replace('_on', '');
		img.setAttribute('src', new_filename);
	}
}

function showControls()
{
	if ( document.getElementById('img_nav') ){
		document.getElementById('img_nav').style.display = 'block';
	}
}

function hideControls()
{
	if ( document.getElementById('img_nav') ){
		document.getElementById('img_nav').style.display = 'none';
	}
}

function centerImg(obj){
	var container_width = 670;
	var container_height = 445;
	var padding = 8;
	var obj_width = obj.width;
	var left_pos = Math.round((container_width - obj_width) / 2);
	obj.style.left = left_pos+'px';
	
	var obj_height = obj.height;
	var top_pos = Math.round((container_height - obj_height) / 2);
	top_pos = top_pos + padding;
	obj.style.top = top_pos+'px';
}