lib/templates/paged_content_paging_bar.mustache

   1 {{!
   2     This file is part of Moodle - http://moodle.org/
   3
   4     Moodle is free software: you can redistribute it and/or modify
   5     it under the terms of the GNU General Public License as published by
   6     the Free Software Foundation, either version 3 of the License, or
   7     (at your option) any later version.
   8
   9     Moodle is distributed in the hope that it will be useful,
  10     but WITHOUT ANY WARRANTY; without even the implied warranty of
  11     MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  12     GNU General Public License for more details.
  13
  14     You should have received a copy of the GNU General Public License
  15     along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
  16 }}
  17 {{!
  18     @template core/paged_content_paging_bar
  19
  20     This template renders the bootstrap style paging bar to control a paged
  21     content section.
  22
  23     Example context (json):
  24     {
  25         "itemsperpage": 2,
  26         "previous": true,
  27         "next": true,
  28         "first": true,
  29         "last": true,
  30         "pages": [
  31             {
  32                 "url": "#",
  33                 "page": "1",
  34                 "active": true
  35             },
  36             {
  37                 "url": "#",
  38                 "page": "2"
  39             }
  40         ]
  41     }
  42 }}
  43 <nav aria-label="{{label}}"
  44      id="{{$pagingbarid}}paging-bar-{{uniqid}}{{/pagingbarid}}"
  45      data-region="paging-bar"
  46      data-items-per-page="{{itemsperpage}}">
  47
  48     <ul class="pagination">
  49         {{#previous}}
  50             {{< core/paged_content_paging_bar_item }}
  51                 {{$item-content}}
  52                     <span aria-hidden="true">&laquo;</span>
  53                     <span class="sr-only">{{#str}}previous{{/str}}</span>
  54                 {{/item-content}}
  55                 {{$attributes}}data-control="previous"{{/attributes}}
  56             {{/ core/paged_content_paging_bar_item }}
  57         {{/previous}}
  58         {{#first}}
  59             {{< core/paged_content_paging_bar_item }}
  60                 {{$item-content}}
  61                     <span aria-hidden="true">{{#str}}first{{/str}}</span>
  62                     <span class="sr-only">{{#str}}first{{/str}}</span>
  63                 {{/item-content}}
  64                 {{$attributes}}data-control="first"{{/attributes}}
  65             {{/ core/paged_content_paging_bar_item }}
  66         {{/first}}
  67         {{#pages}}
  68             {{< core/paged_content_paging_bar_item }}
  69                 {{$attributes}}data-page="true"{{/attributes}}
  70             {{/ core/paged_content_paging_bar_item }}
  71         {{/pages}}
  72         {{#last}}
  73             {{< core/paged_content_paging_bar_item }}
  74                 {{$item-content}}
  75                     <span aria-hidden="true">{{#str}}last{{/str}}</span>
  76                     <span class="sr-only">{{#str}}last{{/str}}</span>
  77                 {{/item-content}}
  78                 {{$attributes}}data-control="last"{{/attributes}}
  79             {{/ core/paged_content_paging_bar_item }}
  80         {{/last}}
  81         {{#next}}
  82             {{< core/paged_content_paging_bar_item }}
  83                 {{$item-content}}
  84                     <span aria-hidden="true">&raquo;</span>
  85                     <span class="sr-only">{{#str}}next{{/str}}</span>
  86                 {{/item-content}}
  87                 {{$attributes}}data-control="next"{{/attributes}}
  88             {{/ core/paged_content_paging_bar_item }}
  89         {{/next}}
  90     </ul>
  91 </nav>
  92 {{#js}}
  93 require(['jquery', 'core/paged_content_paging_bar'], function($, PagingControl) {
  94     var root = $('#{{$pagingbarid}}paging-bar-{{uniqid}}{{/pagingbarid}}');
  95     PagingControl.init(root);
  96 });
  97 {{/js}}