//
//Requiere prototype
//Classe: Paginador
//Esta clase debe ser sobrecargada para indicar el método a llamar para dibujar Elemento
//y el médoto llamado para dibujar Cabecera.
var Paginador = Class.create({
   //Constructor
   initialize: function(n_nombre, n_arreglo, n_nombreDiv, n_numeroFilas) {
	  this.nombre=n_nombre;
      this.arreglo=n_arreglo; //Arreglo de elementos a dibujar, la primera posición debe ser un serial
	  this.nombreDiv=n_nombreDiv; //Nombre del div donde se va a dibujar la tabla
	  this.numeroFilas=n_numeroFilas;
	  this.elementoActual=0;
	  this.paginaActual=0;
   }, //Fin initialize
   //Dibuja un elemento de la tabla
   dibujarElemento: function(posicion) {
	  var html='';
	  html+='<tr>\n';
	  html+='<td>'+posicion+'</td>\n';
	  html+='</tr>\n';
	  return html;
   }, //Fin dibujarElemento
   //Dibuja la fila cabecera de la tabla 
   dibujarCabecera: function() {
	  var html='';
	  html+='<tr>\n';
	  html+='<td class="fondoGris">Posici&oacute;n</td>\n';
	  html+='</tr>\n';
	  return html;
   }, //Fin dibujarCabecera
   //Dibuja la barra de botones siguiente anterior
   dibujarBarra: function(desde, largo, nElementos) {
	  var html='';
	  var columnasDibujadas=0;
	  var nColumnas=4;
	  var anchoColumna=parseInt(100/nColumnas);
	  var i;
  	  html+='<table border="0" class="tablaPaginador">\n';
	  html+='<tr>\n';
	  html+='<td colspan="'+nColumnas+'"><strong>'+largo+' de '+nElementos+'</strong></td>\n';
	  html+='</tr>\n';
	  html+='<tr>\n';
	  if (this.paginaActual-1>0) {
		 html+='<td width="'+anchoColumna+'%"><a href="javascript:void(0);" onclick="'+this.nombre+'.dibujarPrimera();">&lt;&lt;</a></td>\n';
		 columnasDibujadas++;
	  } //Fin si pagina Actual > 0
	  if (desde > 0) {
		 html+='<td width="'+anchoColumna+'%"><a href="javascript:void(0);" onclick="'+this.nombre+'.dibujarAnterior();">&lt;</a></td>\n';
		 columnasDibujadas++;
	  } //Fin si desde>0
	  if (largo < nElementos) {
         html+='<td width="'+anchoColumna+'%"><a href="javascript:void(0);" onclick="'+this.nombre+'.dibujarSiguiente();">&gt;</a></td>\n';
		 columnasDibujadas++;
	  } //Fin si largo < nElementos
	  if (this.paginaActual+1<this.numeroPaginas) {
		 html+='<td width="'+anchoColumna+'%"><a href="javascript:void(0);" onclick="'+this.nombre+'.dibujarUltima();">&gt;&gt;</a></td>\n';
		 columnasDibujadas++;
	  } //Fin si paginaActual < numeroPaginas
	  for (i=columnasDibujadas; i<nColumnas; i++) {
		 html+='<td width="'+anchoColumna+'%">&nbsp;</td>\n';
	  } //Fin for
	  html+='</tr>\n';
	  html+='</table>\n';
	  return html;
   }, //Fin dibujarBarra
   //Esta función manda a dibujar el siguiente grupo
   dibujarSiguiente: function() {	  
      this.paginaActual+=1;
      return this.dibujar();
   }, //Fin dibujarSiguiente
   //Esta función manda a dibujar la última página
   dibujarUltima: function() {	  
      this.paginaActual=this.numeroPaginas;
      return this.dibujar();
   }, //Fin dibujarSiguiente
   //Esta función manda a dibujar desde la primera página
   dibujarPrimera: function() {	  
      this.paginaActual=0;
      return this.dibujar();
   }, //Fin dibujarSiguiente
   //Esta función manda a dibujar el grupo anterior
   dibujarAnterior: function() {	  
      this.paginaActual-=1;
      return this.dibujar();
   }, //Fin dibujarSiguiente
   //Esta función marca una fila dada
   marcar: function (posicion) {
	  this.elementoActual=posicion;
	  this.paginaActual=parseInt(posicion/this.numeroFilas);
	  return this.dibujar();
   }, //Fin marcar
   //Dibuja la tabla y los elementos
   dibujar: function() {
      var html='';
	  var i;
	  var nElementos=this.arreglo.length;
	  this.numeroPaginas=parseInt(nElementos/this.numeroFilas); //Poner como entero
	  var desde=this.paginaActual*this.numeroFilas;
	  var largo=desde+this.numeroFilas;
	  if (largo>nElementos) largo=nElementos;
	  html+='<table width="100%" border="0">\n'
	  html+='<tr>\n';
	  html+=this.dibujarCabecera();
	  html+='</tr>\n';
	  for (i=desde;i<largo;i++) {
		 html+='<tr>\n';  
	     html+=this.dibujarElemento(i);
		 html+='</tr>\n';		 
	  } //Fin For
	  html+='</table>\n';
	  html+=this.dibujarBarra(desde, largo, nElementos);
	  $(this.nombreDiv).innerHTML=html;
	  return html;
   } //Fin dibujar
}); //Fin de la definición de la clase