$(function(){
	
	// Calculate slide-box height
	
	var marTop = $('#slide-box-bg').css('margin-top');
	var marBottom = $('#slide-box-bg').css('margin-bottom');
	
	var winHeight = $(window).height();
	var winWidth = $(window).width();
	
	// Nav-left positioning
	
	var navHeight = $('.nav-left').height();
	
	$('.nav-left').css({'top':(winHeight-navHeight)/2})
	$('.nav-left span').css({'max-width':(winWidth-640)/2 - 50});
	$('.nav-left a span.nav-next').parent().css({'float':'right'});
	
	// $('#slide-box-bg').height(winHeight - marTop - marBottom);
	
	var slideBgWidth = $('#slide-box-bg').width();
	
	// $('#topnav').width(slideBgWidth - 10);
	
	
	if (winWidth <= 900 && winWidth > 680) {
		var slideCol = 3;
		var slideRow = 3;
	} else if (winWidth <= 680) {
		var slideCol = 2;
		var slideRow = 4;
	} else {
		var slideCol = 4;
		var slideRow = 2;
	}
	
	$('#slide-box-bg').height((slideBgWidth/slideCol)*slideRow).css({
		'-webkit-animation':'showSlides 0.375s ease',
		'-moz-animation':'showSlides 0.375s ease',
		'opacity':1
	});
	
	$('#right_column').height((slideBgWidth/slideCol)*slideRow);
	
	$('.ngg-navigation span:contains("...")').css({'background':'#999', 'color':'#fff'});	
	
	$('.wp-pagenavi').css({'top':((slideBgWidth/slideCol)*slideRow) + 180 + 50 + 'px'});
	
	$('.ngg-navigation .prev').html('&laquo;');
	$('.ngg-navigation .next').html('&raquo;');
		
	$(window).load(function(){
		$('.text').height($('.related_img_container').height());
	});
	
	$(window).resize(function() {
		
		$('.text').height($('.related_img_container').height());
		
		slideBgWidth = $('#slide-box-bg').width();
		winWidth = $(window).width();
		
		if (winWidth <= 900 && winWidth > 680) {
			var slideCol = 3;
			var slideRow = 3;
		} else if (winWidth <= 680) {
			var slideCol = 2;
			var slideRow = 4;
		} else {
			var slideCol = 4;
			var slideRow = 2;
		}
		
		
		$('#slide-box-bg').height((slideBgWidth/slideCol)*slideRow);
		$('#right_column').height((slideBgWidth/slideCol)*slideRow);
		
		$('.wp-pagenavi').css({'top':((slideBgWidth/slideCol)*slideRow) + 180 + 50 + 'px'});
		
		// Nav-left positioning
	
		var navHeight = $('.nav-left').height();
	
		$('.nav-left').css({'top':(winHeight-navHeight)/2})
		$('.nav-left span').css({'max-width':(winWidth-640)/2 - 50});
		
		$('.slide-box').each(function() {
    		var imgWidth = $('.slide-container img', this).width();
    		$('.slide-container img', this).css({'margin-left':( -1 * imgWidth ) / 2, 'left':'50%'});
    		
    	});
    	
	});
	
	// Apply image background
	
	    $('.slide-box').each(function() {
	    		    
    		var box = $(this);
    		    		
    		$(window).load(function() {
    		
    			var imgWidth = $('.slide-container img', box).width();
    			$('.slide-container img', box).css({'margin-left':( -1 * imgWidth ) / 2, 'left':'50%'});
    		});
    	});
	
	// Reset CSS3 animations
	
	var $element = $("#slide-box-bg, #right_column").bind("webkitAnimationEnd", function(){
            this.style.webkitAnimationName = "";
    });
	
	// Show a post
	
	$('.slide-box a').live('click', function(e){
		var linkSrc = $(this).attr('href');
		
		var newPage = $(this).parent().find('.slide-box-info h3').html();
		
		$('#currCategory').html(newPage);
		
		$('#slide-box-bg').css({
			'webkitAnimation':'hideSlides 0.375s ease',
			'-moz-animation':'hideSlides 0.375s ease',
			'opacity':'0'
		});
		
		$('.wp-pagenavi').hide();
		
		$('#currCategory').addClass('categoryChanging');
		
		setTimeout(function() { $('#currCategory').removeClass('categoryChanging'); }, 625);
  		e.preventDefault();
  		var destination = $(this).attr('href');
  		setTimeout(function() { window.location.href = destination; }, 1000);
	});
	
	// Menu clicking
	
	$('#topnav a, .home, .ngg-albumtitle a, #single-meta a').live('click', function(e){
		var linkSrc = $(this).attr('href');
		
		var newPage = $(this).html();
		
		$('#currCategory').html(newPage);
		
		$('#slide-box-bg').css({
			'-moz-animation':'hideSlides 0.375s ease',
			'-webkit-animation':'hideSlides 0.375s ease',
			'opacity':'0'
		});
		
		$('.wp-pagenavi').hide();
		
		$('#currCategory').addClass('categoryChanging');
		
		setTimeout(function() { $('#currCategory').removeClass('categoryChanging'); }, 625);
  		e.preventDefault();
  		var destination = $(this).attr('href');
  		setTimeout(function() { window.location.href = destination; }, 1000);
	});
	
	// NGG Album click
	
	$('.ngg-thumbnail a').live('click', function(e){
		var linkSrc = $(this).attr('href');
		
		var newPage = $(this).parent().parent().parent().find('.ngg-albumtitle a').html();
		
		$('#currCategory').html(newPage);
		
		$('#slide-box-bg').css({
			'-moz-animation':'hideSlides 0.375s ease',
			'-webkit-animation':'hideSlides 0.375s ease',
			'opacity':'0'
		});
		
		$('#currCategory').addClass('categoryChanging');
		
		setTimeout(function() { $('#currCategory').removeClass('categoryChanging'); }, 625);
  		e.preventDefault();
  		var destination = $(this).attr('href');
  		setTimeout(function() { window.location.href = destination; }, 1000);
	});
	
	// Read-more click
	
	$('a.read-more').live('click', function(e){
		var linkSrc = $(this).attr('href');
		
		var newPage = $(this).parent().find('.post-title').html();
		
		$('#currCategory').html(newPage);
		
		$('#slide-box-bg').css({
			'-moz-animation':'hideSlides 0.375s ease',
			'-webkit-animation':'hideSlides 0.375s ease',
			'opacity':'0'
		});
		
		$('#currCategory').addClass('categoryChanging');
		
		setTimeout(function() { $('#currCategory').removeClass('categoryChanging'); }, 625);
  		e.preventDefault();
  		var destination = $(this).attr('href');
  		setTimeout(function() { window.location.href = destination; }, 1000);
	});
	
	// Navigating
	
	$('.wp-pagenavi a').live('click', function(e){
		var linkSrc = $(this).attr('href');
		var newSrc = linkSrc + " #slide-box-container";
		
		$('head').append('<link rel="prefetch" href="' + linkSrc + '" />');
		
		// Set the text of current page
		var newPage = $(this).html();
		var currPage = parseInt($('.wp-pagenavi .current').html());
		
		if ($(this).hasClass('nextpostslink')) {
			newPage = currPage + 1;
		} else if ($(this).hasClass('previouspostslink')) {
			newPage = currPage - 1;
		}
		
			$('#currCategory').html('Sida ' + newPage);
			
		$('#slide-box-bg').css({
			'-moz-animation':'hideSlides 0.375s ease',
			'-webkit-animation':'hideSlides 0.375s ease',
			'opacity':'0'
		});
		
		
		$('.wp-pagenavi').hide();
		
		$('#currCategory').addClass('categoryChanging');
		setTimeout(function() { $('#currCategory').removeClass('categoryChanging'); }, 625);
  	e.preventDefault();
  	var destination = $(this).attr('href');
  	setTimeout(function() { window.location.href = destination; }, 1000);
	});

	$('.slide-box').each(function() {
		var randNum = Math.floor(Math.random()*2)
		
		if (randNum == 0) {
			$(this).attr('data-dir', 'left');
		} else {
			$(this).attr('data-dir', 'right');
		}
	});
	
	// Animating box-image on hover
		
	$('.slide-box').bind('mouseenter', function() {
		var container = $(this);
		var containerWidth = container.width();
		var box = $('.slide-container img', this);
		
		var imgWidth = $(box).width();
		
		this.iid = setInterval(function() {
		
		var currPos = parseInt($(box).css('margin-left'));
					
			if (currPos >= (-1 * (containerWidth/2)) - 0.5 && $(container).attr('data-dir') == 'left') { // Image is aligned left
				$(box).css({'margin-left':currPos - 1 + 'px'});
				$(container).attr('data-dir', 'right');
			} else if (currPos <= (-1 * imgWidth) + (containerWidth/2) + 0.5 && $(container).attr('data-dir') == 'right') { // Image is aligned right
				$(box).css({'margin-left':currPos + 1 + 'px'});
				$(container).attr('data-dir', 'left');
			} else {
				if ($(container).attr('data-dir') == 'left') {
					$(box).css({'margin-left':currPos + 1 + 'px'});
				} else {
					$(box).css({'margin-left':currPos - 1 + 'px'});
				}
			}
		},50);
	}).bind('mouseleave', function() {
		this.iid && clearInterval(this.iid);
	});
	
	// Gallery Navigation
	
	$('.ngg-navigation a').live('click', function(e){
		var linkSrc = $(this).attr('href');
		
		// Set the text of current page
		var newPage = $(this).html();
		var currPage = parseInt($('.ngg-navigation span').first().html());
		
		if ($(this).hasClass('next')) {
			newPage = currPage + 1;
		} else if ($(this).hasClass('prev')) {
			newPage = currPage - 1;
		}
		
		$('#currCategory').html('Sida ' + newPage);
		
		$('#slide-box-bg').css({
			'-moz-animation':'hideSlides 0.375s ease',
			'-webkit-animation':'hideSlides 0.375s ease',
			'opacity':'0'
		});
		
		$('#currCategory').addClass('categoryChanging');
		setTimeout(function() { $('#currCategory').removeClass('categoryChanging'); }, 625);
		
  	e.preventDefault();
  	var destination = $(this).attr('href');
  	setTimeout(function() { window.location.href = destination; }, 1000);
	});
	
	// All links click
	
	$('.post a, .page a, #right_column a, .nav-left a').not('a:has(img), a.comment-count').click(function(e){
		
		var linkSrc = $(this).attr('href');
	 	
		// Set the text of current page
		var newPage = $(this).html();
		if ($('span', this).length > 0) {
			newPage = $('span', this).html();
		}
		
		$('#currCategory').html(newPage);
		
		
		$('#slide-box-bg').css({
			'-moz-animation':'hideSlides 0.375s ease',
			'-webkit-animation':'hideSlides 0.375s ease',
			'opacity':'0'
		});
		
		$('#currCategory').addClass('categoryChanging');
		setTimeout(function() { $('#currCategory').removeClass('categoryChanging'); }, 625);
		
  	e.preventDefault();
  	var destination = $(this).attr('href');
  	setTimeout(function() { window.location.href = destination; }, 1000);
	});
	
	// Show sidebar
	
	$('#plus').click(function(){
		if ($(this).html() == '+') {
			$(this).css({'z-index':150});
			$('#right_column').show().css({
				'-webkit-animation':'showSlides 0.375s ease',
				'-moz-animation':'showSlides 0.375s ease',
				'opacity':'1'
			});
			$('.lightbox-overlay').fadeIn(0);
			$(this).html('-');
		} else {
			$(this).css({'z-index':10});
			$('#right_column').css({
				'-webkit-animation':'hideSlides 0.375s ease',
				'-moz-animation':'hideSlides 0.375s ease',
				'opacity':'0'
			}).delay(375).fadeOut(0);
			$('.lightbox-overlay').fadeOut(375);
			$(this).html('+');
		}
	});
	
});

