// Don't execute any code until the DOM is ready!
	$(document).ready(function(){
		
		$("#scrollable_ipad").scrollable({circular:true}).autoscroll({interval:5000}).navigator();
		$("#scrollable_iphone").scrollable({circular:true}).autoscroll({interval:5000}).navigator();
							
		// Our very special jQuery JSON fucntion call to Flickr, gets details of the most recent 20 images			   
		$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?id=39415354@N05&lang=en-us&format=json&jsoncallback=?", displayImages);
		function displayImages(data) {																																   
			// Randomly choose where to start. A random number between 0 and the number of photos we grabbed (20) minus 9 (we are displaying 9 photos).
			var iStart = Math.floor(Math.random()*(11));	
			// Reset our counter to 0
			var iCount = 0;								
			// Start putting together the HTML string
			var htmlString = "<ul>";					
			// Now start cycling through our array of Flickr photo details
			$.each(data.items, function(i,item){
				// Let's only display 9 photos (a 3x3 grid), starting from a random point in the feed					
				if (iCount > iStart && iCount < (iStart + 7)) {
					// I only want the ickle square thumbnails
					var sourceSquare = (item.media.m).replace("_m.jpg", "_s.jpg");		
					// Here's where we piece together the HTML
					htmlString += '<li><a href="' + item.link + '" target="_blank">';
					htmlString += '<img src="' + sourceSquare + '" alt="' + item.title + '" title="' + item.title + '"/>';
					htmlString += '<\/a><\/li>';
				}
				// Increase our counter by 1
				iCount++;
			});		
		// Pop our HTML in the #images DIV	
		$('#flickr_images').html(htmlString + "<\/ul>");
		// Close down the JSON function call
		}
		
		// HOME - LATEST TWEET
		getTwitters('tweet', { 
		  id: 'desouzamedia', 
		  count: 3, 
		  enableLinks: true, 
		  ignoreReplies: true, 
		  clearContents: true,
		  template: '<span class="twitter_status">"%text%"<\/span><span class="twitter_time">%time% via %source%<\/span>'
		});	
	});
    
	// ABOUT - EXPERIENCE TIMER
    $(function () {
		$('#counter_digits').countdown({since: new Date(2006, 12 - 1, 11), format: 'YODHMS', 
    layout: '<div class="years"><div class="image{y10}"><\/div><div class="image{y1}"><span>{y10}{y1} years<\/span><\/div><\/div>' + 
	    '<div class="months">{o10}{o1}<span> months<\/span><\/div>' + 
	    '<div class="days">{d10}{d1}<span> days<\/span><\/div>' + 
        '<div class="hours">{h10}{h1}<span> hours<\/span><\/div>' + 
        '<div class="minutes">{m10}{m1}<span> minutes<\/span><\/div>' + 
        '<div class="seconds">{s10}{s1}<span> seconds<\/span><\/div>'});
		});
    
	// PORFOLIO - PROJECT FILTER
	$(document).ready(function(){
		//Horizontal Sliding
		$('.boxgrid').hover(function(){
			$(".cover", this).stop().animate({left:'220px'},{queue:false,duration:300});
		}, function() {
			$(".cover", this).stop().animate({left:'0px'},{queue:false,duration:300});
		});
	});
	
	function project_filter(id, filterVal) {
		$('.portfolio_list a').removeClass('selected');
		$(id).addClass('selected');
		
		if(filterVal == 'all'){  
			$('.hidden').fadeIn('slow').removeClass('hidden');  
		} else {  
			$('.project').each(function() {  
				if(!$(this).hasClass(filterVal)) {  
					$(this).fadeOut('normal').addClass('hidden');  
				} else {  
					$(this).fadeIn('slow').removeClass('hidden');  
				}  
			}); 
		}  	
	}