/*******************************************************************************
	jQuery.jadrotate (alpha!)
	-------------------------
	
	This is a simple ad rotator that will rotate a set of images smoothly. Takes in an object as a parameter
	of options:
		* interval 
			-> The time interval between the rotation of the images, the minimum is 3secs or 3000ms.
			   Defaults to 3000.
		* rotation
			-> This options specifies if the widget will rotate or not. Values are either 'on' or 'off'.
			   Defaults to 'on'.
		* listContainer (new in 1.5)
			-> The selector used to find the list container(the parent of the 'listSelector' if you specified one).
			   Defaults to '#jadrotate-list'.	   
		* listSelector
			-> The selector used to find the list inside the #jadrotate-list container(not neccessarily li).
			   No longer constrained to list elements. Defaults to 'li'.
		* img
			-> The selector used to find the images to be rotated. Defaults to '.jadrotate-img'.	   
	This is still in testing...
	
	@example
		conforms to the following markup:
		
		<script>
			$(function () {
				$('#jadrotate-box2').jadrotate({
					interval : 3000,
					rotation : 'on',
					listSelector : '#list-con',
					img : '.jadrotate-img2'
				});
			});
		</script>
		
		<div id="jadrotate-box2">
			<div>
				<ul id="list-con">
					<li class="jadrotate:activate(test-active) asdf asdff">advertisement 1</li>
					<li class="jadrotate:activate(test-active)">advertisement 2</li>
					<li class="asdf jadrotate:activate(test-active)  asdff">advertisement 3</li>
					<li class="jadrotate:activate(test-active)">advertisement 4</li>
					<li class="jadrotate:activate(test-active)">advertisement 5</li>
					<li class="asdf asdff jadrotate:activate(test-active)">advertisement 6</li>
				</ul>
			</div>
			<div style="float: right; padding-top: 20px;">
				<a href="#1"><img src="img/1.jpg" class="jadrotate-img2" alt="hellow from image 1" style="width: 500px; height: 400px;"/></a>
				<a href="#2"><img src="img/2.jpg" class="jadrotate-img2" alt="hellow from image 2" style="width: 500px; height: 400px;"/></a>
				<a href="#3"><img src="img/3.jpg" class="jadrotate-img2" alt="hellow from image 3" style="width: 500px; height: 400px;"/></a>
				<a href="#4"><img src="img/4.jpg" class="jadrotate-img2" alt="hellow from image 4" style="width: 500px; height: 400px;"/></a>
				<a href="#5"><img src="img/5.jpg" class="jadrotate-img2" alt="hellow from image 5" style="width: 500px; height: 400px;"/></a>
				<a href="#6"><img src="img/6.jpg" class="jadrotate-img2" alt="hellow from image 6" style="width: 500px; height: 400px;"/></a>
			</div>
		</div>
	
	Hooks for the markup: (depreciated!)
	-----------------------------------
		(If not using $.fn.jadrotate)
		-> #jadrotate-box
			|_ #jadrotate-list
			|_ .jadrotate-img 
			
		-> 	jadrotate:activate(<your-class-here>)
			 - The class that is activated when the list is hovered.
			 
		->  .jadrotate-active
			 - A class that is given by jadrotate to the list item which is active.
			 
	Tested on JSLint (http://jslint.com/) with no errors!		
			
	LM: 07-23-10

	@dependencies jquery 1.3.2 and above	
	@author Rafael Gandionco (http://elrafa.0fees.net) "Write Less, Destroy More"
	@version 1.5.2
	
********************************************************************************/
(function (_w, _d, $) { // be a good citizen avoid globals...but the dollar sign is mine!
$('<style type="text/css">.jadrotate-hide{display:none;}</style>').appendTo(_d.getElementsByTagName('head')[0]);			
$.fn.jadrotate = function (_o) {
	if (this.length <= 0) { return this; } //from Paul Irish's jquery antipattern	
	var opt,
		MIN_INTERVAL = 3000,
		_defaultOpt = {
			interval : MIN_INTERVAL,
			rotation : 'on',
			listSelector : 'li',
			listContainer : '#jadrotate-list',
			img : '.jadrotate-img'
		},
		_timer;
		
	opt = $.extend({}, _defaultOpt, _o);	
	var _queue = 0;	
	return this.each(function () {
		// group the selectors //
		var $jAdBox = $(this),
			$jAdList = $jAdBox.find(opt.listContainer),
			$jAdImg = $jAdBox.find(opt.img),
			$jAdListLi = $jAdList.find(opt.listSelector),
			$jAdImgCon = $jAdImg.closest(':not(a)'),
			jqueryVersion = _w.parseFloat($jAdBox.jquery);
		
		$jAdImg.addClass('jadrotate-hide'); // hide the images right away...
		
		var class2Activate,
			checker,
			DELAY = opt.interval,			
			enter, leave;	
			
		if (opt.interval) { //set minimum interval...
			if (opt.interval < MIN_INTERVAL) {
				opt.interval = MIN_INTERVAL;
			}
		}		
		
		// a bunch of friendly error handlers //
		if ($jAdListLi.length !== $jAdImg.length) {throw 'jadrotate:ERROR -> The number of list does not match the number of images to rotate!';}
		if ($jAdList.length <= 0) {throw 'jadrotate:ERROR -> ' + opt.listContainer + ' can\'t be found!';}
		if ($jAdImg.length <= 0) {throw 'jadrotate:ERROR -> .jadrotate-img is missing. Their are no images to rotate!';}
		if ($jAdListLi.length <= 0) {throw 'jadrotate:ERROR -> ' + opt.listSelector + ' can\'t be found!';}
		
		// find the parent container of the images and give it a relative position...
		if ($jAdImgCon.length > 0) {
			$jAdImgCon.css({position : 'relative'});  
		}
		
		// dont bother rotating when there is only 0ne item to rotate //
		if ($jAdListLi.length < 2 || $jAdImg.length < 2) {
			opt.rotation = 'off';
		}
		
		// stack the images one on top of the other...
		$jAdImg.css({
			position: 'absolute',
			display : 'none',
			left : '0px'
		});
		
		// display the first image
		$jAdImg.eq(0).css('display', 'block');	
					
		// get the class to activate when hovered...
		$jAdListLi.each(function (_index) {
			var me = $(this), c;
			if ($.trim(this.className) !== '') {
				class2Activate = /jadrotate:activate\(.{1,}\)/.exec(this.className);
				if (class2Activate !== null) {
					me.removeClass(class2Activate[0]);
					c = class2Activate[0].replace(/^.*jadrotate:activate\(/, '')
										 .replace(')', '');
					me.data('jadrotate-active-class', c+' '+'jadrotate-active');					 
				}
				else {
					me.data('jadrotate-active-class','jadrotate-active');	
				}
			}
			else {
				me.data('jadrotate-active-class','jadrotate-active');
			}
		});
		
		var _refreshListClass = function () {
			$jAdListLi.each(function () {
				var $me = $(this);
				$me.removeClass($me.data('jadrotate-active-class'));
			});			
		};
		
		var __doRotation = function () {
			if ($.trim(opt.rotation).toLowerCase() === 'on') {
				_w.clearTimeout(_timer);
				// See: http://www.learningjquery.com/2007/01/effect-delay-trick
				$jAdImg.eq(_queue).animate({opacity : 1.0}, 500, function () {				
					_queue++;	
					if (_queue > ($jAdListLi.length-1)) {
						_queue = 0;					
					}
					else {
						_refreshListClass();	   
						$jAdListLi.eq(_queue).addClass($jAdListLi.eq(_queue).data('jadrotate-active-class'));
					}
					var $pme = $(this);		
					$jAdImg.eq(_queue).hide().fadeIn('slow', function () {					
						if (_queue === 0) { // for some reason img[0] does not fadein(WTF)...so foce the last image to fadeOut...
							_refreshListClass();	  
							$jAdListLi.eq(_queue).addClass($jAdListLi.eq(_queue).data('jadrotate-active-class'));
							$pme.fadeOut('slow');						
						}
						else {
							$pme.hide();
						}					
						_timer = _w.setTimeout(__doRotation, opt.interval); // call again...recursive call to simulate rotation...					
					});
				});
			}
		};
		
		// use mouseenter/mouseleave when possible
		// See: http://bennadel.com/blog/1805-jQuery-Events-MouseOver-MouseOut-vs-MouseEnter-MouseLeave.htm
		if (jqueryVersion < 1.4) { enter = 'mouseover'; leave = 'mouseout'; }
		else { enter = 'mouseenter'; leave = 'mouseleave'; } 
		
		// handle list hover events here //		
		$jAdListLi
			.live(enter, function () {
				if ($.trim(opt.rotation).toLowerCase() === 'on') {
					_w.clearTimeout(_timer);
				}
				_w.clearTimeout(checker);			
				var me = $(this),
					indx = $jAdListLi.index(this);						
				
				$jAdImg.hide().eq(indx).show();
				_queue	= indx;
				
				_refreshListClass();	  
				me.addClass(me.data('jadrotate-active-class'));														
			})
			.live(leave, function () {
				var me = $(this);
								
				checker = _w.setTimeout(function () { // para dili m tok-an....
					me.removeClass(me.data('jadrotate-active-class'));
					__doRotation(); // rotate..	
				}, DELAY);			
			});
			
		// initialization calls....but not all init actions are called here.... //	
		(function () {	
			$jAdListLi.eq(_queue).addClass($jAdListLi.eq(_queue).data('jadrotate-active-class'));
			_w.setTimeout(function () {		
				__doRotation();
			}, opt.interval);			
		})();		
				
	});	//end of return			
};

// add backwards compatibility with older jadrotate versions
$.jadrotate = function (_o) {return $('#jadrotate-box').jadrotate(_o);};
})(this, this.document, this.jQuery);