// Lightbox function

$(document).ready(function(){
    
    // Inserts the overlay div last in the body of the page
    $('body').append('<div class="lightbox-overlay"></div>');
    
    // My Lightbox function will only work with links that contains images
    $('a:has(img)').live('click', function(){
    	
    	if ($(this).is('#related-content a, #mainSlider a, #social-stuff a, .ngg-thumbnail a')) {
    		// do nothing
    	} else {
        
	        // I set the width of the overlay to be the same as the width of the document, that's because the width can change if the user decides to resixe the window
	        $('.lightbox-overlay').width($(document).width());
	        
	        // I store the link to the big image and it´s optional description into some variables
	        targetImageLink = $(this).attr('href');
	        targetImageDesc = $(this).parent().find('figcaption').html();
	                        
	        showLightbox(targetImageLink, targetImageDesc);
		    return false;
	    
    	}
    });
    
    
});  
  
function showLightbox(imgLink, imgDesc) {
    
    // Inserts the Lightbox container last in the body
    $('body').append('<div class="lightbox"><div class="close-lightbox"></div></div>');

    var image = new Image();

    image.onload = function() {
		
		// I need to know the width and height of the window
		var windowHeight = $(window).height();
		var windowWidth = $(window).width();
		
		$('.lightbox-overlay').height($(document).height());
		
		var boxHeight = image.height; // The height of the lightbox container
		var boxWidth = image.width; // The width of the lightbox container
		
		// The Lightbox is absolute positioned, so I need to know how far the user has scrolled down
		var scrollPos = $(window).scrollTop();
		
		// I calculate the top position, 640 is the height of the big images
		var posTop = scrollPos + ((windowHeight - boxHeight)/2);
		
		if (boxWidth >= windowWidth) {
		  var posLeft = '3%';
		  $('.lightbox').width('94%');
		} else {
		  var posLeft = (windowWidth - boxWidth)/2; // Else this, where 640 is the width of the big image
		}
		
	   // If the image has a description, then we append it to the lightbox wrapped in a div
	   if (imgDesc != undefined) {
	       $('.lightbox').append('<div class="lightbox-desc">'+imgDesc+'</div>');
	   }
		
	   // Fade in the overlay
	   $('.lightbox-overlay').fadeIn(375);
		
		// Here I set some CSS values for the lightbox
		$('.lightbox')
			.css({
				'top':        posTop,
				'left':       posLeft,
				'visibility': 'visible',
				'-webkit-animation' : 'showSlides 0.375s ease',
				'-moz-animation' : 'showSlides 0.375s ease',
				'opacity': '1'
			}); // and pulls it down aswell as fading it in
			
       	// A function to close the lightbox
       $('.close-lightbox').click(function(){ // .lightbox-overlay, .lightbox
           $('.lightbox-overlay').fadeOut(375);  
           $('.lightbox').css({
           	'-webkit-animation' : 'hideSlides 0.375s ease',
           	'-moz-animation' : 'hideSlides 0.375s ease',
           'opacity': '0'});
           
           setTimeout(function(){$('.lightbox').remove();}, 375);
       });   
	};
	
	image.src = imgLink;
    $('.lightbox').append('<img src="'+imgLink+'" alt="" />');
    
}
