PageRenderTime 42ms CodeModel.GetById 16ms RepoModel.GetById 0ms app.codeStats 0ms

/files/jquery.pajinate/0.4/jquery.pajinate.js

https://gitlab.com/Mirros/jsdelivr
JavaScript | 328 lines | 210 code | 70 blank | 48 comment | 27 complexity | dc187d04b534f8c30bb956227b9cf329 MD5 | raw file
  1. ;
  2. (function($) { /*******************************************************************************************/
  3. // jquery.pajinate.js - version 0.4
  4. // A jQuery plugin for paginating through any number of DOM elements
  5. //
  6. // Copyright (c) 2010, Wes Nolte (http://wesnolte.com)
  7. // Licensed under the MIT License (MIT-LICENSE.txt)
  8. // http://www.opensource.org/licenses/mit-license.php
  9. // Created: 2010-04-16 | Updated: 2010-04-26
  10. //
  11. /*******************************************************************************************/
  12. $.fn.pajinate = function(options) {
  13. // Set some state information
  14. var current_page = 'current_page';
  15. var items_per_page = 'items_per_page';
  16. var meta;
  17. // Setup default option values
  18. var defaults = {
  19. item_container_id: '.content',
  20. items_per_page: 10,
  21. nav_panel_id: '.page_navigation',
  22. nav_info_id: '.info_text',
  23. num_page_links_to_display: 20,
  24. start_page: 0,
  25. wrap_around: false,
  26. nav_label_first: 'First',
  27. nav_label_prev: 'Prev',
  28. nav_label_next: 'Next',
  29. nav_label_last: 'Last',
  30. nav_order: ["first", "prev", "num", "next", "last"],
  31. nav_label_info: 'Showing {0}-{1} of {2} results',
  32. show_first_last: true,
  33. abort_on_small_lists: false,
  34. jquery_ui: false,
  35. jquery_ui_active: "ui-state-highlight",
  36. jquery_ui_default: "ui-state-default",
  37. jquery_ui_disabled: "ui-state-disabled"
  38. };
  39. var options = $.extend(defaults, options);
  40. var $item_container;
  41. var $page_container;
  42. var $items;
  43. var $nav_panels;
  44. var total_page_no_links;
  45. var jquery_ui_default_class = options.jquery_ui ? options.jquery_ui_default : '';
  46. var jquery_ui_active_class = options.jquery_ui ? options.jquery_ui_active : '';
  47. var jquery_ui_disabled_class = options.jquery_ui ? options.jquery_ui_disabled : '';
  48. return this.each(function() {
  49. $page_container = $(this);
  50. $item_container = $(this).find(options.item_container_id);
  51. $items = $page_container.find(options.item_container_id).children();
  52. if (options.abort_on_small_lists && options.items_per_page >= $items.size()) return $page_container;
  53. meta = $page_container;
  54. // Initialize meta data
  55. meta.data(current_page, 0);
  56. meta.data(items_per_page, options.items_per_page);
  57. // Get the total number of items
  58. var total_items = $item_container.children().size();
  59. // Calculate the number of pages needed
  60. var number_of_pages = Math.ceil(total_items / options.items_per_page);
  61. // Construct the nav bar
  62. var more = '<span class="ellipse more">...</span>';
  63. var less = '<span class="ellipse less">...</span>';
  64. var first = !options.show_first_last ? '' : '<a class="first_link ' + jquery_ui_default_class + '" href="">' + options.nav_label_first + '</a>';
  65. var last = !options.show_first_last ? '' : '<a class="last_link ' + jquery_ui_default_class + '" href="">' + options.nav_label_last + '</a>';
  66. var navigation_html = "";
  67. for (var i = 0; i < options.nav_order.length; i++) {
  68. switch (options.nav_order[i]) {
  69. case "first":
  70. navigation_html += first;
  71. break;
  72. case "last":
  73. navigation_html += last;
  74. break;
  75. case "next":
  76. navigation_html += '<a class="next_link ' + jquery_ui_default_class + '" href="">' + options.nav_label_next + '</a>';
  77. break;
  78. case "prev":
  79. navigation_html += '<a class="previous_link ' + jquery_ui_default_class + '" href="">' + options.nav_label_prev + '</a>';
  80. break;
  81. case "num":
  82. navigation_html += less;
  83. var current_link = 0;
  84. while (number_of_pages > current_link) {
  85. navigation_html += '<a class="page_link ' + jquery_ui_default_class + '" href="" longdesc="' + current_link + '">' + (current_link + 1) + '</a>';
  86. current_link++;
  87. }
  88. navigation_html += more;
  89. break;
  90. default:
  91. break;
  92. }
  93. }
  94. // And add it to the appropriate area of the DOM
  95. $nav_panels = $page_container.find(options.nav_panel_id);
  96. $nav_panels.html(navigation_html).each(function() {
  97. $(this).find('.page_link:first').addClass('first');
  98. $(this).find('.page_link:last').addClass('last');
  99. });
  100. // Hide the more/less indicators
  101. $nav_panels.children('.ellipse').hide();
  102. // Set the active page link styling
  103. $nav_panels.find('.previous_link').next().next().addClass('active_page ' + jquery_ui_active_class);
  104. /* Setup Page Display */
  105. // And hide all pages
  106. $items.hide();
  107. // Show the first page
  108. $items.slice(0, meta.data(items_per_page)).show();
  109. /* Setup Nav Menu Display */
  110. // Page number slices
  111. total_page_no_links = $page_container.find(options.nav_panel_id + ':first').children('.page_link').size();
  112. options.num_page_links_to_display = Math.min(options.num_page_links_to_display, total_page_no_links);
  113. $nav_panels.children('.page_link').hide(); // Hide all the page links
  114. // And only show the number we should be seeing
  115. $nav_panels.each(function() {
  116. $(this).children('.page_link').slice(0, options.num_page_links_to_display).show();
  117. });
  118. /* Bind the actions to their respective links */
  119. // Event handler for 'First' link
  120. $page_container.find('.first_link').click(function(e) {
  121. e.preventDefault();
  122. movePageNumbersRight($(this), 0);
  123. gotopage(0);
  124. });
  125. // Event handler for 'Last' link
  126. $page_container.find('.last_link').click(function(e) {
  127. e.preventDefault();
  128. var lastPage = total_page_no_links - 1;
  129. movePageNumbersLeft($(this), lastPage);
  130. gotopage(lastPage);
  131. });
  132. // Event handler for 'Prev' link
  133. $page_container.find('.previous_link').click(function(e) {
  134. e.preventDefault();
  135. showPrevPage($(this));
  136. });
  137. // Event handler for 'Next' link
  138. $page_container.find('.next_link').click(function(e) {
  139. e.preventDefault();
  140. showNextPage($(this));
  141. });
  142. // Event handler for each 'Page' link
  143. $page_container.find('.page_link').click(function(e) {
  144. e.preventDefault();
  145. gotopage($(this).attr('longdesc'));
  146. });
  147. // Goto the required page
  148. gotopage(parseInt(options.start_page));
  149. toggleMoreLess();
  150. if (!options.wrap_around) tagNextPrev();
  151. });
  152. function showPrevPage(e) {
  153. new_page = parseInt(meta.data(current_page)) - 1;
  154. // Check that we aren't on a boundary link
  155. if ($(e).siblings('.active_page').prev('.page_link').length == true) {
  156. movePageNumbersRight(e, new_page);
  157. gotopage(new_page);
  158. }
  159. else if (options.wrap_around) {
  160. gotopage(total_page_no_links - 1);
  161. }
  162. };
  163. function showNextPage(e) {
  164. new_page = parseInt(meta.data(current_page)) + 1;
  165. // Check that we aren't on a boundary link
  166. if ($(e).siblings('.active_page').next('.page_link').length == true) {
  167. movePageNumbersLeft(e, new_page);
  168. gotopage(new_page);
  169. }
  170. else if (options.wrap_around) {
  171. gotopage(0);
  172. }
  173. };
  174. function gotopage(page_num) {
  175. page_num = parseInt(page_num, 10)
  176. var ipp = parseInt(meta.data(items_per_page));
  177. // Find the start of the next slice
  178. start_from = page_num * ipp;
  179. // Find the end of the next slice
  180. end_on = start_from + ipp;
  181. // Hide the current page
  182. var items = $items.hide().slice(start_from, end_on);
  183. items.show();
  184. // Reassign the active class
  185. $page_container.find(options.nav_panel_id).children('.page_link[longdesc=' + page_num + ']').addClass('active_page ' + jquery_ui_active_class).siblings('.active_page').removeClass('active_page ' + jquery_ui_active_class);
  186. // Set the current page meta data
  187. meta.data(current_page, page_num);
  188. /*########## Ajout de l'option page courante + nombre de pages*/
  189. var $current_page = parseInt(meta.data(current_page)+1);
  190. // Get the total number of items
  191. var total_items = $item_container.children().size();
  192. // Calculate the number of pages needed
  193. var $number_of_pages = Math.ceil(total_items / options.items_per_page);
  194. /*##################################################################*/
  195. $page_container.find(options.nav_info_id).html(options.nav_label_info.replace("{0}", start_from + 1).
  196. replace("{1}", start_from + items.length).replace("{2}", $items.length).replace("{3}", $current_page).replace("{4}", $number_of_pages));
  197. // Hide the more and/or less indicators
  198. toggleMoreLess();
  199. // Add a class to the next or prev links if there are no more pages next or previous to the active page
  200. tagNextPrev();
  201. // check if the onPage callback is available and call it
  202. if (typeof(options.onPageDisplayed) !== "undefined" ) {
  203. options.onPageDisplayed.call(this, page_num + 1)
  204. }
  205. }
  206. // Methods to shift the diplayed index of page numbers to the left or right
  207. function movePageNumbersLeft(e, new_p) {
  208. var new_page = new_p;
  209. var $current_active_link = $(e).siblings('.active_page');
  210. if ($current_active_link.siblings('.page_link[longdesc=' + new_page + ']').css('display') == 'none') {
  211. $nav_panels.each(function() {
  212. $(this).children('.page_link').hide() // Hide all the page links
  213. .slice(parseInt(new_page - options.num_page_links_to_display + 1), new_page + 1).show();
  214. });
  215. }
  216. }
  217. function movePageNumbersRight(e, new_p) {
  218. var new_page = new_p;
  219. var $current_active_link = $(e).siblings('.active_page');
  220. if ($current_active_link.siblings('.page_link[longdesc=' + new_page + ']').css('display') == 'none') {
  221. $nav_panels.each(function() {
  222. $(this).children('.page_link').hide() // Hide all the page links
  223. .slice(new_page, new_page + parseInt(options.num_page_links_to_display)).show();
  224. });
  225. }
  226. }
  227. // Show or remove the ellipses that indicate that more page numbers exist in the page index than are currently shown
  228. function toggleMoreLess() {
  229. if (!$nav_panels.children('.page_link:visible').hasClass('last')) {
  230. $nav_panels.children('.more').show();
  231. }
  232. else {
  233. $nav_panels.children('.more').hide();
  234. }
  235. if (!$nav_panels.children('.page_link:visible').hasClass('first')) {
  236. $nav_panels.children('.less').show();
  237. }
  238. else {
  239. $nav_panels.children('.less').hide();
  240. }
  241. }
  242. /* Add the style class ".no_more" to the first/prev and last/next links to allow custom styling */
  243. function tagNextPrev() {
  244. if ($nav_panels.children('.last').hasClass('active_page')) {
  245. $nav_panels.children('.next_link').add('.last_link').addClass('no_more ' + jquery_ui_disabled_class);
  246. }
  247. else {
  248. $nav_panels.children('.next_link').add('.last_link').removeClass('no_more ' + jquery_ui_disabled_class);
  249. }
  250. if ($nav_panels.children('.first').hasClass('active_page')) {
  251. $nav_panels.children('.previous_link').add('.first_link').addClass('no_more ' + jquery_ui_disabled_class);
  252. }
  253. else {
  254. $nav_panels.children('.previous_link').add('.first_link').removeClass('no_more ' + jquery_ui_disabled_class);
  255. }
  256. }
  257. };
  258. })(jQuery);