From 3ac996ba608b6565ce38bd2bdc81332902a0ec7d Mon Sep 17 00:00:00 2001 From: Campbell Allen Date: Sun, 24 Aug 2014 12:41:45 +0100 Subject: [PATCH 1/4] use a sample of page number links for large collections Large collections will have a large number of page links. The browser slows noticeably when inserting the large page links collection into the DOM. --- addons/pager/jquery.tablesorter.pager.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/addons/pager/jquery.tablesorter.pager.js b/addons/pager/jquery.tablesorter.pager.js index a3c54cc16..2aec58a4a 100644 --- a/addons/pager/jquery.tablesorter.pager.js +++ b/addons/pager/jquery.tablesorter.pager.js @@ -186,8 +186,14 @@ if ( p.$goto.length ) { t = ''; pg = Math.min( p.totalPages, p.filteredPages ); - for ( i = 1; i <= pg; i++ ) { + // Filter the options page number link array if it's larger than 'max_option_size' + // as large page set links will slow the browser on large dom inserts + var max_option_size = 20, + skip_set_size = Math.floor(pg / max_option_size), + large_collection = pg > max_option_size; + for ( i = 1; i <= pg; ) { t += ''; + (large_collection) ? i = i+skip_set_size : i++; } p.$goto[0].innerHTML = t; p.$goto[0].value = p.page + 1; From 66045f5a25e957cea9dfb56a32edf66e54324677 Mon Sep 17 00:00:00 2001 From: Campbell Allen Date: Wed, 27 Aug 2014 11:35:02 +0100 Subject: [PATCH 2/4] add focus page number set around current page number --- addons/pager/jquery.tablesorter.pager.js | 29 ++++++++++++++++++++---- 1 file changed, 25 insertions(+), 4 deletions(-) diff --git a/addons/pager/jquery.tablesorter.pager.js b/addons/pager/jquery.tablesorter.pager.js index 2aec58a4a..92cb10f7f 100644 --- a/addons/pager/jquery.tablesorter.pager.js +++ b/addons/pager/jquery.tablesorter.pager.js @@ -190,13 +190,34 @@ // as large page set links will slow the browser on large dom inserts var max_option_size = 20, skip_set_size = Math.floor(pg / max_option_size), - large_collection = pg > max_option_size; - for ( i = 1; i <= pg; ) { - t += ''; + large_collection = pg > max_option_size, + current_page = p.page + 1, + start_page = 1, + end_page = pg, + option_pages = []; + //construct default options pages array + var option_pages_start_page = (large_collection && current_page == 1) ? skip_set_size : 1 + for (i = option_pages_start_page; i <= pg;) { + option_pages.push(i); (large_collection) ? i = i+skip_set_size : i++; + } + if (large_collection) { + var central_focus_size = Math.floor(max_option_size / 2) - 1, + lower_focus_window = Math.abs(Math.floor(current_page - central_focus_size/2)), + focus_option_pages = []; + start_page = Math.min(current_page, lower_focus_window); + end_page = start_page + central_focus_size; + //construct an array to get a focus set around the current page + for (i = start_page; i <= end_page ; i++) focus_option_pages.push(i); + var insert_index = Math.floor(option_pages.length / 2) - Math.floor(focus_option_pages.length / 2); + Array.prototype.splice.apply(option_pages, [ insert_index, focus_option_pages.length ].concat(focus_option_pages)); + option_pages.sort(function sortNumber(a,b) { return a - b; }); + } + for ( i = 0; i < option_pages.length; i++) { + t += ''; } p.$goto[0].innerHTML = t; - p.$goto[0].value = p.page + 1; + p.$goto[0].value = current_page; } // rebind startRow/page inputs $out.find('.ts-startRow, .ts-page').unbind('change').bind('change', function(){ From 8eb0a6125ac8f29cc2d4c537df709212b0fe8f42 Mon Sep 17 00:00:00 2001 From: Campbell Allen Date: Wed, 27 Aug 2014 12:14:45 +0100 Subject: [PATCH 3/4] extract maxOptionSize to a pager widget configuration option --- addons/pager/jquery.tablesorter.pager.js | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/addons/pager/jquery.tablesorter.pager.js b/addons/pager/jquery.tablesorter.pager.js index 92cb10f7f..5156a8634 100644 --- a/addons/pager/jquery.tablesorter.pager.js +++ b/addons/pager/jquery.tablesorter.pager.js @@ -58,13 +58,16 @@ // starting page of the pager (zero based index) page: 0, - // reset pager after filtering; set to desired page # - // set to false to not change page at filter start + // reset pager after filtering; set to desired page # + // set to false to not change page at filter start pageReset: 0, // Number of visible rows size: 10, + // Number of options to include in the pager number selector + maxOptionSize: 20, + // Save pager page & size if the storage script is loaded (requires $.tablesorter.storage in jquery.tablesorter.widgets.js) savePages: true, @@ -186,11 +189,11 @@ if ( p.$goto.length ) { t = ''; pg = Math.min( p.totalPages, p.filteredPages ); - // Filter the options page number link array if it's larger than 'max_option_size' + // Filter the options page number link array if it's larger than 'maxOptionSize' // as large page set links will slow the browser on large dom inserts var max_option_size = 20, - skip_set_size = Math.floor(pg / max_option_size), - large_collection = pg > max_option_size, + skip_set_size = Math.floor(pg / p.maxOptionSize), + large_collection = pg > p.maxOptionSize, current_page = p.page + 1, start_page = 1, end_page = pg, @@ -202,7 +205,7 @@ (large_collection) ? i = i+skip_set_size : i++; } if (large_collection) { - var central_focus_size = Math.floor(max_option_size / 2) - 1, + var central_focus_size = Math.floor(p.maxOptionSize / 2) - 1, lower_focus_window = Math.abs(Math.floor(current_page - central_focus_size/2)), focus_option_pages = []; start_page = Math.min(current_page, lower_focus_window); From 74163cf8a95661e509e3a01c53a52c096c4098a5 Mon Sep 17 00:00:00 2001 From: Campbell Allen Date: Tue, 16 Sep 2014 08:39:48 +0100 Subject: [PATCH 4/4] remove unused variable max_option_size --- addons/pager/jquery.tablesorter.pager.js | 1 - 1 file changed, 1 deletion(-) diff --git a/addons/pager/jquery.tablesorter.pager.js b/addons/pager/jquery.tablesorter.pager.js index 5156a8634..2926cab9d 100644 --- a/addons/pager/jquery.tablesorter.pager.js +++ b/addons/pager/jquery.tablesorter.pager.js @@ -191,7 +191,6 @@ pg = Math.min( p.totalPages, p.filteredPages ); // Filter the options page number link array if it's larger than 'maxOptionSize' // as large page set links will slow the browser on large dom inserts - var max_option_size = 20, skip_set_size = Math.floor(pg / p.maxOptionSize), large_collection = pg > p.maxOptionSize, current_page = p.page + 1,