$(document).ready(function(){ 
	$('body').addClass('hasJS');
	
	$(".nav li").hover(
	  function () {
       	$clicked = $(this);
	   	$clicked.animate({ opacity: 1 }, 600 );
      }, 
      function () {
        $clicked = $(this);
		$clicked.animate({ opacity: 0.6 }, 600 );
      }
    );
	
	
	// Function for scrolling	
	//$.localScroll.defaults.axis = 'y';
	
	// Scroll initially if there's a hash (#something) in the url 
	$.localScroll.hash({
		queue:false,
		duration:1500
	});
	
	/**
	 * NOTE: I use $.localScroll instead of $('#navigation').localScroll() so I
	 * also affect the >> and << links. I want every link in the page to scroll.
	 */
	$('.nav').localScroll({
		queue:false,
		duration:1000,
		hash:true,
		onBefore:function( e, anchor, $target ){
			// The 'this' is the settings object, can be modified
		},
		onAfter:function( anchor, settings ){
			// The 'this' contains the scrolled element (body)
		}
	});
	$('.jumper').localScroll({
		queue:false,
		duration:1000,
		hash:true,
		onBefore:function( e, anchor, $target ){
			// The 'this' is the settings object, can be modified
		},
		onAfter:function( anchor, settings ){
			// The 'this' contains the scrolled element (body)
		}
	});
	
	scroller(288, 3);
	
	$(function() {
		$('a.lightbox').lightBox(); // Select all links with lightbox class
	});
	
	$('img.plant').ifixpng();	
	
}); 


// Function to control the scrolling for the gallery
function scroller($item_width, $step_no){
	// Slider
	//var $item_width=110;
	$('#button_left span').addClass('end');
	$('#button_right span').removeClass('end');
	var $items=$('.photo').length;
	var $width=$items * parseInt('-'+$item_width, 10);
	//var $step=$item_width*5;
	var $step=$item_width*$step_no;
	var $pos=0;
	
	var $div_width=$items * parseInt($item_width, 10);
	$('#gallery_in').css({'width':$div_width});
	
	$('#button_left').each(function(){
		var $this = $(this);
		var $hd = $('span', $this);
		var $bt = $('<a href="#">&nbsp;</a>');
		
		if ($items <= $step_no){
			$('#button_right span').addClass('end');
		}
		
		$bt.click(function(){
			//if ($items > 5){
			if ($items > $step_no){
				$pos = parseInt($('#gallery_in').css('left'), 10);
				var $new_pos = $pos+$step+'px';
				if (parseInt($new_pos, 10) > 0){
					$new_pos='0px';
				}
				if($pos != $new_pos){
					$('#gallery_in').animate({'left':$new_pos},800);
					$('#button_right span').removeClass('end');
				}
				
				//check position to change button state
				if ($new_pos=='0px'){ $('#button_left span').addClass('end'); }
			}
			return false;
		});
		$hd.text('');
		$bt.prependTo($hd);
	});
	
	$('#button_right').each(function(){
		var $this = $(this);
		var $hd = $('span', $this);
		var $bt = $('<a href="#">&nbsp;</a>');
		
		$bt.click(function(){
			//if ($items > 5){
			if ($items > $step_no){
				$pos = parseInt($('#gallery_in').css('left'), 10);
				var $new_pos = $pos-$step+'px';
				var $next_pos = parseInt($new_pos, 10)-$step;
				if ($next_pos < $width){
					var $diff=$next_pos-$width;
					$new_pos = parseInt($new_pos, 10)-$diff+'px';
				}
				if (parseInt($new_pos, 10) > ($width)){
					$('#gallery_in').animate({'left':$new_pos},800);
					$('#button_left span').removeClass('end');
				} 
				
				//check position to change button state
				$new_pos = parseInt($new_pos, 10)-$step+'px';
				if (parseInt($new_pos, 10)==$width){ $('#button_right span').addClass('end'); }
			}
			return false;
		});
		$hd.text('');
		$bt.prependTo($hd);
	});
}