$(document).ready(function(){            

$('#outer_container').hover(function(){
		$(this).children('div.flickr-message').fadeIn();
	},
	function() {
		$(this).children('div.flickr-message').fadeOut();
	}).mousemove(function(e){
		$(this).children('div.flickr-message').css({
			top: (e.pageY - 200) + "px",
			left: (e.pageX - 200) + "px"
		});
	});

// Navigation: append a div with hover class to all the LI
$('li.menu-item a').append('<div class="active"></div>');
$('li.menu-item a').click (function () {
    $(this).children('div').fadeIn('fast');
    $('li.menu-item a:hover').css({"color":"white"});
    $('li.current-menu-item a').css({"background":"white","color":"black"});
});

//PICS

function flickr(){
       $(function (){
       		// Prepare markup for isotope
            $('#demo').wrap("<div id='pics-layout'></div>").before("<div id='loading'>Loading from flickr &nbsp;<img style='margin-bottom:-4px' src='http://lowsand.com/wp-content/themes/portfolio/images/loading.gif'></div>");
            // Load flickr feed
			$.getJSON("http://api.flickr.com/services/feeds/photoset.gne?set=72157627145580159&nsid=43577535@N08&lang=de-de&format=json&jsoncallback=?", 	
			function(data){
  				$.each(data.items, function(i,item){
    				var sourceBig = (item.media.m).replace("_m.jpg", "_b.jpg");
    				$("<img/>").attr("width", "239").attr("src", sourceBig).attr("alt", item.title).attr("title", item.title)
    				.appendTo("#demo").wrap("<div class='box'></div>").wrap("<div class='inner-box'></div>")
    				.before("<div class='titulo'><h2 class='entry-title'><a target='_blank' title='"+ item.title +"'href='"+ item.link +"'>"+ item.title +"</a></h2><div class='entry-date'><abbr class='published' title='"+ item.date_taken +"'>"+ item.date_taken +"</abbr></div>").after("<div class='descripto'>"+ item.description +"</div>");
    				// After ten pics, return! (this has to be extended.. infinite scroll or pages
    				if ( i == 9 ) return false;
  				});
			});  	        
      	});
}
// load flickr feed
flickr();
 
function loadIsotope(){
	setTimeout(function(){
 		var $container = $('#demo');
  		$('#loading').fadeTo( 200, 0 );
  		$('.expand_all').fadeTo(400, 1);
  		$container.fadeTo( 400, 1.0 ).isotope({
  			itemSelector: '.box',
    		masonry: {
      			columnWidth: 249
    		}
		}).find("div.descripto").each(function(){
			// Hide unnecessary description paragraphs provided by flickr
			$(this).children("p").eq(0).hide();
			$(this).children("p").eq(1).hide();
			// Make first letter of description bold and indent
			var realDescr = $(this).children("p").eq(2);
			var text = realDescr.html();
			if(text != null) {
				var first = $('<span>'+text.charAt(0)+'</span>').addClass('caps');
				realDescr.html(text.substring(1)).prepend(first);	
			}    
		});
  		// change size of clicked element
  		$('.box').click(function(){
    		var $this = $(this),
    			tileStyle = $this.hasClass('large') ? { width: 239 } : { width: 749 }; 
    		$this.toggleClass('large');
    		$this.find('.inner-box').stop().animate( tileStyle );
    		$container.isotope( 'reLayout' );
  		});   
  		// Expand all for scrolling site
  		$('.expand_all').click(function(){
  			var $this = $(this),
    		box = $('.box');
    		box.addClass('large');
    		box.find('.inner-box').stop().animate( { width: '749px' } );
    		$container.isotope( 'reLayout' );
    		$this.toggleClass('active');
    		$(".minimize_all").toggleClass('active');
  		});
  		// Minimize all for overview
  		$('.minimize_all').click(function(){
  			var $this = $(this),
    		box = $('.box');
    		box.removeClass('large');
    		box.find('.inner-box').stop().animate( { width: '239px' } );
    		$container.isotope( 'reLayout' );
    		$this.toggleClass('active');
    		$(".expand_all").toggleClass('active');
   		});
	},2000);      
} 
// initialize isotope on flickr feed
loadIsotope();    
 
//Load thumbnail scroller
 
 $("#ts2").thumbnailScroller({ 
		scrollerType:"hoverAccelerate", 
		scrollerOrientation:"horizontal", 
		scrollSpeed:2, 
		scrollEasing:"easeOutCirc", 
		scrollEasingAmount:0, 
		acceleration:4, 
		scrollSpeed:800, 
		noScrollCenterSpace:10, 
		autoScrolling:0, 
		autoScrollingSpeed:2000, 
		autoScrollingEasing:"easeInOutQuad", 
		autoScrollingDelay:500 
	});      


// Add fancybox to thumb scroll images and .lightbox classes
$("div.jTscroller a").fancybox();
$(".lightbox").fancybox();
 
// Add fade when hovering post thumbnails
$(".post-preview").hover(
	function(){
		$(this).stop(true, true).animate({
			opacity: 0.8 
		}, 500);
	},
	function(){
		$(this).stop(true, true).animate({
			opacity: 1.0 
		}, 500);
});

// Add fade when hovering thumbnail scroller links
$(".jThumbnailScroller .jTscroller a").hover(
	function(){
		$(this).stop(true, true).animate({
			opacity: 0.8 
		}, 500);
	},
	function(){
		$(this).stop(true, true).animate({
			opacity: 1.0 
		}, 500);
});

    
// End of all scripts    
});