$.fn.preload = function() {
    this.each(function(){
        $('<img/>')[0].src = this;
    });
  }
  
  $(['bookshelf/assets/back.png', 'bookshelf/assets/next.png', 'bookshelf/assets/prev.png','bookshelf/assets/nextshelf.png', 'bookshelf/assets/prevshelf.png']).preload();

  var images = [
	'bookshelf/assets/loading.gif',
	'bookshelf/assets/bg-detail.png',
	'bookshelf/spines/bookA01.png',
	'bookshelf/spines/bookA02.png',
	'bookshelf/spines/bookA03.png',
	'bookshelf/spines/bookA04.png',
	'bookshelf/spines/bookA05.png',
	'bookshelf/spines/bookA06.png',
	//'bookshelf/spines/bookA07.png',
	'bookshelf/spines/bookA08.png',
	'bookshelf/spines/bookA09.png',
	'bookshelf/spines/bookA10.png',
	'bookshelf/spines/bookA11.png',
	'bookshelf/spines/bookA12.png',
	'bookshelf/spines/bookA13.png',
	'bookshelf/spines/bookA14.png',
	'bookshelf/spines/bookA15.png',
	'bookshelf/covers/bookA01.png',
	'bookshelf/covers/bookA02.png',
	'bookshelf/covers/bookA03.png',
	'bookshelf/covers/bookA04.png',
	'bookshelf/covers/bookA05.png',
	'bookshelf/covers/bookA06.png',
	//'bookshelf/covers/bookA07.png',
	'bookshelf/covers/bookA08.png',
	'bookshelf/covers/bookA09.png',
	'bookshelf/covers/bookA10.png',
	'bookshelf/covers/bookA11.png',
	'bookshelf/covers/bookA12.png',
	'bookshelf/covers/bookA13.png',
	'bookshelf/covers/bookA14.png',
	'bookshelf/covers/bookA15.png'
  ];
 
  $({}).imageLoader({
	    images: images,
	    async: true,
	    allcomplete: function(){
	    	loadShelf(1);
	    	$('.slider').fadeIn();
	    	$('#loading').fadeOut();
	    	loadShelf2();
	    }
  	});

