/*
	My home grown photo viewer thingy. If you're looking at this, can make any sense at all of it,
	and can use any of it then feel free to poach it. Clearly, it's not the best written
	code, but it works!
	
	-Paul Holder
*/

var currentIndex = 0;
var lastIndex = 0;
var imageList = new Array();
var selectedState = '2px solid #090';
var defaultState = '2px solid #fff';
/* Initialize thumbnail objects */
function initGallery() {
	var carousel = document.getElementById('carousel');
	var itemList = carousel.getElementsByTagName('li');
	for (var i=0; i<itemList.length; i++) {
		var childAnchor = itemList[i].firstChild;
		if (childAnchor != null) {
			imageList[i] = new thumbnail(itemList[i],childAnchor,i);
		}
	}
	/* select first thumbnail */
	imageList[0].selected = true;
	imageList[0].itemEle.className = 'selected';
}
/* Individual thumbnail objects */
function thumbnail(itemEle,anchorEle,ind) {
	this.itemEle = itemEle;
	this.anchorEle = anchorEle;
	this.ind = ind;
	this.selected = false;
	var thisObj = this;
	this.clickEvent = function() {
		lastIndex = currentIndex;
		currentIndex = thisObj.ind;
		imageList[lastIndex].itemEle.className = 'unselected';
		thisObj.itemEle.className = 'selected';
		var main = document.getElementById('mainPhoto');
		main.src = thisObj.anchorEle.href;
		updateMainPageCounts();
		manageLinkControls();		
		return false;
	}
	this.anchorEle.onclick = this.clickEvent; // so I can use object function elsewhere
}

/* Swap out the Medium image */
function showLarge(num) {
	var img = document.getElementById('mainPhoto');
	img.src = 'car_img/medium/' + num + '.jpg';
	return false;
}

/* Specifics about thumbstrip */
var pixelsToMove = 20; // Pixels per iteration
var speed = 5; // milliseconds between iterations
var thumbsPerPage = 6; // How many thumbs are viewable

