$j(document).ready(function() {
	//select all the a tag with name equal to modal
	$j('a[name=abasbox]').click(function(e) {
		//Cancel the link behavior
		//e.preventDefault();
		tamanos=$j(this).attr('rel');
		tam=tamanos.split(':');
		mostrarAbasBox(tam[0],tam[1],$j(this).attr('title'));
	});
	
	//if close button is clicked
	$j('#cerrarAbasbox').click(function (e) {
		//Cancel the link behavior
		//e.preventDefault();
		ocultarAbasBox();
	});		
	//if mask is clicked
//	$j('#mask').click(function () {
//		$j(this).hide();
//		$j('.window').hide();
//	});			
	
});
function ocultarAbasBox(){
	var winH = $j(window).height();
	$j('#mask').fadeOut(1000);
	$j('.window').animate( {top:  -(winH+$j(id).height())} , 400 );
	$j('#cuerpoabasbox').html('');
}
function mostrarAbasBoxURL(ancho,alto,titulo,url){
	//Get the A tag
	id='#VentanaAbasBox';
	//Get the screen height and width
	var maskHeight = $j(document).height();
	var maskWidth = $j(window).width();

	//Set heigth and width to mask to fill up the whole screen
	$j('#mask').css({'width':maskWidth,'height':maskHeight});
	
	//transition effect		
	$j('#mask').fadeIn(1000);	
	$j('#mask').fadeTo("slow",0.7);	

	//Get the window height and width
	var winH = $j(window).height();
	var winW = $j(window).width();
    $j('#TituloAbasbox').html(titulo);     
	//Set the popup window to center
	$j('#cuerpoabasbox').css('height',alto);
	$j(id).css('top',  -winH/2-$j(id).height()/2);
	$j(id).css('width',  ancho);
	$j(id).css('left', winW/2-$j(id).width()/2);

	//transition effect
	$j(id).show();
	$j(id).animate( {top:  winH/2-$j(id).height()/2 } , 400 );
	$j.ajax({
        url: url,
        complete: function(datos){
	     	$j('#cuerpoabasbox').html(datos.responseText);
	    }
	});
}
function mostrarAbasBoxIframe(ancho,alto,titulo,url){
	id='#VentanaAbasBox';
	var maskHeight = $j(document).height();
	var maskWidth = $j(window).width();
	$j('#mask').css({'width':maskWidth,'height':maskHeight});
	$j('#mask').fadeIn(1000);	
	$j('#mask').fadeTo("slow",0.7);
	var winH = $j(window).height();
	var winW = $j(window).width();
    $j('#TituloAbasbox').html(titulo);
	$j('#cuerpoabasbox').css('height',alto);
	$j(id).css('top',  -winH/2-$j(id).height()/2);
	$j(id).css('width',  ancho);
	$j(id).css('left', winW/2-$j(id).width()/2);
	$j(id).show();
	$j(id).animate( {top:  winH/2-$j(id).height()/2 } , 400 );
	html='<img src="images/loadingAnimation.gif" id="animacionLoading" align="absmiddle"><iframe id="AbasBoxiframe" style="dislpay:none" frameborder="0" onload="muestra()" marginheight="0" marginwidth="0" src="'+url+'" height="100%" width="100%"></iframe>';
	$j('#cuerpoabasbox').html(html);
}
function muestra(){
	$j('#animacionLoading').hide();
	$j('#AbasBoxiframe').fadeIn(1000);
}
function mostrarAbasBox(ancho,alto,titulo){
	//Get the A tag
	id='#VentanaAbasBox';
	//Get the screen height and width
	var maskHeight = $j(document).height();
	var maskWidth = $j(window).width();

	//Set heigth and width to mask to fill up the whole screen
	$j('#mask').css({'width':maskWidth,'height':maskHeight});
	
	//transition effect		
	$j('#mask').fadeIn(1000);	
	$j('#mask').fadeTo("slow",0.7);	

	//Get the window height and width
	var winH = $j(window).height();
	var winW = $j(window).width();
    $j('#TituloAbasbox').html(titulo);     
	//Set the popup window to center
	$j('#cuerpoabasbox').css('height',alto);
	$j(id).css('top',  -winH/2-$j(id).height()/2);
	$j(id).css('width',  ancho);
	$j(id).css('left', winW/2-$j(id).width()/2);

	//transition effect
	$j(id).show();
	$j(id).animate( {top:  winH/2-$j(id).height()/2 } , 400 );
}