MDL-57690 js: fix core modal uses in amd
[moodle.git] / lib / amd / src / tag.js
1 // This file is part of Moodle - http://moodle.org/
2 //
3 // Moodle is free software: you can redistribute it and/or modify
4 // it under the terms of the GNU General Public License as published by
5 // the Free Software Foundation, either version 3 of the License, or
6 // (at your option) any later version.
7 //
8 // Moodle is distributed in the hope that it will be useful,
9 // but WITHOUT ANY WARRANTY; without even the implied warranty of
10 // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
11 // GNU General Public License for more details.
12 //
13 // You should have received a copy of the GNU General Public License
14 // along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
16 /**
17  * AJAX helper for the tag management page.
18  *
19  * @module     core/tag
20  * @package    core_tag
21  * @copyright  2015 Marina Glancy
22  * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
23  * @since      3.0
24  */
25 define(['jquery', 'core/ajax', 'core/templates', 'core/notification', 'core/str', 'core/yui'],
26         function($, ajax, templates, notification, str, Y) {
27     return /** @alias module:core/tag */ {
29         /**
30          * Initialises tag index page.
31          *
32          * @method initTagindexPage
33          */
34         initTagindexPage: function() {
35             // Click handler for changing tag type.
36             $('body').delegate('.tagarea[data-ta] a[data-quickload=1]', 'click', function(e) {
37                 e.preventDefault();
38                 var target = $(this),
39                     query = target[0].search.replace(/^\?/, ''),
40                     tagarea = target.closest('.tagarea[data-ta]'),
41                     args = query.split('&').reduce(function(s, c) {
42                       var t = c.split('=');
43                       s[t[0]] = decodeURIComponent(t[1]);
44                       return s;
45                     }, {});
47                 var promises = ajax.call([{
48                     methodname: 'core_tag_get_tagindex',
49                     args: {tagindex: args}
50                 }], true);
52                 $.when.apply($, promises)
53                     .done(function(data) {
54                         templates.render('core_tag/index', data).done(function(html) {
55                             tagarea.replaceWith(html);
56                         });
57                     });
58             });
59         },
61         /**
62          * Initialises tag management page.
63          *
64          * @method initManagePage
65          */
66         initManagePage: function() {
68             // Set cell 'time modified' to 'now' when any of the element is updated in this row.
69             $('body').on('updated', '[data-inplaceeditable]', function(e) {
70                 str.get_string('now').done(function(s) {
71                     $(e.target).closest('tr').find('td.col-timemodified').html(s);
72                 });
73                 if (e.ajaxreturn.itemtype === 'tagflag') {
74                     var row = $(e.target).closest('tr');
75                     if (e.ajaxreturn.value === '0') {
76                         row.removeClass('flagged-tag');
77                     } else {
78                         row.addClass('flagged-tag');
79                     }
80                 }
81             });
83             // Confirmation for single tag delete link.
84             $('.tag-management-table').delegate('a.tagdelete', 'click', function(e) {
85                 e.preventDefault();
86                 var href = $(this).attr('href');
87                 str.get_strings([
88                         {key: 'delete'},
89                         {key: 'confirmdeletetag', component: 'tag'},
90                         {key: 'yes'},
91                         {key: 'no'},
92                     ]).done(function(s) {
93                         notification.confirm(s[0], s[1], s[2], s[3], function() {
94                             window.location.href = href;
95                         });
96                     }
97                 );
98             });
100             // Confirmation for bulk tag delete button.
101             $("#tag-management-delete").click(function(e) {
102                 var form = $(this).closest('form').get(0),
103                     cnt = $(form).find("input[type=checkbox]:checked").length;
104                 if (!cnt) {
105                     return;
106                 }
107                 var tempElement = $("<input type='hidden'/>").attr('name', this.name);
108                 e.preventDefault();
109                 str.get_strings([
110                         {key: 'delete'},
111                         {key: 'confirmdeletetags', component: 'tag'},
112                         {key: 'yes'},
113                         {key: 'no'},
114                     ]).done(function(s) {
115                         notification.confirm(s[0], s[1], s[2], s[3], function() {
116                             tempElement.appendTo(form);
117                             form.submit();
118                         });
119                     }
120                 );
121             });
123             // Confirmation for bulk tag combine button.
124             $("#tag-management-combine").click(function(e) {
125                 e.preventDefault();
126                 var form = $(this).closest('form').get(0),
127                     tags = $(form).find("input[type=checkbox]:checked");
128                 if (tags.length <= 1) {
129                     str.get_strings([
130                         {key: 'combineselected', component: 'tag'},
131                         {key: 'selectmultipletags', component: 'tag'},
132                         {key: 'ok'},
133                     ]).done(function(s) {
134                             notification.alert(s[0], s[1], s[2]);
135                         }
136                     );
137                     return;
138                 }
139                 var tempElement = $("<input type='hidden'/>").attr('name', this.name);
140                 str.get_strings([
141                     {key: 'combineselected', component: 'tag'},
142                     {key: 'selectmaintag', component: 'tag'},
143                     {key: 'continue'},
144                     {key: 'cancel'},
145                 ]).done(function(s) {
146                     var el = $('<div><form id="combinetags_form" class="form-inline">' +
147                         '<p class="description"></p><p class="options"></p>' +
148                         '<p class="mdl-align"><input type="submit" id="combinetags_submit"/>' +
149                         '<input type="button" id="combinetags_cancel"/></p>' +
150                         '</form></div>');
151                     el.find('.description').html(s[1]);
152                     el.find('#combinetags_submit').attr('value', s[2]);
153                     el.find('#combinetags_cancel').attr('value', s[3]);
154                     var fldset = el.find('.options');
155                     tags.each(function() {
156                         var tagid = $(this).val(),
157                             tagname = $('.inplaceeditable[data-itemtype=tagname][data-itemid=' + tagid + ']').attr('data-value');
158                         fldset.append($('<input type="radio" name="maintag" id="combinetags_maintag_' + tagid + '" value="' +
159                             tagid + '"/><label for="combinetags_maintag_' + tagid + '">' + tagname + '</label><br>'));
160                     });
161                     // TODO: MDL-57778 Convert to core/modal.
162                     Y.use('moodle-core-notification-dialogue', function() {
163                         var panel = new M.core.dialogue({
164                             draggable: true,
165                             modal: true,
166                             closeButton: true,
167                             headerContent: s[0],
168                             bodyContent: el.html()
169                         });
170                         panel.show();
171                         $('#combinetags_form input[type=radio]').first().focus().prop('checked', true);
172                         $('#combinetags_form #combinetags_cancel').on('click', function() {
173                             panel.destroy();
174                         });
175                         $('#combinetags_form').on('submit', function() {
176                             tempElement.appendTo(form);
177                             var maintag = $('input[name=maintag]:checked', '#combinetags_form').val();
178                             $("<input type='hidden'/>").attr('name', 'maintag').attr('value', maintag).appendTo(form);
179                             form.submit();
180                             return false;
181                         });
182                     });
183                 });
184             });
186             // When user changes tag name to some name that already exists suggest to combine the tags.
187             $('body').on('updatefailed', '[data-inplaceeditable][data-itemtype=tagname]', function(e) {
188                 var exception = e.exception; // The exception object returned by the callback.
189                 var newvalue = e.newvalue; // The value that user tried to udpated the element to.
190                 var tagid = $(e.target).attr('data-itemid');
191                 if (exception.errorcode === 'namesalreadybeeingused') {
192                     e.preventDefault(); // This will prevent default error dialogue.
193                     str.get_strings([
194                         {key: 'nameuseddocombine', component: 'tag'},
195                         {key: 'yes'},
196                         {key: 'cancel'},
197                     ]).done(function(s) {
198                         notification.confirm(e.message, s[0], s[1], s[2], function() {
199                             window.location.href = window.location.href + "&newname=" + encodeURIComponent(newvalue) +
200                                 "&tagid=" + encodeURIComponent(tagid) +
201                                 '&action=renamecombine&sesskey=' + M.cfg.sesskey;
202                         });
203                     });
204                 }
205             });
207             // Form for adding standard tags.
208             $('body').on('click', 'a[data-action=addstandardtag]', function(e) {
209                 e.preventDefault();
210                 str.get_strings([
211                     {key: 'addotags', component: 'tag'},
212                     {key: 'inputstandardtags', component: 'tag'},
213                     {key: 'continue'},
214                     {key: 'cancel'},
215                 ]).done(function(s) {
216                     var el = $('<div><form id="addtags_form" class="form-inline" method="POST">' +
217                         '<input type="hidden" name="action" value="addstandardtag"/>' +
218                         '<input type="hidden" name="sesskey" value="' + M.cfg.sesskey + '"/>' +
219                         '<p><label for="id_tagslist">' + s[1] + '</label>' +
220                         '<input type="text" id="id_tagslist" name="tagslist"/></p>' +
221                         '<p class="mdl-align"><input type="submit" id="addtags_submit"/>' +
222                         '<input type="button" id="addtags_cancel"/></p>' +
223                         '</form></div>');
224                     el.find('#addtags_form').attr('action', window.location.href);
225                     el.find('#addtags_submit').attr('value', s[2]);
226                     el.find('#addtags_cancel').attr('value', s[3]);
227                     // TODO: MDL-57778 Convert to core/modal.
228                     Y.use('moodle-core-notification-dialogue', function() {
229                         var panel = new M.core.dialogue({
230                             draggable: true,
231                             modal: true,
232                             closeButton: true,
233                             headerContent: s[0],
234                             bodyContent: el.html()
235                         });
236                         panel.show();
237                         $('#addtags_form input[type=text]').focus();
238                         $('#addtags_form #addtags_cancel').on('click', function() {
239                             panel.destroy();
240                         });
241                     });
242                 });
243             });
244         },
246         /**
247          * Initialises tag collection management page.
248          *
249          * @method initManageCollectionsPage
250          */
251         initManageCollectionsPage: function() {
252             $('body').on('updated', '[data-inplaceeditable]', function(e) {
253                 var ajaxreturn = e.ajaxreturn,
254                     areaid, collid, isenabled;
255                 if (ajaxreturn.component === 'core_tag' && ajaxreturn.itemtype === 'tagareaenable') {
256                     areaid = $(this).attr('data-itemid');
257                     $(".tag-collections-table ul[data-collectionid] li[data-areaid=" + areaid + "]").hide();
258                     isenabled = ajaxreturn.value;
259                     if (isenabled === '1') {
260                         $(this).closest('tr').removeClass('dimmed_text');
261                         collid = $(this).closest('tr').find('[data-itemtype="tagareacollection"]').attr("data-value");
262                         $(".tag-collections-table ul[data-collectionid=" + collid + "] li[data-areaid=" + areaid + "]").show();
263                     } else {
264                         $(this).closest('tr').addClass('dimmed_text');
265                     }
266                 }
267                 if (ajaxreturn.component === 'core_tag' && ajaxreturn.itemtype === 'tagareacollection') {
268                     areaid = $(this).attr('data-itemid');
269                     $(".tag-collections-table ul[data-collectionid] li[data-areaid=" + areaid + "]").hide();
270                     collid = $(this).attr('data-value');
271                     isenabled = $(this).closest('tr').find('[data-itemtype="tagareaenable"]').attr("data-value");
272                     if (isenabled === "1") {
273                         $(".tag-collections-table ul[data-collectionid=" + collid + "] li[data-areaid=" + areaid + "]").show();
274                     }
275                 }
276             });
278             $('body').on('click', '.addtagcoll > a', function(e) {
279                 e.preventDefault();
280                 var href = $(this).attr('data-url') + '&sesskey=' + M.cfg.sesskey;
281                 str.get_strings([
282                         {key: 'addtagcoll', component: 'tag'},
283                         {key: 'name'},
284                         {key: 'searchable', component: 'tag'},
285                         {key: 'create'},
286                         {key: 'cancel'},
287                     ]).done(function(s) {
288                         var el = $('<div><form id="addtagcoll_form" class="form-inline">' +
289                             '<p><label for="addtagcoll_name"></label>: ' +
290                             '<input id="addtagcoll_name" type="text"/></p>' +
291                             '<p><label for="addtagcoll_searchable"></label>: ' +
292                             '<input id="addtagcoll_searchable" type="checkbox" value="1" checked/></p>' +
293                             '<p class="mdl-align"><input type="submit" id="addtagcoll_submit"/>' +
294                             '<input type="button" id="addtagcoll_cancel"/></p>' +
295                             '</form></div>');
296                         el.find('label[for="addtagcoll_name"]').html(s[1]);
297                         el.find('label[for="addtagcoll_searchable"]').html(s[2]);
298                         el.find('#addtagcoll_submit').attr('value', s[3]);
299                         el.find('#addtagcoll_cancel').attr('value', s[4]);
300                         // TODO: MDL-57778 Convert to core/modal.
301                         Y.use('moodle-core-notification-dialogue', function() {
302                             var panel = new M.core.dialogue({
303                                 draggable: true,
304                                 modal: true,
305                                 closeButton: true,
306                                 headerContent: s[0],
307                                 bodyContent: el.html()
308                             });
309                             panel.show();
310                             $('#addtagcoll_form #addtagcoll_name').focus();
311                             $('#addtagcoll_form #addtagcoll_cancel').on('click', function() {
312                                 panel.destroy();
313                             });
314                             $('#addtagcoll_form').on('submit', function() {
315                                 var name = $('#addtagcoll_form #addtagcoll_name').val();
316                                 var searchable = $('#addtagcoll_form #addtagcoll_searchable').prop('checked') ? 1 : 0;
317                                 if (String(name).length > 0) {
318                                     window.location.href = href + "&name=" + encodeURIComponent(name) + "&searchable=" + searchable;
319                                 }
320                                 return false;
321                             });
322                         });
323                     }
324                 );
326             });
328             $('body').on('click', '.tag-collections-table .action_delete', function(e) {
329                 e.preventDefault();
330                 var href = $(this).attr('data-url') + '&sesskey=' + M.cfg.sesskey;
331                 str.get_strings([
332                         {key: 'delete'},
333                         {key: 'suredeletecoll', component: 'tag', param: $(this).attr('data-collname')},
334                         {key: 'yes'},
335                         {key: 'no'},
336                     ]).done(function(s) {
337                         notification.confirm(s[0], s[1], s[2], s[3], function() {
338                             window.location.href = href;
339                         });
340                     }
341                 );
342             });
343         }
344     };
345 });