var c=0;
var array=["Buscamos siempre tener los espacios más adecuados para fomentar la creatividad y la colaboración en nuestros grupos de trabajo",
			"We are Online Heroes.",
			"All the web are belong to us.",
			"Desarrollamos aplicaciones y servicios basados en Web con un enfoque creativo, mezclando arte y tecnología."];
function cambia(){
	$("#fras").fadeOut(function(){
		$("#fras").text(array[c % 3]);
		$("#fras").fadeIn();
	});
	
	//alert(array[c % 3]);
	
	c++;
}
$(document).ready(function() {

	


  
	var blog;
	$.getFeed({
		url: '/blog/feed/rss/?'+Math.random(),

		success: function(feed) {
			blog=feed.items;
						

			$("body").fadeIn(1000);

			var t;

			t=setInterval("cambia()",5000);
			$("#design_content").ready(function() { 
				$('#map_canvas').googleMaps({
						latitude: 	20.60445,
						longitude: -100.38172,
				        markers: {
				            latitude: 	20.60445,
				            longitude: -100.38172,
				        },
						depth: 15
				    });
			});
			
			
			
			$("#nav").children().click(function() {
				showContent($(this).attr("id").split("_")[1], true);
			});

			if (window.location.hash && document.referrer != window.location) {
				showContent(window.location.hash.replace("#", ""), false);
			}
			
		}
	});
	
	

	function showContent(layer, animate) {
		
		$("#background").show();
		$("#footer").hide();
		$("#announcement").hide();
		if($('#content').css('display')=="none"){
			$("#content").html($("#" + layer + "_html").comments());
			
			$("#content").show();
			$('html,body').animate({scrollTop: $("#nav").offset().top - 16}, 800, "swing");
			
			
			
			 paint_blog();
			
			$('#map_canvas').googleMaps({
					latitude: 	20.60445,
					longitude: -100.38172,
					markers: {
			            latitude: 	20.60445,
			            longitude: -100.38172,
			        },
					depth: 15
			    });
				/* This code is executed after the DOM has been completely loaded */

					var totWidth=0;
					var positions = new Array();

					$('#slides .slide').each(function(i){
						/* Loop through all the slides and store their accumulative widths in totWidth */
						positions[i]= totWidth;
						totWidth += $(this).width();

						/* The positions array contains each slide's commulutative offset from the left part of the container */

						if(!$(this).width())
						{
							alert("Please, fill in width & height for all your images!");
							return false;
						}
					});

					$('#slides').width(totWidth);

					/* Change the cotnainer div's width to the exact width of all the slides combined */

					$('#menu ul li a').click(function(e){

						/* On a thumbnail click */
						$('li.menuItem').removeClass('act').addClass('inact');
						$(this).parent().addClass('act');

						var pos = $(this).parent().prevAll('.menuItem').length;

						$('#slides').stop().animate({marginLeft:-positions[pos]+'px'},450);
						/* Start the sliding animation */

						e.preventDefault();
						/* Prevent the default action of the link */
					});

					$('#menu ul li.menuItem:first').addClass('act').siblings().addClass('inact');
					/* On page load, mark the first thumbnail as active */
					
					$("#more1").click(function(){
						$("#more1").hide("slow");
						$("#more2").hide("slow");
						$("#more3").hide("slow");
						$('#hidden-more-1').slideDown("slow");
						$('#hidden-more-2').slideDown("slow");
						$('#hidden-more-3').slideDown("slow");
					});
					$("#more2").click(function(){
						$("#more1").hide("slow");
						$("#more2").hide("slow");
						$("#more3").hide("slow");
						$('#hidden-more-1').slideDown("slow");
						$('#hidden-more-2').slideDown("slow");
						$('#hidden-more-3').slideDown("slow");
					});
					$("#more3").click(function(){
						$("#more1").hide("slow");
						$("#more2").hide("slow");
						$("#more3").hide("slow");
						$('#hidden-more-1').slideDown("slow");
						$('#hidden-more-2').slideDown("slow");
						$('#hidden-more-3').slideDown("slow");
					});
			
		}else{
			$("#content:first-child").fadeOut(1000,function(){
				$('html,body').animate({scrollTop: $("#nav").offset().top - 16}, 1, "swing");
				$("#content").html($("#" + layer + "_html").comments());
				
				 paint_blog();
				
				$("#content:first-child").fadeIn(function(){
					$('html,body').animate({scrollTop: $("#nav").offset().top - 16}, 1, "swing");
						$('#map_canvas').googleMaps({
								latitude: 	20.60445,
								longitude: -100.38172,
 								markers: {
						            latitude: 	20.60445,
						            longitude: -100.38172,
						        },
								depth: 15
						});
						/* This code is executed after the DOM has been completely loaded */

							var totWidth=0;
							var positions = new Array();

							$('#slides .slide').each(function(i){
								/* Loop through all the slides and store their accumulative widths in totWidth */
								positions[i]= totWidth;
								totWidth += $(this).width();

								/* The positions array contains each slide's commulutative offset from the left part of the container */

								if(!$(this).width())
								{
									alert("Please, fill in width & height for all your images!");
									return false;
								}
							});

							$('#slides').width(totWidth);

							/* Change the cotnainer div's width to the exact width of all the slides combined */

							$('#menu ul li a').click(function(e){

								/* On a thumbnail click */
								$('li.menuItem').removeClass('act').addClass('inact');
								$(this).parent().addClass('act');

								var pos = $(this).parent().prevAll('.menuItem').length;

								$('#slides').stop().animate({marginLeft:-positions[pos]+'px'},450);
								/* Start the sliding animation */

								e.preventDefault();
								/* Prevent the default action of the link */
							});

							$('#menu ul li.menuItem:first').addClass('act').siblings().addClass('inact');
							/* On page load, mark the first thumbnail as active */
						

							$("#more1").click(function(){
								$("#more1").hide("slow");
								$("#more2").hide("slow");
								$("#more3").hide("slow");
								$('#hidden-more-1').slideDown("slow");
								$('#hidden-more-2').slideDown("slow");
								$('#hidden-more-3').slideDown("slow");
							});
							$("#more2").click(function(){
								$("#more1").hide("slow");
								$("#more2").hide("slow");
								$("#more3").hide("slow");
								$('#hidden-more-1').slideDown("slow");
								$('#hidden-more-2').slideDown("slow");
								$('#hidden-more-3').slideDown("slow");
							});
							$("#more3").click(function(){
								$("#more1").hide("slow");
								$("#more2").hide("slow");
								$("#more3").hide("slow");
								$('#hidden-more-1').slideDown("slow");
								$('#hidden-more-2').slideDown("slow");
								$('#hidden-more-3').slideDown("slow");
							});
						
				});
				
				
			});
			
			
		}
	
		
		
		$("#nav").children().each(function() {
			if ($(this).attr("id").search(layer) == -1) {
				$(this).addClass("inactive");
			} else {
				$(this).removeClass("inactive");
			}
		});

		
		// setUpHover();
		
		setupFullScreen();
		setupImageViewers();
		setupHovers();
		

		
		window.location.hash = layer;
	}
	

	

	preloadContentDelay = 1000;
	
	setTimeout(function() {
		
		preloadNode = $("<div></div>");
		
		preloadNode.css({
			"position": "absolute", 
			"left": "-100000px", 
			"top": "-100000px", 
			"height": "1px", 
			"width": "1px",
			"overflow": "hidden"})
	
		preloadNode.append($("#software_html").comments())
		preloadNode.append($("#design_html").comments())
		preloadNode.append($("#company_html").comments())
		preloadNode.append($("#blog_html").comments())
	
		$("body").append(preloadNode);
		
		// setUpHover();
		
	}, preloadContentDelay);
	function paint_blog(){
		first =""
		all='<div class="all_posts">';
		for (p in blog){
		 	if(p==0){
				first='<div class="first_post">'+
							'<div class="grid_2"><h2>'+
							'<a href="'+blog[p].link+'">Blog&nbsp;<span class="lucida">&raquo;</span></a>'+
							'</h2></div>'+
							'<div class="grid_2_last">'+
								'<p class="intro">'+blog[p].title+'</p>'+
							'</div>'+
							'<div class="clear">&nbsp;</div>'+
							'<div class="grid_2">'+
								'<span class="date">'+blog[p].updated+'</span>'+
							'</div>'+
							'<div class="grid_2_last">'+
								'<a class="button" href="'+blog[p].link+'">Leer más</a>'+
							'</div>'+
						'</div>'+
						'<div class="clear">&nbsp;</div>';
						
			}else{
				all+='<div class="grid_2"><div class="wrap_date">'+
						'<h3>21</h3>'+
						'<span>Jan 11</span>'+
					'</div>'+
					'<div class="wrap_title">'+
						'<h3><a href="'+blog[p].link+'">'+blog[p].title+'&nbsp;<span class="lucida">&raquo;</span></a></h3>'+
					'</div></div>'+
					'<div class="grid_2_last">'+
						'<p>'+blog[p].description+'</p>'+
						'<a class="button" href="'+blog[p].link+'">Leer Más</a>'+
					'</div>'+
					'<div class="clear">&nbsp;</div>';
			}
		all+='</div>';
		}
		$('#blog_content').html(first+all);
	}
	function setupHovers() {	
		$(".hoverable").hover(
			function() {$(this).addClass("hover")},
			function() {$(this).removeClass("hover")}
		);
	
		$(".gallery .thumbnail").hover(
			function() {$(this).children("img.fade").stop().fadeTo(200, 1)},
			function() {$(this).children("img.fade").stop().fadeTo(50, 0)}
		);

		$(".profile").hover(
			function() {$('img.fade', this).stop().fadeTo(200, 1)},
			function() {$('img.fade', this).stop().fadeTo(50, 0)}
		);

	};
	setupHovers();
	
});