Gitlab CSE Unil

tool_form.mustache 18 KB
Newer Older
M. Chardon's avatar
M. Chardon committed
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
{{!
    This file is part of Moodle - http://moodle.org/

    Moodle is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    Moodle is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
}}
M. Chardon's avatar
M. Chardon committed
17
18
{{!
    @template assignfeedback_editpdfplus/tool_form
M. Chardon's avatar
M. Chardon committed
19
20
21
22
23
24
25
26
27
28
29
30

    Admin template to manage a tool.

    Context variables required for this template:
    * courseid - Course id
    * tool - current tool object to edit
    * formid - id of moodleform
    * actionurl - moodle service url to send form
    * sesskey - session key to validate form
    * map01 - picture for previsualisation for type 1
    * map02 - picture for previsualisation for type 2
    * map03 - picture for previsualisation for type 3
M. Chardon's avatar
M. Chardon committed
31
32
}}

M. Chardon's avatar
M. Chardon committed
33
<div id="toolworkspace">
M. Chardon's avatar
M. Chardon committed
34
    {{^tool.id}}<h4>{{# str }} adminaddtool, assignfeedback_editpdfplus {{/ str }}</h4>{{/tool.id}}
M. Chardon's avatar
M. Chardon committed
35
    <table>
M. Chardon's avatar
M. Chardon committed
36
        <tr>
M. Chardon's avatar
M. Chardon committed
37
38
            <td>
                {{#tool.id}}<div id="editpdlplus_tool_label" class="btn alert-info">{{tool.label}}</div>{{/tool.id}}
M. Chardon's avatar
M. Chardon committed
39
40
41
42
43
44
45
46
47
48
49
50
            </td>
            <td style="text-align: right;padding-left: 20px;">
                {{# str }} admintoolboxaction, assignfeedback_editpdfplus {{/ str }}{{#tool.id}}s{{/tool.id}} :
                <div class="btn-group">
                    <button type="button" class="btn btn-default" id="toolFormSubmit"><i class="fa fa-{{#tool.id}}save{{/tool.id}}{{^tool.id}}save{{/tool.id}}" aria-hidden="true"></i></button>
                    {{#tool.id}}
                    <button type="button" class="btn btn-default" id="toolClone"><i class="fa fa-clone" aria-hidden="true"></i></button>
                    <button type="button" class="btn btn-default" id="toolEnabled"><i class="fa fa-eye{{^tool.enabled}}-slash{{/tool.enabled}}" aria-hidden="true"></i></button>
                    <button type="button" class="btn btn-default {{^tool.removable}}disabled{{/tool.removable}}" id="toolRemove"><i class="fa fa-remove" aria-hidden="true"></i></button>
                    {{/tool.id}}
                </div>
            </td>
M. Chardon's avatar
M. Chardon committed
51
            <td class='assignfeedback_editpdfplus_widget_admin_tool_col2'>
M. Chardon's avatar
M. Chardon committed
52
53
54
55
56
57
                {{#tool.id}}
                <button type="button" class="btn btn-default" id="toolRefesh"><i class="fa fa-refresh" aria-hidden="true"></i></button>
                {{/tool.id}}
            </td>
        </tr>
        <tr>
M. Chardon's avatar
M. Chardon committed
58
            <td class='assignfeedback_editpdfplus_widget_admin_tool_col1 assignfeedback_editpdfplus_widget_admin_tool_row' colspan="2">
M. Chardon's avatar
M. Chardon committed
59
                <form id="{{formid}}" method="post" action="{{actionurl}}" class="form-horizontal">
M. Chardon's avatar
M. Chardon committed
60
61
62
63
64
65
66
67
68
                    <div id="accordion">
                        <div class="card">
                            <div class="card-header" id="headingOne">
                                <h5 class="mb-0">
                                    <i class="fa fa-wrench" aria-hidden="true"></i>&nbsp;&nbsp;
                                    <button class="btn btn-link" data-toggle="collapse" data-target="#collapse1" aria-expanded="true" aria-controls="collapse1">
                                      {{# str }} admintoolboxtypetool, assignfeedback_editpdfplus {{/ str }}
                                    </button>
                                </h5>
M. Chardon's avatar
M. Chardon committed
69
                            </div>
M. Chardon's avatar
M. Chardon committed
70
71
                            <div id="collapse1" class="collapse" aria-labelledby="headingOne" data-parent="#accordion">
                                <div class="card-body">
M. Chardon's avatar
M. Chardon committed
72
                                    <table>
M. Chardon's avatar
M. Chardon committed
73
74
                                        <tr>
                                            <td style="width: 25%;">
M. Chardon's avatar
M. Chardon committed
75
76
77
                                                <label class="control-label" for="typetool">
                                                    {{# str }} admintoolboxtypetool_type, assignfeedback_editpdfplus {{/ str }}
                                                </label>
M. Chardon's avatar
M. Chardon committed
78
79
80
81
82
83
84
85
86
87
                                            </td>
                                            <td>
                                                <select class="form-control" id="typetool" name="typetool">
                                                    {{# tools }}
                                                    <option value='{{id}}'>{{libelle}}</option>
                                                    {{/ tools }}
                                                </select>
                                            </td>
                                        </tr>
                                    </table>
M. Chardon's avatar
M. Chardon committed
88
                                </div>
M. Chardon's avatar
M. Chardon committed
89
90
91
                            </div>
                        </div>

M. Chardon's avatar
M. Chardon committed
92
93
94
95
96
97
98
99
                        <div class="card">
                            <div class="card-header" id="headingTwo">
                                <h5 class="mb-0">
                                    <i class="fa fa-bars" aria-hidden="true"></i>&nbsp;&nbsp;
                                    <button class="btn btn-link" data-toggle="collapse" data-target="#collapse2" aria-expanded="true" aria-controls="collapse2">
                                      {{# str }} admintoolboxtoolbardisplay, assignfeedback_editpdfplus {{/ str }}
                                    </button>
                                </h5>
M. Chardon's avatar
M. Chardon committed
100
                            </div>
M. Chardon's avatar
M. Chardon committed
101
102
                            <div id="collapse2" class="collapse" aria-labelledby="headingTwo" data-parent="#accordion">
                                <div class="card-body">
M. Chardon's avatar
M. Chardon committed
103
                                    <table>
104
105
106
107
108
109
110
111
112
113
114
115
                                        <tr>
                                            <td style="width: 25%;">
                                                <label class="control-label" for="toolaxis">{{# str }} admintoolboxtoolbardisplay_axis, assignfeedback_editpdfplus {{/ str }}</label>
                                            </td>
                                            <td>
                                                <select class="form-control" id="toolaxis" name="toolaxis">
                                                    {{# axis }}
                                                    <option value='{{id}}'>{{label}}</option>
                                                    {{/ axis }}
                                                </select>
                                            </td>
                                        </tr>
M. Chardon's avatar
M. Chardon committed
116
117
                                        <tr>
                                            <td style="width: 25%;">
M. Chardon's avatar
M. Chardon committed
118
119
120
                                                <label class="control-label" for="button">
                                                    {{# str }} admintoolboxtoolbardisplay_button, assignfeedback_editpdfplus {{/ str }}
                                                </label>
M. Chardon's avatar
M. Chardon committed
121
122
123
124
125
126
127
                                            </td>
                                            <td>
                                                <input type="text" class="form-control" id="button" value="{{tool.label}}" name="button" />
                                            </td>
                                        </tr>
                                        <tr>
                                            <td style="width: 25%;">
M. Chardon's avatar
M. Chardon committed
128
                                                <label class="control-label" for="order">{{# str }} admintoolboxtoolbardisplay_order, assignfeedback_editpdfplus {{/ str }}</label>
M. Chardon's avatar
M. Chardon committed
129
130
131
132
133
134
135
136
                                            </td>
                                            <td>
                                                <input type="number" class="form-control" id="order" value="{{tool.order_tool}}" name="order" />
                                            </td>
                                        </tr>
                                    </table>
                                </div>
                            </div>
M. Chardon's avatar
M. Chardon committed
137
                        </div>
M. Chardon's avatar
M. Chardon committed
138

M. Chardon's avatar
M. Chardon committed
139
140
141
142
143
144
145
146
                        <div class="card">
                            <div class="card-header" id="headingThree">
                                <h5 class="mb-0">
                                    <i class="fa fa-address-card-o" aria-hidden="true"></i>&nbsp;&nbsp;
                                    <button class="btn btn-link" data-toggle="collapse" data-target="#collapse3" aria-expanded="true" aria-controls="collapse3">
                                      {{# str }} admintoolboxcartridge, assignfeedback_editpdfplus {{/ str }}
                                    </button>
                                </h5>
M. Chardon's avatar
M. Chardon committed
147
                            </div>
M. Chardon's avatar
M. Chardon committed
148
149
                            <div id="collapse3" class="collapse" aria-labelledby="headingThree" data-parent="#accordion">
                                <div class="card-body">
M. Chardon's avatar
M. Chardon committed
150
                                    <table>
M. Chardon's avatar
M. Chardon committed
151
152
                                        <tr>
                                            <td style="width: 25%;">
M. Chardon's avatar
M. Chardon committed
153
                                                <label class="control-label " for="libelle">{{# str }} admintoolboxcartridge_label, assignfeedback_editpdfplus {{/ str }}</label>
M. Chardon's avatar
M. Chardon committed
154
155
                                            </td>
                                            <td>
M. Chardon's avatar
M. Chardon committed
156
                                                <input type="text" class="form-control" id="libelle" value="{{tool.cartridge}}" name="libelle" maxlength="10" />
M. Chardon's avatar
M. Chardon committed
157
158
159
160
                                            </td>
                                        </tr>
                                        <tr>
                                            <td style="width: 25%;">
M. Chardon's avatar
M. Chardon committed
161
                                                <label class="control-label " for="cartridgecolor">{{# str }} admintoolboxcartridge_color, assignfeedback_editpdfplus {{/ str }}</label>
M. Chardon's avatar
M. Chardon committed
162
163
164
165
166
167
168
169
                                            </td>
                                            <td>
                                                <input type="color" class="form-control" id="cartridgecolor" placeholder="{{^tool.cartridge_color}}-{{/tool.cartridge_color}}"
                                                       value="{{#tool.cartridge_color}}{{tool.cartridge_color}}{{/tool.cartridge_color}}" name="catridgecolor" />
                                                <input type="hidden" id="realcartridgecolor" value="{{#tool.cartridge_color}}{{tool.cartridge_color}}{{/tool.cartridge_color}}" />
                                            </td>
                                        </tr>
                                    </table>
M. Chardon's avatar
M. Chardon committed
170
                                </div>
M. Chardon's avatar
M. Chardon committed
171
172
173
                            </div>
                        </div>

M. Chardon's avatar
M. Chardon committed
174
175
176
177
178
179
180
181
                        <div class="card">
                            <div class="card-header" id="headingFour">
                                <h5 class="mb-0">
                                    <i class="fa fa-pencil-square-o" aria-hidden="true"></i>&nbsp;&nbsp;
                                    <button class="btn btn-link" data-toggle="collapse" data-target="#collapse4" aria-expanded="true" aria-controls="collapse4">
                                      {{# str }} admintoolboxannotation, assignfeedback_editpdfplus {{/ str }}
                                    </button>
                                </h5>
M. Chardon's avatar
M. Chardon committed
182
                            </div>
M. Chardon's avatar
M. Chardon committed
183
184
                            <div id="collapse4" class="collapse" aria-labelledby="headingFour" data-parent="#accordion">
                                <div class="card-body" style="overflow: auto;">
M. Chardon's avatar
M. Chardon committed
185
                                    <table>
M. Chardon's avatar
M. Chardon committed
186
187
                                        <tr>
                                            <td style="width: 25%;">
M. Chardon's avatar
M. Chardon committed
188
                                                <label class="control-label" for="color">{{# str }} admintoolboxannotation_color, assignfeedback_editpdfplus {{/ str }}</label>
M. Chardon's avatar
M. Chardon committed
189
190
191
192
193
194
195
196
197
                                            </td>
                                            <td>
                                                <input type="color" class="form-control" id="color" placeholder="{{^tool.colors}}-{{/tool.colors}}"
                                                       value="{{#tool.colors}}{{tool.colors}}{{/tool.colors}}" name="color" />
                                                <input type="hidden" id="realcolor" value="{{#tool.colors}}{{tool.colors}}{{/tool.colors}}" />
                                            </td>
                                        </tr>
                                        <tr>
                                            <td style="width: 25%;">
M. Chardon's avatar
M. Chardon committed
198
                                                <label class="control-label" for="texts">{{# str }} admintoolboxannotation_texts, assignfeedback_editpdfplus {{/ str }}</label>
M. Chardon's avatar
M. Chardon committed
199
200
201
202
203
204
205
206
207
208
209
210
211
212
                                            </td>
                                            <td>
                                                <input type="hidden" class="form-control" id="texts" value="{{tool.texts}}" name="texts" />
                                                <ul class="textform"
                                                    data-prototype="<input  type='text' class='form-control' value='' name='text[__name__]' style='width:90%;display:inline-block;' />" 
                                                    style="list-style-type:none;padding:0px;margin-left: 0px;">
                                                    {{#tool.textsarray}}
                                                    <li><input  type='text' class='form-control' value='{{text}}' name='text[{{index}}]' style='width:90%;display:inline-block;' /></li>
                                                    {{/tool.textsarray}}
                                                </ul>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td style="width: 25%;">
M. Chardon's avatar
M. Chardon committed
213
                                                <label class="control-label" for="reply">{{# str }} admintoolboxannotation_reply, assignfeedback_editpdfplus {{/ str }}</label>
M. Chardon's avatar
M. Chardon committed
214
215
216
217
218
219
                                            </td>
                                            <td>
                                                <input type="checkbox" id="reply" {{#tool.reply}}checked {{/tool.reply}}name="reply" />
                                            </td>
                                        </tr>
                                    </table>
M. Chardon's avatar
M. Chardon committed
220
                                </div>
M. Chardon's avatar
M. Chardon committed
221
222
223
224
                            </div>
                        </div>
                    </div>

M. Chardon's avatar
M. Chardon committed
225
226
                    <div style='display:none;'>
                        <input type="hidden" name="toolid" value="{{tool.id}}" />
227
                        <input type="hidden" name="axisid" id="axisid" value="{{tool.axis}}" />
M. Chardon's avatar
M. Chardon committed
228
229
230
231
232
233
234
                        <input type="hidden" name="courseid" value="{{courseid}}" />
                        <input type="hidden" name="sesskey" value="{{sesskey}}" />
                        <input type="hidden" name="enabled" id="toolenabled" value="{{tool.enabled}}" />
                    </div>

                </form>
            </td>
M. Chardon's avatar
M. Chardon committed
235
            <td class='assignfeedback_editpdfplus_widget_admin_tool_col2 assignfeedback_editpdfplus_widget_admin_tool_row'>
M. Chardon's avatar
M. Chardon committed
236
237
238
239
                <input id='map01' type='hidden' value='{{map01}}' />
                <input id='map02' type='hidden' value='{{map02}}' />
                <input id='map03' type='hidden' value='{{map03}}' />
                <!--{{# pix }} cross, assignfeedback_editpdfplus, previsu {{/ pix }}-->
M. Chardon's avatar
M. Chardon committed
240
                <div id="canevas" style="background-image: url('{{map01}}');" class="drawingcanvas"></div>
M. Chardon's avatar
M. Chardon committed
241
242
243
            </td>
        </tr>
    </table>
M. Chardon's avatar
M. Chardon committed
244
245
246
247
248
</div>

{{# js }}
require(['jquery','core/ajax','core/notification'], function($,ajax,notification) {

M. Chardon's avatar
M. Chardon committed
249
{{#tool.id}}$("#typetool").val({{tool.type}});{{/tool.id}}
250
{{#tool.id}}$("#toolaxis").val({{tool.axis}});{{/tool.id}}
M. Chardon's avatar
M. Chardon committed
251

252
253
254
255
256
257
var $collectionHolder;

// setup an "add a tag" link
var $addTagLink = $('<a href="#" class="add_text_link"><i class="fa fa-plus"></i></a>');
var $newLinkLi = $('<li></li>').append($addTagLink);

M. Chardon's avatar
M. Chardon committed
258
$(document).ready(function() {
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
// Get the ul that holds the collection of tags
$collectionHolder = $('ul.textform');

// add a delete link to all of the existing tag form li elements
$collectionHolder.find('li').each(function() {
addTagFormDeleteLink($(this));
});

// add the "add a tag" anchor and li to the tags ul
$collectionHolder.append($newLinkLi);

// count the current form inputs we have (e.g. 2), use that as the new
// index when inserting a new item (e.g. 2)
$collectionHolder.data('index', $collectionHolder.find(':input').length);

$addTagLink.on('click', function(e) {
// prevent the link from creating a "#" on the URL
e.preventDefault();

// add a new tag form (see next code block)
addTagForm($collectionHolder, $newLinkLi);
});
});
function addTagForm($collectionHolder, $newLinkLi) {
// Get the data-prototype explained earlier
var prototype = $collectionHolder.data('prototype');

// get the new index
var index = $collectionHolder.data('index');

// Replace '__name__' in the prototype's HTML to
// instead be a number based on how many items we have
var newForm = prototype.replace(/__name__/g, index);

// increase the index with one for the next item
$collectionHolder.data('index', index + 1);

// Display the form in the page in an li, before the "Add a tag" link li
var $newFormLi = $('<li></li>').append(newForm);
$newLinkLi.before($newFormLi);

// add a delete link to the new form
addTagFormDeleteLink($newFormLi);
}

function addTagFormDeleteLink($tagFormLi) {
var $removeFormA = $('<a href="#"><i class="fa fa-remove"></i></a>');
$tagFormLi.append($removeFormA);

$removeFormA.on('click', function(e) {
// prevent the link from creating a "#" on the URL
e.preventDefault();

// remove the li for the tag form
$tagFormLi.remove();
});
}

M. Chardon's avatar
M. Chardon committed
317
318
});
{{/ js }}