/**
 * 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'
 * 
 *  arrowHeight
 *   height of arrow, pass to center arrows vertically
 * 
 *  arrowWidth
 *   width of arrow
 * 
 * 
 * @author Munish Dabas
 * @version 1.0
 */

(function($) {

    $.fn.arrowNav = function(options){
		var that = $(this);
    	var baseArrowClass = 'arrowNav';
		var markup;
		var animInt;

		var settings = {
			arrowLeftClass: 'cnnArrowLeft',
			arrowRightClass: 'cnnArrowRight',
			prevUrl: '#prevImagePage',
			nextUrl: '#nextImagePage',
			arrowY: Math.floor($(that).height()/2),
			initDisplayTime: 3000,
			arrowSlideInDuration: 200,
			arrowSlideOutDuration: 400,
			showArrows: true,
			arrowHeight: 100,
			arrowWidth: 15
		};

		// extend settings if options are specified
      	if(options){
			$.extend(settings, options);
		}
		// determine top of arrows
		//   if the image is greater than 900px tall, use 225 instead of half the height
//		if( settings.arrowY >= 450 ) { settings.arrowY = 225; }
		if( settings.arrowY >= 0 ) { settings.arrowY = 225; }
		//   if arrowHeight is given, subtract half the height of the arrow from y for proper centering
		if( options.arrowHeight ) { settings.arrowY -= Math.floor( options.arrowHeight / 2 ); }


		/**
		* 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', (settings.arrowWidth * -1)+'px');
				$(obj).find('div.arrowNav > a.' + settings.arrowRightClass).css('right', (settings.arrowWidth * -1)+'px');
			}

			$(obj).find('div.arrowNav > a').each(function(){
				var index = $(this).parent().find('a').index(this);
				if($(this).hasClass(settings.arrowLeftClass)){
					$(this).animate({left: '0px'}, {duration: settings.arrowSlideInDuration});
				} else {
					$(this).animate({right: '0px'}, {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: (settings.arrowWidth * -1)+'px'},
							{duration: settings.arrowSlideOutDuration}
						);
					} else {
						$(this).animate(
							{right: (settings.arrowWidth * -1)+'px'},
							{duration: settings.arrowSlideOutDuration}
						);
					}
				} else {
					if ($(this).hasClass(settings.arrowLeftClass)) {
						$(this).css(
							{left: (settings.arrowWidth * -1)+'px'}
						);
					} else {
						$(this).css(
							{right: (settings.arrowWidth * -1)+'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).append(markup)
		.hover(
			function(){ slideIn(this); },
			function(){ slideOut(this); }
		)
		.find('div.arrowNav > a')
		.css({position:'absolute', top:settings.arrowY})
		.each(function(){
			if($(this).hasClass(settings.arrowLeftClass)){	// left arrow
				$(this)
				.css({left: (settings.arrowWidth * -1)+'px'})
				.attr('href', settings.prevUrl);
			} else {	// right arrow
				$(this)
				.css({right: (settings.arrowWidth * -1)+'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)