var gallery = null;
var galleryStartPos = 0;
var galleryWidth = 0;
var slideDirection = 0;
var timer = null;
var selectedImage = null;

var slideSpeed = 10;

function initGallery()
{
	gallery = document.getElementById('thumbs');
	
	if (gallery) {
		galleryStartPos = gallery.offsetLeft;
		
		var thumbDivs = gallery.getElementsByTagName('DIV');
		galleryWidth = thumbDivs[0].offsetWidth * thumbDivs.length;
		var thumbs = gallery.getElementsByTagName('IMG');
		
		selectedImage = thumbs[0];
		thumbs[0].style.filter = 'alpha(opacity=100)';
		thumbs[0].style.opacity = 1;	
		
		for(var i = 0; i < thumbs.length; i++)
		{
			thumbs[i].onmouseover = hiliteImage;
			thumbs[i].onmouseout = dehiliteImage;
			thumbs[i].onmouseup = selectImage;
		}
		
		var nav = document.getElementById('navigation_left');
		if (nav) {
			nav.onmouseover = startSliding;
			nav.onmouseout = stopSliding;
		}
		nav = document.getElementById('navigation_right')
		if (nav) {
			nav.onmouseover = startSliding;
			nav.onmouseout = stopSliding;
		}
	}
}


function startSliding()
{
	if (timer == null)
	{
		slideDirection = (this.id == 'navigation_right') ? -1 : 1;
		doSlide();
	}
}


function stopSliding()
{
	if (timer != null)
	{
		clearTimeout(timer);
		timer = null;
	}
}


function doSlide()
{
	var galleryPos = gallery.offsetLeft;
	var stopped = false;
	
	galleryPos += slideDirection * slideSpeed;
	if (galleryPos >= galleryStartPos)
	{
		galleryPos = galleryStartPos;
		stopped = true;
	}
	if (galleryPos <= galleryStartPos - galleryWidth + 464 - 28)	// TODO: calculate these offsets
	{
		galleryPos = galleryStartPos - galleryWidth + 464 - 28;
		stopped = true;
	}
	
	gallery.style.left = galleryPos + 'px';
	if (stopped)
	{
		stopSliding();
	}
	else
	{
		timer = setTimeout('doSlide()', 20);
	}
}


function dehiliteImage()
{
	if (this != selectedImage)
	{
		this.style.filter = 'alpha(opacity=50)';
		this.style.opacity = 0.5;
	}
}


function hiliteImage()
{
	this.style.filter = 'alpha(opacity=100)';
	this.style.opacity = 1;	
}


function selectImage()
{
	if (selectedImage)
	{
		selectedImage.style.filter = 'alpha(opacity=50)';
		selectedImage.style.opacity = 0.5;
	}
	this.style.filter = 'alpha(opacity=100)';
	this.style.opacity = 1;	
	selectedImage = this;
	
	document.getElementById('theater_preview_image').src = this.src.replace('/t_', '/p_');
	var movie = document.qtmovie;
	if (movie) movie.Stop();
	
	document.getElementById('theater').style.display = 'none';
}


function selectImageById(id)
{
	var img = document.getElementById(id);
	if (img)
	{
		if (selectedImage)
		{
			selectedImage.style.filter = 'alpha(opacity=50)';
			selectedImage.style.opacity = 0.5;
		}
		img.style.filter= 'alpha(opacity=100)';
		img.style.opacity = 1;
		selectedImage = img;
		
		document.getElementById('theater_preview_image').src = img.src.replace('/t_', '/p_');
		var movie = document.qtmovie;
		if (movie) movie.Stop();
		
		document.getElementById('theater').style.display = 'none';
	}
}


function showMovie(w, h)
{
    var theater = document.getElementById('theater');
    if (theater.style.display == 'none')
    {
    	var title = document.getElementById('theater_preview_image').src.replace('/images/p_', '/movies/').replace('_over', '').replace('.jpg', '.mov');
	    theater.style.display = 'inline';
	    var str = QT_GenerateOBJECTText(title, w, h + 16, '', 'name', 'qtmovie', 'controller', 'true');
//	    alert(str);
//	    theater.innerHTML = QT_GenerateOBJECTText(title, w, h + 16, '', 'name', 'qtmovie', 'controller', 'true');
        theater.innerHTML = str;
//        alert(theater.innerHTML);
	}
}


function hilitePlay()
{
    var img = document.getElementById('theater_preview_image');
    if (img)
    {
	var src = img.src;
	var path = src.substring(0, src.lastIndexOf('p_'));
	var imgName = src.substring(src.lastIndexOf('p_'));
	img.src = path + imgName.replace('.jpg', '_over.jpg');
    }
}


function dehilitePlay()
{
    var img = document.getElementById('theater_preview_image');
    if (img)
    {
	var src = img.src;
	var path = src.substring(0, src.lastIndexOf('p_'));
	var imgName = src.substring(src.lastIndexOf('p_'));
	img.src = path + imgName.replace('_over.jpg', '.jpg');
    }
}


window.onload = function() {
	initGallery();
}