Merge branch 'MDL-68355-master' of git://github.com/junpataleta/moodle
[moodle.git] / grade / grading / form / guide / templates / grades / grader / gradingpanel.mustache
CommitLineData
9c2c79f5
MM
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 gradingform_rubric/grades/grader/gradingpanel
19
20 Classes required for JS:
21 * none
22
23 Data attributes required for JS:
24 * none
25
26 Context variables required for this template:
27 * instanceid: Instance of the module this grading form belongs too
28 * criterion: A gradeable item in the Marking Guide
29 * name: Name of the gradeable item
30 * id: ID of the gradeable item
31 * description: Description shown to students for this gradeable item
32 * descriptionmarkers: Description shown to teachers for this gradeable item
33 * maxscore: Max allowable assinable points for this item
34 * score: Current score assigned to the learner for this item
35 * remark: Text input for the teacher to relay to the student
36 * hascomments: Flag for frequently used comments
37 * comments: Array of frequently used comments
38 * description: Description of a frequently used comment
39
40 Example context (json):
41 {
42 "instanceid": "42",
43 "criterion": [
44 {
45 "name": "Motivation",
46 "id": 13,
47 "description": "Show your motivation to rock climbing",
48 "descriptionmarkers": "Does the student show interest in climbing?",
49 "maxscore": 37,
50 "score": 20,
51 "remark": "That's great!",
52 "hascomments": true,
53 "comments": [
54 {"description": "Great work!"},
55 {"description": "You should really try it before jumping to conclusions"}
56 ]
57 }
58 ]
59 }
60}}
38f3bd93
AN
61<form id="gradingform_guide-{{uniqid}}">
62 <input type="hidden" name="instanceid" value="{{instanceid}}">
63 {{#criterion}}
bf7018b6
RW
64 <div class="mb-3 criterion" data-gradingform-guide-role="criterion">
65 <div class="d-flex align-items-center">
66 <h5 class="description font-weight-bold mb-0">{{name}}</h5>
67 <button
68 class="btn btn-link px-1"
69 aria-controls="gradingform_guide-{{uniqid}}-criteria-{{id}}-description"
70 aria-expanded="false"
71 data-target="#gradingform_guide-{{uniqid}}-criteria-{{id}}-description"
72 data-toggle="collapse"
73 type="button"
38f3bd93
AN
74 >
75 {{# pix }} info, gradingform_guide {{/ pix }}
3c282462 76 <span class="sr-only">{{#str}}informationforcriterion, gradingform_guide, {{name}}{{/str}}</span>
bf7018b6
RW
77 </button>
78 <button class="criterion-toggle btn btn-icon icon-no-margin text-reset p-0 font-weight-bold mb-0 ml-auto"
79 type="button"
80 data-toggle="collapse"
81 data-target="#criteria-{{id}}"
82 aria-expanded="true"
83 aria-controls="criteria-{{id}}">
84 <span class="collapsed-icon">
85 {{#pix}} t/collapsed, core {{/pix}}
86 <span class="sr-only">{{#str}} expandcriterion, core_grades {{/str}}</span>
87 </span>
88 <span class="expanded-icon">
89 {{#pix}} t/expanded, core {{/pix}}
90 <span class="sr-only">{{#str}} collapsecriterion, core_grades {{/str}}</span>
91 </span>
92 </button>
93 </div>
38f3bd93
AN
94 <div class="collapse" id="gradingform_guide-{{uniqid}}-criteria-{{id}}-description">
95 <div class="border p-3 mb-3 bg-white rounded">
96 {{{description}}}
97 {{#descriptionmarkers}}
98 <hr>
99 {{{descriptionmarkers}}}
100 {{/descriptionmarkers}}
101 </div>
102 </div>
bf7018b6
RW
103 <div class="collapse show" id="criteria-{{id}}">
104 <div class="form-group">
105 <label for="gradingform_guide-{{uniqid}}-criteria-{{id}}-score">{{#str}}outof, gradingform_guide, {{maxscore}}{{/str}}</label>
106 <input class="form-control" type="number" name="advancedgrading[criteria][{{id}}][score]" value="{{score}}"
3c282462
JP
107 id="gradingform_guide-{{uniqid}}-criteria-{{id}}-score"
108 aria-describedby="gradingform_guide-{{uniqid}}-help-{{id}}-score"
109 min="0" max="{{maxscore}}"
110 aria-label="{{#str}}scoreforcriterion, gradingform_guide, {{name}}{{/str}}">
111 <span id="gradingform_guide-{{uniqid}}-help-{{id}}-score" aria-hidden="true" class="sr-only">{{!
112 }}{{#str}}score_help, gradingform_guide, { "criterion": {{# quote }}{{ name }}{{/ quote }}, "maxscore": {{# quote }}{{ maxscore }}{{/ quote }} }{{/str}}
113 </span>
38f3bd93 114 </div>
bf7018b6 115 <div class="form-group ">
3c282462 116 <label for="gradingform_guide-{{uniqid}}-criteria-{{id}}-remark">{{#str}}additionalcomments, gradingform_guide{{/str}}</label>
bf7018b6
RW
117 <div class="input-group mb-3 form-inset form-inset-right">
118 <textarea class="form-control" type="text" name="advancedgrading[criteria][{{id}}][remark]"
119 id="gradingform_guide-{{uniqid}}-criteria-{{id}}-remark"
120 aria-describedby="gradingform_guide-{{uniqid}}-help-{{id}}-remark"
3c282462 121 aria-label="{{#str}}additionalcommentsforcriterion, gradingform_guide, {{name}}{{/str}}"
bf7018b6
RW
122 data-gradingform-guide-role="remark"
123 rows="2"
124 data-max-rows="5"
125 data-auto-rows
126 >{{remark}}</textarea>
127 {{#hascomments}}
128 <button
129 class="btn btn-icon form-inset-item icon-no-margin p-0 mt-1 mr-1 text-reset collapsed"
130 aria-controls="gradingform_guide-{{uniqid}}-criteria-{{id}}-remark-frequent-comments"
131 aria-expanded="false"
132 data-toggle="collapse"
133 data-target="#gradingform_guide-{{uniqid}}-criteria-{{id}}-remark-frequent-comments"
134 type="button"
135 >
136 {{#pix}}plus, gradingform_guide{{/pix}}
3c282462 137 <span class="sr-only">{{#str}}commentpickerforcriterion, gradingform_guide, {{name}}{{/str}}</span>
bf7018b6
RW
138 </button>
139 {{/hascomments}}
140 </div>
141 {{#hascomments}}
142 <div class="collapse" id="gradingform_guide-{{uniqid}}-criteria-{{id}}-remark-frequent-comments">
143 <div data-gradingform_guide-frequent-comments="gradingform_guide-{{uniqid}}-criteria-{{id}}-remark">
144 <h6>{{#str}}comments, gradingform_guide{{/str}}</h6>
145 <div class="list-group">
146 {{#comments}}
147 <button type="button" class="list-group-item list-group-item-action" data-gradingform_guide-role="frequent-comment">{{description}}</button>
148 {{/comments}}
149 </div>
38f3bd93
AN
150 </div>
151 </div>
bf7018b6 152 {{/hascomments}}
3c282462 153 <span id="gradingform_guide-{{uniqid}}-help-{{id}}-remark" aria-hidden="true" class="sr-only">{{#str}}remark_help, gradingform_guide{{/str}}</span>
bf7018b6 154 </div>
38f3bd93
AN
155 </div>
156 </div>
157 {{/criterion}}
158</form>
159{{#js}}
bf7018b6 160require(['gradingform_guide/grades/grader/gradingpanel/comments', 'core/auto_rows'], function(Comments, AutoRows) {
38f3bd93 161 Comments.init('gradingform_guide-{{uniqid}}');
bf7018b6 162 AutoRows.init(document.getElementById('gradingform_guide-{{uniqid}}'));
38f3bd93
AN
163});
164{{/js}}