$(function() {
var $panels = $('#slider .page');
var $container = $('#slider #page_Container');
var $scroll = $('#slider #pages').css('overflow', 'hidden');

$("#specials").scrollable({items:'.items',horizontal:true,size: 1});

   // 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
		'height' : '599px'
	});
    // calculate a new width for the container (so it holds all panels) // Check for IE 6 cause it sucks!
	if ($.browser.msie && $.browser.version == '6.0') {
		re('sm'); //Load the correct page
	    $container.css('width', $panels[0].offsetWidth * $panels.length+700);
	} else {
	   $container.css('width', $panels[0].offsetWidth * $panels.length);
	}
}


function selectNav() {
	if ($.browser.version == "6.0") {
		$(this)
		.parents('ul:first')
		  .find('a')
			.removeClass('sel_ie6')
		  .end()
		.end()
		.addClass('sel_ie6');	  
	} else {
		$(this)
		.parents('ul:first') // find the first UL parent
		  .find('a') // find all the A elements
			.removeClass('sel') // remove from all
		  .end() // go back to all A elements
		.end() // go back to 'this' element
		.addClass('sel');
	}
}

	
$('#slider .navigation').find('a').click(selectNav);

		
function trigger(data) {
  // within the .navigation element, find the A element
  // whose href ends with ID ($= is ends with)
  var el = $('#slider .navigation').find('a[href$="' + data.id + '"]').get(0);
  // we're passing the actual element, and not the jQuery instance.
  selectNav.call(el);
}

if (window.location.hash) {
  trigger({ id : window.location.hash.substr(1)});
} else {
  $('#slider .navigation a:first').click();
}

  // 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,
        items: $panels,
        navigation: '.navigation a',
        prev: 'img.left', 
        next: 'img.right',
        axis: 'xy',
        onAfter: trigger,
        offset: offset,
        duration: 500,
        easing: 'swing'
		//hash:true // adds the hash to the url but drop the page to meet the ID.
    };

    // apply serialScroll to the slider - we chose this plugin because it 
    // supports// the indexed next and previous scroll along with hooking 
    // in to our navigation.
	$('#slider').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);
//
//    $("a.directions_show").click(function () {										   
//      $("a.directions_show").fadeOut(100, function () {
//        $("div#directions").fadeIn(2000);
//      });
//      return false;
//    });
//	
//	 $("a.directions_hide").click(function () {
//      $("div#directions").fadeOut(100, function () {
//        $("a.directions_show").fadeIn(2000);
//      });
//      return false;
//    });

function re(size) {	
		var $menu_page = $('#pages');
		$panels.css({'height' : '599px'}); //default height for other pages.
		if (size == 'lg') {
			$menu_page.css({'height' : '2160px'})} 
		else if (size == 'lg_ie6') {
			$menu_page.css({'height' : '2010px'})
			$container.css({'height' : '2010px'})
			$('div#m').css({'padding-top' : '10px'});}
		else if (size == 'lg_ie') {
			$menu_page.css({'height' : '1950px'})
			$container.css({'height' : '1950px'})
			$('div#m').css({'padding-top' : '10px'});} 
		else {$menu_page.css({'height' : '599px'}) //default height for other pages.
		}
}

$('.navigation a').click(function(e) {	
	e.preventDefault();
	$(this).blur();
	var anchorTag = $(this).attr('href').split('#')[1];
	if (anchorTag == 'm') {
			if ($.browser.msie) {
				if ($.browser.version=='6.0'){re('lg_ie6');
				}else{
					re('lg_ie');
				}
			}
			else {re('lg');}					
	 } else {re('sm');}
});

});