/*===================================	
	common.js
	for illo.juliendecaudin.com    
    by Julien Decaudin http://www.juliendecaudin.com
    25/04/2010
===================================*/

$('html').addClass('js');

/************* GLOBAL VARIABLES *************/
var cacheSpeed = 300;
var cacheOverviewSpeed = 200;
var illoFadeOutSpeed = 200;
var illoFadeInSpeed = 400;
var timerPreloaderDelay = 500;
var timerPreloader;
var overviewLoaded = false;
var latestIlloPathIl;
var latestIlloPathSk;
var illoListSlideSpeed = 250;
var currentCategoryId;

$(document).ready(function() {			
    /*////////////////////////////////////// INIT */ 
    currentCategoryId = 'il';
    latestIlloPathIl = $('#illo_list_il li:eq(0) a').attr('href');    
    latestIlloPathSk = $('#illo_list_sk li:eq(0) a').attr('href');    

    /* CATEGORIES */
    $('#illo_list_holder .illo_list').each(function(n) {
        var offset = -(n * parseInt($(this).width()));

        $(this).data("offset", offset);        
        $(this).data("position", n + 1);        
    });

    /*////////////////////////////////////// INTERACTIONS */ 
    $('h1 a').click(function(){    	
    	loadNextIllo(latestIlloPathIl);    	
    });
       
    /* PREVIOUS */
    $('#link_previous').live('click', function(){  
    	$.address.value($(this).attr('href'));    			
		loadPreviousIllo($(this).attr('href'));
		return false;
	});
	
	/* NEXT */
	$('#link_next[class!=link_all], #illo_container a[class!=link_all], #illo_thumbnails ul li a').live('click', function(){				
		$.address.value($(this).attr('href'));
		loadNextIllo($(this).attr('href'));
		return false;
	});
	
	/* LIST */	
	$('.illo_list li[class!=prj_all] a').bind('click', function(){			
		$.address.value($(this).attr('href'));  
		loadNextIllo($(this).attr('href'));
		return false;
	});		
	
	/* OVERVIEW */
	$('.illo_list li[class=prj_all] a, a[class=link_all]').live('click', function(){			
		$.address.value($(this).attr('href'));  
		loadOverview($(this).attr('href'));
		return false;
	});	
			
	/* ROLLOVER */
	$('#illo_container a').live('mouseover', function(){
		$('#link_next').addClass('hover');	
	}).live('mouseout', function(){
		$('#link_next').removeClass('hover');	
	});
	
	/* CATEGORIES NAVIGATION */        
    $('#illo_type_list li a').hover(function(){
    	var label = $(this).attr('title');
    	$('#illo_type_list li.label').text(label);    	
    }, function(){
    	var label = $('#illo_type_list li a.current').attr('title');
    	$('#illo_type_list li.label').text(label);    	
    });
   
    $('#illo_type_list li a, #illo_thumbnails_cache').live('click', function(){
    	var previousIlloListId = currentCategoryId;    	
    	var illoListId = $(this).attr('href').split('/project/')[1].split('/')[0];    	    	
    	
    	$.address.value($(this).attr('href')); 
    	
    	//slide the navigation
    	loadCategory(illoListId);    	    	
		
    	//load the first item of the selected category
    	if(previousIlloListId == 'sk' && currentCategoryId == 'il')
    		loadPreviousIllo($('#illo_list_' + currentCategoryId + ' li:eq(0) a').attr('href'));
    	else
	    	loadNextIllo($('#illo_list_' + currentCategoryId + ' li:eq(0) a').attr('href'));    	    	
    	
    	return false;
	});
	
	/* DEEP LINKING */
	$.address.init(function(event) {	
	}).change(function(event) {        
        var pageTitleSize = $.address.title().split(' / ').length;
        var pageTitleBase = $.address.title().split(' / ')[pageTitleSize - 1];
        var pageTitleDynamic = $('a[href=' + event.value + ']').attr('title');
        
        if(event.value == '/' || event.value == '/project/il/')
        	pageTitleDynamic = $('a[href=' + latestIlloPathIl + ']').attr('title');
        else if(event.value == '/project/sk/')
        	pageTitleDynamic = $('a[href=' + latestIlloPathSk + ']').attr('title');        	
        
        if(pageTitleDynamic)
        	$.address.title(pageTitleDynamic + ' / ' + pageTitleBase);        
    }).externalChange(function(event) {	    
        //load the right illustration       
        if(event.value == '/project/il/all/' || event.value == '/project/sk/all/')
        	loadOverview(event.value);
        else if(event.value == '/' || event.value == '/project/il/')
        	loadNextIllo(latestIlloPathIl);        	
		else if(event.value == '/project/sk/')
        	loadNextIllo(latestIlloPathSk);        	        	
        else
        	loadNextIllo(event.value);        
    });   
    
    /* OVERVIEW */
    $('#illo_thumbnails ul li a').live('mouseover', function(){
    	itemId = $(this).parent().attr('id');    	    	
    	prjId = $(this).parent().attr('id').split('thprj_')[1];    	    	    	    	
    	
    	//thumbnails state
    	$('#illo_thumbnails_primary li[id != ' + itemId + ']').stop().animate({
			opacity:0.5
		}, cacheOverviewSpeed);
    	
    	//illo list state
    	$('.illo_list li a.hover').removeClass('hover');
    	$('#prj_' + prjId + ' a', '.illo_list').addClass('hover');
    	
    }).live('mouseout', function(){
    	itemId = $(this).parent().attr('id');    	    	
    	prjId = $(this).parent().attr('id').split('thprj_')[1];    	
    	
    	//thumbnails state
    	$('#illo_thumbnails_primary li').stop().animate({
			opacity:1
		}, cacheSpeed);
    	
    	//illo list state    	
    	$('#prj_' + prjId + ' a', '.illo_list').removeClass('hover');    	
    });          
    
    $('#illo_thumbnails_cache').live('mouseover', function(){
    	$(this).stop().animate({
			opacity:0
		}, cacheOverviewSpeed);	
		
		$('#illo_thumbnails_primary ul').stop().animate({
			opacity:0.5
		}, cacheOverviewSpeed);	
		
    }).live('mouseout', function(){
    	$(this).stop().animate({
			opacity:0.5
		}, cacheSpeed);
		
		$('#illo_thumbnails_primary ul').stop().animate({
			opacity:1
		}, cacheSpeed);
    });
});

