var scrollSpeed =0;
var i = 0;
var timer = 0;
var box,showreels,count,infoContainer,infoBoxes, boxes;
var slideTimer = 0, position = 0, slideSpeed = 1, slideBox;
var clients;
var current;
var obj;
var fadeInTimer, fadeOutTimer;
var thumbs, gallerySlideTimer, gallerySpeed = 0, galleryBox, galleryImages, desc, filename, mainContent, main;
var videoLinks, newArrivalsLinks;
var mousex = 0, mousey = 0, algor = 0;
var objPos, objSize, curleft, curtop, width, height;
var checkTimeout = 0;

var myImages = new Array("1st_slate_thumb","checking_the_frame_thumb","choice_of_lens_thumb","director_and_notes_thumb","director_thinking_it_over_thumb","i_told_you_about_set_food_thumb","jan_tring_thumb","kitchen_2_thumb","kitchen_eat_the_congee_thumb","kitchen_pain_thumb","kitchen_thumb","maye_3_thumb","maye_4_thumb","maye_and_make_up_artist_kaz_preston_thumb","maye_and_olivier_thumb","maye_framed_thumb","maye_framed_twice_thumb","maye_in_grans_bedroom_thumb","maye_thumb","night_time_revelations_thumb","rehersals_in_the_kitchen_thumb","rob_and_jimmy_thumb","shooting_in_the_resturaunt_thumb","the_corridor_thumb","the_hand_of_death_2_thumb","the_hand_of_death_thumb","tight_shooting_conditions_thumb","vincent_wong_2_thumb","vincent_wong_head_wound_2_thumb","vincent_wong_head_wound_thumb","vincent_wong_thumb","vince_wong_and_jimmy_thumb","vince_wong_in_resturant_thumb");

var changerImages = new Array("equipment-1","equipment-2","equipment-3");
var changeTimer = 0, item = 0;


function getElementsByClassName(oElm, strTagName, strClassName)
{
	var arrElements = (strTagName == "*" && oElm.all)? oElm.all : oElm.getElementsByTagName(strTagName);
	var arrReturnElements = new Array();
	strClassName = strClassName.replace(/\-/g, "\\-");
	var oRegExp = new RegExp("(^|\\s)" + strClassName + "(\\s|$)");
	var oElement;
	for(var i=0; i<arrElements.length; i++){
		oElement = arrElements[i];
		if(oRegExp.test(oElement.className)){
			arrReturnElements.push(oElement);
		}
	}
	return (arrReturnElements)
}

function getMouseXY(e) // works on IE6,FF,Moz,Opera7
{
	if (!e) e = window.event; // works on IE, but not NS (we rely on NS passing us the event)
 
  if (e)
  { 
    if (e.pageX || e.pageY)
    { // this doesn't work on IE6!! (works on FF,Moz,Opera7)
      mousex = e.pageX;
      mousey = e.pageY;
      algor = '[e.pageX]';
      if (e.clientX || e.clientY) algor += ' [e.clientX] '
    }
    else if (e.clientX || e.clientY)
    { // works on IE6,FF,Moz,Opera7
      // Note: I am adding together both the "body" and "documentElement" scroll positions
      //       this lets me cover for the quirks that happen based on the "doctype" of the html page.
      //         (example: IE6 in compatibility mode or strict)
      //       Based on the different ways that IE,FF,Moz,Opera use these ScrollValues for body and documentElement
      //       it looks like they will fill EITHER ONE SCROLL VALUE OR THE OTHER, NOT BOTH 
      //         (from info at http://www.quirksmode.org/js/doctypes.html)
      mousex = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
      mousey = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
      algor = '[e.clientX]';
      if (e.pageX || e.pageY) algor += ' [e.pageX] '
    }
  }
}

function findObjPosition(obj)
{
	var curleft = curtop = 0;
	if (obj.offsetParent)
	{
		while (obj.offsetParent)
		{
			curleft += obj.offsetLeft;
			curtop += obj.offsetTop;
			obj = obj.offsetParent;
		}
	}
	else if (obj.x)
		curtop += obj.x;
	else if (obj.y)
		curtop += obj.y;
	return [curleft, curtop];
}

