/**
 * Arrow Nav
 * jQuery plugin
 * 
 * Dependencies: 
 * 	jQuery (v1.3.2 or higher)
 *  jQuery easing plugin
 * 
 * Displays left and right arrows upon rolling over a container.
 * Parent container must have 'position' css attribute set (relative or absolute)
 * and overflow set to 'hidden' to facilitate hiding of arrows
 * 
 * Usage:
 * 	// basic initialization with default settings,
 *  // supplies prevUrl for left arrow link, nextUrl for right arrow link
 * 	$(container).arrowNav({prevUrl: '#somelink', nextUrl: '#somelink'});
 * 
 * Optional Settings:
 *  
 *  arrowLeftClass, arrowRightClass		
 *   pass to override default class names for arrows
 *   	
 *  arrowY	
 *   override default y position of arrows (relative to container)	
 *   
 *  initDisplayTime
 *   num of milliseconds arrows initially display on load, before hiding,
 *   only valid if 'showArrows' is set to true																
 * 
 *  arrowSlideInDuration
 *   num of milliseconds arrows take to slide in
 *   
 *  arrowSlideOutDuration
 *   num of milliseconds arrows take to slide out
 *   
 *  showArrows (Boolean)
 *   pass true to have arrows initially display, then hide. 
 *   Works in tandem with 'initDisplayTime'
 *   
 * 
 * @author Munish Dabas
 * @version 1.0
 */

(function($) {
    
    $.fn.arrowNav = function(options){
			var that = $(this);
    	var baseArrowClass = 'arrowNav';
			var markup;
			//var arrowBaseXs = new Array();
			var arrowSlideOffset = -70;
			var animInt;

			var settings = {
        arrowLeftClass: 'leftArrow',
        arrowRightClass: 'rightArrow',
				prevUrl: '#prevImagePage',
				nextUrl: '#nextImagePage',
				arrowY: Math.floor($(that).height()/2),
				initDisplayTime: 3000,
				arrowSlideInDuration: 200,
				arrowSlideOutDuration: 400,
				showArrows: true
      };
			
			// extend settings if options are specified	
      if(options){
				$.extend(settings, options);
			} 
			
			
			/**
			 * Slides arrows into the frame
			 * @param {Object} obj - parent container of arrows
			 * @param {Boolean} startFromOut - specify true to start with arrows in out position
			 */
			var slideIn = function(obj, startFromOut) {
				clearInterval(animInt);
				
				if(startFromOut){
					var deltaX = $(obj).find('div.arrowNav > a').width();
					//$(obj).find('div.arrowNav > a.' + settings.arrowLeftClass).css('left', arrowSlideOffset+'px');
					//$(obj).find('div.arrowNav > a.' + settings.arrowRightClass).css('right', arrowSlideOffset+'px');
					$(obj).find('div.arrowNav > a.' + settings.arrowLeftClass).css('left', '-15px');
					$(obj).find('div.arrowNav > a.' + settings.arrowRightClass).css('right', '-15px');
				}
					
				$(obj).find('div.arrowNav > a').each(function(){
					var index = $(this).parent().find('a').index(this);
					if($(this).hasClass(settings.arrowLeftClass)){
						$(this).animate({left: '-15px'}, {duration: settings.arrowSlideInDuration});
					} else {
						$(this).animate({right: '-15px'}, {duration: settings.arrowSlideInDuration});
					}
				});
			};
			
			
			/**
			 * Slides arrows out of frame
			 * @param {Object} obj - parent container of arrows
			 * @param {Boolean} dontAnimate - specify true to skip animation
			 */
			var slideOut = function(obj, dontAnimate) {
				$(obj).find('div.arrowNav > a').each(function(){
					var index = $(this).parent().find('a').index(this);
					var deltaX = $(this).width();
					if(!index) {
						deltaX *= -1;
					}
					if (!dontAnimate) {
						if ($(this).hasClass(settings.arrowLeftClass)) {
							$(this).animate({
								left: arrowSlideOffset+'px'
							}, {
								duration: settings.arrowSlideOutDuration,
								easing: 'easeOutQuad'
							});
						} else {
							$(this).animate({
								right: arrowSlideOffset+'px'
							}, {
								duration: settings.arrowSlideOutDuration,
								easing: 'easeOutQuad'
							});
						}
				  } else {
						if ($(this).hasClass(settings.arrowLeftClass)) {
							$(this).css({
								left: arrowSlideOffset+'px'
							});
						} else {
							$(this).css({
								right: arrowSlideOffset+'px'
							});
						}
				  }
					
				});
				clearInterval(animInt);
			};
			
			
			// construct markup
			markup = '<div class="' + baseArrowClass + '">\
									<a class="' + settings.arrowLeftClass + '"></a>\
									<a class="' + settings.arrowRightClass + '"></a>\
								</div>';
			
			// add arrow markup, along with arrow props and css
			$(this).prepend(markup)
				.hover(
					function(){
						slideIn(this);
					},
					function(){
						//slideOut(this);
						animInt = setInterval(slideOut, 2000, this);
					}
				)
				.find('div.arrowNav > a')
				.css({position:'absolute', top:settings.arrowY})
				.each(function(){
					if($(this).hasClass(settings.arrowLeftClass)){	// left arrow
						//arrowBaseXs[0] = -20;
						$(this)
							.css({left: arrowSlideOffset+'px'})
							.attr('href', settings.prevUrl);
					} else {	// right arrow
						//arrowBaseXs[1] = ($(that).width() - $(this).width() + 20);
						$(this)
							.css({right: arrowSlideOffset+'px'})
							.attr('href', settings.nextUrl);
					}
				});
				
			// initial slide out
			if (settings.showArrows) {
				slideIn(this, true);
		  	//animInt = setInterval(slideOut, settings.initDisplayTime, this);
		  } else {
				slideOut(this, true);
			}
			
			return $(this);
    };
    
})(jQuery)