Merge branch 'MDL-66034-master' of git://github.com/lameze/moodle
[moodle.git] / mod / forum / templates / discussion_list.mustache
1 {{!
2     This file is part of Moodle - http://moodle.org/
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.
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.
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 mod_forum/discussion_list
20     Template to display the list of forum discussions.
22     Classes required for JS:
23     * none
25     Data attributes required for JS:
26     * none
28     Context variables required for this template:
29     * TODO
31     Example context (json):
32     {
33     }
34 }}
35 <div id="discussion-list-{{uniqid}}">
36     {{{groupchangemenu}}}
38     {{#notifications}}
39         {{> core/notification}}
40     {{/notifications}}
42     {{#forum.capabilities.create}}
43         <div class="p-t-1 p-b-1">
44             <a class="btn btn-primary" data-toggle="collapse" href="#collapseAddForm">
45                 {{$discussion_create_text}}
46                     {{#str}}addanewdiscussion, forum{{/str}}
47                 {{/discussion_create_text}}
48             </a>
49             <div class="collapse m-t-1" id="collapseAddForm">
50                 {{{newdiscussionhtml}}}
51             </div>
52         </div>
53     {{/forum.capabilities.create}}
54     {{^forum.capabilities.create}}
55         {{#forum.capabilities.selfenrol}}
56             <div class="p-t-1 p-b-1">
57                 <a class="btn btn-primary" href="{{forum.urls.create}}">
58                     {{$discussion_create_text}}
59                         {{#str}}addanewdiscussion, forum{{/str}}
60                     {{/discussion_create_text}}
61                 </a>
62             </div>
63         {{/forum.capabilities.selfenrol}}
64     {{/forum.capabilities.create}}
67     {{#state.hasdiscussions}}
68         {{$discussion_top_pagination}}
69             {{{ pagination }}}
70         {{/discussion_top_pagination}}
71         {{$discussion_list_output}}
72             <span id="discussion-table-description-{{uniqid}}" class="sr-only">
73                 {{#str}} showingcountoftotaldiscussions, mod_forum, {"count": "{{visiblediscussioncount}}", "total":"{{totaldiscussioncount}}"} {{/str}}
74             </span>
75             <table
76                 class="table table-hover table-striped discussion-list"
77                 aria-label='{{#str}} showingcountoftotaldiscussions, mod_forum, {"count": "{{visiblediscussioncount}}", "total":"{{totaldiscussioncount}}"} {{/str}}'
78                 aria-describedby="discussion-table-description-{{uniqid}}"
79             >
80                 {{$discussion_list_header}}
81                 <thead>
82                     <tr>
83                         <th scope="col">&nbsp;</th>
84                         <th scope="col" class="p-l-0">{{#str}}discussion, mod_forum{{/str}}</th>
85                         <th scope="col" class="author">{{#str}}startedby, mod_forum{{/str}}</th>
86                         {{#forum.state.groupmode}}
87                             <th scope="col" class="group">{{#str}}group{{/str}}</th>
88                         {{/forum.state.groupmode}}
89                         {{#forum.capabilities.viewdiscussions}}
90                             <th scope="col" class="text-center">
91                                 {{#state.sortorder.isrepliesdesc}}
92                                     <a href="{{{forum.urls.sortrepliesasc}}}" aria-label="{{#str}}discussionlistsortbyrepliesasc, mod_forum{{/str}}">{{#str}}replies, mod_forum{{/str}}</a> <span class="text-primary">{{#pix}}t/downlong, core, {{#str}}desc, core{{/str}}{{/pix}}</span>
93                                 {{/state.sortorder.isrepliesdesc}}
94                                 {{#state.sortorder.isrepliesasc}}
95                                     <a href="{{{forum.urls.sortrepliesdesc}}}" aria-label="{{#str}}discussionlistsortbyrepliesdesc, mod_forum{{/str}}">{{#str}}replies, mod_forum{{/str}}</a> <span class="text-primary">{{#pix}}t/uplong, core, {{#str}}asc, core{{/str}}{{/pix}}</span>
96                                 {{/state.sortorder.isrepliesasc}}
97                                 {{^state.sortorder.isrepliesdesc}}
98                                     {{^state.sortorder.isrepliesasc}}
99                                         <a href="{{{forum.urls.sortrepliesdesc}}}" aria-label="{{#str}}discussionlistsortbyrepliesdesc, mod_forum{{/str}}">{{#str}}replies, mod_forum{{/str}}</a>
100                                     {{/state.sortorder.isrepliesasc}}
101                                 {{/state.sortorder.isrepliesdesc}}
102                             </th>
104                             {{#forum.userstate.tracked}}
105                             <th scope="col" class="text-center">
106                                 {{#str}}unread, mod_forum{{/str}}
107                                 <a href="{{{forum.urls.markasread}}}">{{#pix}}t/markasread, core, {{#str}}markallread, mod_forum{{/str}}{{/pix}}</a>
108                             </th>
109                             {{/forum.userstate.tracked}}
110                         {{/forum.capabilities.viewdiscussions}}
111                         <th scope="col" class="lastpost">
112                             {{#state.sortorder.islastpostdesc}}
113                                 <a href="{{{forum.urls.sortlastpostasc}}}" aria-label="{{#str}}discussionlistsortbylastpostasc, mod_forum{{/str}}">{{#str}}lastpost, mod_forum{{/str}}</a> <span class="text-primary">{{#pix}}t/downlong, core, {{#str}}desc, core{{/str}}{{/pix}}</span>
114                             {{/state.sortorder.islastpostdesc}}
115                             {{#state.sortorder.islastpostasc}}
116                                 <a href="{{{forum.urls.sortlastpostdesc}}}" aria-label="{{#str}}discussionlistsortbylastpostdesc, mod_forum{{/str}}">{{#str}}lastpost, mod_forum{{/str}}</a> <span class="text-primary">{{#pix}}t/uplong, core, {{#str}}asc, core{{/str}}{{/pix}}</span>
117                             {{/state.sortorder.islastpostasc}}
118                             {{^state.sortorder.islastpostdesc}}
119                                 {{^state.sortorder.islastpostasc}}
120                                     <a href="{{{forum.urls.sortlastpostdesc}}}" aria-label="{{#str}}discussionlistsortbylastpostdesc, mod_forum{{/str}}">{{#str}}lastpost, mod_forum{{/str}}</a>
121                                 {{/state.sortorder.islastpostasc}}
122                             {{/state.sortorder.islastpostdesc}}
123                         </th>
124                         <th scope="col" class="created">
125                             {{#state.sortorder.iscreateddesc}}
126                                 <a href="{{{forum.urls.sortcreatedasc}}}" aria-label="{{#str}}discussionlistsortbycreatedasc, mod_forum{{/str}}">{{#str}}created, mod_forum{{/str}}</a> <span class="text-primary">{{#pix}}t/downlong, core, {{#str}}desc, core{{/str}}{{/pix}}</span>
127                             {{/state.sortorder.iscreateddesc}}
128                             {{#state.sortorder.iscreatedasc}}
129                                 <a href="{{{forum.urls.sortcreateddesc}}}" aria-label="{{#str}}discussionlistsortbycreateddesc, mod_forum{{/str}}">{{#str}}created, mod_forum{{/str}}</a> <span class="text-primary">{{#pix}}t/uplong, core, {{#str}}asc, core{{/str}}{{/pix}}</span>
130                             {{/state.sortorder.iscreatedasc}}
131                             {{^state.sortorder.iscreateddesc}}
132                                 {{^state.sortorder.iscreatedasc}}
133                                     <a href="{{{forum.urls.sortcreateddesc}}}" aria-label="{{#str}}discussionlistsortbycreateddesc, mod_forum{{/str}}">{{#str}}created, mod_forum{{/str}}</a>
134                                 {{/state.sortorder.iscreatedasc}}
135                             {{/state.sortorder.iscreateddesc}}
136                         </th>
137                         <th scope="col">&nbsp;</th>
138                         <th scope="col" class="discussionsubscription"></th>
139                     </tr>
140                 </thead>
141                 {{/discussion_list_header}}
142                 {{$discussion_list_body}}
143                 <tbody>
144                     {{#summaries}}
145                         <!-- The discussion class is only required for behat tests to identify the row -->
146                         <tr class="discussion {{#discussion.timed}}{{#istimed}}{{^visible}}dimmed_text{{/visible}}{{/istimed}}{{/discussion.timed}}">
147                             <td scope="col" class="pinned p-0 text-center align-middle">
148                                 {{#discussion.pinned}}
149                                     {{#pix}}i/pinned, mod_forum, {{#str}}discussionpinned, mod_forum{{/str}}{{/pix}}
150                                 {{/discussion.pinned}}
151                                 {{^discussion.pinned}}
152                                     {{#discussion}}
153                                         {{> mod_forum/forum_discussion_favourite_toggle}}
154                                     {{/discussion}}
155                                 {{/discussion.pinned}}
156                             </td>
157                             <td scope="col" class="topic p-0 align-middle">
158                                 <a class="p-3 p-l-0 w-100 h-100 d-block" href="{{discussion.urls.view}}">{{{discussion.name}}}</a>
159                             </td>
160                             <td scope="col" class="author align-middle">
161                                 {{#firstpostauthor}}
162                                     <div class="d-flex flex-row">
163                                         <div class="align-middle p-0">
164                                             <img
165                                                 class="rounded-circle userpicture"
166                                                 src="{{urls.profileimage}}"
167                                                 alt="{{#str}}pictureof, moodle, {{fullname}}{{/str}}"
168                                                 title="{{#str}}pictureof, moodle, {{fullname}}{{/str}}"
169                                             >
170                                         </div>
171                                         <div class="align-middle p-2">
172                                             {{fullname}}
173                                         </div>
174                                     </div>
175                                 {{/firstpostauthor}}
176                             </td>
177                             {{#forum.state.groupmode}}
178                                 <td scope="col" class="group align-middle">
179                                     {{#discussion.group}}
180                                         {{#urls.picture}}
181                                             {{#urls.userlist}}
182                                                 <a href="{{{urls.userlist}}}" role="button" aria-label='{{#str}} memberofgroup, group, {{name}}{{/str}}'>
183                                                     <img alt="{{#str}} pictureof, core, {{name}} {{/str}}"
184                                                          aria-hidden="true"
185                                                          class="border rounded h-auto rounded-circle grouppicture"
186                                                          src="{{{urls.picture}}}"
187                                                          title="{{#str}} pictureof, core, {{name}} {{/str}}">
188                                                 </a>
189                                             {{/urls.userlist}}
190                                             {{^urls.userlist}}
191                                                 <img alt="{{#str}} pictureof, core, {{name}} {{/str}}"
192                                                      class="border rounded h-auto rounded-circle grouppicture"
193                                                      src="{{{urls.picture}}}"
194                                                      title="{{#str}} pictureof, core, {{name}} {{/str}}">
195                                             {{/urls.userlist}}
196                                         {{/urls.picture}}
197                                         {{^urls.picture}}
198                                             {{#urls.userlist}}
199                                                 <a href="{{{urls.userlist}}}" aria-label='{{#str}} memberofgroup, group, {{name}}{{/str}}'>{{name}}</a>
200                                             {{/urls.userlist}}
201                                             {{^urls.userlist}}
202                                                 {{name}}
203                                             {{/urls.userlist}}
204                                         {{/urls.picture}}
205                                     {{/discussion.group}}
206                                 </td>
207                             {{/forum.state.groupmode}}
208                             {{#forum.capabilities.viewdiscussions}}
209                                 <td scope="col" class="p-0 text-center align-middle">
210                                     <a href="{{discussion.urls.view}}" class="p-3 w-100 h-100 d-block">
211                                         {{replies}}
212                                     </a>
213                                 </td>
214                                 {{#forum.userstate.tracked}}
215                                     <td scope="col" class="p-0 text-center align-middle">
216                                         {{#unread}}
217                                             {{! TODO Rewrite as AJAX}}
218                                             <span class="p-1 w-100 h-100 d-block unread">
219                                                 <a href="{{{discussion.urls.viewfirstunread}}}">{{unread}}</a>
220                                                 <a href="{{{discussion.urls.markasread}}}">{{#pix}}t/markasread, core, {{#str}}markalldread, mod_forum{{/str}}{{/pix}}</a>
221                                             </span>
222                                         {{/unread}}
223                                         {{^unread}}
224                                             <span class="p-3 w-100 h-100 d-block">
225                                                 0
226                                             </span>
227                                         {{/unread}}
228                                     </td>
229                                 {{/forum.userstate.tracked}}
230                             {{/forum.capabilities.viewdiscussions}}
231                             <td scope="col" class="text-left">
232                                 {{! TODO Check q&a, eachuser }}
233                                 {{#latestpostid}}
234                                     <div class="d-flex flex-row">
235                                         <div class="align-middle p-0">
236                                             <a href="{{latestpostauthor.urls.profile}}">
237                                                 <img
238                                                     class="rounded-circle userpicture"
239                                                     src="{{latestpostauthor.urls.profileimage}}"
240                                                     alt="{{#str}}pictureof, moodle, {{latestpostauthor.fullname}}{{/str}}"
241                                                     title="{{#str}}pictureof, moodle, {{latestpostauthor.fullname}}{{/str}}"
242                                                 >
243                                             </a>
244                                         </div>
245                                         <div class="p-2 p-t-0 p-b-0 d-inline-flex flex-column">
246                                             <div>
247                                                 <a href="{{latestpostauthor.urls.profile}}">{{latestpostauthor.fullname}}</a>
248                                             </div>
249                                             <div>
250                                                 <a href="{{{discussion.urls.viewlatest}}}">{{#userdate}}
251                                                     {{discussion.times.modified}}, {{#str}}strftimerecentfull{{/str}}
252                                                 {{/userdate}}</a>
253                                             </div>
254                                         </div>
255                                     </div>
256                                 {{/latestpostid}}
257                             </td>
258                             <td scope="col" class="text-left align-middle">
259                                 {{#userdate}}{{discussion.times.created}}, {{#str}}strftimerecentfull{{/str}}{{/userdate}}
260                             </td>
261                             <td scope="col" class="timed p-0 text-center align-middle">
262                                 {{#discussion.timed.istimed}}
263                                 <div class="timedpost">
264                                     {{#pix}}
265                                     i/calendar, moodle,
266                                     {{#discussion.times.start}}
267                                     {{!                                           }}{{#str}} displaystart, mod_forum {{/str}}: {{#userdate}}{{.}}, {{#str}}strftimerecentfull {{/str}}{{/userdate}}
268                                     {{/discussion.times.start}}
269                                     {{#discussion.times.end}}
270                                     {{!                                           }}{{#str}} displayend, mod_forum {{/str}}: {{#userdate}}{{.}}, {{#str}} strftimerecentfull {{/str}}{{/userdate}}
271                                     {{/discussion.times.end}}
272                                     {{#discussion.timed.visible}}
273                                     {{!                                           }}{{#str}} timedvisible, mod_forum {{/str}}
274                                     {{/discussion.timed.visible}}
275                                     {{^discussion.timed.visible}}
276                                     {{!                                           }}{{#str}} timedhidden, mod_forum {{/str}}
277                                     {{/discussion.timed.visible}}
278                                     {{/pix}}
279                                 </div>
280                                 {{/discussion.timed.istimed}}
281                             </td>
282                             <td scope="col" class="p-0 align-middle" data-container="discussion-summary-actions">
283                                 {{#discussion}}
284                                     <div class="d-flex flex-wrap justify-content-end pr-4">
285                                         <div class="pt-1 mt-2  {{^discussion.locked}}hidden{{/discussion.locked}}" data-region="locked-icon">
286                                             <span class="btn" >{{#pix}}i/lock, core, {{#str}}locked, forum{{/str}}{{/pix}}</span>
287                                         </div>
288                                         {{#forum.capabilities.subscribe}}
289                                         <div>
290                                             {{> mod_forum/discussion_subscription_toggle}}
291                                         </div>
292                                         {{/forum.capabilities.subscribe}}
293                                         {{#hasanyactions}}
294                                         <div class="mt-3" data-container='discussion-tools'>
295                                             {{> mod_forum/forum_action_menu}}
296                                         </div>
297                                         {{/hasanyactions}}
298                                     </div>
299                                 {{/discussion}}
300                             </td>
301                         </tr>
302                     {{/summaries}}
303                 </tbody>
304                 {{/discussion_list_body}}
305             </table>
306         {{/discussion_list_output}}
307         {{$discussion_bottom_pagination}}
308             {{{ pagination }}}
309         {{/discussion_bottom_pagination}}
310         {{#can_create_discussion}}
311             <div class="forumaddnew">
312                 <a href="{{create_discussion_link}}" class="btn btn-primary">{{create_discussion_link_text}}</a>
313             </div>
314         {{/can_create_discussion}}
315     {{/state.hasdiscussions}}
316     {{^state.hasdiscussions}}
317         <div class="forumnodiscuss">
318             {{$no_discussions_text}}
319                 ({{#str}}nodiscussions, forum{{/str}})
320             {{/no_discussions_text}}
321         </div>
322     {{/state.hasdiscussions}}
324 </div>
325 {{#js}}
326     require(['jquery', 'mod_forum/discussion_list'], function($, View) {
327         var root = $('#discussion-list-{{uniqid}}');
328         View.init(root);
329     });
330 {{/js}}