function getSize(obj)
{
	var width = height = 0;
	width = parseInt(obj.style.width.replace(/px/, ""));
	height = parseInt(obj.style.height.replace(/px/, ""));
	return [width, height];
}

function checkMouse(evt)
{
	clearTimeout(checkTimeout)
	objPos = findObjPosition(evt);
	objSize = getSize(evt);

	if (mousex > objPos[0] && mousex < (objPos[0]+objSize[0]))
	{
		if (mousey > objPos[1] && mousey < (objPos[1]+50))
		{
			//scrollSpeed = -1;
			evt.scrollTop -= 1;
		}
		else if (mousey < (objPos[1]+objSize[1]) && mousey > (objPos[1]+objSize[1]-50))
		{
			//scrollSpeed = 1;
			evt.scrollTop += 1;
		}
	}
	checkTimeout = setTimeout(function() {checkMouse(evt);},10)
}

function updateMouse(e)
{
	getMouseXY(e); // NS is passing (event), while IE is passing (null)
}

function scroll(e)
{
	e.scrollTop += scrollSpeed;
	setTimeout("scroll()",10);
}

window.onload = function()
{
	if (self.init)
	init();

	if (getElementsByClassName(document, "div", "scroller"))
	{
		boxes = getElementsByClassName(document, "div", "scroller");
		document.onmousemove = updateMouse;
		for (count=0; count < boxes.length; count++)
		{
			boxes[count].style.overflow = 'hidden';
			boxes[count].onmouseover = function() {checkMouse(this)};
		}
		updateMouse();
	}
	/*if (getElementsByClassName(document, "iframe", "equipmentScroller"))
	{
		boxes = getElementsByClassName(document, "iframe", "equipmentScroller");
		document.onmousemove = updateMouse;
		for (count=0; count < boxes.length; count++)
		{
			boxes[count].style.overflow = 'hidden';
			boxes[count].onmouseover = function() {checkMouse(this)};
		}
		updateMouse();
	}*/
	if (document.getElementById("portfolio"))
	{
		box = document.getElementById("portfolio");
		showreels = box.getElementsByTagName("a");
		for (count=0; count < showreels.length; count++)
		{
			if (count%2 == 0 || count < 1)
			{
				showreels[count].onmouseover = function() {animateColor(this,'#333333','#cccccc',360,72);};
				showreels[count].onmouseout = function() {animateColor(this,'#cccccc','#333333',360,72);};
			}
			else
			{
				showreels[count].onmouseover = function() {animateColor(this,'#444444','#cccccc',320,64);};
				showreels[count].onmouseout = function() {animateColor(this,'#cccccc','#444444',320,64);};
			}
			showreels[count].onclick = display;
		}
		box = document.getElementById("newArrivals");
		newArrivalsLinks = box.getElementsByTagName("a");
		for (count=0; count <newArrivalsLinks.length; count++)
		{
			newArrivalsLinks[count].onclick = show;
			newArrivalsLinks[count].onmouseover = updateLink;
		}
		box = document.getElementById("infoContainer");
		videoLinks = box.getElementsByTagName("a");
		for (count=0; count <videoLinks.length; count++)
		{
			videoLinks[count].onclick = show;
			videoLinks[count].onmouseover = updateLink;
		}
	}

	if (document.getElementById("newPortfolio"))
	{
		box = document.getElementById("newPortfolio");
		showreels = box.getElementsByTagName("a");
		for (count=0; count < showreels.length; count++)
		{
			if (count%2 == 0 || count < 1)
			{
				showreels[count].onmouseover = function() {animateColor(this,'#333333','#cccccc',360,72);}
				showreels[count].onmouseout = function() {animateColor(this,'#cccccc','#333333',360,72);}
			}
			else
			{
				showreels[count].onmouseover = function() {animateColor(this,'#444444','#cccccc',320,64);}
				showreels[count].onmouseout = function() {animateColor(this,'#cccccc','#444444',320,64);}
			}
			showreels[count].onclick = function() {newDisplay(this); return false;}
		}
		box = document.getElementById("newArrivals");
		newArrivalsLinks = box.getElementsByTagName("a");
		for (count=0; count <newArrivalsLinks.length; count++)
		{
			newArrivalsLinks[count].onclick = show;
			newArrivalsLinks[count].onmouseover = updateLink;
		}
		box = document.getElementById("infoContainer");
		videoLinks = box.getElementsByTagName("a");
		for (count=0; count <videoLinks.length; count++)
		{
			videoLinks[count].onclick = show;
			videoLinks[count].onmouseover = updateLink;
		}
	}


	if (document.getElementById('slideBoxInner'))
	{
		slideBox = document.getElementById('slideBoxInner');
		slideBox.onmouseover = function () {slideSpeed = 0;}
		slideBox.onmouseout = function () {slideSpeed = 1;}
		clients = slideBox.getElementsByTagName("a");
		for (var count = 0; count < clients.length; count++)
		{
			obj = clients[count];
			obj.style.left = (count * 170) + "px";
		}
		slide();
	}
	if (document.getElementById("galleryPage"))
	{
		box = document.getElementById("scroller");
		thumbs = box.getElementsByTagName("a");
		for (count=0; count <thumbs.length; count++)
		{
			thumbs[count].onclick = show;
			thumbs[count].onmouseover = updateLink;
		}
	}
	if (document.getElementById("gallery"))
	{
		initGallery();
	}
	if (document.getElementById("changer"))
	{
		changeinfo();
	}
}

