$(function() {

//paginate tables with class paginated
  $('table.paginated').each(function() {
    var currentPage = 0;
    var numPerPage = 11;
    var $table = $(this);
	

    $table.bind('repaginate', function() {
      $table.find('tbody tr')
        .show()
		.slice(1, currentPage * numPerPage)
		.hide()
		.end()
		.slice((currentPage + 1) * numPerPage - 1)
		.hide()
		.end();
    });
	$table.trigger('repaginate');
	
    var numRows = $table.find('tbody tr').length;
    var numPages = Math.ceil(numRows / numPerPage);
    var $pager = $('<div class="pager">Page : </div>');
    for (var page = 0; page < numPages; page++) {
      $('<span class="page-number"></span>').text(page + 1)
        .bind('click', {newPage: page}, function(event) {
          currentPage = event.data['newPage'];
          $table.trigger('repaginate');
          $(this).addClass('active')
            .siblings().removeClass('active');
        }).appendTo($pager).addClass('clickable');
    }
    $pager.insertBefore($table)
      .find('span.page-number:first').addClass('active');
  });

//used to apply alternating row styles
function zebraRows(selector, className)
{
  $(selector).removeClass(className).addClass(className);
}
    
	
	
$('table.hover tbody tr').hover(function(){  
		$(this).find('td').addClass('hovered');  
}, function(){  
   		$(this).find('td').removeClass('hovered');  
});

//filter results based on query
function filter(selector, query) {
  query	=	$.trim(query); //trim white space
  query = query.replace(/ /gi, '|'); //add OR for regex query

  $(selector).each(function() {
    ($(this).text().search(new RegExp(query, "i")) < 0) ? $(this).hide().removeClass('visible') : $(this).show().addClass('visible');
  });
}

 //default each row to visible
  $('tbody tr').addClass('visible');
  zebraRows('.visible:odd td', 'odd');
  
  $('.filter').show();
  
  $('#filter').keyup(function(event) {
							  
	var $table  =  $('table.paginated');
    //if esc is pressed or nothing is entered
    if (event.keyCode == 27 || $(this).val() == '') {
      //if esc is pressed we want to clear the value of search box
      $(this).val('');
		
      //we want each row to be visible because if nothing
      //is entered then all rows are matched.
      $('tbody tr').removeClass('visible').show().addClass('visible');
	  $table.trigger('repaginate');
    }

    //if there is text, lets filter
    else {
		
		
      filter('tbody tr', $(this).val());
	  
    }

    //reapply zebra rows
    $('.visible td').removeClass('odd');
    zebraRows('.visible:odd td', 'odd');
});
  
 

});