function Pager(tableName, trid, itemsPerPage) {
	this.tableName = tableName
	this.trid = trid
	this.itemsPerPage = itemsPerPage
	this.currentPage = 1
	this.pages = 0
	this.inited = false
	
	this.showRecords = function(from, to) {
		var rows = document.getElementById(tableName).rows
		// i starts from 1 to skip table header row
		var j = 0
		for (var i = 1; i < rows.length; i++) {
			if (rows[i].id != trid) continue
			j ++
			if (j < from || j > to) {
				rows[i].style.display = 'none'
			} else {
				rows[i].style.display = ''
			}
		}
	}
	
	this.showPage = function(pageNumber) {
		if (! this.inited) {
			alert("not inited")
			return
		}
				
		var from = (pageNumber - 1) * itemsPerPage + 1
		var to = from + itemsPerPage - 1
		this.showRecords(from, to)

		if (this.pages < 2) return
		
		var oldPageAnchor = document.getElementById(trid+'pg'+this.currentPage)
		if (oldPageAnchor) oldPageAnchor.className = 'pg-normal'
		
		this.currentPage = pageNumber
		if (this.currentPage == 1) {
			document.getElementById(trid+'pgPrev').style.visibility = 'hidden'
		} else {
			document.getElementById(trid+'pgPrev').style.visibility = ''
		}
		if (this.currentPage == this.pages) {
			document.getElementById(trid+'pgNext').style.visibility = 'hidden'
		} else {
			document.getElementById(trid+'pgNext').style.visibility = ''
		}
		
		var newPageAnchor = document.getElementById(trid+'pg'+this.currentPage)
		if (newPageAnchor) newPageAnchor.className = 'pg-selected'		
	}
	
	this.prev = function() {
		if (this.currentPage > 1) this.showPage(this.currentPage - 1)
	}
	
	this.next = function() {
		if (this.currentPage < this.pages) this.showPage(this.currentPage + 1)
	}
	
	this.init = function() {
		var rows = document.getElementById(tableName).rows
		var j = 0
		for (var i = 1; i < rows.length; i++) {
			if (rows[i].id != trid) continue
			j ++
		}
		this.pages = Math.ceil(j / itemsPerPage)
		this.inited = true
	}

	this.showPageNav = function(pagerName, positionId) {
		if (! this.inited) {
			alert("not inited")
			return
		}
		var element = document.getElementById(positionId)
		
		if (this.pages > 1) {
			var pagerHtml = ''
			pagerHtml = '<span onclick="return false"><span id="'+trid+'pgPrev" onclick="' + pagerName + '.prev();" class="pg-normal">&#171;&nbsp;</span> | '
			for (var page = 1; page <= this.pages; page++) 
				pagerHtml += '<span id="'+trid+'pg' + page + '" class="pg-normal" onclick="' + pagerName + '.showPage(' + page + ');">' + page + '</span> | '
			pagerHtml += '<span id="'+trid+'pgNext" onclick="'+pagerName+'.next();" class="pg-normal">&nbsp;&#187;</span></span>'
			
			element.style.display = ''
			element.innerHTML = pagerHtml
		}
	}
}