$(function(){

// tipo de vista -----------------------------------------------------------------
	var viewType = $.cookie('viewType');
	
	if (viewType == 'list') {
		//alert('list');
		$("#category a").click(function () {
			$("#category a").removeClass('select');
			$(this).addClass('select');
			var categ = $(this).attr('id');
			for(t=1; t<100; t++) {
		 		$("#project-"+t+" ul").animate({opacity: 0.1}, 200)
				if($("#project-"+t).hasClass(categ) || categ == "all") {
					$("#project-"+t+" ul").animate({opacity: 1.0}, 100);
				}
	 		}
		});
	} else {
		//alert('grid');
		$('.mini .info').css('opacity',0);
		$('.mini .info').hover(
			function () {
				//$(this).fadeTo("fast", 0.8);
				if (!$(this).hasClass('animated')) {
					$(this).dequeue().stop().fadeTo("fast", 0.8);
				}
			}, 
			function () {
				//$(this).fadeTo("slow", 0);
				$(this).addClass('animated').fadeTo("slow", 0, function() {
					$(this).removeClass('animated').dequeue();
				});
			}
		);

		$("#category a").click(function () {
			$("#category a").removeClass('select');
			$(this).addClass('select');
			var categ = $(this).attr('id');
			
			numItems = $('.mini').length;
			
			for(t=0; t<numItems; t++) {
		 		$("div.mini:eq("+t+") a img").animate({opacity: 0.1}, 200)
				if($("div.mini:eq("+t+")").hasClass(categ) || categ == "all") {
					$("div.mini:eq("+t+") a img").animate({opacity: 1.0}, 100);
				}
	 		}
		});
	}

	$("#list_view").click(function () {
		$.cookie('viewType', 'list', {path: "/"}, {expires: 7});
		location.reload();
	});
	
	$("#grid_view").click(function () {
		$.cookie('viewType', 'grid', {path: "/"}, {expires: 7});
		location.reload();
	});
	
	
// mostrar detalle de item seleccionado ------------------------------------------
	
	var url;
	$('#closeDetail').hide();
	
	$('#closeDetail').click(function(){
		$(this).hide();
		$('#box').animate({ height: "0px" });
		$('#box #detail').html("");
		return false;
	})

	// paso 3
	$.history.init(function (hash) {
		$.scrollTo( 'topbar', 400 );
		//accion web-mi programacion
		if(hash) {
			//lee la página que le corresponde al hash
		   readDetail ( hash )
		} else {
		    // start page
			$('#closeDetail').hide();
			$('#box').animate({ height: "0px" });
			$('#box #detail').html("");
		}
	});

	// paso 2
	function loadHistory(hash) {
	    //Guarda el hash en history
	    $.history.load(hash);
	}

	// paso 1
	$('.mini .info').click(function(){
		$.scrollTo( 'topbar', 400 );
		
		// extrae la url + se la pasa a readDetail
		url = $(this).prev().attr('href');	

		//extraer solo el id de la url para pasarlo como hash
		//miHash = url.split("?id=");
		
		miHash = url.split(document.domain);
		miHash = miHash[1].substring(1);
		miHash = miHash.split(".html");

		//readDetail(url);
		loadHistory(miHash[0]);
		
		return false;
	});

	function readDetail ( miUrl ){
		
		$('#box #detail').html("");
		
		// volver a componer al url para leerla en el #detail
		urlRaiz = document.domain;
		miUrlTotal = '/' + miUrl + '.html';
		
		$('#box #detail').load(miUrlTotal , function() {
			alto = $('#detail').css('height');
			$('#box').animate({ height: alto });
			$('#closeDetail').show();
		});

	}


});
