MDL-64786 analytics: Make the list of indicators collapsed by default
[moodle.git] / admin / tool / analytics / templates / models_list.mustache
CommitLineData
efaf8534
DM
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{{!
e10b29ed 18 @template tool_analytics/models_list
efaf8534
DM
19
20 Template for models list.
21
22 Classes required for JS:
7bd09a69 23 * The list od models wrapped within a id="predictionmodelslist" element.
efaf8534
DM
24
25 Data attributes required for JS:
7bd09a69
DM
26 * [data-widget="toggle"] indicates the clickable element for expanding/collapsing
27 the list of indicators used by the given model.
efaf8534
DM
28
29 Context variables required for this template:
cfb5603e 30 * models: array - list of models to display
7bd09a69 31 - id: int - model unique identifier
cfb5603e
DM
32 - name: object - data for the inplace editable element template
33 - target: string - name of the target associated with the model
34 - targetclass: string - fully qualified name of the target class
35 - targethelp: object - data for the help tooltip template
36 - enabled: bool - is the model enabled
7bd09a69 37 - indicatorsnum: int - number of indicators
cfb5603e
DM
38 - indicators: array - list of indicators used by the model
39 + name: string - name of the indicator
40 + help: object - data for the help tooltip template
41 - insights: object - data for the single select template
42 - noinsights: string - text to display instead of insights
43 * warnings: array - list of data for notification warning template
44 * infos: array - list of data for notification info template
45 * createmodelurl: string - URL to create a new model
46 * importmodelurl: string - URL to import a model
efaf8534
DM
47
48 Example context (json):
49 {
acb14d08
DM
50 "models": [
51 {
7bd09a69 52 "id": 11,
cfb5603e
DM
53 "name": {
54 "component": "local_analyticsdemo",
55 "itemtype": "modelname",
56 "itemid": 42,
57 "displayvalue": "Prevent devs at risk",
58 "value": ""
59 },
acb14d08 60 "target": "Prevent devs at risk",
cfb5603e
DM
61 "targetclass": "\\local_analyticsdemo\\analytics\\target\\dev_risk",
62 "targethelp": {
63 "title": "Help with Prevent devs at risk",
64 "text": "This target blah blah ...",
65 "url": "http://example.org/help",
66 "linktext": "",
67 "icon": {
68 "extraclasses": "iconhelp",
69 "attributes": [
70 {"name": "src", "value": "../../../pix/help.svg"},
71 {"name": "alt", "value": "Help icon"}
72 ]
2fa1f92a 73 }
cfb5603e 74 },
2fa1f92a 75 "enabled": 1,
7bd09a69 76 "indicatorsnum": 2,
cfb5603e
DM
77 "indicators": [
78 {
79 "name": "Indicator 1",
80 "help": {
81 "text": "This indicator blah blah ...",
82 "title": "Help with Indicator 1",
2fa1f92a
MN
83 "url": "http://example.org/help",
84 "linktext": "",
cfb5603e 85 "icon": {
2fa1f92a
MN
86 "extraclasses": "iconhelp",
87 "attributes": [
88 {"name": "src", "value": "../../../pix/help.svg"},
89 {"name": "alt", "value": "Help icon"}
90 ]
91 }
cfb5603e 92 }
2fa1f92a
MN
93 },
94 {
cfb5603e
DM
95 "name": "Indicator 2",
96 "help": {
97 "text": "This indicator blah blah ...",
98 "title": "Help with Indicator 2",
2fa1f92a
MN
99 "url": "http://example.org/help",
100 "linktext": "",
cfb5603e 101 "icon": {
2fa1f92a
MN
102 "extraclasses": "iconhelp",
103 "attributes": [
104 {"name": "src", "value": "../../../pix/help.svg"},
105 {"name": "alt", "value": "Help icon"}
106 ]
107 }
2fa1f92a
MN
108 }
109 }
110 ],
cfb5603e
DM
111 "timesplitting": "Quarters",
112 "timesplittinghelp": {
113 "text": "This time splitting methof blah blah ...",
114 "title": "Help with Quarters",
115 "url": "http://example.org/help",
116 "linktext": "",
117 "icon": {
118 "extraclasses": "iconhelp",
119 "attributes": [
120 {"name": "src", "value": "../../../pix/help.svg"},
121 {"name": "alt", "value": "Help icon"}
122 ]
123 }
124 },
acb14d08
DM
125 "noinsights": "No insights available yet"
126 }
1cc2b4ba 127 ],
cfb5603e
DM
128 "warnings": [
129 {
130 "message": "Be ware, this is just an example!"
131 }
132 ],
133 "createmodelurl": "#",
134 "importmodelurl": "#"
efaf8534
DM
135 }
136}}
137
138{{#warnings}}
139 {{> core/notification_warning}}
140{{/warnings}}
f19719c1
DM
141{{#infos}}
142 {{> core/notification_info}}
143{{/infos}}
144
efaf8534 145<div class="box">
e4453adc 146 <div class="top-nav d-flex">
29551c4b
MM
147 <a href="{{createmodelurl}}" class="btn btn-secondary mr-2">{{#str}}createmodel, tool_analytics{{/str}}</a>
148 <a href="{{importmodelurl}}" class="btn btn-secondary">{{#str}}importmodel, tool_analytics{{/str}}</a>
e4453adc 149 </div>
7bd09a69 150 <table id="predictionmodelslist" class="generaltable fullwidth">
8816022d 151 <caption>{{#str}}analyticmodels, tool_analytics{{/str}}</caption>
efaf8534
DM
152 <thead>
153 <tr>
066a4d64 154 <th scope="col">{{#str}}modelname, tool_analytics{{/str}}</th>
e10b29ed
DM
155 <th scope="col">{{#str}}enabled, tool_analytics{{/str}}</th>
156 <th scope="col">{{#str}}indicators, tool_analytics{{/str}}</th>
157 <th scope="col">{{#str}}modeltimesplitting, tool_analytics{{/str}}</th>
158 <th scope="col">{{#str}}insights, tool_analytics{{/str}}</th>
efaf8534
DM
159 <th scope="col">{{#str}}actions{{/str}}</th>
160 </tr>
161 </thead>
162 <tbody>
163 {{#models}}
164 <tr>
2fa1f92a 165 <td>
066a4d64
DM
166 {{#name}}
167 <span class="model-name">{{>core/inplace_editable}}</span>
168 {{/name}}
169 <div>
170 <small class="target-class">{{targetclass}}</small>
171 {{#targethelp}}
172 {{>core/help_icon}}
173 {{/targethelp}}
174 </div>
2fa1f92a 175 </td>
efaf8534
DM
176 <td>
177 {{#enabled}}
178 {{#pix}}i/checked, core, {{#str}}yes{{/str}}{{/pix}}
179 {{/enabled}}
180 {{^enabled}}
181 {{#str}}no{{/str}}
182 {{/enabled}}
183 </td>
184 <td>
7bd09a69
DM
185 <a data-widget="toggle"
186 title="{{#str}} clicktohideshow {{/str}}"
187 aria-expanded="false"
188 aria-controls="indicators-{{id}}"
189 role="button"
190 href="">
191 {{#str}} indicatorsnum, tool_analytics, {{indicatorsnum}} {{/str}}
192 </a>
193 <ul class="hidden" id="indicators-{{id}}">
efaf8534 194 {{#indicators}}
2fa1f92a
MN
195 <li>
196 {{name}}
197 {{#help}}
198 {{>core/help_icon}}
199 {{/help}}
200 </li>
efaf8534
DM
201 {{/indicators}}
202 </ul>
203 </td>
204 <td>
2fa1f92a
MN
205 {{#timesplitting}}
206 {{timesplitting}}
207 {{#timesplittinghelp}}
208 {{>core/help_icon}}
209 {{/timesplittinghelp}}
210 {{/timesplitting}}
211 {{^timesplitting}}
212 {{#str}}notdefined, tool_analytics{{/str}}
8d6b7f0c
AA
213 {{#timesplittinghelp}}
214 {{>core/help_icon}}
215 {{/timesplittinghelp}}
2fa1f92a 216 {{/timesplitting}}
efaf8534
DM
217 </td>
218 <td>
f9e7447f
DM
219 {{! models_list renderer is responsible of sending one or the other}}
220 {{#insights}}
efaf8534 221 {{> core/single_select }}
f9e7447f
DM
222 {{/insights}}
223 {{#noinsights}}
224 {{.}}
225 {{/noinsights}}
efaf8534
DM
226 </td>
227 <td>
228 {{#actions}}
229 {{> core/action_menu}}
230 {{/actions}}
231 </td>
232 </tr>
233 {{/models}}
234 </tbody>
235 </table>
236</div>
7bd09a69
DM
237{{#js}}
238require(['jquery'], function($) {
239
240 // Toggle the visibility of the indicators list.
241 $('#predictionmodelslist').on('click', '[data-widget="toggle"]', function(e) {
242 e.preventDefault();
243 var toggle = $(e.currentTarget);
244 var listid = toggle.attr('aria-controls');
245
246 $(document.getElementById(listid)).toggle();
247
248 if (toggle.attr('aria-expanded') == 'false') {
249 toggle.attr('aria-expanded', 'true');
250 } else {
251 toggle.attr('aria-expanded', 'false');
252 }
253 });
254});
255{{/js}}