function cerrar_Skembox(){
	jQuery('#skembox').removeData("open");
	jQuery('#modalBackgroundOverlay').hide();
	jQuery('#skembox').slideUp("slow", function(){
		jQuery('#CargarContenidoSkembox').empty();
		jQuery('#skembox').hide();
	});
}

(function($){

var index, relacionado, CargandoElementos, modal, SkemboxOverlay, SkemboxCargando, SkemboxContenido, CargarContenidoSkembox, CerrarVentana, bordeArribaIzquierda, bordeArribaCentro, bordeArribaDerecha, bordeMedioIzquierda, bordeMedioDerecha, bordeAbajoIzquierda, bordeAbajoCentro, bordeAbajoDerecha;

$(function(){
	$("body").append(
		$([
			SkemboxOverlay = $('<div id="modalBackgroundOverlay" />')[0], 
			modal = $('<div id="skembox" />')[0]
		]).hide()
	);

	$(modal).append(
		$([
			bordeArribaIzquierda = $('<div id="bordeArribaIzquierda" />')[0],
			bordeArribaCentro = $('<div id="bordeArribaCentro" />')[0],
			bordeArribaDerecha = $('<div id="bordeArribaDerecha" />')[0],
			bordeMedioIzquierda = $('<div id="bordeMedioIzquierda" />')[0],
			bordeMedioDerecha = $('<div id="bordeMedioDerecha" />')[0],
			bordeAbajoIzquierda = $('<div id="bordeAbajoIzquierda" />')[0],
			bordeAbajoCentro = $('<div id="bordeAbajoCentro" />')[0],
			bordeAbajoDerecha = $('<div id="bordeAbajoDerecha" />')[0],
			SkemboxContenido = $('<div id="SkemboxContenido" />')[0]
		])
	);
	
	$(SkemboxContenido).append(
		$([
			CargarContenidoSkembox = $('<div id="CargarContenidoSkembox"><a id="contenidoAnterior" href="#"></a><a id="contenidoSiguiente" href="#"></a><span id="contenidoActual"></span><br id="brTitulo"/><span id="contenidoTitulo"></span><div id="preAnterior"></div><div id="preSiguiente"></div></div>')[0], 
			SkemboxCargandoOverlay = $('<div id="SkemboxCargandoOverlay" />')[0],
			CerrarVentana = $('<a id="CerrarVentana" href="#">Cerrar</a>')[0]
		])
	);

	$(CerrarVentana).click(function(){
		cerrarSkembox();
		return false;
	});
	
	$(SkemboxOverlay).click(function(){
		cerrarSkembox();
		return false;
	});
});

function setModalOverlay(){
	$([SkemboxOverlay]).css({"position":"absolute", width:$(window).width(), height:$(window).height(), top:$(window).scrollTop(), left:$(window).scrollLeft()});
}

function keypressEvents(e){
	if(e.keyCode == 27){
		cerrarSkembox();
		return false;
	}
	else if(e.keyCode == 37){
		$("a#contenidoSiguiente").click();
		return false;
	}
	else if(e.keyCode == 39){
		$("a#contenidoAnterior").click();
		return false
	}
}

function cerrarSkembox(){
	$(modal).removeData("open");
	$(SkemboxOverlay).hide();
	$(modal).slideUp("slow", function(){
		$(CargarContenidoSkembox).empty();
		$(modal).hide();
	});
	if(CargandoElementos){$(CargandoElementos).remove()};
	$(document).unbind('keydown', keypressEvents);
	$(window).unbind('resize scroll', setModalOverlay);
}

$.fn.skembox = function(configuracion) {
	configuracion = $.extend({}, $.fn.skembox.configuracion, configuracion);
	function modalPosition(modalWidth, modalHeight, velocidad, callback){
		var windowHeight;
		(typeof(window.innerHeight)=='number')?windowHeight=window.innerHeight:windowHeight=document.documentElement.clientHeight;
		var skemboxHeight = modalHeight + $(bordeArribaIzquierda).height() + $(bordeAbajoIzquierda).height();
		var skemboxWidth = modalWidth + $(bordeArribaIzquierda).width() + $(bordeAbajoIzquierda).width();
		var posTop = windowHeight/2 - skemboxHeight/2 + $(window).scrollTop();
		var posLeft = $(window).width()/2 - skemboxWidth/2 + $(window).scrollLeft();
		if(skemboxHeight > windowHeight){
			posTop -=(skemboxHeight - windowHeight);
		}
		if(posTop < 0){posTop = 0;}
		if(posLeft < 0){posLeft = 0;}
		$(modal).animate({height:skemboxHeight, top:posTop, left:posLeft, width:skemboxWidth}, velocidad);

		$(bordeMedioIzquierda).animate({top:$(bordeArribaIzquierda).height(), left:0, height:modalHeight}, velocidad);
		$(bordeMedioDerecha).animate({top:$(bordeArribaDerecha).height(), left:skemboxWidth-$(bordeMedioDerecha).width(), height:modalHeight}, velocidad);

		$(bordeArribaIzquierda).animate({top:0, left:0}, velocidad);
		$(bordeArribaCentro).animate({top:0, left:$(bordeArribaIzquierda).width(), width:modalWidth}, velocidad);
		$(bordeArribaDerecha).animate({top: 0, left: skemboxWidth - $(bordeArribaDerecha).width()}, velocidad);

		$(bordeAbajoIzquierda).animate({top:skemboxHeight-$(bordeAbajoIzquierda).height(), left:0}, velocidad);
		$(bordeAbajoCentro).animate({top:skemboxHeight-$(bordeAbajoIzquierda).height(), left:$(bordeAbajoIzquierda).width(), width:modalWidth}, velocidad);
		$(bordeAbajoDerecha).animate({top: skemboxHeight - $(bordeAbajoIzquierda).height(),	left: skemboxWidth - $(bordeAbajoDerecha).width()}, velocidad);
		$(SkemboxContenido).animate({height:modalHeight, width:modalWidth, top:$(bordeArribaIzquierda).height(), left:$(bordeArribaIzquierda).width()}, velocidad, function(){
			if(callback){callback();}
			if($.browser.msie && $.browser.version < 7){
				setModalOverlay();
			}
		});	
	}
	
	var preloads = [];

	function preload(){
		if(configuracion.preCargar == true && relacionado.length>1){
			var previous, next;
			index > 0 ? previous = relacionado[index-1].href : previous = relacionado[relacionado.length-1].href;
			index < relacionado.length-1 ? next = relacionado[index+1].href : next = relacionado[0].href;
			callCertifica('/Player/Fotos/');
			return [$(new Image()).attr("src", next), $(new Image()).attr("src", previous)];
		}
	}
	
	function centerModal(contentHtml, contenidoInfo){
		$(CargarContenidoSkembox).hide().html(contentHtml).append(contenidoInfo);
		if(configuracion.anchoContenido){$(CargarContenidoSkembox).css({"width":configuracion.anchoContenido})}
		if(configuracion.altoContenido){$(CargarContenidoSkembox).css({"height":configuracion.altoContenido})}
		modalPosition($(CargarContenidoSkembox).outerWidth(true), $(CargarContenidoSkembox).outerHeight(true), configuracion.velocidad, function(){
				$(CargarContenidoSkembox).show();
				$(SkemboxCargandoOverlay).hide();
			});
		var preloads = preload();
	}
	
	function Navegar(){
		$(SkemboxCargandoOverlay).show();
		if($(this).attr("id") == "contenidoSiguiente"){
			index > 0 ? index-- : index=relacionado.length-1;
		} else {
			index < relacionado.length-1 ? index++ : index = 0;
		}
		crearGaleria(relacionado[index]);
		return false;	
	}
	
	function crearGaleria(este){

		var contenidoInfo = "<br id='brTitulo'/><span id='contenidoTitulo'>"+este.title+"</span>";
		
		if(relacionado.length>1){
			contenidoInfo += "<a id='contenidoAnterior' href='#'>Anterior</a> "
			contenidoInfo += "<a id='contenidoSiguiente' href='#'>Siguiente</a> "
		}

		if (configuracion.ContenidoEnLinea) {
		 centerModal($(configuracion.ContenidoEnLinea).html(), contenidoInfo); 
		} else if (configuracion.ContenidoIframe) {
			
			if($(este).html() == 'Facebook' ){
				callCertifica('/Player/Compartir_Facebook/');
			}else if($(este).html() == '<img src="/images/share_facebook.png">'){
				callCertifica('/Compartir/Compartir_Facebook/');
			}else if($(este).html() == 'Twitter'){
				callCertifica('/Player/Compartir_Twitter/');
			}else if($(este).html() == '<img src="/images/share_twitter.png">'){
				callCertifica('/Compartir/Compartir_Twitter/');
			}else if($(este).html() == '<img src="/images/share_mail.png">'){
				callCertifica('/Compartir/Email_Amigos/');
			}else if($(este).html() == 'Comentar'){
				callCertifica('/Player/Comentar_Cancion/');
			}else{
				//alert($(este).html());
			}
			centerModal("<iframe src =" + este.href + " border='0' frameborder='0'></iframe>", contenidoInfo);
			
		} else if (este.href.match(/.(gif|png|jpg|jpeg)$/i) && !configuracion.contenidoAjax){
			
			var imagen = new Image();
			CargandoElementos =  $(imagen).load(function(){
														 
			// Redimensionar imagenes grandes - orginal de Christian Montoya.
			var tamanioVentana = Skembox_tamanioVentana();
			var x = tamanioVentana[0] - 40;
			var y = tamanioVentana[1] - 40;
			var imagenAnchoo = imagen.width;
			var imagenAltoo = imagen.height;
			if (imagenAnchoo > x) {
				imagenAltoo = imagenAltoo * (x / imagenAnchoo); 
				imagenAnchoo = x; 
				if (imagenAltoo > y) { 
					imagenAnchoo = imagenAnchoo * (y / imagenAltoo); 
					imagenAltoo = y; 
				}
			} else if (imagenAltoo > y) { 
				imagenAnchoo = imagenAnchoo * (y / imagenAltoo); 
				imagenAltoo = y; 
				if (imagenAnchoo > x) { 
					imagenAltoo = imagenAltoo * (x / imagenAnchoo); 
					imagenAnchoo = x;
				}
			}
			// Fin redimensión										 
														 
			centerModal("<img src='"+este.href+"' alt=''  width='"+imagenAnchoo+"' height='"+imagenAltoo+"'/>", contenidoInfo);
			}).attr("src",este.href);
		}else {
			CargandoElementos = $('<div></div>').load(((configuracion.contenidoAjax) ? configuracion.contenidoAjax : este.href), function(data, textStatus){
				if(textStatus == "success"){centerModal($(this).html(), contenidoInfo)
				} else {
				centerModal("<p>La petici&oacute;n ajax no ha sido completada</p>");
				}
			});
		}
	};
	
	$(this).bind("click.skembox", function () {
		if ($(modal).data("open") != true) {
			$(modal).data("open", true);
			$(CargarContenidoSkembox).empty().css({
				"height": "auto",
				"width": "auto"
			});
			
			if(configuracion.es_modal) $([SkemboxOverlay, modal, SkemboxCargandoOverlay]).show();
			else $([modal, SkemboxCargandoOverlay]).show();
			$(SkemboxContenido).css({
				width: configuracion.AnchoInicial,
				height: configuracion.AltoInicial
			});
			modalPosition($(SkemboxContenido).width(), $(SkemboxContenido).height(), 0);
			if (this.rel) {
				relacionado = $("a[rel='" + this.rel + "']");
				index = $(relacionado).index(this);
			}
			else {
				relacionado = $(this);
				index = 0;
			}
			crearGaleria(relacionado[index]);
			$("a#contenidoAnterior, a#contenidoSiguiente").die().live("click", Navegar);
			$(document).bind('keydown', keypressEvents);
			if ($.browser.msie && $.browser.version < 7) {
				$(window).bind("resize scroll", setModalOverlay);
			}
		}
		return false;
	});

	if(configuracion.open==true && $(modal).data("open")!=true){
		$(this).triggerHandler('click.skembox');
	}
};

$.fn.skembox.configuracion = {
	velocidad : 350, 
	AnchoInicial : 500, 
	AltoInicial : 400, 
	anchoContenido : false, 
	altoContenido : false, 
	contenidoAjax : false, 
	ContenidoEnLinea : false, 
	ContenidoIframe : false,
	preCargar : true,
	es_modal : true,
	open : false
}



function Skembox_tamanioVentana(){
	var de = document.documentElement;
	var w = window.innerWidth || self.innerWidth || (de&&de.clientWidth) || document.body.clientWidth;
	var h = window.innerHeight || self.innerHeight || (de&&de.clientHeight) || document.body.clientHeight;
	arrayTamanioVentana = [w,h];
	return arrayTamanioVentana;
}

})(jQuery);