You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
79 lines
3.1 KiB
79 lines
3.1 KiB
extends layout
|
|
block content
|
|
div.uk-grid
|
|
br
|
|
br
|
|
div.uk-width-1-1
|
|
div.uk-panel.uk-panel-box
|
|
div.uk-badge.uk-float-right
|
|
form.uk-search
|
|
input(class='uk-search-field', type='search', placeholder='Search...')
|
|
button(class='uk-close', type='reset')
|
|
table.uk-table.uk-table-hover.uk-table-striped
|
|
caption Potato Farmer Ladder Rankings
|
|
thead
|
|
tr
|
|
th Rank
|
|
th Viewer
|
|
th Potatoes
|
|
tbody
|
|
ul.uk-pagination
|
|
|
|
block postscript
|
|
script.
|
|
var perPage = 20,
|
|
data = !{JSON.stringify(rows)};
|
|
|
|
$(document).ready(function(){
|
|
|
|
// Live search of the ladder listings
|
|
$('.uk-search-field').keyup(function() {
|
|
var query = $(this).val();
|
|
|
|
if(query.length > 2) {
|
|
var temp = $('.uk-active').attr('page');
|
|
$('.uk-active').removeClass('uk-active').empty().append('<a>'+temp+'</a>');
|
|
$('table > tbody').empty();
|
|
|
|
data.forEach(function(element, index, array) {
|
|
if(element.user.search(new RegExp(query, 'i')) != -1) {
|
|
$('table > tbody').append($('<tr></tr>').append('<td>'+index+'</td><td>'+element.user+'</td><td>'+element.points+'</td>'));
|
|
}
|
|
});
|
|
}
|
|
});
|
|
|
|
// Create pagination buttons
|
|
for(var i = 1; i <= Math.ceil(data.length/perPage); i++) {
|
|
var button = $('<li page='+i+'></li>').append('<a>'+i+'</a>');
|
|
button.on('click', function(){
|
|
//get page
|
|
var z = $(this).attr('page');
|
|
|
|
// cleanup
|
|
var temp = $('.uk-active').attr('page');
|
|
$('.uk-active').removeClass('uk-active').empty().append('<a>'+temp+'</a>');
|
|
$('table > tbody').empty();
|
|
|
|
$(this).addClass('uk-active').empty().append('<span>'+z+'</span>');
|
|
|
|
// slice(a, b): a = (n*(x-1))+1, b = n*x where n = perPage and x=curerntPage (skip +1 at end of a for splice)
|
|
var a = (perPage*(z-1)),
|
|
b = perPage*z;
|
|
|
|
data.slice(a, b).forEach(function(element, index, array){
|
|
$('table > tbody').append($('<tr></tr>').append('<td>'+(a+index+1)+'</td><td>'+element.user+'</td><td>'+element.points+'</td>'));
|
|
});
|
|
});
|
|
|
|
$('.uk-pagination').append(button);
|
|
}
|
|
|
|
// When search input is cleared, go back to first page
|
|
$('.uk-close').on('click', function(){
|
|
$('ul.uk-pagination > li').first().click();
|
|
});
|
|
|
|
// Show the first page when we load up
|
|
$('ul.uk-pagination > li').first().click();
|
|
});
|