// Guardará el número de bloque en el que estamos Físicamente

var numbloque = null;
var numbloque_offset = null;

var block_end = null;
var block_start = null;

// Guardará los eventos del mouse over/out
var hover_firstpageblock = null;
var out_firstpageblock = null;

var hover_blockdown = null;
var out_blockdown = null;

var hover_pagedown = null;
var out_pagedown = null;

var	hover_list = null;
var	out_list = null;

var hover_pageup = null;
var out_pageup = null;

var hover_blockup = null;
var out_blockup = null;

var hover_lastpageblock = null;
var out_lastpageblock = null;


// Efectos de Transición
var effect_listblock_up = null;
var effect_listblock_down = null;

var effect_listblock_reset = null;


// Esperamos a que se carguen todos los controles en la Página
Event.observe(window, 'load', function() { 


	//numbloque = Math.ceil(actual_page/pages_per_block);
	numbloque_offset = 0;

	// Extraemos el Bloque Actual, página inicial y final
	//block_end = numbloque_offset * pages_per_block; 
	//block_start = ( block_end - pages_per_block ) + 1;
	

	// Primer Bloque / Página
	var _firstpageblock = document.createElement('div');
	_firstpageblock.setAttribute('id','firstpage_block');
	_firstpageblock.setAttribute('className','firstpageblock');
	_firstpageblock.setAttribute('class','firstpageblock'); 
	var _fpb_link = document.createElement('a');
	_fpb_link.setAttribute('id','fpblink');
	_fpb_link.setAttribute('href',link_to + '?ap=1'); 
	_fpb_link.innerHTML = '|&lt;'; 
	$(_firstpageblock).appendChild(_fpb_link); 
	$(_container).appendChild(_firstpageblock);
	
	hover_firstpageblock = Event.observe(_firstpageblock, 'mouseover', mantener); 
	out_firstpageblock = Event.observe(_firstpageblock, 'mouseout', resetear); 
	

	// Retroceso de Bloque
	var _block_left = document.createElement('div');
	_block_left.setAttribute('id','block_left');
	_block_left.setAttribute('className','blockleft');
	_block_left.setAttribute('class','blockleft'); 
	var _bl_link = document.createElement('a');
	_bl_link.setAttribute('id','bllink');
	_bl_link.setAttribute('href','Javascript:void(null);'); 
	
	Event.observe(_bl_link, 'click', abajo); 
	
	$(_block_left).appendChild(_bl_link); 
	$(_container).appendChild(_block_left);
	
	hover_blockdown = Event.observe(_block_left, 'mouseover', mantener); 
	out_blockdown = Event.observe(_block_left, 'mouseout', resetear); 

	// Retroceso de Página
	var _previous = document.createElement('div');
	_previous.setAttribute('id','_previous');
	_previous.setAttribute('className','prevoius');
	_previous.setAttribute('class','prevoius'); 
	var _p_link = document.createElement('a');
	_p_link.setAttribute('id','plink');
	_p_link.setAttribute('href',link_to + '?ap=' + eval( actual_page - 1)); 
	_p_link.innerHTML = '&lt;';
	$(_previous).appendChild(_p_link);	
	$(_container).appendChild(_previous);

	hover_pagedown = Event.observe(_previous, 'mouseover', mantener); 
	out_pagedown = Event.observe(_previous, 'mouseout', resetear); 


	// AQUÍ VA EL PAGINADO
	// contenedor de las Páginas
	var _block_pages = document.createElement('div');
	_block_pages.setAttribute('id','block_pages');
	_block_pages.setAttribute('className','blockpages');
	_block_pages.setAttribute('class','blockpages'); 


	var _ulist = document.createElement('ul');
	_ulist.setAttribute('id','x_u_list');
	_ulist.setAttribute('className','xulist');
	_ulist.setAttribute('class','xulist'); 
	
	
	add_pages(_ulist);
	
	hover_list = Event.observe(_block_pages, 'mouseover', mantener); 
	out_list = Event.observe(_block_pages, 'mouseout', resetear); 


	$(_block_pages).appendChild(_ulist);
	$(_container).appendChild(_block_pages);
	

	// Avance de Página
	var _next = document.createElement('div');
	_next.setAttribute('id','_next');
	_next.setAttribute('className','next');
	_next.setAttribute('class','next'); 
	var _n_link = document.createElement('a');
	_n_link.setAttribute('id','nlink');
	_n_link.setAttribute('href', link_to + '?ap=' + eval( actual_page + 1)); 
	_n_link.innerHTML = '&gt;';
	$(_next).appendChild(_n_link);		
	$(_container).appendChild(_next);	
	
	hover_pagenext = Event.observe(_next, 'mouseover', mantener); 
	out_pagenext = Event.observe(_next, 'mouseout', resetear); 
	
	// Avance de Bloque
	var _block_right = document.createElement('div');
	_block_right.setAttribute('id','block_right');
	_block_right.setAttribute('className','blockright');
	_block_right.setAttribute('class','blockright'); 
	var _br_link = document.createElement('a');
	_br_link.setAttribute('id','brlink');
	_br_link.setAttribute('href','Javascript:void(null);'); 
	Event.observe(_br_link, 'click', arriba); 
	
	
	$(_block_right).appendChild(_br_link); 
	$(_container).appendChild(_block_right);
	
	hover_blockup = Event.observe(_block_right, 'mouseover', mantener); 
	out_blockup = Event.observe(_block_right, 'mouseout', resetear); 
	

	// Último Bloque /Página
	var _lastpageblock = document.createElement('div');
	_lastpageblock.setAttribute('id','lastpage_block');
	_lastpageblock.setAttribute('className','lastpageblock');
	_lastpageblock.setAttribute('class','lastpageblock');  
	var _lpb_link = document.createElement('a');
	_lpb_link.setAttribute('id','lpblink');
	_lpb_link.setAttribute('href', link_to + '?ap=' + eval(Math.ceil(parseInt(total_elements)/parseInt(elements_per_page)))); 
	_lpb_link.innerHTML = '&gt;|'; 
	$(_lastpageblock).appendChild(_lpb_link); 
	$(_container).appendChild(_lastpageblock);
	
	hover_lastpageblock = Event.observe(_lastpageblock, 'mouseover', mantener); 
	out_lastpageblock = Event.observe(_lastpageblock, 'mouseout', resetear); 
	
	update_block_pagers(_bl_link, _br_link);


}); //Event.observe-load


