Gitlab CSE Unil

tool_form.mustache 13 KB
Newer Older
M. Chardon's avatar
M. Chardon committed
1
2
3
4
5
{{!
    @template assignfeedback_editpdfplus/tool_form
}}

<div class="alert" id="message_edit_tool">
M. Chardon's avatar
M. Chardon committed
6

M. Chardon's avatar
M. Chardon committed
7
8
</div>

M. Chardon's avatar
M. Chardon committed
9
10
<div id="toolworkspace">
    <div class='row' style="margin-bottom: 10px;">
11
        {{^tool.id}}<h4>{{# str }} adminaddtool, assignfeedback_editpdfplus {{/ str }}</h4>{{/tool.id}}
12
        <div class='col-sm-3'>
M. Chardon's avatar
M. Chardon committed
13
            {{#tool.id}}<div id="editpdlplus_tool_label" class="btn alert-info" style="cursor: default;">{{tool.label}}</div>{{/tool.id}}
M. Chardon's avatar
M. Chardon committed
14
        </div>
M. Chardon's avatar
M. Chardon committed
15
        <div class='col-sm-offset-1 col-sm-3'>
16
            {{# str }} admintoolboxaction, assignfeedback_editpdfplus {{/ str }}{{#tool.id}}s{{/tool.id}} :
17
            <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>
M. Chardon's avatar
M. Chardon committed
18
19
20
21
22
23
            {{#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>
M. Chardon's avatar
M. Chardon committed
24
25
26
27
28
        <div class='col-sm-2'>
            {{#tool.id}}
            <button type="button" class="btn btn-default" id="toolRefesh"><i class="fa fa-refresh" aria-hidden="true"></i></button>
            {{/tool.id}}
        </div>
M. Chardon's avatar
M. Chardon committed
29
30
    </div>

M. Chardon's avatar
M. Chardon committed
31
32
33
    <div class='row'>
        <div class='col-sm-6'>
            <form id="{{formid}}" method="post" action="{{actionurl}}" class="form-horizontal">
M. Chardon's avatar
M. Chardon committed
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
                <div class="panel-group" id="accordion">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <i class="fa fa-wrench" aria-hidden="true"></i>&nbsp;&nbsp;
                            <a data-toggle="collapse" href="#collapse1" data-parent="#accordion">{{# str }} admintoolboxtypetool, assignfeedback_editpdfplus {{/ str }}</a>
                        </div>
                        <div id="collapse1" class="panel-collapse collapse">
                            <div class="panel-body" style="margin-bottom: 20px;">
                                <div class="form-group">
                                    <label class="control-label col-sm-3" for="typetool">{{# str }} admintoolboxtypetool_type, assignfeedback_editpdfplus {{/ str }}</label>
                                    <div class="col-sm-9">
                                        <select class="form-control" id="typetool" name="typetool">
                                            {{# tools }}
                                            <option value='{{id}}'>{{libelle}}</option>
                                            {{/ tools }}
                                        </select>
                                    </div>
M. Chardon's avatar
M. Chardon committed
51
                                </div>
M. Chardon's avatar
M. Chardon committed
52
53
54
55
                            </div>
                        </div>
                    </div>

M. Chardon's avatar
M. Chardon committed
56
57
58
59
60
61
62
63
64
65
66
67
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <i class="fa fa-bars" aria-hidden="true"></i>&nbsp;&nbsp;
                            <a data-toggle="collapse" href="#collapse2" data-parent="#accordion">{{# str }} admintoolboxtoolbardisplay, assignfeedback_editpdfplus {{/ str }}</a>
                        </div>
                        <div id="collapse2" class="panel-collapse collapse">
                            <div class="panel-body" style="margin-bottom: 50px;">
                                <div class="form-group">
                                    <label class="control-label col-sm-3" for="button">{{# str }} admintoolboxtoolbardisplay_button, assignfeedback_editpdfplus {{/ str }}</label>
                                    <div class="col-sm-9">
                                        <input type="text" class="form-control" id="button" value="{{tool.label}}" name="button" />
                                    </div>
M. Chardon's avatar
M. Chardon committed
68
                                </div>
M. Chardon's avatar
M. Chardon committed
69
70
71
72
73
                                <div class="form-group">
                                    <label class="control-label col-sm-3" for="order">{{# str }} admintoolboxtoolbardisplay_order, assignfeedback_editpdfplus {{/ str }}</label>
                                    <div class="col-sm-9">
                                        <input type="number" class="form-control" id="order" value="{{tool.order_tool}}" name="order" />
                                    </div>
M. Chardon's avatar
M. Chardon committed
74
                                </div>
M. Chardon's avatar
M. Chardon committed
75
76
77
78
                            </div>
                        </div>
                    </div>

M. Chardon's avatar
M. Chardon committed
79
80
81
82
83
84
85
86
87
88
89
90
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <i class="fa fa-address-card-o" aria-hidden="true"></i>&nbsp;&nbsp;
                            <a data-toggle="collapse" href="#collapse3" data-parent="#accordion">{{# str }} admintoolboxcartridge, assignfeedback_editpdfplus {{/ str }}</a>
                        </div>
                        <div id="collapse3" class="panel-collapse collapse">
                            <div class="panel-body" style="margin-bottom: 50px;">
                                <div class="form-group">
                                    <label class="control-label col-sm-3" for="libelle">{{# str }} admintoolboxcartridge_label, assignfeedback_editpdfplus {{/ str }}</label>
                                    <div class="col-sm-9">
                                        <input type="text" class="form-control" id="libelle" value="{{tool.cartridge}}" name="libelle" />
                                    </div>
M. Chardon's avatar
M. Chardon committed
91
                                </div>
M. Chardon's avatar
M. Chardon committed
92
93
94
                                <div class="form-group">
                                    <label class="control-label col-sm-3" for="cartridgecolor">{{# str }} admintoolboxcartridge_color, assignfeedback_editpdfplus {{/ str }}</label>
                                    <div class="col-sm-9">
95
                                        <input type="color" class="form-control" id="cartridgecolor" placeholder="{{^tool.cartridge_color}}-{{/tool.cartridge_color}}"
M. Chardon's avatar
M. Chardon committed
96
                                               value="{{#tool.cartridge_color}}{{tool.cartridge_color}}{{/tool.cartridge_color}}" name="catridgecolor" />
97
                                        <input type="hidden" id="realcartridgecolor" value="{{#tool.cartridge_color}}{{tool.cartridge_color}}{{/tool.cartridge_color}}" />
M. Chardon's avatar
M. Chardon committed
98
                                    </div>
M. Chardon's avatar
M. Chardon committed
99
                                </div>
M. Chardon's avatar
M. Chardon committed
100
101
102
103
                            </div>
                        </div>
                    </div>

M. Chardon's avatar
M. Chardon committed
104
105
106
107
108
109
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <i class="fa fa-pencil-square-o" aria-hidden="true"></i>&nbsp;&nbsp;
                            <a data-toggle="collapse" href="#collapse4" data-parent="#accordion">{{# str }} admintoolboxannotation, assignfeedback_editpdfplus {{/ str }}</a>
                        </div>
                        <div id="collapse4" class="panel-collapse collapse">
110
                            <div class="panel-body" style="margin-bottom: 80px;overflow: auto;">
111
112
113
114
115
116
117
                                    <div class="row form-group">
                                        <label class="control-label col-sm-3" for="color">{{# str }} admintoolboxannotation_color, assignfeedback_editpdfplus {{/ str }}</label>
                                        <div class="col-sm-9">
                                            <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}}" />
                                        </div>
M. Chardon's avatar
M. Chardon committed
118
                                    </div>
119
                                <div class="row form-group">
M. Chardon's avatar
M. Chardon committed
120
121
                                    <label class="control-label col-sm-3" for="texts">{{# str }} admintoolboxannotation_texts, assignfeedback_editpdfplus {{/ str }}</label>
                                    <div class="col-sm-9">
122
123
124
125
126
127
128
129
                                        <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;">
                                            {{#tool.textsarray}}
                                            <li><input  type='text' class='form-control' value='{{text}}' name='text[{{index}}]' style='width:90%;display:inline-block;' /></li>
                                            {{/tool.textsarray}}
                                        </ul>
M. Chardon's avatar
M. Chardon committed
130
                                    </div>
M. Chardon's avatar
M. Chardon committed
131
                                </div>
132
                                <div class="row form-group">
M. Chardon's avatar
M. Chardon committed
133
134
135
136
                                    <label class="control-label col-sm-3" for="reply">{{# str }} admintoolboxannotation_reply, assignfeedback_editpdfplus {{/ str }}</label>
                                    <div class="col-sm-9">
                                        <input type="checkbox" id="reply" {{#tool.reply}}checked {{/tool.reply}}name="reply" />
                                    </div>
M. Chardon's avatar
M. Chardon committed
137
                                </div>
M. Chardon's avatar
M. Chardon committed
138
139
140
141
                            </div>
                        </div>
                    </div>
                </div>
M. Chardon's avatar
M. Chardon committed
142

M. Chardon's avatar
M. Chardon committed
143
144
145
146
147
148
149
                <div style='display:none;'>
                    <input type="hidden" name="toolid" value="{{tool.id}}" />
                    <input type="hidden" name="axisid" value="{{tool.axis}}" />
                    <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>
M. Chardon's avatar
M. Chardon committed
150

M. Chardon's avatar
M. Chardon committed
151
152
153
            </form>
        </div>
        <div class='col-sm-6'>
M. Chardon's avatar
M. Chardon committed
154
155
156
            <input id='map01' type='hidden' value='{{map01}}' />
            <input id='map02' type='hidden' value='{{map02}}' />
            <input id='map03' type='hidden' value='{{map03}}' />
157
            <!--{{# pix }} cross, assignfeedback_editpdfplus, previsu {{/ pix }}-->
158
            <div id="canevas" style="background-image: url('{{map01}}');background-repeat: no-repeat; border-width: 1px; border-style: solid; height: 330px;" class="drawingcanvas">
M. Chardon's avatar
M. Chardon committed
159
            </div>
M. Chardon's avatar
M. Chardon committed
160
        </div>
M. Chardon's avatar
M. Chardon committed
161
162
163
164
165
166
    </div>
</div>

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

M. Chardon's avatar
M. Chardon committed
167
{{#tool.id}}$("#typetool").val({{tool.type}});{{/tool.id}}
M. Chardon's avatar
M. Chardon committed
168

169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
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);

jQuery(document).ready(function() {
// 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
234
235
});
{{/ js }}