var Scroller = Class.create({slides: 4,currentSlide: 1,previousSlide: 1,canClick: true,autoScroll: false,autoScrollIntervalId: null,autoScrollSpeed: 14000,scrollerWidth: 0,initialize: function(){$$('.thumbnail').invoke('writeAttribute', 'onclick', 'return false');Event.observe('thumbs', 'click', this.clickSlide.bind(this));Event.observe('window', 'click', this.clickSlide.bind(this));this.scrollerWidth = 951;if(this.autoScroll == true){this.autoScrollIntervalId = setInterval(function(){if(this.currentSlide == (this.slides)){if(this.canClick == true) this.goToSlide(1);} else{if(this.canClick == true) this.goToSlide((this.currentSlide+1));}}.bind(this), this.autoScrollSpeed);}},clickSlide: function(event){var element = Event.element(event);if(element.src && element.up().tagName == 'A'){var parentElement = element.up().up();} else if(element.tagName == 'A'){var parentElement = element.up();}if(parentElement){clearInterval(this.autoScrollIntervalId);if(parentElement.getAttribute('id') && parentElement.getAttribute('id') != 'slide1Links'){var newSlideId = parseInt(parentElement.getAttribute('id').replace('thumbnailContainer', ''));Event.stop(event);} else{if(element.hasClassName('nextButton')){var newSlideId = parseInt(element.getAttribute('id').replace('nextButton', ''));Event.stop(event);}}if(this.getClickStatus(newSlideId) == true){this.canClick = false;this.showSlide(this.getScrollX(newSlideId), newSlideId);}}},getScrollX: function(newSlideId){if(newSlideId < this.currentSlide){var scrollX = 0 - (this.scrollerWidth*(newSlideId - this.currentSlide));} else if(newSlideId > this.currentSlide){var scrollX =  (this.scrollerWidth*(this.currentSlide - newSlideId));}return scrollX;},getClickStatus: function(newSlideId){if((newSlideId != this.currentSlide) && this.canClick == true){return true;} else{return false;}},goToSlide: function(slideNum){this.canClick = false;this.showSlide(this.getScrollX(slideNum), slideNum);},showSlide: function(scrollX, newSlideId){$$('.thumbnailContainer').invoke('removeClassName', 'selected');$('thumbnailContainer'+newSlideId).addClassName('selected');new Effect.Move($('pointer'), { x:this.getPointerCoords(newSlideId),mode:'absolute',duration:0.9});this.currentSlide = newSlideId;this.options = {x: scrollX,y:0,duration: 1.2,afterFinish: this.afterScroll.bind(this)};new Effect.Move($('scroll'), this.options);},getPointerCoords: function(newSlideId){if(newSlideId == 1){return 90;} else if(newSlideId == 2){return 330;} else if(newSlideId == 3){return 570;} else if(newSlideId == 4){return 800;}},afterScroll: function(){this.canClick = true;},setCurrentSlide: function(slide){this.currentSlide = slide;}});