// Generador-Actualizador de las Páginas
function add_pages(lista){
	
	var elementos_paginas = Element.immediateDescendants($(lista));

	// Eliminamos los elementos que pudiera tener la lista
	if ( elementos_paginas.length > 0 ){
		for (var j = 0; j < elementos_paginas.length; ++j)
			elementos_paginas[j].remove();
	}
	
	numbloque = eval(Math.ceil(parseInt(actual_page)/parseInt(pages_per_block))); 
	//numbloque_offset = numbloque; 
	
	//if ( numbloque_offset != 0 )
		numbloque = numbloque + numbloque_offset;
	
	// Extraemos el Bloque Actual, página inicial y final
	block_end = numbloque * pages_per_block; 
	block_start = ( block_end - pages_per_block ) + 1;
	
	//alert( 'actual_page: ' + actual_page + '   numbloque: ' + numbloque + '   numbloque_offset: ' + numbloque_offset + '   block_start: ' + block_start + '   block_end: ' + block_end );

	// Creamos cada página y resaltamos la que está seleccionada
	
	var total_blocks = eval( Math.ceil( parseInt(total_elements) / parseInt(elements_per_page) ) );
	
	for (var j = block_start; j <= block_end; ++j) {
		
		if ( j <= total_blocks ){
		
			var classtoapply = 'xlitem_unselect';
			var classforlink = 'linkitem_unselect';
			
			if ( actual_page == j ) {
				classtoapply = 'xlitem_select';
				classforlink = 'linkitem_select'
			}
			
			var _ulitem = document.createElement('li');
			_ulitem.setAttribute('id','x_l_item_' + j);
			_ulitem.setAttribute('className',classtoapply);
			_ulitem.setAttribute('class',classtoapply); 
			
			var _itemlink = document.createElement('a');
			_itemlink.setAttribute('id','x_l_item_link_' + j);
			_itemlink.innerHTML = j;
			_itemlink.setAttribute('href', link_to + '?ap=' + j );
			
			_itemlink.setAttribute('className',classforlink);
			_itemlink.setAttribute('class',classforlink); 
			
			
			$(_ulitem).appendChild(_itemlink);
		
			$(lista).appendChild(_ulitem);

		}//if
	}


		//$('debugger').innerHTML = '<BR>Entró a add_pages(),    numbloque: ' + numbloque + ',    numbloque_offset: ' + numbloque_offset + $('debugger').innerHTML

}


