// Easing equation, borrowed from jQuery easing plugin
// http://gsgd.co.uk/sandbox/jquery/easing/
jQuery.easing.easeOutQuart = function (x, t, b, c, d) {
	return -c * ((t=t/d-1)*t*t*t - 1) + b;
};
jQuery(function( $ ){
	if($('#content .banner').length > 0){
		init();
	}
});
function init(){
	
	//	alert(nextItem);
		var jqdir = jQuery.url.attr("host");

		$('#content .banner a[href*=#]').not('#content .banner a.safe').click(function(e) {
			e.preventDefault();
			var target = $(this).attr('href');
			//targetID = target.substr(1, target.length -1);
			//var target = $('#content').find(this.pathname.replace(/^\//,''));
			if(target == "#top"){
				$('.banner .scrollcontainer').stop().scrollTo("body" , 800 );
			} else {
				$('.banner .scrollcontainer').stop().scrollTo(target , 800 );
			}
			return true;
		});

		$('.scroll').css('display', 'block');


	    var $panels = $('.banner .scrollcontainer > div.panel');
	    var $container = $('.banner .scrollcontainer');

		var panelArray = new Array();

		for(i=0;i<$('.banner  .panel').length;i++){
			  //$('.panel')[i].id  // this is the list of available elements
			  // Create some text  //  $("#divScroll").append(' '+ $('.panel')[i].id);

			  panelArray[i] = $('.banner .panel')[i].id;
			  //i++
		};
	    // if false, we'll float all the panels left and fix the width 
	    // of the container
	    var horizontal = true;

	    // float the panels left if we're going horizontal
	    if (horizontal) {
	        $panels.css({
	            'float' : 'left',
	            'position' : 'relative' // IE fix to ensure overflow is hidden
	        });

	        // calculate a new width for the container (so it holds all panels)
	        $container.css('width', $panels[0].offsetWidth * $panels.length);
	    }
	    // collect the scroll object, at the same time apply the hidden overflow
	    // to remove the default scrollbars that will appear
	    var $scroll = $('.banner .scroll').css('overflow', 'hidden');
/*
	    $scroll
	        .before('<img class="scrollButtons left" src="http://julianacole.com/html/images/left.png" title="Previous" />')
	        .after('<img class="scrollButtons right" src="http://julianacole.com/html/images/right.png" title="Next" />');
*/
	    // handle nav selection
	    function selectNav() {
	        $(this)
	            .parents('ul:first')
	                .find('a')
	                    .removeClass('selected')
	                .end()
	            .end()
	            .addClass('selected');
	    }
		var thisItem = panelArray[0];
		var prevItem = panelArray[panelArray.length-1];
		var nextItem = panelArray[1];

	    $('.banner .scrollnav ul').find('a').click(selectNav); // "a" to  "li"
		    // go find the navigation link that has this target and select the nav
		function fade_out(){
			//$(".scroll").fadeOut(100);
		}
	    function trigger(data) {

			var el = $('.banner .scrollnav ul').find('li a[href$="' + data.id + '"]').get(0);
			selectNav.call(el);
			thisItem = data.id;

			for(Item in panelArray){
				if(panelArray[Item] == thisItem){
					prevItem = panelArray[Item-1];
					Item++
					nextItem = panelArray[Item++];
				}; 
			};

	    }

		if (window.location.hash) {
	        trigger({ id : window.location.hash.substr(1) }); 
	    } else {
	        $('.scrollnav ul li:first').click();// "a" to  "li"
	    }
		    // offset is used to move to *exactly* the right place, since I'm using
		    // padding on my example, I need to subtract the amount of padding to
		    // the offset.  Try removing this to get a good idea of the effect
	    var offset = parseInt((horizontal ? $container.css('paddingTop') : $container.css('paddingLeft')) || 0) * -1;


	    var scrollOptions = {
	        target: $scroll, // the element that has the overflow

	        // can be a selector which will be relative to the target
	        items: $panels,

	        navigation: '.scrollnav ul li',// "a" to  "li"

	        // allow the scroll effect to run both directions
	        axis: 'xy',

	        onAfter: trigger, // our final callback

			onBefore: fade_out,

	        offset: offset,

			force:true,
	        // duration of the sliding effect
	        duration: 500,
			//do not cycle though items at first and last
			cycle:true,

	        // selectors are NOT relative to document, i.e. make sure they're unique
	        prev: 'img.left', 
	        next: 'img.right',
			//event:'myevent',
	        // easing - can be used with the easing plugin: 
	        // http://gsgd.co.uk/sandbox/jquery/easing/
	        easing: 'swing'
	    };

		$(".banner").bind('mousewheel', function(event, delta) {

	            var dir = delta > 0 ? 'up' : 'dn',
	                vel = Math.abs(delta);
	            //$("#divScroll").text(dir + ' at ' + vel);
				if (dir == "up"){
					if(prevItem){
						$('.banner .scrollnav ul').find('a[href$="#'+prevItem+'"]').click();
					} else {
						$('.scrollnav ul li:last').click();
					}
				} else {
					if(nextItem){
						$('.banner .scrollnav ul').find('a[href$="#'+nextItem+'"]').click();
					} else {
						$('.scrollnav ul li:first').click();
					}
				}
	            return false;
		});

 		if($('body.index').length == 0){
 			
			$(".banner").everyTime(2000,function(i) {
				//$("#divScroll").text(i);
				
				if(nextItem){
					$('.banner .scrollnav ul').find('a[href$="#'+nextItem+'"]').click();
				} else {
					$('.scrollnav ul li:first').click();
				}
	
			});
 		}else{

			$(".banner").everyTime(8000,function(i) {
				//$("#divScroll").text(i);
				
				if(nextItem){
					$('.banner .scrollnav ul').find('a[href$="#'+nextItem+'"]').click();
				} else {
					$('.scrollnav ul li:first').click();
				}
	
			});
 		}

		$('.banner').serialScroll(scrollOptions);


	    // now apply localScroll to hook any other arbitrary links to trigger 
	    // the effect
	//    $.localScroll(scrollOptions);


	    // finally, if the URL has a hash, move the slider in to position, 
	    // setting the duration to 1 because I don't want it to scroll in the
	    // very first page load.  We don't always need this, but it ensures
	    // the positioning is absolutely spot on when the pages loads.
	  //  scrollOptions.duration = 1;
	//    $.localScroll.hash(scrollOptions);




		/**
		 * Most jQuery.serialScroll's settings, actually belong to jQuery.ScrollTo, check it's demo for an example of each option.
		 * @see http://flesler.demos.com/jquery/scrollTo/
		 * You can use EVERY single setting of jQuery.ScrollTo, in the settings hash you send to jQuery.serialScroll.
		 */

		/**
		 * The plugin binds 6 events to the container to allow external manipulation.
		 * prev, next, goto, start, stop and notify
		 * You use them like this: $(your_container).trigger('next'), $(your_container).trigger('goto', [5]) (0-based index).
		 * If for some odd reason, the element already has any of these events bound, trigger it with the namespace.
		 */		

		/**
		 * IMPORTANT: this call to the plugin specifies ALL the settings (plus some of jQuery.ScrollTo)
		 * This is done so you can see them. You DON'T need to specify the commented ones.
		 * A 'target' is specified, that means that #screen is the context for target, prev, next and navigation.
		 */
}