$(function(){


	// Adds a class to the html code so we can target browsers without JS.
	$('html').addClass('JS');
	// Sets the slides width on page load
	var i = $(window).width();
	if (i > 959){ $('#items > div').css({ width: i }); }
	
	// Scrollable and navigator plugin settings.
	$("#slider").scrollable({ easing: 'easeInOutBack', speed: 900, circular: true }).navigator({ navi: '#navigation' });
	
	// Window resize code
	window.api = $("#slider").data("scrollable");
	$(window).resize(function() {
		var a = 1 + window.api.getIndex();
		var w = $(window).width();
		if (w > 959) {
			var l = a * w
			$('#items').css({ left: + - +l });
			$('#items > div').css({ width: w });
		} else {
			$('#items > div').css({ width: 960 });
		}
	});
		
		
	var tid = setTimeout(mycode, 7000);
	function mycode() {
	  window.api.next();
	  tid = setTimeout(mycode, 7000); // repeat myself
	}
	function abortTimer() { // to be called when you want to stop the timer
	  clearTimeout(tid);
	}
	
	var mhea = false;
		
		$('#mhea-view').click(function(e){
			e.preventDefault();
			
			if(mhea)
			{
				setTimeout(mycode, 7000);
				$('.hide').fadeOut();
				$('#slider,#mhea').animate({
   					 height: '490px'
  				}, 1000, function(){
  				
  					$('#mhea-view').html('> view project details');
  					mhea = false;
  				
  				});
  			
	  			$('#mhea-qr').animate({
	   				 left: '-161px',
					top: '258px'
	  			}, 1000);
			}
			else
			{
				abortTimer();
				$('.hide').fadeIn();
				$('#slider,#mhea').animate({
   					 height: '900px'
  				}, 1000, function(){
  				
  					$('#mhea-view').html('>close project');
  					mhea = true;
  				
  				});
  			
	  			$('#mhea-qr').animate({
	   				 left: '218px',
					top: '675px'
	  			}, 1000);
			
			}
		})
		
		var ljb = false;
		
		$('#ljb-view').click(function(e){
			e.preventDefault();
			
			if(ljb)
			{
				setTimeout(mycode, 7000);
				
				$('#ljb-doll').animate({
	   				 left: '-122px'
	  			}, 1000);
	  			
	  			$('#ljb-banner').animate({
	   				 left: '0'
	  			}, 1000);
	  			
				$('.hide').fadeOut();
				$('#ljb-logo').fadeIn();
				$('#slider,#ljb').animate({
   					 height: '490px'
  				}, 1000, function(){
  				
  					$('#ljb-view').html('> view project details');
  					ljb = false;
  				
  				});
  			
	  			
			}
			else
			{
				abortTimer();
				$('.hide').fadeIn();
				$('#ljb-logo').fadeOut();
				
				$('#ljb-doll').animate({
	   				 left: '-430px'
	  			}, 1000);
	  			
	  			$('#ljb-banner').animate({
	   				 left: '138px'
	  			}, 1000);
				
				
				$('#slider,#ljb').animate({
   					 height: '900px'
  				}, 1000, function(){
  				
  					$('#ljb-view').html('> close project');
  					ljb = true;
  				
  				});
			
			}
			
		
		})
		
		

});