function abajo(){
	//Effect.Fade($('block_left'),{duration:0.2});
	//Effect.Fade($('block_right'),{duration:0.2});
	
	effect_listblock_down = Effect.Fade($('x_u_list'),{duration:0.2, afterFinishInternal:function(){
	
		numbloque_offset --;
		
		//$('debugger').innerHTML = '<BR>Entró a abajo(),    numbloque_offset: ' + numbloque_offset + $('debugger').innerHTML
		
		add_pages($('x_u_list'));
		update_block_pagers($('bllink'), $('brlink'));
		
		Effect.Appear($('x_u_list'));
		
		//Effect.Appear($('block_left'));		
		//Effect.Appear($('block_right'));
	
	}}); //Effect.Fade
		
}


function arriba(){
	//Effect.Fade($('block_left'),{duration:0.2});
	//Effect.Fade($('block_right'),{duration:0.2});
	
	effect_listblock_up = Effect.Fade($('x_u_list'),{duration:0.2, afterFinishInternal:function(){

		numbloque_offset ++;
		add_pages($('x_u_list'));
		update_block_pagers($('bllink'), $('brlink'));
		
		
		Effect.Appear($('x_u_list'));
		
		//Effect.Appear($('block_left'));		
		//Effect.Appear($('block_right'));
	
	}}); //Effect.Fade
}


function update_block_pagers(block_down, block_up){

	if ( actual_page <= 1 ) {
		$('firstpage_block').style.visibility = 'hidden';
		$('fpblink').style.visibility = 'hidden';
		$('_previous').style.visibility = 'hidden';
		$('plink').style.visibility = 'hidden';

	} else {
		$('firstpage_block').style.visibility = 'visible';
		$('fpblink').style.visibility = 'visible';
		$('_previous').style.visibility = 'visible';
		$('plink').style.visibility = 'visible';
	}

	if ( block_start <= 1 ) {
		$('block_left').style.visibility = 'hidden';
		$('bllink').style.visibility = 'hidden';
	}else{
		$('block_left').style.visibility = 'visible';
		$('bllink').style.visibility = 'visible';
	}




	var total_blocks = eval( Math.ceil( Math.ceil( parseInt(total_elements) / parseInt(elements_per_page) ) / parseInt(pages_per_block) ) );
	var actual_block = eval( Math.ceil( parseInt(actual_page) / parseInt(elements_per_page) ) ) + numbloque_offset;


	//alert('total_blocks: ' + total_blocks + '   actual_block: ' + actual_block)

	if ( actual_block < total_blocks ) {
		
		$('block_right').style.visibility = 'visible';
		$('brlink').style.visibility = 'visible';
	} else {
		$('block_right').style.visibility = 'hidden';
		$('brlink').style.visibility = 'hidden';
	}


	totalpages = eval(Math.ceil(parseInt(total_elements)/parseInt(elements_per_page))); 


	if ( actual_page >= totalpages ) {
		$('lastpage_block').style.visibility = 'hidden';
		$('lpblink').style.visibility = 'hidden';
		$('_next').style.visibility = 'hidden';
		$('nlink').style.visibility = 'hidden';
	} else {
		$('lastpage_block').style.visibility = 'visible';
		$('lpblink').style.visibility = 'visible';
		$('_next').style.visibility = 'visible';
		$('nlink').style.visibility = 'visible';
	}


	$(block_down).innerHTML = eval( block_start - pages_per_block )  + '&nbsp;-&nbsp;' + eval( block_end - pages_per_block);
	$(block_up).innerHTML = eval( block_start + pages_per_block )  + '&nbsp;-&nbsp;' + eval( block_end + pages_per_block);

	
}

function resetear () {
	
	if ( numbloque_offset != 0 ) {
	
			//if ( effect_listblock_up != null ) 
			//effect_listblock_up.cancel();
		
			//if ( effect_listblock_down != null ) 
			//effect_listblock_down.cancel();
		
			
			//Effect.Fade($('block_left'),{duration:0.2,  delay:1.0});
			//Effect.Fade($('block_right'),{duration:0.2, delay:1.0});
			
			effect_listblock_reset = Effect.Fade($('x_u_list'),{duration:0.2, delay:1.0, afterFinishInternal:function(){
			
				numbloque_offset = 0;
			
				add_pages($('x_u_list'));
				update_block_pagers($('bllink'), $('brlink'));
				
				Effect.Appear($('x_u_list'));
				
				//Effect.Appear($('block_left'));		
				//Effect.Appear($('block_right'));
			
			}}); //Effect.Fade
	}
}


function mantener(){ 

	if ( effect_listblock_up != null ) 
	effect_listblock_up.cancel();

	if ( effect_listblock_down != null ) 
	effect_listblock_down.cancel();

	if ( effect_listblock_reset != null ) 
	effect_listblock_reset.cancel();

	//add_pages($('x_u_list'));
	//update_block_pagers($('bllink'), $('brlink'));
}






