source: extensions/GrumPluginClasses/js/pagesNavigator.js @ 6106

Last change on this file since 6106 was 6106, checked in by grum, 14 years ago

Update plugin with some new functions

File size: 8.6 KB
Line 
1/**
2 * -----------------------------------------------------------------------------
3 * file: pagesNavigator.js
4 * file version: 1.0.0
5 * date: 2010-05-02
6 *
7 * JS file provided by the piwigo's plugin "GrumPluginClasses"
8 *
9 * -----------------------------------------------------------------------------
10 * Author     : Grum
11 *   email    : grum@piwigo.com
12 *   website  : http://photos.grum.fr
13 *   PWG user : http://forum.phpwebgallery.net/profile.php?id=3706
14 *
15 *   << May the Little SpaceFrog be with you ! >>
16 * -----------------------------------------------------------------------------
17 *
18 * constructor : myPN = new pagesNavigator(containerId [, options]);
19 *
20 *  - containerId : the Id of the DOM element where the criteria will be added
21 *  - options : an object with this properties :
22 *          . numberItem:0,
23 *          . itemPerPage:25,
24 *          . defaultPage:0,
25 *          . displayNumPage:7,
26 *          . displayFirst:true,
27 *          . displayLast:true,
28 *          . displayPrevious:true,
29 *          . displayNext:true,
30 *          . textFirst:'&lt;&lt;',
31 *          . textLast:'&gt;&gt;',
32 *          . textPrevious:'&lt;',
33 *          . textNext:'&gt;',
34 *          . textMore:'...',
35 *          . onPageChange:null,
36 *          . classActive:'',
37 *          . classInactive:'',
38 *
39 *
40 * :: HISTORY ::
41 *
42 * | release | date       |
43 * | 1.0.0   | 2010/05/02 | start to coding
44 * |         |            |
45 * |         |            |
46 * |         |            |
47 * |         |            |
48 * |         |            |
49 * |         |            |
50 *
51 */
52
53
54
55function pagesNavigator(container)
56{
57  var itemsId = {
58    first:'iNavFirst',
59    last:'iNavLast',
60    previous:'iNavPrevious',
61    next:'iNavNext',
62    pageNumber:'iNavPage',
63    morePrevious:'iNavPrevMore',
64    moreNext:'iNavNextMore',
65    container:container,
66  };
67
68  var pages = {
69    num:0,
70    current:1,
71  }
72
73  var options = {
74    numberItem:0,
75    itemPerPage:25,
76    defaultPage:0,
77    displayNumPage:7,
78    displayFirst:true,
79    displayLast:true,
80    displayPrevious:true,
81    displayNext:true,
82    hideMode:'1,<', // "1": hide nav if only 1 page to display, "<": hide nav First, Previous, Next & Last if num of page < displayNumPage
83    textFirst:'&lt;&lt;',
84    textLast:'&gt;&gt;',
85    textPrevious:'&lt;',
86    textNext:'&gt;',
87    textMore:'...',
88    onPageChange:null,
89    classActive:'',
90    classInactive:'',
91    classDisabled:'',
92  };
93
94
95  /**
96   *
97   */
98  this.doAction = function(fct)
99  {
100    switch(fct)
101    {
102      case 'setOptions':
103        /* function 'setOptions' : allows to set options after the object was
104         * created
105         */
106        if(arguments.length==2)
107        {
108          setOptions(arguments[1]);
109        }
110        break;
111    }
112  }
113
114  /**
115   * calculate the number of page
116   *
117   * @param Integer numItems : number of item to manage
118   * @param Integer numPerPage : number of item to display per page
119   * @return Integer : number of page
120   */
121  var calcNumPages=function(numItems, numPerPage)
122  {
123    return(Math.ceil(numItems/numPerPage));
124  }
125
126  /**
127   *
128   * @param Object optionsToSet : set the given options
129   */
130  var setOptions = function(optionsToSet)
131  {
132    if(typeof optionsToSet=='object')
133    {
134      options = jQuery.extend(options, optionsToSet);
135
136      if(options.numberItem<=0) options.numberItem=0;
137      if(options.itemPerPage<=0) options.itemPerPage=25;
138      if(options.displayNumPage<=2) options.displayNumPage=8;
139
140      pages.num=calcNumPages(options.numberItem, options.itemPerPage);
141
142      if(options.defaultPage>0 && options.defaultPage<=pages.num) pages.current=options.defaultPage;
143      build();
144    }
145  }
146
147  /**
148   * build the page navigator and affect it in the container
149   *
150   */
151  var build = function()
152  {
153    re=/1/;
154    if( (re.exec(options.hideMode)==null)==false && pages.num==1)
155    {
156      $('#'+itemsId.container).html(content);
157      return('');
158    }
159
160    content="<ul id='"+container+"PageNavigator'>";
161
162    styleLI=" list-style:none;float:left; ";
163    re=/</;
164    if( (re.exec(options.hideMode)==null)==false && pages.num<=options.displayNumPage)
165    {
166      hideFPNL='display:none;';
167    }
168    else
169    {
170      hideFPNL='';
171    }
172
173
174    pnClass="class='cPnInactive "+options.classInactive+"'";
175
176    if(options.displayFirst) content+="<li style='"+styleLI+hideFPNL+"' id='"+itemsId.first+"' "+pnClass+">"+options.textFirst+"</li>";
177    if(options.displayPrevious) content+="<li style='"+styleLI+hideFPNL+"' id='"+itemsId.previous+"' "+pnClass+">"+options.textPrevious+"</li>";
178    content+="<li style='"+styleLI+"display:none;' id='"+itemsId.morePrevious+"' class='cPnDisabled "+options.classDisabled+"'>"+options.textMore+"</li>";
179
180    for(i=1;i<=pages.num;i++)
181    {
182      content+="<li style='"+styleLI+"display:none;' id='"+itemsId.pageNumber+i+"' "+pnClass+">"+i+"</li>";
183    }
184
185    content+="<li style='"+styleLI+";display:none;' id='"+itemsId.moreNext+"' class='cPnDisabled "+options.classDisabled+"'>"+options.textMore+"</li>";
186    if(options.displayNext) content+="<li style='"+styleLI+hideFPNL+"' id='"+itemsId.next+"' "+pnClass+">"+options.textNext+"</li>";
187    if(options.displayLast) content+="<li style='"+styleLI+hideFPNL+"' id='"+itemsId.last+"' "+pnClass+">"+options.textLast+"</li>";
188
189    content+="</ul>";
190
191    $('#'+itemsId.container).css('visibility', 'hidden').html(content);
192    $('.cPnInactive').bind('click', onChangePage);
193
194    displayNav();
195
196    $('#'+itemsId.container).css('visibility', 'visible');
197  }
198
199
200  var displayNav = function()
201  {
202    // -1 for the current page
203    prev=Math.ceil((options.displayNumPage-1)/2);
204    if(pages.current-prev<=0)
205    {
206      prev=pages.current-1;
207    }
208    next=options.displayNumPage-1-prev
209    if(pages.current+next>=pages.num)
210    {
211      prev+=(pages.current+next-pages.num);
212      next=pages.num-pages.current;
213    }
214
215    prev=pages.current-prev;
216    next=pages.current+next;
217
218    if(prev>1)
219    {
220      $('#'+itemsId.morePrevious).css('display', 'block');
221    }
222    else
223    {
224      $('#'+itemsId.morePrevious).css('display', 'none');
225    }
226
227    if(next<pages.num)
228    {
229      $('#'+itemsId.moreNext).css('display', 'block');
230    }
231    else
232    {
233      $('#'+itemsId.moreNext).css('display', 'none');
234    }
235
236    $('#'+itemsId.container+' ul li').each(
237      function ()
238      {
239        id=-1;
240        if(!(this.id==itemsId.first ||
241             this.id==itemsId.previous ||
242             this.id==itemsId.next ||
243             this.id==itemsId.last ||
244             this.id==itemsId.morePrevious ||
245             this.id==itemsId.moreNext))
246        {
247          re=/[0-9]*$/i;
248          id=re.exec(this.id)[0];
249
250
251          if(id>=prev && id <=next)
252          {
253            $(this).css('display', 'block');
254          }
255          else
256          {
257            $(this).css('display', 'none');
258          }
259
260          if(id==pages.current)
261          {
262            $(this).addClass('cPnActive '+options.classActive).removeClass('cPnInactive '+options.classInactive);
263          }
264          else
265          {
266            $(this).addClass('cPnInactive '+options.classInactive).removeClass('cPnActive '+options.classActive);
267          }
268        }
269
270
271
272        if( ((this.id==itemsId.first || this.id==itemsId.previous) && pages.current==1) ||
273            ((this.id==itemsId.last || this.id==itemsId.next) && pages.current==pages.num) ||
274            (this.id==itemsId.morePrevious || this.id==itemsId.moreNext ) )
275        {
276          $(this).addClass('cPnDisabled '+options.classDisabled).removeClass('cPnInactive '+options.classInactive);
277        }
278        else
279        {
280          $(this).addClass('cPnInactive '+options.classInactive).removeClass('cPnDisabled '+options.classDisabled);
281        }
282      }
283    );
284
285  }
286
287
288  /**
289   * this function is called every time a page is changed
290   *  - manage the navigation bar
291   *  - if defined, execute the callback function
292   */
293  var onChangePage = function (event)
294  {
295    //event.target.id : the clicked item
296    if(event.target.id==itemsId.first)
297    {
298      pages.current=1;
299    }
300    else if(event.target.id==itemsId.previous)
301    {
302      pages.current--;
303    }
304    else if(event.target.id==itemsId.next)
305    {
306      pages.current++;
307    }
308    else if(event.target.id==itemsId.last)
309    {
310      pages.current=pages.num;
311    }
312    else
313    {
314      re=/[0-9]*$/i;
315      page=re.exec(event.target.id)[0];
316
317      if(page==pages.current) return(false);
318
319      pages.current=eval(page);
320    }
321
322    if(pages.current<=0) pages.current=1;
323    if(pages.current>=pages.num) pages.current=pages.num;
324
325    displayNav();
326    if(options.onPageChange!=null && jQuery.isFunction(options.onPageChange)) options.onPageChange(pages.current);
327  }
328
329  if(arguments.length==2)
330  {
331    setOptions(arguments[1]);
332  }
333
334}
Note: See TracBrowser for help on using the repository browser.