function pager(topEl) {

	

    this.list = $('bioRows').childElements();
   
    //number of items in array
    this.len = this.list.length;
   
    //set default page size
    this.pageSize = 8;
   
    this.curPage = 1;
   
    this.pageNum = Math.ceil(this.len/this.pageSize);
	
	this.numDividerEl = document.createElement('span');
	this.numDividerEl.className = "numDivider";
	this.numDividerChar = " | ";
	this.numDividerEl.innerHTML = this.numDividerChar;
   
    //styles
    this.buttonColorOn = "";
    this.buttonColorOff = "#ccc";
	
	this._atStart = true;
	this._atEnd = false;
   

   
    this.init = function() {
       
        //for (var i = 0; i < (this.pageSize); i++) {
         //   alert(i);
         //   $(this.list[i]).style.display = 'block';
       
        //}// end for loop
       
        this._writeNumbers(this.pageNum);
		
		this._goToPage(1);
		

		if ($('numbersDiv')) {
        	
			$('numbersDiv').setStyle({
  				display: 'inline'
			});
		}
		
       
    } //end init
   
   
    this._goToPage = function(page) {
       
        this._clearAll();
       
        lowerBound = (((page-1)*(this.pageSize)));
        upperBound = lowerBound + this.pageSize - 1;
       
	   // This line below modified by Guy to fix the following issue: Next button was still active when on last page.  Clicking next took you to an empty page.  I added the " -1" to the if statement below:
        if (upperBound >= this.len -1) { this._disableNext(); this._atEnd = true; } else { this._enableNext(); this._atEnd = false; }
       
        if (lowerBound <= 0) { this._disablePrevious(); this._atStart = true; } else { this._enablePrevious(); this._atStart = false; }
       
        for (var i = lowerBound ; i <= upperBound; i++) {
           
            if ($( this.list[i])) {
                $(this.list[i]).style.display = 'block';
            } //end if
       
        }// end for loop
		
		this._setPageNumOn(page);
		
		this.curPage = page;
		
		$('showing').update('Showing Page ' + page + ' of ' + this.pageNum);
		
		//hack to equalize height of elements and correct float issue
		for (var i = lowerBound ; i <= upperBound; i+=2) {
           
            if ($( this.list[i])) {
			
			   e = 	$(this.list[i])	
               if  (e.getHeight() > e.next().getHeight()) {
			   		e.next().setStyle({
  					height: e.getHeight() + 'px' });
			   }
            } //end if
       
        }// end for loop
		
       
   
    } // end _goToPage function

   
   
   	this._setPageNumOn = function(page) {
		
		c = $('numbersDiv').getElementsByTagName('a'); 
		
		//remove classname
		for (i=0;i < c.length;i++) {
			c[i].className = "off";
		}
		
		c[page-1].className = "on"; //add classname to selected
	
	}
   
   
    this.next = function() {
   
   		if (this._atEnd != true) {
       		this._goToPage(this.curPage + 1);
        	
		} // end if
   
    } // end next function
   
    this.previous = function() {
   		
		if (this._atStart != true) {
        	this._goToPage(this.curPage - 1);
        	
		} // end if
   		
    } // end previous function
	
	
	
	
	
   
    this._disableNext = function() {
        $('buttonNext').style.textDecoration = "none";
        $('buttonNext').style.color = this.buttonColorOff;
		$('buttonNext').className = "buttonDisabled";
    }
   
    this._enableNext = function() {
        $('buttonNext').style.textDecoration = "underline";
        $('buttonNext').style.color = this.buttonColorOn ;
		$('buttonNext').className = "";
    }

    this._disablePrevious = function() {
        $('buttonPrevious').style.textDecoration = "none";
        $('buttonPrevious').style.color = this.buttonColorOff;
    }

    this._enablePrevious = function() {
        $('buttonPrevious').style.textDecoration = "underline";
        $('buttonPrevious').style.color = this.buttonColorOn;
    }

    this._clearAll = function() {

        for (var i = 0; i < this.len; i++) {
           
            $(this.list[i]).style.display = 'none';
       
        }// end for loop

    } // end of _clearAll function


    this._writeNumbers = function(num) {
   
        for (i = 1; i <= num; i++) {
   
        newA = document.createElement('a');
        newName = "a_" + i;
        newA.setAttribute('id',newName);
        newA.innerHTML = i;
		newA.href="javascript:goToPage(" + i + ");";
		
		newS = document.createElement('span');
		newS.innerHTML = "&nbsp;";
 	
	
		if ($('numbersDiv')) {
	
        	$('numbersDiv').appendChild(newA);
			
			if (i != num) { $('numbersDiv').appendChild(newS); }
		
		} //end if numbserDiv existence test
   
           
        }// end for loop
   
    } //end _writeNumbers function

   
} // end of constructor function


// end if class




function goToPage(num) {

    p._goToPage(num);

}

function next() {

    p.next();

}

function previous() {

    p.previous();

}