/**
 * @author Max Shindler <max.shindler@gmail.com>
 * @version 1.0
 * @requires jQuery, jQueryUI WidgetFactory, jQuery Cycle Plug-in
 */

var teoSpoter  = {
	options: {
		arrowsShowDelay: 100,
		arrowsShowSpeed: 500,
		delay: 4000,
		borderActive: 	'#e20074',
		borderInActive: '#ededed',
		speed: 1000
	},
	currentPage: 0,
	_init: function() {
		this.initNavigation();
		this.initSpotlight();
		this.initEvents();
		this.navigator.init.call(this);
		
	},
	initNavigation: function () {
		
		$this = this;
		$teoSpoter = this.element;
		
		/* Setup cycle for navigation */
		$('#spotlight-thumbs', $teoSpoter).cycle({
			fx:	'scrollVert',
			timeout: 0,
			rev:	true,
			nowrap: true,
			easing: 'easeInOut',
			speed: this.options.speed,
			cleartypeNoBg: true,
			after:	function(currSlideElement, nextSlideElement, options, forwardFlag) {
				$this.currentPage = parseInt(options.currSlide);
				//$('li:first', nextSlideElement).addClass('current');
			},
			before:	function(currSlideElement, nextSlideElement, options, forwardFlag) {
				$this.currentPage = parseInt(options.nextSlide);
				//$('#spotlight-navigation-current', $teoSpoter).stop().animate({top: $('#spotlight-navigation-current', $teoSpoter).data('spoter-defaultTop')});
			}
		}).animate({left: '10'}); 
		
		/* Setup cycle arrow UP */
		$('#spotlight-nav-up', $teoSpoter).css({opacity: 0, display: 'block'}).click(function (e) {
			e.preventDefault();
			$('#spotlight-thumbs', $teoSpoter).cycle('prev');
			return false;
		}).delay(this.options.arrowsShowDelay).animate({opacity: 1, top: 0}, this.options.arrowsShowSpeed);
		
		/* Setup cycle arrow DOWN */
		$('#spotlight-nav-down', $teoSpoter).css({opacity: 0, display: 'block'}).click(function (e) {
			e.preventDefault();
			$('#spotlight-thumbs', $teoSpoter).cycle('next');
			return false;
		}).delay(this.options.arrowsShowDelay).animate({opacity: 1, bottom: 0}, this.options.arrowsShowSpeed);
		
		/* Animate current indicator */
		$('#spotlight-navigation-current', $teoSpoter).animate({opacity: 1, left: '+=13'}, function () {
			$(this).data('spoter-defaultTop', $(this).position().top);
		});
		
		/* Setup current element */
		$('#spotlight-thumbs ul', $teoSpoter).eq(0).find('li:first').addClass('current');
		
		
		$('#spotlight-thumbs ul li a', $teoSpoter).click(function (e) {
			e.preventDefault();
			$this.navigator.goTo.call($this, e);
			return false;
		});
		
		
		$('#spotlight-thumbs li a', $teoSpoter).css({
			borderBottomColor	: this.options.borderInActive,
			borderLeftColor		: this.options.borderInActive,
			borderRightColor	: this.options.borderInActive,
			borderTopColor		: this.options.borderInActive
		}, this.options.speed);
		$('#spotlight-thumbs li[ref=0] a', $teoSpoter).animate({
			borderBottomColor	: this.options.borderActive,
			borderLeftColor		: this.options.borderActive,
			borderRightColor	: this.options.borderActive,
			borderTopColor		: this.options.borderActive
		}, this.options.speed).addClass('current');
	},
	initSpotlight: function () {
		$teoSpoter = this.element;
		/* Setup cycle for navigation */
		$('#spotlight-main', $teoSpoter).cycle({
			fx:	'scrollVert',
			timeout: 0,
			rev:	true,
		    easing: 'easeInOut',
		    speed: this.options.speed
		});
	},
	initEvents: function () {
		$this = this;
		$teoSpoter = this.element;

		
		$('#spotlight-thumbs-cont, .spotlight-image', $teoSpoter).bind('mouseover.spotlight', function () {
			$this.navigator.timer = clearTimeout($this.navigator.timer);
			return false;
		});
		
		$('#spotlight-thumbs-cont, .spotlight-image', $teoSpoter).bind('mouseout.spotlight', function () {
			if($.browser.msie) {
				$this.navigator.timer = setTimeout(function () { $this.navigator.go.call($this); } , $this.options.delay/2);
			} else {
				$this.navigator.timer = setTimeout(function (thisObj) { thisObj.navigator.go.call(thisObj); } , $this.options.delay/2, $this);
			}
			return false;
		});
		
		
	},
	navigator: {
		size: 0,
		pages: 0,
		nextItem: 0,
		nextPage: 0,
		timer: null,
		init: function () {
			this.navigator.size 	= $('#spotlight-thumbs li', $teoSpoter).size();
			this.navigator.pages	= Math.ceil(this.navigator.size / 4);
			if($.browser.msie) {
				var thisObj = this;
				this.navigator.timer 	= setTimeout(function () { thisObj.navigator.go.call(thisObj); }, this.options.delay);
			} else {
				this.navigator.timer 	= setTimeout(function (thisObj) { console.log(thisObj); thisObj.navigator.go.call(thisObj); }, this.options.delay, this);
			}
		},
		goTo: function(e) {
			index = $(e.target).parents('li').attr('ref');
			elementPage = Math.floor(parseInt(index) / 4);
			this.navigator.nextItem = index;
			this.navigator.nextPage = elementPage;
			this.navigator.go.call(this, true);
			$this.navigator.timer = clearTimeout($this.navigator.timer);
		},
		go: function(ommitCalculation){
			
			var $liWrapper 		= $('#spotlight-thumbs li.current', $teoSpoter);
			var $currentItem 	= parseInt($liWrapper.attr('ref'));
			var elementPage 	= Math.floor(parseInt($currentItem) / 4);
			
			if(ommitCalculation !== true) {
				/* Check if next item is in range */
				if ($currentItem + 1 >= this.navigator.size) {
					this.navigator.nextItem = 0;
					this.navigator.nextPage = 0;
					$('#spotlight-thumbs', $teoSpoter).cycle(this.navigator.nextPage);
				} else {
				
					/* Check if next item is on same page, and if so... */
					if ($currentItem + 1 < ((this.navigator.pages) * 4)) {
						this.navigator.nextItem = $currentItem + 1;
					}
					
					if ($currentItem + 1 == ((this.navigator.nextPage + 1) * 4)) {
						this.navigator.nextPage++;
						$('#spotlight-thumbs', $teoSpoter).cycle(this.navigator.nextPage);
					} else if ($currentItem + 1 < ((this.navigator.nextPage + 1) * 4) && this.currentPage != elementPage) {
						$('#spotlight-thumbs', $teoSpoter).cycle(elementPage);
					}
				}
				

			} else {
			
				if(this.navigator.nextPage != elementPage) {
					$('#spotlight-thumbs', $teoSpoter).cycle(this.navigator.nextPage);
				}
			}
				
			$liWrapper.removeClass('current').find('a').animate({
				borderBottomColor	: this.options.borderInActive,
				borderLeftColor		: this.options.borderInActive,
				borderRightColor	: this.options.borderInActive,
				borderTopColor		: this.options.borderInActive
			}, this.options.speed);
			
			$('#spotlight-thumbs li[ref='+this.navigator.nextItem+']', $teoSpoter).addClass('current');
			
			$('#spotlight-main', $teoSpoter).cycle(parseInt(this.navigator.nextItem));
			
			$('#spotlight-navigation-current', $teoSpoter).stop().animate({top: parseInt($('#spotlight-thumbs li[ref='+this.navigator.nextItem+']', $teoSpoter).position().top) + 24}, this.options.speed);
			
			$('#spotlight-thumbs li[ref='+this.navigator.nextItem+'] a', $teoSpoter).animate({
				borderBottomColor	: this.options.borderActive,
				borderLeftColor		: this.options.borderActive,
				borderRightColor	: this.options.borderActive,
				borderTopColor		: this.options.borderActive
			}, this.options.speed);
			
			if($.browser.msie) {
				var thisObj = this;
				this.navigator.timer = setTimeout(function () { thisObj.navigator.go.call(thisObj); } , this.options.delay);
			} else {
				this.navigator.timer = setTimeout(function (thisObj) { thisObj.navigator.go.call(thisObj); } , this.options.delay, this);
			}
		}
	}
	
};

jQuery.widget("ui.teoSpoter", teoSpoter);