// squishyDreams JS File ...

	jQuery(function($) { // GALLERIA PLUGIN- TAKEN FROM DEMO 01 http://devkick.com/lab/galleria/demo_01.htm#img/grass-blades.jpg
		
		$('ul.gallery').galleria({
			history   : true, // activates the history object for bookmarking, back-button etc.
			clickNext : false, // helper for making the image clickable
			insert    : '#main_image', // the containing selector for our main image
			onImage   : function(image,caption,info,thumb) { // let's add some image effects for demonstration purposes
				
				// fade in the image & caption
				if(! ($.browser.mozilla && navigator.appVersion.indexOf("Win")!=-1) ) { // FF/Win fades large images terribly slow
					image.css('display','none').fadeIn(1000);
				}
				caption.css('display','none').fadeIn(1000);
				info = $('.info');
				info.css('display','none').fadeIn(1000);
				
				// fetch the thumbnail container
				var _li = thumb.parents('li');
				
				// fade out inactive thumbnail
				_li.siblings().children('img.selected').fadeTo(500,0.3);
				
				// fade in active thumbnail
				thumb.fadeTo('fast',1).addClass('selected');
				
				// add a title for the clickable image
				image.attr('title','View Full Size');
				
				$("a#toFancyBox").fancybox({ 'zoomSpeedIn': 300, 'zoomSpeedOut': 300, 'overlayShow': true }); 

			},
			onThumb : function(thumb) { // thumbnail effects goes here
				
				// fetch the thumbnail container
				var _li = thumb.parents('li');
				
				// if thumbnail is active, fade all the way.
				var _fadeTo = _li.is('.active') ? '1' : '0.3';
				
				// fade in the thumbnail when finished loading
				thumb.css({display:'none',opacity:_fadeTo}).fadeIn(1500);
				
				// hover effects
				thumb.hover(
					function() { thumb.fadeTo('fast',1); },
					function() { _li.not('.active').children('img').fadeTo('fast',0.3); } // don't fade out if the parent is active
				)
			}
		});
	});
	
	// SLIDING GALLERY CODE BELOW. SOURCE: http://tutsvalley.com/tutorials/making-a-jquery-infinite-carousel-with-nice-features/
	
	  $(document).ready(function() {  
   
         //options( 1 - ON , 0 - OFF)  
         var auto_slide = 1;  
             var hover_pause = 1;  
         var key_slide = 1;  
   
         //speed of auto slide(  
         var auto_slide_seconds = 5000;  
         /* IMPORTANT: i know the variable is called ...seconds but it's 
         in milliseconds ( multiplied with 1000) '*/  
   
         /*move the last list item before the first item. The purpose of this is 
         if the user clicks to slide left he will be able to see the last item.*/  
         $('ul.gallery li:first').before($('ul.gallery li:last'));   
   
         //check if auto sliding is enabled  
         if(auto_slide == 1){  
             /*set the interval (loop) to call function slide with option 'right' 
             and set the interval time to the variable we declared previously */  
             var timer = setInterval('slide("right")', auto_slide_seconds);   
   
             /*and change the value of our hidden field that hold info about 
             the interval, setting it to the number of milliseconds we declared previously*/  
             $('#hidden_auto_slide_seconds').val(auto_slide_seconds);  
         }  
   
         //check if hover pause is enabled  
         if(hover_pause == 1){  
             //when hovered over the list  
             $('ul.gallery').hover(function(){  
                 //stop the interval  
                 clearInterval(timer)  
             },function(){  
                 //and when mouseout start it again  
                 timer = setInterval('slide("right")', auto_slide_seconds);  
             });  
   
         }  
   
         //check if key sliding is enabled  
         if(key_slide == 1){  
   
             //binding keypress function  
             $(document).bind('keypress', function(e) {  
                 //keyCode for left arrow is 37 and for right it's 39 '  
                 if(e.keyCode==37){  
                         //initialize the slide to left function  
                         slide('left');  
                 }else if(e.keyCode==39){  
                         //initialize the slide to right function  
                         slide('right');  
                 }  
             });  
   
         }  
   
   });  
   
 //FUNCTIONS BELLOW  
   
 //slide function  
 function slide(where){  
   
             //get the item width  
             var item_width = $('ul.gallery li').outerWidth() + 10;  
   
             /* using a if statement and the where variable check 
             we will check where the user wants to slide (left or right)*/  
             if(where == 'left'){  
                 //...calculating the new left indent of the unordered list (ul) for left sliding  
                 var left_indent = parseInt($('ul.gallery').css('left')) + item_width;  
             }else{  
                 //...calculating the new left indent of the unordered list (ul) for right sliding  
                 var left_indent = parseInt($('ul.gallery').css('left')) - item_width;  
   
             }  
   
             //make the sliding effect using jQuery's animate function... '  
             $('ul.gallery:not(:animated)').animate({'left' : left_indent},500,function(){      
   
                 /* when the animation finishes use the if statement again, and make an ilussion 
                 of infinity by changing place of last or first item*/  
                 if(where == 'left'){  
                     //...and if it slided to left we put the last item before the first item  
                     $('ul.gallery li:first').before($('ul.gallery li:last'));  
                 }else{  
                     //...and if it slided to right we put the first item after the last item  
                     $('ul.gallery li:last').after($('ul.gallery li:first'));  
                 }  
   
                 //...and then just get back the default left indent  
                 $('ul.gallery').css({'left' : '-270px'});  
             });  
   
 }  
	
// NAVIGATION SYSTEM

$(document).ready(function () {

	//HOVER EFFECTS
	// animation block
	$('.nav_ani').hover(function () {
		$(this).attr("src","nav_animation_b.png");
		
	}, function () {
		$(this).attr("src","nav_animation_a.png");
	});
	
	// story block
	$('.nav_story').hover(function () {
		$(this).attr("src","nav_story_b.png");
		
	}, function () {
		$(this).attr("src","nav_story_a.png");
	});
	
	// painting block
	$('.nav_painting').hover(function () {
		$(this).attr("src","nav_painting_b.png");
		
	}, function () {
		$(this).attr("src","nav_painting_a.png");
	});
	
	//fancy box about/contact links
	$("a#aboutbox").fancybox();
	
});