var winHeight = window.innerHeight;
var footHeight;

var ua = $.browser;


$(document).ready(function() {
	
	//footHeight = $('footer').height();
	footHeight = $('footer').outerHeight(true);
	
	//$('#main').css({'margin-bottom':footHeight});
	
	$('.play').click(function(e) {
		videoID = $(this).attr('id').split('_');
		if (videoID[0] == 'vimeo') {
			$(this).parent().html('<iframe src="http://player.vimeo.com/video/'+videoID[1]+'?color=FFCC00&autoplay=1" width="500" height="281" frameborder="0"></iframe>');
		}else if (videoID[0] == 'youtube') {
			img = $(this).siblings('.ytb');
			ytbHeight = $('img',img).height();
			$(this).parent().html('<iframe width="500" height="'+ytbHeight+'" src="http://www.youtube.com/embed/'+videoID[1]+'?autoplay=1" frameborder="0" allowfullscreen></iframe>');
		}
		return false;
	});
	
	
	if($('.inputBg input[type=text], .inputBg input[type=password], .inputBg textarea').val() != ''){
		$(this).prev().removeClass('overlay').removeClass('focus').addClass('hastext');
	}
	
	$('.inputBg input[type=text], .inputBg input[type=password], .inputBg textarea').change(function(e) {
		$(this).prev().removeClass('overlay').removeClass('focus').addClass('hastext');
	});
	
	// Fade the label back when a field gains focus		
	$('.inputBg input[type=text], .inputBg input[type=password], .inputBg textarea').focus(function() {
		if ($(this).val() == ''){
			$(this).prev().removeClass('hastext').removeClass('overlay').addClass('focus');
		}
	});
	
	// Fade the label back when a field gains focus		
	$('.inputBg input[type=text], .inputBg input[type=password], .inputBg textarea').blur(function() {
		if ($(this).val() == '' || $(this).val() == ' '){
			$(this).prev().removeClass('hastext').removeClass('focus').addClass('overlay');
		}
	});
	
	// Fade the label back when the user starts to type
	$('.inputBg input[type=text], .inputBg input[type=password], .inputBg textarea').keypress(function(e) {
		//var code = (e.keyCode ? e.keyCode : e.which);
		var code = (e.charCode ? e.charCode : e.keyCode);
		//alert("+"+$(this).val()+"+");
		if (($(this).val().length =='1') && (code === 8 || code === 46)) {
			$(this).prev().removeClass('hastext').removeClass('overlay').addClass('focus');
		}else{
			$(this).prev().removeClass('overlay').removeClass('focus').addClass('hastext');
		}
	});


	var ua = $.browser;
	if (ua.webkit) {
		$('.suscripcion input').css({'padding-top': '6px'})
		//$('.proyectos_list ul, .fotos_proyecto ul').css({'margin-top': '53px'})
	}
	
	
	if ($('.grupo_humano .personas').length){
		empHeight = $('.grupo_humano .personas').height();
		$('.grupo_humano .contenido').css({'margin-top': empHeight+60});
	}
	

});

$(window).load(function() {
	
/*
	$('.proyectos_list .viewport').each(function() {
		if($('.ytb', this).length) {
			var height = $('.ytb',this).height();
		}else{
			var height = $('img',this).height();
		}
		$(this).css('height', height);
	});
*/
	
	
	// Imágenes en Blanco y Negro
	var supportCanvas = 'getContext' in document.createElement('canvas');
	
	if(supportCanvas && $('.grupo_humano').length){
		$('.empleado img').each(function(){
			createBWCanvas(this);
		});
	}

	$('.empleado').stop().click(function(){
		
		if($(this).hasClass('open') && !$(this).hasClass('closing')){
			closeEmpleado($(this));
		    //nextIndex = current >= slides.length-1 ? 0 : current+1;
		} else {
			$('.empleado').not(this).each(function(index) {
				if ($(this).hasClass('open')){
					closeEmpleado($(this));
				}
			});
			openEmpleado($(this));
		    //nextIndex = current <= 0 ? slides.length-1 : current-1;
		}
		
	return false;
	});
	
});

$(window).bind("resize", function() { winHeight = window.innerHeight; });