/* Gallery Object that moves thumbstrip and maintains state */
function galleryObj() {
	var tsEle = document.getElementById('thumbstrip');
	var eles = tsEle.getElementsByTagName('ul');
	for (var i=0; i<eles.length; i++) {
		this.pageWidth = (eles[i].offsetWidth);
	  break;
	}	
	this.thumbstrip = tsEle;
	this.thumbpages = this.thumbstrip.getElementsByTagName('ul');
	this.thumbimages = this.thumbstrip.getElementsByTagName('img');
	this.currentThumbSelection = 0;
	this.currentLeftPos = 0;
	this.targetLeftPos = 0;
	this.currentPage = 1;
	this.numberOfPages = this.thumbpages.length;
	this.numberOfImages = this.thumbimages.length;
	this.movingLeft = null;
	this.movingRight = null;
	var thisObj = this;
	this.moveRight = function() {
		if (thisObj.movingLeft) clearTimeout(thisObj.movingLeft);
		if (thisObj.currentLeftPos < thisObj.targetLeftPos) {
			if (thisObj.currentLeftPos + pixelsToMove > thisObj.targetLeftPos) {
				thisObj.currentLeftPos = thisObj.targetLeftPos;
				thisObj.thumbstrip.style.left = thisObj.targetLeftPos + 'px';
				if (thisObj.movingRight) clearTimeout(thisObj.movingRight);
			} else {
				thisObj.currentLeftPos = thisObj.currentLeftPos + pixelsToMove;
				thisObj.thumbstrip.style.left = thisObj.currentLeftPos + 'px';
				thisObj.movingRight = setTimeout('gallery.moveRight()',speed);
			}
		}
	}
	this.moveLeft = function() {
		if (thisObj.movingRight) clearTimeout(thisObj.movingRight);
		if (thisObj.currentLeftPos - pixelsToMove < thisObj.targetLeftPos) {
			thisObj.currentLeftPos = thisObj.targetLeftPos;
			thisObj.thumbstrip.style.left = thisObj.targetLeftPos + 'px';
			if (thisObj.movingLeft) clearTimeout(thisObj.movingLeft);
		} else {
			thisObj.currentLeftPos = thisObj.currentLeftPos - pixelsToMove;
			thisObj.thumbstrip.style.left = thisObj.currentLeftPos + 'px';
			thisObj.movingLeft = setTimeout('gallery.moveLeft()',speed);
		}
	}
}
/* Left arrow click - slides to the right */
function leftClick() {
	if (gallery.targetLeftPos < 0) {
		var thumbstrip = document.getElementById('thumbstrip');
		gallery.targetLeftPos += gallery.pageWidth;
		gallery.moveRight();
		gallery.currentPage--;	
		manageButtons();
		manageLinkControls();
	}
}
/* Right arrow click - slides to the left */
function rightClick() {
	var maxNumber = (gallery.numberOfPages - 1) * gallery.pageWidth;
	if (gallery.targetLeftPos > -maxNumber) {
		var thumbstrip = document.getElementById('thumbstrip');
		gallery.targetLeftPos -= gallery.pageWidth;
		gallery.moveLeft();
		gallery.currentPage++;
		manageButtons();
		manageLinkControls();
	}
}
/* Set left/right arrows state on or off */
function manageButtons() {
	updateThumbSelection();
	var leftBtn = document.getElementById('leftControl');
	var rightBtn = document.getElementById('rightControl');
	(gallery.currentPage > 1) ? leftBtn.src = '/img/gallery/left_on.gif' : leftBtn.src = '/img/gallery/left_off.gif';
	(gallery.currentPage == gallery.numberOfPages) ? rightBtn.src = '/img/gallery/right_off.gif' : rightBtn.src = '/img/gallery/right_on.gif';
}
/* update large thumbnail count description (x of x) */
function updateMainPageCounts() {
	var mainPagingContainer = document.getElementById('mainPaging');
	mainPagingContainer.innerHTML = (currentIndex + 1) + ' of ' + gallery.numberOfImages;	
}
/* Change selected thumbnail on "page" change to  top left */
function updateThumbSelection() {
	// Access onclick event of imageList object array - can just subtract thumbsPerPage since array index starts at zero.
	imageList[(gallery.currentPage * thumbsPerPage) - thumbsPerPage].clickEvent();
}
/* Move main forward and update thumbstrip to reflect change */
function advanceMain() {
	if (currentIndex < (gallery.numberOfImages - 1)) {
		imageList[currentIndex + 1].clickEvent();
		if (currentIndex + 1 > gallery.currentPage * thumbsPerPage) {
			rightClick();
		}
	} 
	manageLinkControls();
}
function rewindMain() {
	if (currentIndex > 0) {
		var preservedIndex = currentIndex;
		if ((currentIndex) < ((gallery.currentPage * thumbsPerPage) - (thumbsPerPage - 1))) {
			leftClick();
		}
		imageList[preservedIndex - 1].clickEvent();	
	}
	manageLinkControls();
}
function manageLinkControls() {
	if (currentIndex > 0) {
		document.getElementById('prevMainLink').className = 'bkActiveLink';
	}
	if (currentIndex == (gallery.numberOfImages - 1)) {
		document.getElementById('nextMainLink').className = 'fwDisabledLink';
	}
	if (currentIndex == 0) {
		document.getElementById('prevMainLink').className = 'bkDisabledLink';
	}
	if (currentIndex < (gallery.numberOfImages - 1)) {
		document.getElementById('nextMainLink').className = 'fwActiveLink';
	}	
}
function setupControls() {
	updateMainPageCounts();	
	if (gallery.numberOfPages == 1) {
		document.getElementById('rightControl').src = '/img/gallery/right_off.gif';
	}
}