/*	
 *	MultiSlider 2.1 - jQuery Plugin
 *	jQuery required.
 *	
 *	Name     	jquery.multiSlider.js
 *	Author   	Shigeki Hosomi
 *	Copyright	Shigeki Hosomi
 *	Version  	2.1
 *	Date     	2012.3.28
 *				2012.4.9	[SlideType] Fade - bugfix
 *				2012.4.10	options + Added: 'width'&'height'
 *				2012.10.10	options + Added: 'directionNav' 'startSlide' && reName: 'pointNav'
 *				2013.4.18	options + Added: CallBack function 'onStart'&'onChange'
 *				2013.5.15	options + Added: 'timer' 0 == TimerOff
 *				2013.6.5	options + Added: CallBack function 'onMouseOver'&'onMouseOut' 
 *				
 *	Category 	jQuery plugin
 *	
 *	Dual licensed under the MIT (MIT-LICENSE.txt)
 *	and GPL (GPL-LICENSE.txt) licenses.
 *	
 **/
;(function($)
{
	$.fn.multiSlider = function(options)
	{
		options = $.extend({
			width: 0,										//  CanvasWidth (Number)
			height: 0,										//  CanvasHeight (Number)
			speed: 'normal',								// 'slow' or 'normal' or 'fast' or Milliseconds. (String / Number)
			timer: 5000,									//  Milliseconds. (Number) or '0 == TimerOff' (Number)
			easing: 'swing',								// 'easingType' (String)
			slideMode: 'col',								// 'col' or 'row' or 'fade' (String)
			startSlide: 0,									//  Set starting Slide '0 index' (Number)
			directionNav: true,								//  true or false (Boolean)
			directionNavClass: 'multiSlider-DirectionNav',	// 'Prev' & 'Next' Navigation ClassName (String)
			prevNavText: '< Prev',						// 'Prev' Navigation innerHTML (String)
			nextNavText: 'Next >',						// 'Next' Navigation innerHTML (String)
			pointNav: true,									//  true or false (Boolean)
			pointNavPosition: 'after',						// 'after' or 'before' (String)
			pointNavClass: 'multiSlider-PointNav',			//  Current Position Navigation ClassName (String)
			pointNavIndex: null,							//  Current Position Navigation NumberTxt (Number)
			onStart: function(){},							//  Start Slide (CallBack function)
			onChange: function(){},							//  Change Slide (CallBack function)
			onMouseOver: function(){},						//  MouseOver Event (CallBack function)
			onMouseOut: function(){}						//  MouseOut Event (CallBack function)
		}, options);
		
		return this.each(function()
		{
			var $el = $(this);
			var $elTarget = $(this).children();
			var $elSize = {
				w: options.width == 0 ? ~~$elTarget.width() : options.width,
				h: options.height == 0 ? ~~$elTarget.height() : options.height
			};
			var $elChild = $(this).children();
			var total = $elChild.length;
			var cnt = 0;
			var num = options.startSlide < total ? options.startSlide : total-1;
			var prevnum = 0;
			var loopTimer = null;
			var isAnimate = false;
			var directionTpl = null;
			var pointNavTpl = null;
			var pointNavInnerTpl = "";
			
			if(total>1)
			{
				setUp();
			}
			
			function setUp()
			{
				$el.css({
				    width: $elSize.w,
					height: $elSize.h,
					position: 'relative'
				}).bind('mouseenter mouseleave', function(e)
				{
					if(e.type == 'mouseenter')
					{
						options.onMouseOver.call(this);
						clearTimer();
					}
					else if(e.type == 'mouseleave')
					{
						options.onMouseOut.call(this);
						onSetTimer();
					}
				});
				
				switch(options.slideMode)
				{
					case 'col':
						setColMode();
						break;
					case 'row':
						setRowMode();
						break;
					case 'fade':
						setFadeMode();
						break;
					default:
						setFadeMode();
						break;
				}

				setTarget();
				
				if(options.pointNav)
				{
					setPointNav();
				}
				
				if(options.directionNav)
				{
					setDirectionNav();
				}
				
				onSetTimer();
				options.onStart.call(this);
			}
			
			function setTarget()
			{
				$elChild.each(function()
				{
					cnt++;
				});
			}
			
			function setPointNav()
			{
				pointNavTpl = $("<ul>",{
					'class': options.pointNavClass
				});
				
				if(options.pointNavIndex==0 || options.pointNavIndex)
				{
					for (var i=0; i<total; i++)
					{
						pointNavInnerTpl += "<li class='multiSlider-Index"+i+"'>"+(~~options.pointNavIndex+i)+"</li>";
					}
				}
				else
				{
					for (var j=0; j<total; j++)
					{
						pointNavInnerTpl += "<li class='multiSlider-Index"+j+"'></li>";
					}
				}
				
				$(pointNavInnerTpl).appendTo(pointNavTpl);
				$(pointNavTpl).children().eq(num).addClass("active");
				$(pointNavTpl).find("li").bind('click', function(e)
				{
					pointNavClick(e);
				});
				
				switch(options.pointNavPosition)
				{
					case 'after':
						$el.after(pointNavTpl);
						break;
					case 'before':
						$el.before(pointNavTpl);
						break;
					default:
						$el.after(pointNavTpl);
						break;
				}
			}
			
			function setDirectionNav()
			{
				directionTpl = $("<div>",{
					"class": options.directionNavClass
				});
				
				var $prevNav = $("<a>",{
					'class': 'multiSlider-Prev',
					'css':{
						cursor: 'pointer'
					},
					'click': prevNavClick
				}).html(options.prevNavText).appendTo(directionTpl);
				
				var $nextNav = $("<a>",{
					'class': 'multiSlider-Next',
					'css':{
						cursor: 'pointer'
					},
					'click': nextNavClick
				}).html(options.nextNavText).appendTo(directionTpl);
				
				$el.after(directionTpl);
			}
			
			function onSetTimer()
			{
				if(options.timer!==0)
				{
					clearInterval(loopTimer);
					loopTimer = setInterval(onLoop, options.timer);
				}
			}
			
			function clearTimer()
			{
				if(options.timer!==0)
				{
					clearInterval(loopTimer);
					loopTimer = null;
				}
			}
			
			function onLoop()
			{
				if(!isAnimate)
				{
					num<total-1 ? num++ : num=0;
					num==0 ? prevnum=total-1 : prevnum=num-1;
					isAnimate = true;
					options.onChange.call(this);
					
					switch(options.slideMode)
					{
						case 'col':
							onColSlide(prevnum,num);
							break;
						case 'row':
							onRowSlide(prevnum,num);
							break;
						case 'fade':
							onFadeSlide(prevnum,num);
							break;
						default:
							onFadeSlide(prevnum,num);
							break;
					}
					
					if(options.controlNav)
					{
						$(pointNavTpl).children().eq(prevnum).removeClass("active");
						$(pointNavTpl).children().eq(num).addClass("active");
					}
				}
			}
			
			function setColMode()
			{
				$elChild.each(function()
				{
					$(this).css({
						display: 'none',
						position: 'absolute',
						top: $elSize.h,
						left: 0
					});
				}).filter(':eq('+num+')').css({
					display: 'block',
					top: 0
				});
			}
			
			function setRowMode()
			{
				$elChild.each(function()
				{
					$(this).css({
						display: 'none',
						position: 'absolute',
						top: 0,
						left: $elSize.w
					});
				}).filter(':eq('+num+')').css({
					display: 'block',
					left: 0
				});
			}
			
			function setFadeMode()
			{
				$elChild.each(function()
				{
					$(this).css({
						display: 'block',
						position: 'absolute',
						opacity: 0,
						zIndex: 0
					});
				}).filter(':eq('+num+')').css({
					opacity: 1,
					zIndex: ''
				});
			}
			
			/*	[SlideType] Fade
			 ----------------------------------- */
			function onFadeSlide(_prevnum,_num)
			{
				$elChild.filter(':eq('+_prevnum+')').animate({
					opacity: 0
				},{duration:options.speed, easing:options.easing, queue:false, complete:
					function()
					{
						$(this).css('zIndex',0);
						isAnimate = false;
					}
				});
				
				$elChild.filter(':eq('+_num+')').animate({
					opacity: 1
				},{duration:options.speed, easing:options.easing, queue:false, complete:
					function()
					{
						$(this).css('zIndex','');
						isAnimate = false;
					}
				});
			}
			
			function resetFadeSlide(_prevnum,_num)
			{
				$elChild.filter(':eq('+_prevnum+')').stop(true,false).animate({
					opacity: 0
				},{duration:options.speed, easing:options.easing, queue:false, complete:
					function()
					{
						$(this).css('zIndex','');
						isAnimate = false;
					}
				});
				
				$elChild.filter(':eq('+_num+')').stop(true,false).animate({
					opacity: 1
				},{duration:options.speed, easing:options.easing, queue:false, complete:
					function()
					{
						$(this).css('zIndex',0);
						isAnimate = false;
						onSetTimer();
					}
				});
			}
			
			/*	[SlideType] Col
			 ----------------------------------- */
			function onColSlide(_prevnum,_num)
			{
				$elChild.filter(':eq('+_prevnum+')').css('display','block').animate({
					top: -$el.height()
				},{duration:options.speed, easing:options.easing, queue:false, complete:
					function()
					{
						$(this).css({display:'none',top:$el.height()});
						isAnimate = false;
					}
				});
				
				$elChild.filter(':eq('+_num+')').css('display','block').animate({
					top: 0
				},{duration:options.speed, easing:options.easing, queue:false, complete:
					function()
					{
						isAnimate = false;
					}
				});
			}
			
			function resetColSlide(_prevnum,_num)
			{
				$elChild.filter(':eq('+_prevnum+')').css('display','block').animate({
					top: -$el.height()
				},{duration:options.speed, easing:options.easing, queue:false, complete:
					function()
					{
						$(this).css({display:'none',top:$el.height()});
						isAnimate = false;
					}
				});
				
				$elChild.filter(':eq('+_num+')').css({display:'block',top:$el.height()}).animate({
					top: 0
				},{duration:options.speed, easing:options.easing, queue:false, complete:
					function()
					{
						isAnimate = false;
						onSetTimer();
					}
				});
			}
			
			function resetColSlide_Prev(_prevnum,_num)
			{
				$elChild.filter(':eq('+_num+')').css({display:'block',top:-$el.height()}).animate({
					top: 0
				},{duration:options.speed, easing:options.easing, queue:false, complete:
					function()
					{
						isAnimate = false;
						onSetTimer();
					}
				});
				
				$elChild.filter(':eq('+_prevnum+')').css('display','block').animate({
					top: $el.height()
				},{duration:options.speed, easing:options.easing, queue:false, complete:
					function()
					{
						$(this).css({display:'none',top:$el.height()});
						isAnimate = false;
					}
				});
			}
			
			/*	[SlideType] Row
			 ----------------------------------- */
			function onRowSlide(_prevnum,_num)
			{
				$elChild.filter(':eq('+_prevnum+')').css('display','block').animate({
					left: -$el.width()
				},{duration:options.speed, easing:options.easing, queue:false, complete:
					function()
					{
						$(this).css({display:'none',left:$el.width()});
						isAnimate = false;
					}
				});
				
				$elChild.filter(':eq('+_num+')').css({display:'block',left:$el.width()}).animate({
					left: 0
				},{duration:options.speed, easing:options.easing, queue:false, complete:
					function()
					{
						isAnimate = false;
					}
				});
			}
			
			function resetRowSlide(_prevnum,_num)
			{
				$elChild.filter(':eq('+_prevnum+')').css('display','block').animate({
					left: -$el.width()
				},{duration:options.speed, easing:options.easing, queue:false, complete:
					function()
					{
						$(this).css({display:'none',left:$el.width()});
						isAnimate = false;
					}
				});
				
				$elChild.filter(':eq('+_num+')').css({display:'block',left:$el.width()}).animate({
					left: 0
				},{duration:options.speed, easing:options.easing, queue:false, complete:
					function()
					{
						isAnimate = false;
						onSetTimer();
					}
				});
			}
			
			function resetRowSlide_Prev(_prevnum,_num)
			{
				$elChild.filter(':eq('+_num+')').css({display:'block',left:-$el.width()}).animate({
					left: 0
				},{duration:options.speed, easing:options.easing, queue:false, complete:
					function()
					{
						isAnimate = false;
						onSetTimer();
					}
				});
				
				$elChild.filter(':eq('+_prevnum+')').css('display','block').animate({
					left: $el.width()
				},{duration:options.speed, easing:options.easing, queue:false, complete:
					function()
					{
						$(this).css({display:'none',left:$el.width()});
						isAnimate = false;
					}
				});
			}
			
			/*	DirectionNav Event
			 ----------------------------------- */
			function prevNavClick(e)
			{
				e.preventDefault();
				
				if(!isAnimate)
				{
					clearTimer();
					isAnimate = true;
					prevnum = num;
					num==0 ? num=total-1 : num--;
					
					switch(options.slideMode)
					{
						case 'col':
							resetColSlide_Prev(prevnum,num);
							break;
						case 'row':
							resetRowSlide_Prev(prevnum,num);
							break;
						case 'fade':
							resetFadeSlide(prevnum,num);
							break;
						default:
							resetFadeSlide(prevnum,num);
							break;
					}
					
					if(options.controlNav)
					{
						$(pointNavTpl).children().eq(prevnum).removeClass("active");
						$(pointNavTpl).children().eq(num).addClass("active");
					}
				}
			}
			
			function nextNavClick(e)
			{
				e.preventDefault();
				
				if(!isAnimate)
				{
					clearTimer();
					isAnimate = true;
					prevnum = num;
					num==total-1 ? num=0 : num++;
					
					switch(options.slideMode)
					{
						case 'col':
							resetColSlide(prevnum,num);
							break;
						case 'row':
							resetRowSlide(prevnum,num);
							break;
						case 'fade':
							resetFadeSlide(prevnum,num);
							break;
						default:
							resetFadeSlide(prevnum,num);
							break;
					}
					
					if(options.controlNav)
					{
						$(pointNavTpl).children().eq(prevnum).removeClass("active");
						$(pointNavTpl).children().eq(num).addClass("active");
					}
				}
			}
			
			/*	PointNav Event
			 ----------------------------------- */
			function pointNavClick(e)
			{
				e.preventDefault();
				
				return $(e.target).not('.active').each(function()
				{
					if(!isAnimate)
					{
						clearTimer();
						isAnimate = true;
						
						var targetIndex = $(e.target).index();
						
						$(pointNavTpl).children().eq(num).removeClass("active");
						$(pointNavTpl).children().eq(~~targetIndex).addClass("active");
						prevnum = num;
						num = parseInt(targetIndex);
						
						switch(options.slideMode)
						{
							case 'col':
								resetColSlide(prevnum,num);
								break;
							case 'row':
								resetRowSlide(prevnum,num);
								break;
							case 'fade':
								resetFadeSlide(prevnum,num);
								break;
							default:
								resetFadeSlide(prevnum,num);
								break;
						}
					}
				});
			}
			
		});
	};
	
})(jQuery);