function changeinfo()
{
	clearTimeout(changeTimer);
	changeImage = document.getElementById("changer");
	changeImage.src = "/images/content/" + changerImages[item] + ".jpg";
	if (item < changerImages.length-1)
	{
		item++;
	}
	else
	{
		item = 0;
	}
	changeTimer = setTimeout("changeinfo()",6000);
}

function rgb2h(r,g,b) {return [r.toString(16),g.toString(16),b.toString(16)];}
function h2rgb(h,e,x) {return [parseInt(h,16),parseInt(e,16),parseInt(x,16)];}

function cssColor2rgb(color)
{
	if(color.indexOf('rgb')<=-1)
	{
		return h2rgb(color.substring(1,3),color.substring(3,5),color.substring(5,7));
	}
	return color.substring(4,color.length-1).split(',');
}

function animateColor(elm,begin,end, duration, fps)
{
	if(!duration) duration = 1000;
	if(!fps) fps = 20;
	duration = parseFloat(duration);
	fps=parseFloat(fps);
	var interval = Math.ceil(1000/fps);
	var totalframes = Math.ceil(duration/interval);
	
	for(i=1;i <= totalframes;i++)
	{
		(function()
		{
		   var frame=i;
		   var b = cssColor2rgb(begin);
		   var e = cssColor2rgb(end);
		   var change0=e[0]-b[0];
		   var change1=e[1]-b[1];
		   var change2=e[2]-b[2];

			function color()
			{
				var increase0=ease(frame, b[0], change0, totalframes);
				var increase1=ease(frame, b[1], change1, totalframes);
				var increase2=ease(frame, b[2], change2, totalframes);
				elm.style['backgroundColor']  = 'rgb('+parseInt(increase0)+','+parseInt(increase1)+','+parseInt(increase2)+')';        
			}
			timer = setTimeout(color,interval*frame);
		})(); 
 }
}

function ease(frame,begin,change,totalframes)
{
       return begin+change*(frame/totalframes);
}

function display()
{
	infoContainer = document.getElementById("infoContainer");
	infoBoxes = infoContainer.getElementsByTagName("div");
	for (count=0; count < infoBoxes.length; count++)
	{
		infoBoxes[count].style.display = "none";
	}

	var url = this.href;
	var number = url.substring(url.length-2);
	box = document.getElementById("info" + number + "");
	box.style.display = "block";
	return false;
}

function newDisplay(link)
{
	var box = document.getElementById("portfolioWindow");
	box.src = link.href;
}

function slide()
{
	clearTimeout(slideTimer);
	for (var count = 0; count < clients.length; count++)
	{
		obj = clients[count];
		current = obj.style.left;
		position = current.slice(0,-2);
		if (position < -169)
		{
			position = (clients.length - 1) * 170;
		}
		else
		{
			position -= slideSpeed;
		}
		obj.style.left = position + "px";
	}
	slideTimer = setTimeout("slide()",20);
}

