MDL-69111 mod_forum: forum grading on small viewports
[moodle.git] / mod / forum / templates / local / grades / local / grader / grading.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/local/grades/local/grader/grading
20     Classes required for JS:
21     * none
23     Data attributes required for JS:
24     * data-region="user_picker"
25     * data-region="grade"
26     * data-region="grade-errors"
28     Context variables required for this template:
29     * none
31     Example context (json):
32     {
33     }
34 }}
35 {{<core/drawer}}
36     {{$drawerid}}grading-drawer-{{uniqid}}{{/drawerid}}
37     {{$drawerclasses}}grader-grading-panel flex-shrink-0{{/drawerclasses}}
38     {{$drawercontent}}
39         <div class="h-100 w-100 bg-white d-flex flex-column" role="region" aria-label="{{#str}} forumgradingpanel, mod_forum {{/str}}">
40             <div class="flex-shrink-0 d-flex flex-column">
41                 <div class="header-container bg-light">
42                     <div class="info-container d-flex align-items-center" data-region="grading-info-container">
43                         <button
44                             class="btn btn-icon icon-size-3 icon-no-margin colour-inherit"
45                             data-action="collapse-grading-drawer"
46                             aria-controls="grading-drawer-{{uniqid}}"
47                             aria-expanded="true"
48                             title="{{#str}} closebuttontitle, core {{/str}}"
49                             aria-label="{{#str}} hidegraderpanel, mod_forum {{/str}}"
50                         >
51                             <span class="dir-ltr-hide">{{#pix}} t/left, core {{/pix}}</span>
52                             <span class="dir-rtl-hide">{{#pix}} t/right, core {{/pix}}</span>
53                         </button>
54                         <div class="ml-auto mr-auto text-center" data-region="status-container">
55                             {{> mod_forum/local/grades/local/grader/status_placeholder }}
56                         </div>
57                     </div>
58                     <div
59                         id="searchbox-{{uniqid}}"
60                         class="user-search-container d-flex flex-grow-1 align-items-center collapsed"
61                         data-region="user-search-container"
62                     >
63                         <div class="search-input-container w-100">
64                             <span class="search-icon icon-no-margin d-flex align-items-center justify-content-center">
65                                 {{#pix}} i/search, core {{/pix}}
66                             </span>
67                             <input
68                                 type="text"
69                                 data-region="user-search-input"
70                                 class="form-control form-control-lg"
71                                 placeholder="{{#str}} searchusers, mod_forum {{/str}}"
72                                 aria-labelledby="user-search-input-{{uniqid}}-label"
73                             >
74                             <span id="user-search-input-{{uniqid}}-label" class="sr-only">{{#str}}searchusers, mod_forum{{/str}}</span>
75                             <button
76                                 class="toggle-search-button btn btn-icon icon-no-margin"
77                                 aria-expanded="false"
78                                 aria-controls="searchbox-{{uniqid}}"
79                                 data-action="toggle-search"
80                             >
81                                 <div class="expanded-icon" data-region="user-search-icon-hide">
82                                     <span>{{#pix}} e/cancel, core, {{#str}} hideusersearch, mod_forum {{/str}} {{/pix}}</span>
83                                 </div>
84                                 <div class="collapsed-icon" data-region="user-search-icon-show">
85                                     <span>{{#pix}} i/search, core, {{#str}} showusersearch, mod_forum {{/str}} {{/pix}}</span>
86                                 </div>
87                             </button>
88                         </div>
89                     </div>
90                 </div>
91                 <div class="border-bottom px-3 pt-2" data-region="user_picker">
92                     {{> mod_forum/local/grades/local/grader/user_picker_placeholder }}
93                 </div>
94             </div>
95             <div class="body-container position-relative d-flex flex-column" data-region="body-container">
96                 <div class="grader-grading-panel-display pt-3" data-region="grading-panel-container">
97                     <h4 class="mb-0 h5 px-3 font-weight-normal">
98                         {{#pix}} i/grading, core {{/pix}}{{#str}} gradingmodulename, core_grades, {{moduleName}} {{/str}}
99                     </h4>
100                     <div data-region="grade" class="pt-3 px-3">
101                         {{> mod_forum/local/grades/local/grader/grade_placeholder }}
102                     </div>
103                     <h4 id="send-student-notifications-setting" class="mb-0 h5 px-3 font-weight-normal">
104                         {{#pix}} i/gradingnotifications, core {{/pix}}{{#str}}notifications, core{{/str}}
105                     </h4>
106                     <div data-region="notification" class="pt-3 px-3" role="radiogroup" aria-labelledby="send-student-notifications-setting">
107                         <label class="form-check">
108                             <input class="form-check-input" type="radio" name="sendstudentnotifications" value="1"{{#defaultsendnotifications}} checked{{/defaultsendnotifications}}/>
109                             {{#str}}sendstudentnotificationsyes, mod_forum{{/str}}
110                         </label>
111                         <label class="form-check">
112                             <input class="form-check-input" type="radio" name="sendstudentnotifications" value="0"{{^defaultsendnotifications}} checked{{/defaultsendnotifications}}/>
113                             {{#str}}sendstudentnotificationsno, mod_forum{{/str}}
114                         </label>
115                         {{#helpicon}}
116                             {{>core/help_icon}}
117                         {{/helpicon}}
118                     </div>
119                     <div data-region="grade-errors" role="alert" aria-live="assertive"></div>
120                 </div>
121             </div>
122             <div class="hidden overflow-auto" data-region="search-results-container"></div>
123         </div>
124         <div data-region="grade-errors" role="alert" aria-live="assertive"></div>
125         <hr/>
126     {{/drawercontent}}
127 {{/core/drawer}}