$(window).resize(function () {
	myresize();
});


myresize = function() {
		var width;
		if ($('#wrapper').get(0))
		{
			width=$('#wrapper').get(0).clientWidth;
		}
		else
		{
			return;
		}
		var $test;
		$test = $('#slider');
		$test.css({
			'width' : (width-80) + 'px'
		});
		$test = $('.scroll');
		$test.css({
			'width' : (width-80) + 'px'
		});
		$test = $('.scrollContainer div.panel');
		$test.css({
			'width' : (width-80-40) + 'px'
		});
		var horizontal = true;
		var $container = $('#slider .scrollContainer');
		var $panels = $('#slider .scrollContainer > div');
		if (horizontal) {
		   // calculate a new width for the container (so it holds all panels)
		  $container.css('width', $panels[0].offsetWidth * $panels.length);
		}
		el=$('#slider .scroll').get(0);
		var fromtop=el.clientHeight/2-13+el.offsetTop;
		$test = $('.scrollButtons');
		$test.css({
			'top' : fromtop + 'px'
		});

		el=$('#slidernavigation').find('a.selected');
		if (el)
		{
			el.click();
	  }
}


sliderInit = function(area) {

  var $panels = $(area).find('.scrollContainer > div');

  // if false, we'll float all the panels left and fix the width 
  // of the container
  var horizontal = true;
  var $container = $('#slider .scrollContainer');

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

  // collect the scroll object, at the same time apply the hidden overflow
  // to remove the default scrollbars that will appear
  var $scroll = $('#slider .scroll').css('overflow', 'hidden');

  // apply our left + right buttons
//    $scroll
//        .before('<img class="scrollButtons left" src="/test/img/arrow-left.gif" />')
//        .after('<img class="scrollButtons right" src="/test/img/arrow-right.gif" />');

  myresize();

	var sliderCheckHashIntervalId = window.setTimeout( sliderCheckHash, 300 );


  function sliderCheckHash() 
  {
		var sliderNewHash=myGetHash();

		if ((sliderLastHash=='') || (sliderLastHash==null) || (sliderLastHash==undefined))
		{
			sliderLastHash=sliderNewHash;
		}
		
		if (sliderLastHash!=sliderNewHash)
		{
			sliderLastHash=sliderNewHash;
 
			el=$('#slidernavigation').find('a[id="' + sliderNewHash + '_button"]');
			if (el.length==1)
			{
				//selectNav.call(el.get(0));
				el.click();
			}
 		}
  	sliderCheckHashIntervalId = window.setTimeout( sliderCheckHash, 100 );
  }
  
  
  // handle nav selection
  function selectNav() {
      $(this)
          .parents('div:eq(2)')
              .find('a')
                  .removeClass('selected')
              .end()
          .end()
          .addClass('selected');
  		if ($(this).attr('scrollleft')=='1')
  		{
  			$('#sliderleft').removeClass('hide');
  		}
  		else
			{
  			$('#sliderleft').addClass('hide');
			}
  		if ($(this).attr('scrollright')=='1')
  		{
  			$('#sliderright').removeClass('hide');
  		}
  		else
			{
  			$('#sliderright').addClass('hide');
			}

		var sliderNewHash=myGetHash();
		var thisHash=stripHash($(this).attr('href'));
		if (thisHash!=sliderNewHash)
		{
			mySetHash(thisHash,false);
			sliderLastHash=thisHash;
		}
  }

  $('#slidernavigation').find('a').click(selectNav);

  $('#slidernavigation').find('input').mousedown(addRed);
  $('#slidernavigation').find('input').mouseup(removeRed);
  $('#slidernavigation').find('input').mouseleave(removeRed);

  $('#slidernavigation').find('img').mousedown(addRed);
  $('#slidernavigation').find('img').mouseup(removeRed);
  $('#slidernavigation').find('img').mouseleave(removeRed);

  function addRed(data) {
  	$(this).addClass('mouseDown');
  }
  function removeRed(data) {
  	$(this).removeClass('mouseDown');
  }
  
  var sliderLastHash=lastHash;
  
  // go find the navigation link that has this target and select the nav
  
  function sliderUpdateHash(data)
  {
		var i = data.id;
		var el;
		
		if (i==undefined)
		{
			return;
		}
		
		if (i.substr(i.length-7)=='_button')
		{
			i=i.substr(0,i.length-7);
		}
		el=$('#slidernavigation').find('a[id="' + i + '_button"]');
		if (el.length==1)
		{
			selectNav.call(el.get(0));
		}
  }
  
  function trigger(data)
  {
		var i = data.id;
		if (i==undefined)
		{
			i=stripHash($('#slidernavigation a.selected').attr('href'));
		}
		if (i==undefined)
		{
			i=stripHash($('#slidernavigation a:first').attr('href'));
		}
		if (i.substr(i.length-7)=='_button')
		{
			i=i.substr(0,i.length-7);
		}
		el=$('#slidernavigation').find('a[id="' + i + '_button"]');
		if (el.length!=1)
		{
			i=stripHash($('#slidernavigation a:first').attr('href'));
			el=$('#slidernavigation').find('a[id="' + i + '_button"]');
		}
		if (el.length==1)
		{
			el.click();
		}
  }

  if (!$('#slider').length)
  {
  	return;
  }
	//alert("in slider init " + $('#slider').length + "\n" + $('#slider').get(0).innerHTML);
 
	trigger({ id : myGetHash() } );
	
  //scrollToElement($('body'));
  
  // 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: '#slidernavigation a',

      // selectors are NOT relative to document, i.e. make sure they're unique
      prev: '#sliderleft', 
      next: '#sliderright',
      hash: 1,

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

			lazy: 1,
			
      onAfter: sliderUpdateHash, // our final callback

      offset: offset,

      // duration of the sliding effect
      duration: 1000,

      // easing - can be used with the easing plugin: 
      // http://gsgd.co.uk/sandbox/jquery/easing/
      easing: 'swing'
  };

  // 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);
}
