/*
 * Name: scroller.js
 * URL: http://lukees.com/project/scroller
 * Description: Creates a box with scrolling pages.
 * 
 * Author: Luke Seeley
 * Email: luke@lukees.com
 * 
 * ------------------------------------------------------- */

// Set Up
var numPages = 0; // set in applyPaging()
var currentPage = "page1";
var pageWidth = "860px";
var pageHeight = "95px";
var navLinkColour = "#fcd7ad";
var navLinkBGColour = "none"
var navLinkHighlightColour = "#fff";
var navLinkHighlightBGColour = "none";

/* Initiates the scroller nav events */
function initScroller() {
	setupScroller();
	
	var links = $ES('a','scroller-nav');
	var scroll = new Fx.Scroll('scroller', {
		wait: false,
		duration: 500,
		transition: Fx.Transitions.Quad.easeInOut
	});
	
	// Set slide page count
	numPages = links.length;	
	
	// Set slider navigation link onclick events
	for(var i=0; i<links.length; i++) {
		links[i].addEvent('click', function(event) {
			var pageID = this.id.split('nav-')[1];
			event = new Event(event).stop();
			setNavCurrentState(pageID);
			currentPage = pageID;
			scroll.toElement(pageID);
		});
	}
	
	// Set slider navigation BACK link onclick events
	$('scroller-nav-back').addEvent('click', function(event) {
		currentPage = getPreviousPage();
		setNavCurrentState(currentPage);
		event = new Event(event).stop();
		scroll.toElement(currentPage);
	
	});

	// Set slider navigation NEXT link onclick events	
	$('scroller-nav-next').addEvent('click', function(event) {
		currentPage = getNextPage();
		setNavCurrentState(currentPage);
		event = new Event(event).stop();
		scroll.toElement(currentPage);
	});
	
	// Set current page
	var url = window.location + "";
	var page = url.split('#')[1];
	
	if(page != null && page.match(/page/))
		currentPage = page;
		
	scroll.toElement(currentPage);	
	setNavCurrentState(currentPage);
}

/* Returns the next page */
function getNextPage() {
	var number = parseInt(currentPage.split('page')[1]);
	return (number < numPages)? "page" + ++number : "page1";
}

/* Returns the previous page */
function getPreviousPage() {
	var number = parseInt(currentPage.split('page')[1]);		
	return (number == 1)? "page" + numPages : "page" + --number;
}


/* Sets the the style of the passed DOM element */

function setNavCurrentState(page) {
	var links = $ES('a','scroller-nav');
	for(var i=0; i<links.length; i++)
		links[i].setStyles({'background':navLinkBGColour,'color':navLinkColour});
	
	var pageLinkID = "nav-"+page;
	$(pageLinkID).setStyles({'background':navLinkHighlightBGColour,'color':navLinkHighlightColour});	
}


/* Adds IDs to the pages and page nav links */

function setupScroller() {
	var pages = $ES('div.page','scroller');
	var links = $ES('a','scroller-nav');
	
	// Set navigation link IDs
	for(var i=0; i<links.length; i++)
		links[i].id = "nav-page" + (i+1);
	
	// Set page IDs and dimensions
	for(var j=0; j<pages.length; j++) {
		var left = j * parseInt(pageWidth.split(/px/)[0]);
		pages[j].id = "page" + (j+1);
		pages[j].setStyles({'width':pageWidth,'height':pageHeight,'left':left,'top':'0px'});
	}

	// Set Scroller and page-content Dimensions
	$('scroller').setStyles({'width':pageWidth, 'height':pageHeight});
	$('scroller-frame').setStyles({'width':pageWidth, 'height':pageHeight});
}


/* Wraps the images in the scroller into pages */

function applyPaging() {
	var thumbnails = $('scroller').innerHTML.split(/<\/[aA]>/); // last element is null
	var temp = "";
	numPages = Math.ceil((thumbnails.length-1) / 8);
	
	
	// Wrap thumbnails in pages
	for(var i=0; i<numPages; i++) {
		temp += "<div class='page'><div class='page-content'><ul class='showroomItemList'>";
		for(var j=0; j<8; j++) { 
			x = j+(8*i);
			if(thumbnails[x])			
				temp += "<li>" + thumbnails[x] + "</a></li>";
		}
		temp += "</div></div></ul>";
	}
	
	$('scroller').innerHTML = temp;
	
	// Set up pageination
	
	if(numPages > 0)
		document.write('<a href="#" id="scroller-nav-back" class="showroomListLess"><img src="images/arrow-left.gif" alt="Less"/></a><a href="#" id="scroller-nav-next" class="showroomListMore"><img src="images/arrow-right.gif" alt="More"/></a>');
	
	document.write('<ul id="scroller-nav" class="showroomPagination">')
	for(var k=0; k<numPages; k++)
		document.write('<li><a href="#page' + (k+1) + '" title="Page ' + (k+1) + '">' + (k+1) + '</a></li>');
	document.write('</ul>');
}

/* Autoscrolls to page that highlighed thumbnail resides */

function scrollToHighlight() {
	var thumbnails = $ES('a','scroller');
	var scroll = new Fx.Scroll('scroller', {
		wait: false,
		duration: 1000,
		transition: Fx.Transitions.Quad.easeInOut
	});
	
	// Find the highlighted thumbnail
	for(var i=0; i<thumbnails.length; i++) {
		if(thumbnails[i].className.match(/highlight/))
			currentPage = "page" + (Math.floor(i/8)+1);
	}	

	setNavCurrentState(currentPage);	
	scroll.toElement(currentPage);
}