| 1 | efrain | 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 tool_lp/competency_picker
 | 
        
           |  |  | 19 |   | 
        
           |  |  | 20 |     Show a competency tree and allow picking a competency.
 | 
        
           |  |  | 21 |   | 
        
           |  |  | 22 |     Context variables required for this template:
 | 
        
           |  |  | 23 |     * frameworks - array of competency framework
 | 
        
           |  |  | 24 |       * id
 | 
        
           |  |  | 25 |       * shortname
 | 
        
           |  |  | 26 |       * idnumber
 | 
        
           |  |  | 27 |       * selected
 | 
        
           |  |  | 28 |   | 
        
           |  |  | 29 |     * framework - competency framework
 | 
        
           |  |  | 30 |       * id
 | 
        
           |  |  | 31 |       * name
 | 
        
           |  |  | 32 |       * shortname
 | 
        
           |  |  | 33 |       * idnumber
 | 
        
           |  |  | 34 |   | 
        
           |  |  | 35 |     * competencies - array of nodes
 | 
        
           |  |  | 36 |       * id - competency id
 | 
        
           |  |  | 37 |       * name - competency idnumber
 | 
        
           |  |  | 38 |       * children - array of children
 | 
        
           |  |  | 39 |       * haschildren - boolean
 | 
        
           |  |  | 40 |   | 
        
           |  |  | 41 |     Example context (json):
 | 
        
           |  |  | 42 |     {
 | 
        
           |  |  | 43 |         "frameworks": [
 | 
        
           |  |  | 44 |             {
 | 
        
           |  |  | 45 |                 "id": "1",
 | 
        
           |  |  | 46 |                 "shortname": "Framework",
 | 
        
           |  |  | 47 |                 "idnumber": "F1"
 | 
        
           |  |  | 48 |             }
 | 
        
           |  |  | 49 |         ],
 | 
        
           |  |  | 50 |         "competencies": [
 | 
        
           |  |  | 51 |         ]
 | 
        
           |  |  | 52 |     }
 | 
        
           |  |  | 53 | }}
 | 
        
           |  |  | 54 | <div data-region="competencylinktree">
 | 
        
           |  |  | 55 | {{^singleFramework}}
 | 
        
           |  |  | 56 | <h5 class="mb-2">{{#str}}competencyframeworks, tool_lp{{/str}}</h5>
 | 
        
           |  |  | 57 | <select data-action="chooseframework" class="custom-select mb-3">
 | 
        
           |  |  | 58 | {{#frameworks}}
 | 
        
           |  |  | 59 | <option value="{{id}}" {{#selected}}selected="selected"{{/selected}}>{{{shortname}}} <em>{{idnumber}}</em></option>
 | 
        
           |  |  | 60 | {{/frameworks}}
 | 
        
           |  |  | 61 | </select>
 | 
        
           |  |  | 62 | {{/singleFramework}}
 | 
        
           |  |  | 63 | <h5 class="mb-2">{{#str}}locatecompetency, tool_lp{{/str}}</h5>
 | 
        
           |  |  | 64 |   | 
        
           |  |  | 65 | <div class="simplesearchform">
 | 
        
           |  |  | 66 |     <form data-region="filtercompetencies" class="form-inline" data-frameworkid="{{framework.id}}">
 | 
        
           |  |  | 67 |         <div class="search-input-group d-inline-flex justify-content-between w-100">
 | 
        
           |  |  | 68 |             <label class="accesshide" for="filter{{uniqid}}">{{#str}}search, tool_lp{{/str}}</label>
 | 
        
           |  |  | 69 |             <span class="search-input-icon">
 | 
        
           |  |  | 70 |                 <svg width="20" height="20" fill="none" viewBox="0 0 24 24">
 | 
        
           |  |  | 71 |                     <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19.25 19.25L15.5 15.5M4.75 11C4.75 7.54822 7.54822 4.75 11 4.75C14.4518 4.75 17.25 7.54822 17.25 11C17.25 14.4518 14.4518 17.25 11 17.25C7.54822 17.25 4.75 14.4518 4.75 11Z"></path>
 | 
        
           |  |  | 72 |                 </svg>
 | 
        
           |  |  | 73 |             </span>
 | 
        
           |  |  | 74 |             <input type="text"
 | 
        
           |  |  | 75 |             id="filter{{uniqid}}"
 | 
        
           |  |  | 76 |             class="search-input w-100"
 | 
        
           |  |  | 77 |             placeholder="{{#str}}search, tool_lp{{/str}}"
 | 
        
           |  |  | 78 |             aria-label="{{#str}}search, tool_lp{{/str}}"
 | 
        
           |  |  | 79 |             name="{{ inputname }}"
 | 
        
           |  |  | 80 |             data-region="input"
 | 
        
           |  |  | 81 |             autocomplete="off"
 | 
        
           |  |  | 82 |             value="{{ search }}"
 | 
        
           |  |  | 83 |             >
 | 
        
           |  |  | 84 |             <button type="submit" class="search-input-btn">
 | 
        
           |  |  | 85 |                 <svg width="22" height="22" fill="none" viewBox="0 0 24 24">
 | 
        
           |  |  | 86 |                     <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.75 6.75L19.25 12L13.75 17.25"></path>
 | 
        
           |  |  | 87 |                     <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 12H4.75"></path>
 | 
        
           |  |  | 88 |                 </svg>
 | 
        
           |  |  | 89 |                 <span class="sr-only">{{ searchstring }}</span>
 | 
        
           |  |  | 90 |             </button>
 | 
        
           |  |  | 91 |         </div>
 | 
        
           |  |  | 92 |     </form>
 | 
        
           |  |  | 93 | </div>
 | 
        
           |  |  | 94 | <ul data-enhance="linktree" style="display: none;" class="mt-1 mx-0 p-3 competency-tree">
 | 
        
           |  |  | 95 |     <li><span>{{{framework.shortname}}}</span>
 | 
        
           |  |  | 96 |         <ul class="pl-2">
 | 
        
           |  |  | 97 |             {{#competencies}}
 | 
        
           |  |  | 98 |                 {{> tool_lp/competencies_tree }}
 | 
        
           |  |  | 99 |             {{/competencies}}
 | 
        
           |  |  | 100 |         </ul>
 | 
        
           |  |  | 101 |     </li>
 | 
        
           |  |  | 102 | </ul>
 | 
        
           |  |  | 103 | <div data-region="link-buttons" class="row px-3">
 | 
        
           |  |  | 104 |     <input type="button" class="col btn btn-secondary" data-action="cancel" value="{{#str}}cancel{{/str}}"/>
 | 
        
           |  |  | 105 |     <input type="button" class="col btn btn-primary" data-action="add" value="{{#str}}add{{/str}}"/>
 | 
        
           |  |  | 106 | </div>
 | 
        
           |  |  | 107 | <div class="clearfix"></div>
 | 
        
           |  |  | 108 | </div>
 |