lib/templates/tertiary_navigation_selector.mustache

   1 {{!
   2     This file is part of Moodle - http://moodle.org/
   3     Moodle is free software: you can redistribute it and/or modify
   4     it under the terms of the GNU General Public License as published by
   5     the Free Software Foundation, either version 3 of the License, or
   6     (at your option) any later version.
   7     Moodle is distributed in the hope that it will be useful,
   8     but WITHOUT ANY WARRANTY; without even the implied warranty of
   9     MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  10     GNU General Public License for more details.
  11     You should have received a copy of the GNU General Public License
  12     along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
  13 }}
  14 {{!
  15     @template core/tertiary_navigation_selector
  16
  17     Tertiary navigation selector.
  18
  19     Context variables required for this template:
  20     * name - name of the form element
  21     * value - value of the form element
  22     * baseid - id of the dropdown element and to be used to generate id for other elements used internally
  23     * label - Element label
  24     * labelattributes - Label attributes.
  25     * selectedoption - Text of the selected option
  26     * options - Array of options for the select with value, name, selected, isgroup and id properites.
  27     Example context (json):
  28     {
  29         "name": "Tertiary navigation selector",
  30         "value": "opt2",
  31         "baseid": "select-menu56789",
  32         "selectedoption": "Second option",
  33         "options": [
  34             {
  35                 "name": "First option",
  36                 "value": "opt1",
  37                 "id": "select-menu-option1",
  38                 "selected": false
  39             },
  40             {
  41                 "name": "Second option",
  42                 "value": "opt2",
  43                 "id": "select-menu-option2",
  44                 "selected": true
  45             },
  46             {
  47                 "selected": false,
  48                 "isgroup": {
  49                     "name": "First group",
  50                     "id": "select-menu-group1",
  51                     "options": [
  52                         {
  53                             "name": "Third option",
  54                             "value": "opt3",
  55                             "id": "select-menu-option3",
  56                             "selected": false
  57                         },
  58                         {
  59                             "name": "Fourth option",
  60                             "value": "opt4",
  61                             "id": "select-menu-option4",
  62                             "selected": false
  63                         }
  64                     ]
  65                 }
  66             },
  67             {
  68                 "name": "Fifth option",
  69                 "value": "opt5",
  70                 "id": "select-menu-option5",
  71                 "selected": false
  72             }
  73         ]
  74     }
  75 }}
  76 <nav class="tertiary-navigation-selector">
  77     {{>core/select_menu}}
  78 </nav>
  79 {{#js}}
  80     document.querySelector('#{{baseid}}').addEventListener('change', function(e) {
  81         window.location.href = e.target.value;
  82     });
  83 {{/js}}