function setOpacity(obj, opacity)
{
	opacity = (opacity == 100)?99.999:opacity;
	obj.style.filter = "alpha(opacity:"+opacity+")";
	obj.style.KHTMLOpacity = opacity/100;
	obj.style.MozOpacity = opacity/100;
	obj.style.opacity = opacity/100;
}

function fadeIn(objId,opacity)
{
	if (document.getElementById)
	{
		var obj = document.getElementById(objId);
		obj.style.display = 'block';
		if (opacity < 102)
		{
			setOpacity(obj, opacity);
			opacity += 4;
			var fadeInTimer = setTimeout("fadeIn('"+objId+"',"+opacity+")", 1);
		}
		else
		{
			clearTimeout(fadeInTimer);
			document.getElementById("contentArea").style.display = 'block';
		}
	}
}

function fadeOut(objId,opacity)
{
	if (document.getElementById)
	{
		var obj = document.getElementById(objId);
		if (opacity > 0)
		{
			setOpacity(obj, opacity);
			opacity -= 4;
			var fadeOutTimer = setTimeout("fadeOut('"+objId+"',"+opacity+")", 1);
		}
		else
		{
			clearTimeout(fadeOutTimer);
			obj.style.display = 'none';
			status = 0;
		}
	}
}

function show()
{
	fadeIn('overlay',0);
	return false;
}

function hide()
{
	document.getElementById("contentArea").src = 'http://www.aspectratioproductions.co.uk/pages/video.php?id=0';
	document.getElementById("contentArea").style.display = 'none';
	fadeOut('overlay',100);
	return false;
}

function updateLink()
{
	box = document.getElementById("contentArea");
	box.style.display = 'block';
	box.src = this.href;
	box.style.display = 'none';
	return false;
}

function initGallery()
{
	document.getElementById("moveLeft").onmouseover = function() {gallerySpeed = -1;};
	document.getElementById("moveLeft").onmouseout = function() {gallerySpeed = 0;};
	document.getElementById("moveRight").onmouseover = function() {gallerySpeed = 1;};
	document.getElementById("moveRight").onmouseout = function() {gallerySpeed = 0;};
	galleryBox = document.getElementById('gallery');
	galleryImages = galleryBox.getElementsByTagName("a");
	for (var count = 0; count < galleryImages.length; count++)
	{
		obj = galleryImages[count];
		obj.onclick = update;
		obj.style.left = (count * 70) + "px";
	}
	resetGallerySlide();
	gallerySlide();
	return false;
}

function update()
{
	obj = this.getElementsByTagName("img")[0];
	filename = obj.src.slice(0,-10);
	mainContent = document.getElementById("main").getElementsByTagName("img")[0];
	mainContent.src = filename + '.jpg';
	document.getElementById("description").innerHTML = obj.alt;
}

function resetGallerySlide()
{
	box = document.getElementById("gallery");
	box.scrollLeft = 0;
}

function gallerySlide()
{
	clearTimeout(gallerySlideTimer);
	box = document.getElementById("gallery");
	box.scrollLeft += gallerySpeed;
	gallerySlideTimer = setTimeout("gallerySlide()",10);
}

function openSubNav(id)
{
	item = document.getElementById(id);
	menu = document.getElementById(id+"Sub");
	if (menu.style.display == "block")
	{
		item.innerHTML = item.innerHTML.replace("[-]", "[+]");
		menu.style.display = "none";
	}
	else
	{
		item.innerHTML = item.innerHTML.replace("[+]", "[-]");
		menu.style.display = "block";
	}
}

function changeEquipmentImage(image)
{
	obj = document.getElementById("equipmentImage");
	obj.src = "/images/equipment/"+image+".jpg";
}

function changeEquipmentImageBack()
{
	obj = document.getElementById("equipmentImage");
	obj.src = "/images/content/equipment-hire.jpg";
}

function setVolume(volume)
{
	plugin.SetVolume(volume);
}