function loadShelf(number){

	$.getJSON(
		'bookshelf/assets/_shelf.txt', 
		function(json){
			$.each(json.shelves, function(i,shelves){
			
				var shelfindex = i+1;
				var shelf = shelves.shelf;
				var blength = shelves.books.length;
											
				if( number == shelfindex ){
				
	          	$.each(shelves.books, function(i,books){

	          		var title = books.title;
	          		var slug = books.slug;		          		
	          		var publisher = books.publisher;		          		
	          		var isbn = books.isbn;		          		
	          		var production = books.production;		          		
	          		var description = books.description;
	          		var index = i+1;
	          			          		
	          		var spines = '<a href="#" class="open" rel="'+shelfindex+'_'+index+'"><img src="bookshelf/spines/'+slug+'.png" border="0" /></a>';
	          		var detail = '\
	          			<div id="book'+shelfindex+'_'+index+'" class="detail"> \
		          			<div class="cover"> \
		          				<img src="bookshelf/covers/'+slug+'.png" alt="'+title+'" /> \
		          			</div> \
		          			<div class="info"> \
			          			<div class="row clearfix"><div class="left">Title</div><div class="right">: '+title+'</div></div> \
			          			<div class="row clearfix"><div class="left">Publisher</div><div class="right">: '+publisher+'</div></div> \
			          			<div class="row clearfix"><div class="left">ISBN</div><div class="right">: '+isbn+'</div></div> \
			          			<div class="row clearfix"><div class="left">Production</div><div class="right">: '+production+'</div></div> \
			          			<div class="row description clearfix"><p><strong>create the look:</strong> '+description+'</p></div> \
			          			<div class="row navigation clearfix"> \
			          				<a href="#" class="prev" rel="'+shelfindex+'_'+index+'">&laquo;</a> \
			          				<a href="#" class="back" rel="'+shelfindex+'_'+index+'">Back to Bookshelf</a> \
			          				<a href="#" class="next" rel="'+shelfindex+'_'+index+'">&raquo;</a> \
			          			</div> \
		          			</div> \
	          			</div> \
	          		';     		
	          		
	            	$('<div class="spine" />').html(spines).appendTo('.bookshelf'+shelfindex+' .spines');
	            	$('<div class="slide" />').html(detail).appendTo('.bookshelf'+shelfindex+' .details');
	            	
	            	$('a.open[rel='+shelfindex+'_'+index+']').click(function() {
	            		$('.bookshelf'+shelfindex+' .spines').fadeOut('slow');
					  	$('#book'+shelfindex+'_'+index+' .cover').slideDown('slow');
					  	$('#book'+shelfindex+'_'+index+' .info').slideDown('slow');
					});
	            	
	            	$('a.back[rel='+shelfindex+'_'+index+']').click(function() {
					  	$('#book'+shelfindex+'_'+index+' .cover').slideUp('slow');
					  	$('#book'+shelfindex+'_'+index+' .info').slideUp('slow');
	            		$('.bookshelf'+shelfindex+' .spines').fadeIn('slow');
					});

	            	$('a.next[rel='+shelfindex+'_'+index+']').click(function() {
					  	$('#book'+shelfindex+'_'+index+' .cover').fadeOut('fast');
					  	$('#book'+shelfindex+'_'+index+' .info').fadeOut('fast');
					  	$('#book'+shelfindex+'_'+(index+1)+' .cover').slideDown('slow');
					  	$('#book'+shelfindex+'_'+(index+1)+' .info').slideDown('slow');
					});
					
	            	$('a.prev[rel='+shelfindex+'_'+index+']').click(function() {
					  	$('#book'+shelfindex+'_'+index+' .cover').fadeOut('fast');
					  	$('#book'+shelfindex+'_'+index+' .info').fadeOut('fast');
					  	$('#book'+shelfindex+'_'+(index-1)+' .cover').slideDown('slow');
					  	$('#book'+shelfindex+'_'+(index-1)+' .info').slideDown('slow');
					});
					
					$('a.next').hover(
						function(){ $('a.back').text('Next Cover').addClass('hover'); },
						function(){ $('a.back').text('Back to Bookshelf').removeClass('hover'); }
					);
					$('a.prev').hover(
						function(){ $('a.back').text('Previous Cover').addClass('hover'); },
						function(){ $('a.back').text('Back to Bookshelf').removeClass('hover'); }
					);

					$('#book1 a.prev').css('visibility','hidden');
					$('.bookshelf'+shelfindex+' #book'+blength+' a.next').css('visibility','hidden');

					$('.spine').hover(
						function(){ $(this).css('margin-top','5px'); },
						function(){ $(this).css('margin-top','0'); }
					);

					$('.bookshelf6 .spine').hover(
						function(){ $(this).css('z-index','9999'); },
						function(){ $(this).css('z-index','inherit'); }
					);
					
	          	});
	
	          	}
			});	

			$('.bookshelf6 .spine:nth-child(10), .bookshelf6 .spine:nth-child(4)').addClass('vertical');
			$('.bookshelf6 .spine:nth-child(10), .bookshelf6 .spine:nth-child(4)').hover(
				function(){ $(this).css('z-index','9999'); },
				function(){ $(this).css('z-index','9998'); }
			);

			$('.bookshelf1 .spine:first').css('margin-left','60px');
			$('.bookshelf3 .spine:first').css('margin-left','-20px');
			$('.bookshelf4 .spine:first').css('margin-left','5px');
			$('.bookshelf6 .spine:first').css('margin-left','-5px');
		
		});	   
		 
	}	


  var images2 = [
	'bookshelf/spines/bookB01.png',
	'bookshelf/spines/bookB02.png',
	'bookshelf/spines/bookB03.png',
	'bookshelf/spines/bookB04.png',
	'bookshelf/spines/bookB05.png',
	'bookshelf/spines/bookB06.png',
	'bookshelf/spines/bookB07.png',
	'bookshelf/spines/bookB08.png',
	'bookshelf/spines/bookB09.png',
	'bookshelf/spines/bookB10.png',
	'bookshelf/spines/bookB11.png',
	'bookshelf/spines/bookB12.png',
	'bookshelf/spines/bookB13.png',
	'bookshelf/spines/bookB14.png',
	'bookshelf/spines/bookB15.png',
	'bookshelf/spines/bookB16.png',
	'bookshelf/spines/bookB17.png',
	'bookshelf/covers/bookB01.png',
	'bookshelf/covers/bookB02.png',
	'bookshelf/covers/bookB03.png',
	'bookshelf/covers/bookB04.png',
	'bookshelf/covers/bookB05.png',
	'bookshelf/covers/bookB06.png',
	'bookshelf/covers/bookB07.png',
	'bookshelf/covers/bookB08.png',
	'bookshelf/covers/bookB09.png',
	'bookshelf/covers/bookB10.png',
	'bookshelf/covers/bookB11.png',
	'bookshelf/covers/bookB12.png',
	'bookshelf/covers/bookB13.png',
	'bookshelf/covers/bookB14.png',
	'bookshelf/covers/bookB15.png',
	'bookshelf/covers/bookB16.png',
	'bookshelf/covers/bookB17.png'
  ];
  	
  function loadShelf2(){
	  	$({}).imageLoader({
	  		images: images2,
		    async: true,
		    allcomplete: function() {
				$('.bookshelf2 .spines').fadeIn();
				$('.bookshelf2 .loading').fadeOut();
		    }
	  	});
  };


  var images3 = [
	'bookshelf/spines/bookC01.png',
	'bookshelf/spines/bookC02.png',
	'bookshelf/spines/bookC03.png',
	'bookshelf/spines/bookC04.png',
	'bookshelf/spines/bookC05.png',
	'bookshelf/spines/bookC06.png',
	'bookshelf/spines/bookC07.png',
	'bookshelf/spines/bookC08.png',
	'bookshelf/spines/bookC09.png',
	'bookshelf/spines/bookC10.png',
	'bookshelf/spines/bookC11.png',
	'bookshelf/spines/bookC12.png',
	'bookshelf/spines/bookC13.png',
	'bookshelf/spines/bookC14.png',
	'bookshelf/spines/bookC15.png',
	'bookshelf/spines/bookC16.png',
	'bookshelf/spines/bookC17.png',
	'bookshelf/spines/bookC18.png',
	'bookshelf/covers/bookC01.png',
	'bookshelf/covers/bookC02.png',
	'bookshelf/covers/bookC03.png',
	'bookshelf/covers/bookC04.png',
	'bookshelf/covers/bookC05.png',
	'bookshelf/covers/bookC06.png',
	'bookshelf/covers/bookC07.png',
	'bookshelf/covers/bookC08.png',
	'bookshelf/covers/bookC09.png',
	'bookshelf/covers/bookC10.png',
	'bookshelf/covers/bookC11.png',
	'bookshelf/covers/bookC12.png',
	'bookshelf/covers/bookC13.png',
	'bookshelf/covers/bookC14.png',
	'bookshelf/covers/bookC15.png',
	'bookshelf/covers/bookC16.png',
	'bookshelf/covers/bookC17.png',
	'bookshelf/covers/bookC18.png'
  ];
  	
  function loadShelf3(){
	  	$({}).imageLoader({
	  		images: images3,
		    async: true,
		    allcomplete: function() {
				$('.bookshelf3 .spines').fadeIn();
				$('.bookshelf3 .loading').fadeOut();
		    }
	  	});
  };

  var images4 = [
	'bookshelf/spines/bookD01.png',
	'bookshelf/spines/bookD02.png',
	'bookshelf/spines/bookD03.png',
	'bookshelf/spines/bookD04.png',
	'bookshelf/spines/bookD05.png',
	'bookshelf/spines/bookD06.png',
	'bookshelf/spines/bookD07.png',
	'bookshelf/spines/bookD08.png',
	'bookshelf/spines/bookD09.png',
	'bookshelf/spines/bookD10.png',
	'bookshelf/spines/bookD11.png',
	'bookshelf/spines/bookD12.png',
	'bookshelf/spines/bookD13.png',
	'bookshelf/spines/bookD14.png',
	'bookshelf/spines/bookD15.png',
	'bookshelf/spines/bookD16.png',
	//'bookshelf/spines/bookD17.png',
	'bookshelf/spines/bookD18.png',
	'bookshelf/covers/bookD01.png',
	'bookshelf/covers/bookD02.png',
	'bookshelf/covers/bookD03.png',
	'bookshelf/covers/bookD04.png',
	'bookshelf/covers/bookD05.png',
	'bookshelf/covers/bookD06.png',
	'bookshelf/covers/bookD07.png',
	'bookshelf/covers/bookD08.png',
	'bookshelf/covers/bookD09.png',
	'bookshelf/covers/bookD10.png',
	'bookshelf/covers/bookD11.png',
	'bookshelf/covers/bookD12.png',
	'bookshelf/covers/bookD13.png',
	'bookshelf/covers/bookD14.png',
	'bookshelf/covers/bookD15.png',
	'bookshelf/covers/bookD16.png',
	//'bookshelf/covers/bookD17.png',
	'bookshelf/covers/bookD18.png'
  ];
  	
  function loadShelf4(){
	  	$({}).imageLoader({
	  		images: images4,
		    async: true,
		    allcomplete: function() {
				$('.bookshelf4 .spines').fadeIn();
				$('.bookshelf4 .loading').fadeOut();
		    }
	  	});
  };

  var images5 = [
	'bookshelf/spines/bookE01.png',
	'bookshelf/spines/bookE02.png',
	'bookshelf/spines/bookE03.png',
	'bookshelf/spines/bookE04.png',
	'bookshelf/spines/bookE05.png',
	'bookshelf/spines/bookE06.png',
	'bookshelf/spines/bookE07.png',
	'bookshelf/spines/bookE08.png',
	'bookshelf/spines/bookE09.png',
	'bookshelf/spines/bookE10.png',
	'bookshelf/spines/bookE11.png',
	'bookshelf/spines/bookE12.png',
	'bookshelf/spines/bookE13.png',
	'bookshelf/spines/bookE14.png',
	'bookshelf/spines/bookE15.png',
	'bookshelf/spines/bookE16.png',
	'bookshelf/spines/bookE17.png',
	'bookshelf/spines/bookE18.png',
	'bookshelf/spines/bookE19.png',
	'bookshelf/covers/bookE01.png',
	'bookshelf/covers/bookE02.png',
	'bookshelf/covers/bookE03.png',
	'bookshelf/covers/bookE04.png',
	'bookshelf/covers/bookE05.png',
	'bookshelf/covers/bookE06.png',
	'bookshelf/covers/bookE07.png',
	'bookshelf/covers/bookE08.png',
	'bookshelf/covers/bookE09.png',
	'bookshelf/covers/bookE10.png',
	'bookshelf/covers/bookE11.png',
	'bookshelf/covers/bookE12.png',
	'bookshelf/covers/bookE13.png',
	//'bookshelf/covers/bookE14.png',
	'bookshelf/covers/bookE15.png',
	'bookshelf/covers/bookE16.png',
	'bookshelf/covers/bookE17.png',
	'bookshelf/covers/bookE18.png'
	//'bookshelf/covers/bookE19.png'
  ];
  	
  function loadShelf5(){
	  	$({}).imageLoader({
	  		images: images5,
		    async: true,
		    allcomplete: function() {
				$('.bookshelf5 .spines').fadeIn();
				$('.bookshelf5 .loading').fadeOut();
		    }
	  	});
  };

  var images6 = [
	'bookshelf/spines/bookF02.png',
	'bookshelf/spines/bookF05.png',
	'bookshelf/spines/bookF06.png',
	'bookshelf/spines/bookF09.png',
	'bookshelf/spines/bookF10.png',
	'bookshelf/spines/bookF13.png',
	'bookshelf/spines/bookF14.png',
	'bookshelf/spines/bookF15.png',
	'bookshelf/spines/bookF16.png',
	'bookshelf/covers/bookF02.png',
	'bookshelf/covers/bookF05.png',
	'bookshelf/covers/bookF06.png',
	'bookshelf/covers/bookF09.png',
	'bookshelf/covers/bookF10.png',
	'bookshelf/covers/bookF13.png',
	'bookshelf/covers/bookF14.png',
	'bookshelf/covers/bookF15.png',
	'bookshelf/covers/bookF16.png'
  ];
  	
  function loadShelf6(){
	  	$({}).imageLoader({
	  		images: images6,
		    async: true,
		    allcomplete: function() {
				$('.bookshelf6 .spines').fadeIn();
				$('.bookshelf6 .loading').fadeOut();
		    }
	  	});
  };