var SliderBox = {
	fadeTiming: 0.5,
		
	init : function (auditorium) {
		var stage 			= auditorium.select('div.galleryStage')[0];
		var yearGroups 	= auditorium.select('div.samplePictures');
		var yearLinks 		= auditorium.select('a.yearSelection');
		var players			= auditorium.select('a.imagePreview');
		
		auditorium.insert('<a class="leftArrow" href="#left" title="">Scroll Left</a>');
		auditorium.insert('<a class="rightArrow" href="#right" title="">Scroll Right</a>');
		
		for(var i = 0; i < yearLinks.length; i++) {
			yearLinks[i].observe('click', SliderBox.ChangeYear);
		}
		
		for(var i=0; i < players.length; i++) {
			var fullResolution = $(players[i].readAttribute('href').gsub(/^#/,''));
			fullResolution.hide();
			players[i].observe('click', function(event){
				var fullResolution = $(this.readAttribute('href').gsub(/^#/,''));
				var relaventStage = stage;
				stage.fade({ duration: SliderBox.fadeTiming, from: 1.0, to: 0.01, queue: 'end' });
				function processClick(){
					SliderBox.ShowOnStage(event, relaventStage, fullResolution);
				}
				processClick.delay(SliderBox.fadeTiming);
				Event.stop(event);
			 });
		}
		
		if(yearGroups.length > 1){
			for(var i = 0; i < yearLinks.length; i++) {
				if(yearLinks[i].hasClassName('displayedYear')) {
					var displayContentDiv = $(yearLinks[i].readAttribute('href').gsub(/^#/,''));
				}
			}
		}
		else {
			var displayContentDiv = $(yearGroups[0]);
		}
		
		SliderBox.ConfigureYear(displayContentDiv);
	},
	
	ChangeYear: function (event) {
		var yearContentDiv		= $(this.readAttribute('href').gsub(/^#/,''));
		var otherYearLinks 		= this.siblings();
		
		for(var i=0; i < otherYearLinks.length; i++){
			if(otherYearLinks[i].hasClassName('displayedYear')){
				otherYearLinks[i].removeClassName('displayedYear');
			}
		}
		
		this.addClassName('displayedYear');
		yearContentDiv.show();
		
		SliderBox.ConfigureYear(yearContentDiv);
		Event.stop(event);
	},
	
	ConfigureYear: function (showingYear) {
		var playersContainer	= showingYear.childElements();
		var leftArrow 				= showingYear.parentNode.parentNode.select('.leftArrow')[0];
		var rightArrow				= showingYear.parentNode.parentNode.select('.rightArrow')[0];
		leftArrow.stopObserving('click');
		rightArrow.stopObserving('click');
		
		showingYear.siblings().each(Element.hide);
		showingYear.setStyle( 'width: ' + ( playersContainer.length * SliderBox.width ) + 'px;' );
		if(playersContainer.length > 3) {
			leftArrow.show();
			rightArrow.show();
			leftArrow.observe('click', function (ev){ SliderBox.SlideLeft(ev, showingYear) });
			rightArrow.observe('click',  function (ev){ SliderBox.SlideRight(ev, showingYear) });
		}
		else {
			leftArrow.hide();
			rightArrow.hide();
		}
	},
	
	SlideLeft: function (event, showingYear) {
		var leftArrow = showingYear.parentNode.parentNode.select('.leftArrow')[0];
		var rightArrow = showingYear.parentNode.parentNode.select('.rightArrow')[0];
		var topPosition = showingYear.getStyle('top').gsub('px','') * 1;
		var leftPosition = showingYear.getStyle('left').gsub('px','') * 1;
		var width = showingYear.getWidth();
		
		
		if( leftPosition < 0) {
			leftArrow.stopObserving('click');
			rightArrow.stopObserving('click');
			new Effect.Move(showingYear, {x: (leftPosition + (SliderBox.width*3)), y: (topPosition + 0), mode: 'absolute'});
		}
		
		Event.stop(event);
		
		function resetArrows(){
			leftArrow.observe('click', function (ev){ SliderBox.SlideLeft(ev, showingYear) });
			rightArrow.observe('click',  function (ev){ SliderBox.SlideRight(ev, showingYear) });
		}
		
		resetArrows.delay(1);
	},
	
	SlideRight: function (event, showingYear) {
		var leftArrow = showingYear.parentNode.parentNode.select('.leftArrow')[0];
		var rightArrow = showingYear.parentNode.parentNode.select('.rightArrow')[0];
		var leftPosition = showingYear.getStyle('left').gsub('px','') * 1;
		var topPosition = showingYear.getStyle('top').gsub('px','') * 1;
		var width = showingYear.getWidth();
		
		if(leftPosition > -1 * (width - (SliderBox.width*3) - 10)) {
			leftArrow.stopObserving('click');
			rightArrow.stopObserving('click');
			new Effect.Move(showingYear, {x: (leftPosition - (SliderBox.width*3)), y: (topPosition + 0), mode: 'absolute'});
		}
		
		Event.stop(event);
		
		function resetArrows(){
			leftArrow.observe('click', function (ev){ SliderBox.SlideLeft(ev, showingYear) });
			rightArrow.observe('click',  function (ev){ SliderBox.SlideRight(ev, showingYear) });
		}
		
		resetArrows.delay(1);
	},
	
	ShowOnStage : function(event, stage, fullResolution){
		stage.update(fullResolution.innerHTML);
		stage.appear({ duration: SliderBox.fadeTiming, from: .01, to: 1.0, queue: 'end' })
		Event.stop(event);
	}
}
var slider = Class.create({
	initialize: function(element){
		this.options = arguments.length > 1 ? arguments[1] : {};
		auditorium = $(element);
		if (auditorium) {
			SliderBox.init(auditorium);
		}
	}
});