$(window).scroll(function () { 
	
	if(!(ua.msie && ua.version.slice(0,3) == "6.0")) {
	
	$(".columna .contenido").each(function(index) {
		$(this).css({'padding-bottom':footHeight});
		//if (index != 0) {
			//maxScroll = ($(this).height()-winHeight)+footHeight+parseInt($(this).css('margin-top').replace("px", ""))+50;
			//maxScroll = ($(this).height()-winHeight)+footHeight+parseInt($(this).css('margin-top').replace("px", ""));
			maxScroll = ($(this).outerHeight()-winHeight)+footHeight-8;
			if ($(this).siblings('.title').children('.wrptitle').length){
				maxScroll += 60;
			}
			
			if ($(this).siblings('.personas').length){
				empHeight = $('.grupo_humano .personas').height();
				$(this).css({'margin-top': empHeight+60});
				maxScroll += empHeight+60;
			}
			
			//$('h2', this).html($(window).scrollTop()+' - '+winHeight+' - '+footHeight+' - '+$(this).height());
			//$(this).siblings('.title').children('h2').html($(window).scrollTop()+' - '+maxScroll+' ( '+$(this).height()+' )');
			
			if ($(window).scrollTop() >= maxScroll && maxScroll > 0) {
				$(this).addClass('stop_column').css('top', -maxScroll);
			}else if (maxScroll <= 0) {
				$(this).addClass('stop_column').css('top', 0);
			}else{
				$(this).removeClass('stop_column').css('top',0);
			}
		//}
	});
	
	if ($(".resto").length){
		if ($(window).scrollTop() >= 224) {
			//$(".resto").css({'position': 'fixed', 'top': '130px'});
			$(".resto").addClass('resto_quieto');
		}else{
			//$(".resto").css({'position': 'relative'});
			$(".resto").removeClass('resto_quieto');
		}
	}
	
	if ($("#recientes").length){
		if ($(window).scrollTop() >= 618) {
			//$(".resto").css({'position': 'fixed', 'top': '130px'});
			$("#recientes .fotos").addClass('quieto');
		}else{
			//$(".resto").css({'position': 'relative'});
			$("#recientes .fotos").removeClass('quieto');
		}
	}
	
	if ($("#flickr").length){
		if ($(window).scrollTop() >= 533) {
			//$(".resto").css({'position': 'fixed', 'top': '130px'});
			$("#flickr .fotos").addClass('quieto');
		}else{
			//$(".resto").css({'position': 'relative'});
			$("#flickr .fotos").removeClass('quieto');
		}
	}
	
	}

});


// Imágenes en Blanco y Negro mediante Canvas

function createBWCanvas(image){

    var canvas = document.createElement('canvas'),
    		canvasContext = canvas.getContext("2d");

    canvas.width = image.width;
    canvas.height = image.height;
    canvas.className = "empBW";

    // Drawing the default version of the image on the canvas:
    canvasContext.drawImage(image,0,0);

    // Taking the image data and storing it in the imageData array:
    var imageData = canvasContext.getImageData(0,0,canvas.width,canvas.height),
        data = imageData.data,
        length, i = 0, grey;
    
    
		length = data.length;
		
		for ( ; i < length; i+= 4 ) {
			grey = data[i] * .3 + data[i+1] * .59 + data[i+2] * .11;
			data[i] = data[i+1] = data[i+2] = grey;
		}
		
		canvasContext.putImageData(imageData,0,0);

    // Inserting the canvas in the DOM, before the image:
    image.parentNode.insertBefore(canvas,image);
}

function openEmpleado(image) {
	var nth = $('.empleado').index(image),
			canvas = image.find('.empBW'),
			line, pos, left, top;
	
	line = parseInt(nth/6);
	pos = parseInt(nth%6);
	
	leftPos = parseInt(pos*77);
	topPos = parseInt(line*77);
	
	if (pos == 0) {
		$('.empleado:eq('+parseInt(nth+1)+')').addClass('leftholder');
	}else{
		$('.empleado:eq('+parseInt(nth-1)+')').addClass('rightholder');
	}
	canvas.stop().fadeTo(300,0);
	image.removeClass('closing').addClass('open').css((pos==5)?{right:0, top:topPos}:{left:leftPos, top:topPos}).stop().animate(
		(pos==0)?{height: 290, width: 229, left: 0, top: 0}:
			((pos==5)?{height: 290, width: 229, right: 0, top: 0}:
				{height: 290, width: 229, left: '-=77', top: 0}),
		300, function() {
		// Animation complete.
		});
	
	$('.img-wrap', image).stop().animate({ left: 0, top: 0 }, 300, function() {	});
}

function closeEmpleado(image) {
	var nth = $('.empleado').index(image),
			canvas = image.find('.empBW'),
			line, pos, left, top;
	
	line = parseInt(nth/6);
	pos = parseInt(nth%6);
	
	leftPos = parseInt(pos*77);
	topPos = parseInt(line*77);
		
	canvas.stop().fadeTo(300,1);
	$(image).addClass('closing').stop().animate(
		(pos==0)?{height: 75, width: 75, left: 0, top: topPos}:
			((pos==5)?{height: 75, width: 75, right: 0, top: topPos}:
				{height: 75, width: 75, left: '+=77', top: topPos}),
		300, function() {
			if (pos == 0) {
				$('.empleado:eq('+parseInt(nth+1)+')').removeClass('leftholder');
			}else{
				$('.empleado:eq('+parseInt(nth-1)+')').removeClass('rightholder');
			}
			$(image).removeClass('open').removeClass('closing').css((pos==5)?{right:0, top:0}:{left:0, top:0});
		});
	
	$('.img-wrap', image).stop().animate({ left: -80, top: -80	}, 300, function() { });
}