var arrowImageHeight = 35;	// Height of arrow image in pixels;
var arrowImageWidth = 124;	// Height of arrow image in pixels;
var displayWaitMessage=false;	// Display a please wait message while images are loading?

var previewElementWidth = 166;

var scrollBarMinOffset = 36;
var scrollBarMaxOffset = 946;
var scrollBarWidth = scrollBarMaxOffset - scrollBarMinOffset;
var scrollBarActive = false;
var scrollBarMousePos = 0;

var previewImage = false;
var previewImageParent = false;
var slideSpeed = 0;
var previewImagePane = false;
var slideEndMarker = false;
var galleryContainer = false;

	
function stopSlide() {slideSpeed = 0;}

function disableScrollBar(e) {
	e = e || window.event;
	scrollBarActive = false;
	scrollBarMousePos = e.clientX;
	if (e.stopPropagation) e.stopPropagation();
	if (e.preventDefault) e.preventDefault();
	return false;
}
function enableScrollBar(e) {
	var mouseBtn;
	if (document.all && !window.opera) { // MSIE
		e = window.event;
		mouseBtn = 1;
	} else mouseBtn = 0;
	if (e.button == mouseBtn) {
		scrollBarActive = true;
		scrollBarMousePos = e.clientX;
	}
	if (e.stopPropagation) e.stopPropagation();
	if (e.preventDefault) e.preventDefault();
	return false;
}
	
function slidePreviewPane() {
	if (slideSpeed != 0) {
		if(slideSpeed < 0 && previewImageParent.scrollLeft == 0 || slideSpeed > 0 && previewImageParent.scrollLeft == previewImageParent.scrollWidth)
			slideSpeed = 0;
		
		previewImageParent.scrollLeft += slideSpeed*3;
		setScrollBarPos();
		window.setTimeout('slidePreviewPane()', 20);		
	}
}

function scrollPreviewPane(scrollPos) {
	if (scrollBarActive) {
		var scrollBar = document.getElementById('scroll_bar');
		if (scrollBar.offsetLeft + scrollPos < scrollBarMinOffset) scrollPos = scrollBar.offsetLeft - scrollBarMinOffset;
		if (scrollBar.offsetLeft + scrollPos > scrollBarMaxOffset) scrollPos = scrollBarMaxOffset - scrollBar.offsetLeft;
		scrollBar.style.left = scrollBar.offsetLeft + scrollPos + 'px';
		previewImageParent.scrollLeft += Math.round(scrollPos/scrollBarWidth*(previewImageParent.scrollWidth-previewImageParent.clientWidth));
		//setScrollBarPos();
	}
}

	
window.onload = function() {
	previewImageParent = document.getElementById('theImages');
	previewImagePane = previewImageParent.getElementsByTagName('div').item(0);
	galleryContainer  = document.getElementById('galleryContainer');
	
	previewImagePane.style.width = previewImagePane.getElementsByTagName('div').length * previewElementWidth +'px';
	
	var arrowUpImg = document.getElementById('arrow_up_image');
	var arrowDownImg = document.getElementById('arrow_down_image');
	var scrollBarImg = document.getElementById('scroll_bar_image');

	if (previewImageParent.clientWidth < previewImageParent.scrollWidth) {

		arrowUpImg.onmousedown = function() {slideSpeed = -3; slidePreviewPane();}
		arrowUpImg.onmouseup = stopSlide;
		arrowUpImg.onmouseout = stopSlide;
	
		arrowDownImg.onmousedown = function() {slideSpeed = 3; slidePreviewPane();}
		arrowDownImg.onmouseup = stopSlide;
		arrowDownImg.onmouseout = stopSlide;

		document.body.onmousemove = function(e) {
			e = e || window.event;
			if (scrollBarActive) {
				scrollPreviewPane(e.clientX-scrollBarMousePos);
				scrollBarMousePos = e.clientX;
			}
			if (e.stopPropagation) e.stopPropagation();
			if (e.preventDefault) e.preventDefault();
			return false;
		}
		scrollBarImg.onmousedown = enableScrollBar;
		scrollBarImg.onmouseup = disableScrollBar;
		document.body.onmouseup = function() {if (scrollBarActive) scrollBarActive = false;}
		
		var previewElements = previewImagePane.getElementsByTagName('div');
		for (var i = 0; i < previewElements.length; i++) {
			var el = previewElements.item(i);
			if (el.className.indexOf('active') != -1) {
				previewImageParent.scrollLeft = Math.round(el.offsetLeft-(previewImageParent.clientWidth-previewElementWidth)/2);
				setScrollBarPos();
				break;
			}
		}
	}
	else {
		arrowUpImg.parentNode.style.display = 'none';
		arrowDownImg.parentNode.style.display = 'none';
		scrollBarImg.parentNode.style.display = 'none';
	}
	
	slidePreviewPane();
}
	
	
function setScrollBarPos(relativePos) {
	if (relativePos === undefined) relativePos = previewImageParent.scrollLeft/(previewImageParent.scrollWidth-previewImageParent.clientWidth);
	var scrollBar = document.getElementById('scroll_bar');
	var newOffset = scrollBarMinOffset + Math.round(relativePos*scrollBarWidth);
	if (newOffset < scrollBarMinOffset) newOffset = scrollBarMinOffset;
	if (newOffset > scrollBarMaxOffset) newOffset = scrollBarMaxOffset;
	scrollBar.style.left = newOffset + 'px';
}