function loadCategory(categoryId){
	var illoListToLoad = $('#illo_list_' + categoryId);
	var illoTypeLink = $('#illo_type_' + categoryId);
    	
	$('#illo_type_list li a').removeClass('current');
	illoTypeLink.addClass('current');
	$('#illo_type_list li.label').text(illoTypeLink.attr('title'));    	    	
	
	//update category flag
	currentCategoryId = categoryId;	    	
	
	//slide the navigation
	$('#illo_list_holder').animate({
        marginLeft: illoListToLoad.data("offset")
    }, illoListSlideSpeed);
}

function loadPreviousIllo(path){
	$('#illo_cache').css('display', 'block').animate({
		opacity:1
	}, illoFadeOutSpeed);
	
	$('#illo_container a img').animate({
		bottom:-50
	}, cacheSpeed, function(){
		loadIllo(path);
	});	
}

function loadNextIllo(path){
	$('#illo_cache').css('display', 'block').animate({
		opacity:1
	}, illoFadeOutSpeed);
	
	$('#illo_container a img').animate({
		top:-50
	}, cacheSpeed, function(){
		loadIllo(path);
	});					
}

function loadIllo(path){		
	timerPreloader = window.setTimeout("displayPreloader()", timerPreloaderDelay);
	
	var illoToLoadCategoryId = getIlloCategoryId(path);
	
	//display the right category if required
	if(illoToLoadCategoryId != currentCategoryId){		
		loadCategory(illoToLoadCategoryId);
	}
	
	$.ajax({
		url: path,
		success: function(html){						
			var illoNav = $(html).find('#illo_nav li');
			var illoListCurrentIndex = $(html).find('#illo_list_' + currentCategoryId + ' li[class=current]').index();
			var linkImage = $(html).find('#illo_container a');
			var details = $(html).find('#illo_details p');			
			
			//console.log(illoListCurrentIndex);
			
			if(overviewLoaded){
				$('#illo_thumbnails').remove();
				$('#illo_nav').show();
				$('#illo_content').show();				
			}
			
			$('#illo_container .vcenter_inner').html(linkImage);
			$('#illo_details').html(details);
			$('#illo_nav').html(illoNav);
			$('.illo_list li.current').removeClass('current');
			$('.illo_list li a.hover').removeClass('hover');
			$('#illo_list_' + currentCategoryId + ' li:eq('+ illoListCurrentIndex +')').addClass('current');
			
			$.preLoadImages($('#illo_container .vcenter_inner a img').attr('src'), function(){
				displayIlloImage();	
			});			
		}, 
		complete: function(){		
			if(overviewLoaded){
				overviewLoaded = false;
			}
		}
	});
}

function loadOverview(path){			
	if(!overviewLoaded){				
		$.ajax({
			url: path,
			success: function(html){									
				var illoListCurrentIndex = $(html).find('#illo_list_' + currentCategoryId + ' li[class=prj_all current]').index();
				var illoThumbnails = $(html).find('#illo_thumbnails');				
				
				$('#illo_nav').hide();
				$('#illo_content').hide();			
				$('.illo_list li.current').removeClass('current');
				$('.illo_list li a.hover').removeClass('hover');
				$('#illo_list_' + currentCategoryId + ' li:eq('+ illoListCurrentIndex +')').addClass('current');		
				
				//console.log(illoListCurrentIndex);
				
				$('#column_right div.content_holder').hide().append(illoThumbnails);
				
				//preload thumbnail images
				var arrayIlloThumbnails = new Array();
				$('#illo_thumbnails li').each(function(n){
					arrayIlloThumbnails[n] = $(this).find('a img').attr('src');
				});
				
				$.preLoadImages(arrayIlloThumbnails, function(){
					$('#column_right div.content_holder').fadeIn(illoFadeInSpeed);
				});			
			}, 
			complete: function(){		
				overviewLoaded = true;					
			}
		});
	}
}

function getIlloCategoryId(path){	
	//return $('.illo_list li a[href=' + path + ']').parents('.illo_list').attr('id').split('illo_type_')[1];
	return $('.illo_list li a[href=' + path + ']').parents('.illo_list').attr('id').split('illo_list_')[1];
}

function displayPreloader(){
	$('#preloader').show();
}

function displayIlloImage(){		
	clearTimeout(timerPreloader);
	$('#preloader').hide();		
	
	$('#illo_container .vcenter_inner a img').show();
	
	$('#illo_cache').animate({
		opacity:0
	}, illoFadeInSpeed, function(){
		//reset cache
		$('#illo_cache').hide();	
		//$('#illo_cache').css('left', cacheOffset + 'px');
		//$('#illo_cache').css('opacity', 1);			
	});			
}






