MDL-41227 core_course:fixed up some JS that was confusing activity visibility
[moodle.git] / course / yui / toolboxes / toolboxes.js
1 YUI.add('moodle-course-toolboxes', function(Y) {
3     // The following properties contain common strings.
4     // We separate them out here because when this JS is minified the content is less as
5     // Variables get compacted to single/double characters and the full length of the string
6     // exists only once.
8     // The CSS classes we use.
9     var CSS = {
10         ACTIVITYINSTANCE : 'activityinstance',
11         AVAILABILITYINFODIV : 'div.availabilityinfo',
12         CONDITIONALHIDDEN : 'conditionalhidden',
13         DIMCLASS : 'dimmed',
14         DIMMEDTEXT : 'dimmed_text',
15         EDITINSTRUCTIONS : 'editinstructions',
16         HIDE : 'hide',
17         MODINDENTCOUNT : 'mod-indent-',
18         MODINDENTHUGE : 'mod-indent-huge',
19         MODULEIDPREFIX : 'module-',
20         SECTIONHIDDENCLASS : 'hidden',
21         SECTIONIDPREFIX : 'section-',
22         SHOW : 'editing_show',
23         TITLEEDITOR : 'titleeditor'
24     },
25     // The CSS selectors we use.
26     SELECTOR = {
27         ACTIONLINKTEXT : '.actionlinktext',
28         ACTIVITYACTION : 'a.cm-edit-action[data-action]',
29         ACTIVITYFORM : 'form.'+CSS.ACTIVITYINSTANCE,
30         ACTIVITYICON : 'img.activityicon',
31         ACTIVITYLI : 'li.activity',
32         ACTIVITYTITLE : 'input[name=title]',
33         COMMANDSPAN : '.commands',
34         CONTENTAFTERLINK : 'div.contentafterlink',
35         HIDE : 'a.editing_hide',
36         HIGHLIGHT : 'a.editing_highlight',
37         INSTANCENAME : 'span.instancename',
38         MODINDENTDIV : 'div.mod-indent',
39         PAGECONTENT : 'div#page-content',
40         SECTIONLI : 'li.section',
41         SHOW : 'a.'+CSS.SHOW,
42         SHOWHIDE : 'a.editing_showhide'
43     },
44     BODY = Y.one(document.body);
46     /**
47      * The toolbox classes
48      *
49      * TOOLBOX is a generic class which should never be directly instantiated
50      * RESOURCETOOLBOX is a class extending TOOLBOX containing code specific to resources
51      * SECTIONTOOLBOX is a class extending TOOLBOX containing code specific to sections
52      */
53     var TOOLBOX = function() {
54         TOOLBOX.superclass.constructor.apply(this, arguments);
55     }
57     Y.extend(TOOLBOX, Y.Base, {
58         /**
59          * Send a request using the REST API
60          *
61          * @param data The data to submit
62          * @param statusspinner (optional) A statusspinner which may contain a section loader
63          * @param optionalconfig (optional) Any additional configuration to submit
64          * @return response responseText field from responce
65          */
66         send_request : function(data, statusspinner, optionalconfig) {
67             // Default data structure
68             if (!data) {
69                 data = {};
70             }
71             // Handle any variables which we must pass back through to
72             var pageparams = this.get('config').pageparams;
73             for (varname in pageparams) {
74                 data[varname] = pageparams[varname];
75             }
77             data.sesskey = M.cfg.sesskey;
78             data.courseId = this.get('courseid');
80             var uri = M.cfg.wwwroot + this.get('ajaxurl');
82             // Define the configuration to send with the request
83             var responsetext = [];
84             var config = {
85                 method: 'POST',
86                 data: data,
87                 on: {
88                     success: function(tid, response) {
89                         try {
90                             responsetext = Y.JSON.parse(response.responseText);
91                             if (responsetext.error) {
92                                 new M.core.ajaxException(responsetext);
93                             }
94                         } catch (e) {}
95                         if (statusspinner) {
96                             window.setTimeout(function(e) {
97                                 statusspinner.hide();
98                             }, 400);
99                         }
100                     },
101                     failure : function(tid, response) {
102                         if (statusspinner) {
103                             statusspinner.hide();
104                         }
105                         new M.core.ajaxException(response);
106                     }
107                 },
108                 context: this,
109                 sync: true
110             }
112             // Apply optional config
113             if (optionalconfig) {
114                 for (varname in optionalconfig) {
115                     config[varname] = optionalconfig[varname];
116                 }
117             }
119             if (statusspinner) {
120                 statusspinner.show();
121             }
123             // Send the request
124             Y.io(uri, config);
125             return responsetext;
126         },
127         /**
128          * Return the name of the activity instance
129          *
130          * If activity has no name (for example label) null is returned
131          *
132          * @param element The <li> element to determine a name for
133          * @return string|null Instance name
134          */
135         get_instance_name : function(target) {
136             if (target.one(SELECTOR.INSTANCENAME)) {
137                 return target.one(SELECTOR.INSTANCENAME).get('firstChild').get('data');
138             }
139             return null;
140         },
141         /**
142          * Return the module ID for the specified element
143          *
144          * @param element The <li> element to determine a module-id number for
145          * @return string The module ID
146          */
147         get_element_id : function(element) {
148             return element.get('id').replace(CSS.MODULEIDPREFIX, '');
149         },
150         /**
151          * Return the module ID for the specified element
152          *
153          * @param element The <li> element to determine a module-id number for
154          * @return string The module ID
155          */
156         get_section_id : function(section) {
157             return section.get('id').replace(CSS.SECTIONIDPREFIX, '');
158         }
159     },
160     {
161         NAME : 'course-toolbox',
162         ATTRS : {
163             // The ID of the current course
164             courseid : {
165                 'value' : 0
166             },
167             ajaxurl : {
168                 'value' : 0
169             },
170             config : {
171                 'value' : 0
172             }
173         }
174     }
175     );
177     /**
178      * Resource and activity toolbox class.
179      *
180      * This class is responsible for managing AJAX interactions with activities and resources
181      * when viewing a course in editing mode.
182      *
183      * @namespace M.course.toolbox
184      * @class ResourceToolbox
185      * @constructor
186      */
187     var RESOURCETOOLBOX = function() {
188         RESOURCETOOLBOX.superclass.constructor.apply(this, arguments);
189     }
191     Y.extend(RESOURCETOOLBOX, TOOLBOX, {
192         /**
193          * No groups are being used.
194          * @static
195          * @const GROUPS_NONE
196          * @type Number
197          */
198         GROUPS_NONE     : 0,
199         /**
200          * Separate groups are being used.
201          * @static
202          * @const GROUPS_SEPARATE
203          * @type Number
204          */
205         GROUPS_SEPARATE : 1,
206         /**
207          * Visible groups are being used.
208          * @static
209          * @const GROUPS_VISIBLE
210          * @type Number
211          */
212         GROUPS_VISIBLE  : 2,
214         /**
215          * Events that were added when editing a title.
216          * These should all be detached when editing is complete.
217          * @property edittitleevents
218          * @type {Event[]}
219          * @protected
220          */
221         edittitleevents : [],
223         /**
224          * Initialize the resource toolbox
225          *
226          * For each activity the commands are updated and a reference to the activity is attached.
227          * This way it doesn't matter where the commands are going to called from they have a reference to the
228          * activity that they relate to.
229          * This is essential as some of the actions are displayed in an actionmenu which removes them from the
230          * page flow.
231          *
232          * This function also creates a single event delegate to manage all AJAX actions for all activities on
233          * the page.
234          *
235          * @method initializer
236          */
237         initializer : function(config) {
238             M.course.coursebase.register_module(this);
239             Y.all(SELECTOR.ACTIVITYLI).each(function(activity){
240                 activity.setData('toolbox', this);
241                 activity.all(SELECTOR.COMMANDSPAN+ ' ' + SELECTOR.ACTIVITYACTION).each(function(){
242                     this.setData('activity', activity);
243                 });
244             }, this);
245             Y.delegate('click', this.handle_data_action, BODY, SELECTOR.ACTIVITYACTION, this);
246         },
248         /**
249          * Handles the delegation event. When this is fired someone has triggered an action.
250          *
251          * Note not all actions will result in an AJAX enhancement.
252          *
253          * @protected
254          * @method handle_data_action
255          * @param {EventFacade} ev The event that was triggered.
256          * @returns {boolean}
257          */
258         handle_data_action : function(ev) {
259             // We need to get the anchor element that triggered this event.
260             var node = ev.target;
261             if (!node.test('a')) {
262                 node = node.ancestor(SELECTOR.ACTIVITYACTION);
263             }
265             // From the anchor we can get both the activity (added during initialisation) and the action being
266             // performed (added by the UI as a data attribute).
267             var action = node.getData('action'),
268                 activity = node.getData('activity');
269             if (!node.test('a') || !action || !activity) {
270                 // It wasn't a valid action node.
271                 return;
272             }
274             // Switch based upon the action and do the desired thing.
275             switch (action) {
276                 case 'edittitle' :
277                     // The user wishes to edit the title of the event.
278                     this.edit_title(ev, node, activity, action);
279                     break;
280                 case 'moveleft' :
281                 case 'moveright' :
282                     // The user changing the indent of the activity.
283                     this.change_indent(ev, node, activity, action);
284                     break;
285                 case 'delete' :
286                     // The user is deleting the activity.
287                     this.delete_with_confirmation(ev, node, activity, action);
288                     break;
289                 case 'hide' :
290                 case 'show' :
291                     // The user is changing the visibility of the activity.
292                     this.change_visibility(ev, node, activity, action);
293                     break;
294                 case 'groupsseparate' :
295                 case 'groupsvisible' :
296                 case 'groupsnone' :
297                     // The user is changing the group mode.
298                     callback = 'change_groupmode';
299                     this.change_groupmode(ev, node, activity, action);
300                     break;
301                 case 'move' :
302                 case 'update' :
303                 case 'duplicate' :
304                 case 'assignroles' :
305                 default:
306                     // Nothing to do here!
307                     break;
308             }
309         },
311         /**
312          * Change the indent of the activity or resource.
313          *
314          * @protected
315          * @method change_indent
316          * @param {EventFacade} ev The event that was fired.
317          * @param {Node} button The button that triggered this action.
318          * @param {Node} activity The activity node that this action will be performed on.
319          * @param {String} action The action that has been requested. Will be 'moveleft' or 'moveright'.
320          */
321         change_indent : function(ev, button, activity, action) {
322             // Prevent the default button action
323             ev.preventDefault();
325             var direction = (action === 'moveleft') ? -1 : 1;
327             // And we need to determine the current and new indent level
328             var indentdiv = activity.one(SELECTOR.MODINDENTDIV);
329             var indent = indentdiv.getAttribute('class').match(/mod-indent-(\d{1,})/);
331             if (indent) {
332                 var oldindent = parseInt(indent[1]);
333                 var newindent = Math.max(0, (oldindent + parseInt(direction)));
334                 indentdiv.removeClass(indent[0]);
335             } else {
336                 var oldindent = 0;
337                 var newindent = 1;
338             }
340             // Perform the move
341             indentdiv.addClass(CSS.MODINDENTCOUNT + newindent);
342             var data = {
343                 'class' : 'resource',
344                 'field' : 'indent',
345                 'value' : newindent,
346                 'id'    : this.get_element_id(activity)
347             };
348             var commands = activity.one(SELECTOR.COMMANDSPAN);
349             var spinner = M.util.add_spinner(Y, commands).setStyles({
350                 position: 'absolute',
351                 top: 0
352             });
353             if (BODY.hasClass('dir-ltr')) {
354                 spinner.setStyle('left', '100%');
355             }  else {
356                 spinner.setStyle('right', '100%');
357             }
358             this.send_request(data, spinner);
360             // Handle removal/addition of the moveleft button.
361             if (newindent == 0) {
362                 button.addClass('hidden');
363             } else if (newindent == 1 && oldindent == 0) {
364                 button.ancestor('.menu').one('[data-action=moveleft]').removeClass('hidden');
365             }
367             // Handle massive indentation to match non-ajax display
368             var hashugeclass = indentdiv.hasClass(CSS.MODINDENTHUGE);
369             if (newindent > 15 && !hashugeclass) {
370                 indentdiv.addClass(CSS.MODINDENTHUGE);
371             } else if (newindent <= 15 && hashugeclass) {
372                 indentdiv.removeClass(CSS.MODINDENTHUGE);
373             }
374         },
376         /**
377          * Deletes the given activity or resource after confirmation.
378          *
379          * @protected
380          * @method delete_with_confirmation
381          * @param {EventFacade} ev The event that was fired.
382          * @param {Node} button The button that triggered this action.
383          * @param {Node} activity The activity node that this action will be performed on.
384          * @return Boolean
385          */
386         delete_with_confirmation : function(ev, button, activity) {
387             // Prevent the default button action
388             ev.preventDefault();
390             // Get the element we're working on
391             var element   = activity
393             // Create confirm string (different if element has or does not have name)
394             var confirmstring = '';
395             var plugindata = {
396                 type : M.util.get_string('pluginname', element.getAttribute('class').match(/modtype_([^\s]*)/)[1])
397             }
398             if (this.get_instance_name(element) != null) {
399                 plugindata.name = this.get_instance_name(element)
400                 confirmstring = M.util.get_string('deletechecktypename', 'moodle', plugindata);
401             } else {
402                 confirmstring = M.util.get_string('deletechecktype', 'moodle', plugindata)
403             }
405             // Confirm element removal
406             if (!confirm(confirmstring)) {
407                 return false;
408             }
410             // Actually remove the element
411             element.remove();
412             var data = {
413                 'class' : 'resource',
414                 'action' : 'DELETE',
415                 'id'    : this.get_element_id(element)
416             };
417             this.send_request(data);
418             if (M.core.actionmenu && M.core.actionmenu.instance) {
419                 M.core.actionmenu.instance.hideMenu();
420             }
421         },
423         /**
424          * Changes the visibility of this activity or resource.
425          *
426          * @protected
427          * @method change_visibility
428          * @param {EventFacade} ev The event that was fired.
429          * @param {Node} button The button that triggered this action.
430          * @param {Node} activity The activity node that this action will be performed on.
431          * @param {String} action The action that has been requested.
432          * @return Boolean
433          */
434         change_visibility : function(ev, button, activity, action) {
435             // Prevent the default button action
436             ev.preventDefault();
438             // Return early if the current section is hidden
439             var section = activity.ancestor(M.course.format.get_section_selector(Y));
440             if (section && section.hasClass(CSS.SECTIONHIDDENCLASS)) {
441                 return;
442             }
444             // Get the element we're working on
445             var element = activity;
446             var value = this.handle_resource_dim(button, activity, action);
448             // Send the request
449             var data = {
450                 'class' : 'resource',
451                 'field' : 'visible',
452                 'value' : value,
453                 'id'    : this.get_element_id(element)
454             };
455             var spinner = M.util.add_spinner(Y, element.one(SELECTOR.COMMANDSPAN));
456             this.send_request(data, spinner);
457             return false; // Need to return false to stop the delegate for the new state firing
458         },
460         /**
461          * Handles the UI aspect of dimming the activity or resource.
462          *
463          * @protected
464          * @method handle_resource_dim
465          * @param {Node} button The button that triggered the action.
466          * @param {Node} activity The activity node that this action will be performed on.
467          * @param {String} action 'show' or 'hide'.
468          * @returns {number} 1 if we changed to visible, 0 if we were hiding.
469          */
470         handle_resource_dim : function(button, activity, action) {
471             var toggleclass = CSS.DIMCLASS,
472                 dimarea = activity.one('a'),
473                 availabilityinfo = activity.one(CSS.AVAILABILITYINFODIV),
474                 nextaction = (action === 'hide') ? 'show' : 'hide';
475                 newstring = M.util.get_string(nextaction, 'moodle');
477             // Update button info.
478             button.one('img').setAttrs({
479                 'alt' : newstring,
480                 'src'   : M.util.image_url('t/' + nextaction)
481             });
482             button.set('title', newstring);
483             button.replaceClass('editing_'+action, 'editing_'+nextaction);
484             button.setData('action', nextaction);
486             // If activity is conditionally hidden, then don't toggle.
487             if (this.get_instance_name(activity) == null) {
488                 toggleclass = CSS.DIMMEDTEXT;
489                 dimarea = activity.all(SELECTOR.MODINDENTDIV + ' > div').item(1);
490             }
491             if (!dimarea.hasClass(CSS.CONDITIONALHIDDEN)) {
492                 // Change the UI.
493                 dimarea.toggleClass(toggleclass);
494                 // We need to toggle dimming on the description too.
495                 activity.all(SELECTOR.CONTENTAFTERLINK).toggleClass(CSS.DIMMEDTEXT);
496             }
497             // Toggle availablity info for conditional activities.
498             if (availabilityinfo) {
499                 availabilityinfo.toggleClass(CSS.HIDE);
500             }
501             return (action === 'hide') ? 0 : 1;
502         },
504         /**
505          * Changes the groupmode of the activity to the next groupmode in the sequence.
506          *
507          * @protected
508          * @method change_groupmode
509          * @param {EventFacade} ev The event that was fired.
510          * @param {Node} button The button that triggered this action.
511          * @param {Node} activity The activity node that this action will be performed on.
512          * @param {String} action The action that has been requested.
513          * @return Boolean
514          */
515         change_groupmode : function(ev, button, activity, action) {
516             // Prevent the default button action.
517             ev.preventDefault();
519             // Current Mode
520             var groupmode = parseInt(button.getData('nextgroupmode'), 10),
521                 newtitle = '',
522                 iconsrc = '',
523                 newtitlestr,
524                 data,
525                 spinner,
526                 nextgroupmode = groupmode + 1;
528             if (nextgroupmode > 2) {
529                 nextgroupmode = 0;
530             }
532             if (groupmode === this.GROUPS_NONE) {
533                 newtitle = 'groupsnone';
534                 iconsrc = M.util.image_url('t/groupn', 'moodle');
535             } else if (groupmode === this.GROUPS_SEPARATE) {
536                 newtitle = 'groupsseparate';
537                 iconsrc = M.util.image_url('t/groups', 'moodle');
538             } else if (groupmode === this.GROUPS_VISIBLE) {
539                 newtitle = 'groupsvisible';
540                 iconsrc = M.util.image_url('t/groupv', 'moodle');
541             }
542             newtitlestr = M.util.get_string(newtitle, 'moodle'),
543             newtitlestr = M.util.get_string('clicktochangeinbrackets', 'moodle', newtitlestr);
545             // Change the UI
546             button.one('img').setAttrs({
547                 'alt' : newtitlestr,
548                 'src' : iconsrc
549             });
550             button.setAttribute('title', newtitlestr).setData('action', newtitle).setData('nextgroupmode', nextgroupmode);
552             // And send the request
553             data = {
554                 'class' : 'resource',
555                 'field' : 'groupmode',
556                 'value' : groupmode,
557                 'id'    : this.get_element_id(activity)
558             };
560             spinner = M.util.add_spinner(Y, activity.one(SELECTOR.COMMANDSPAN));
561             this.send_request(data, spinner);
562             return false; // Need to return false to stop the delegate for the new state firing
563         },
565         /**
566          * Edit the title for the resource
567          *
568          * @protected
569          * @method edit_title
570          * @param {EventFacade} ev The event that was fired.
571          * @param {Node} button The button that triggered this action.
572          * @param {Node} activity The activity node that this action will be performed on.
573          * @param {String} action The action that has been requested.
574          * @return Boolean
575          */
576         edit_title : function(ev, button, activity) {
577             // Get the element we're working on
578             var activityid = this.get_element_id(activity),
579                 instancename  = activity.one(SELECTOR.INSTANCENAME),
580                 currenttitle = instancename.get('firstChild'),
581                 oldtitle = currenttitle.get('data'),
582                 titletext = oldtitle,
583                 thisevent,
584                 anchor = instancename.ancestor('a'),// Grab the anchor so that we can swap it with the edit form.
585                 data = {
586                     'class'   : 'resource',
587                     'field'   : 'gettitle',
588                     'id'      : activityid
589                 },
590                 response = this.send_request(data);
592             if (M.core.actionmenu && M.core.actionmenu.instance) {
593                 M.core.actionmenu.instance.hideMenu();
594             }
596             // Try to retrieve the existing string from the server
597             if (response.instancename) {
598                 titletext = response.instancename;
599             }
601             // Create the editor and submit button
602             var editform = Y.Node.create('<form class="'+CSS.ACTIVITYINSTANCE+'" action="#" />');
603             var editinstructions = Y.Node.create('<span class="'+CSS.EDITINSTRUCTIONS+'" id="id_editinstructions" />')
604                 .set('innerHTML', M.util.get_string('edittitleinstructions', 'moodle'));
605             var editor = Y.Node.create('<input name="title" type="text" class="'+CSS.TITLEEDITOR+'" />').setAttrs({
606                 'value' : titletext,
607                 'autocomplete' : 'off',
608                 'aria-describedby' : 'id_editinstructions',
609                 'maxLength' : '255'
610             })
612             // Clear the existing content and put the editor in
613             editform.appendChild(activity.one(SELECTOR.ACTIVITYICON).cloneNode());
614             editform.appendChild(editor);
615             editform.setData('anchor', anchor);
616             anchor.replace(editform);
617             activity.one('div').appendChild(editinstructions);
618             ev.preventDefault();
620             // Focus and select the editor text
621             editor.focus().select();
623             // Cancel the edit if we lose focus or the escape key is pressed.
624             thisevent = editor.on('blur', this.edit_title_cancel, this, activity, false);
625             this.edittitleevents.push(thisevent);
626             thisevent = editor.on('key', this.edit_title_cancel, 'esc', this, activity, true);
627             this.edittitleevents.push(thisevent);
629             // Handle form submission.
630             thisevent = editform.on('submit', this.edit_title_submit, this, activity, oldtitle);
631             this.edittitleevents.push(thisevent);
632         },
634         /**
635          * Handles the submit event when editing the activity or resources title.
636          *
637          * @protected
638          * @method edit_title_submit
639          * @param {EventFacade} ev The event that triggered this.
640          * @param {Node} activity The activity whose title we are altering.
641          * @param {String} originaltitle The original title the activity or resource had.
642          */
643         edit_title_submit : function(ev, activity, originaltitle) {
644             // We don't actually want to submit anything
645             ev.preventDefault();
647             var newtitle = Y.Lang.trim(activity.one(SELECTOR.ACTIVITYFORM + ' ' + SELECTOR.ACTIVITYTITLE).get('value'));
648             this.edit_title_clear(activity);
649             var spinner = M.util.add_spinner(Y, activity.one(SELECTOR.INSTANCENAME));
650             if (newtitle != null && newtitle != "" && newtitle != originaltitle) {
651                 var data = {
652                     'class'   : 'resource',
653                     'field'   : 'updatetitle',
654                     'title'   : newtitle,
655                     'id'      : this.get_element_id(activity)
656                 };
657                 var response = this.send_request(data, spinner);
658                 if (response.instancename) {
659                     activity.one(SELECTOR.INSTANCENAME).setContent(response.instancename);
660                 }
661             }
662         },
664         /**
665          * Handles the cancel event when editing the activity or resources title.
666          *
667          * @protected
668          * @method edit_title_cancel
669          * @param {EventFacade} ev The event that triggered this.
670          * @param {Node} activity The activity whose title we are altering.
671          * @param {Boolean} preventdefault If true we should prevent the default action from occuring.
672          */
673         edit_title_cancel : function(ev, activity, preventdefault) {
674             if (preventdefault) {
675                 ev.preventDefault();
676             }
677             this.edit_title_clear(activity);
678         },
680         /**
681          * Handles clearing the editing UI and returning things to the original state they were in.
682          *
683          * @protected
684          * @method edit_title_clear
685          * @param {Node} activity  The activity whose title we were altering.
686          */
687         edit_title_clear : function(activity) {
688             // Detach all listen events to prevent duplicate triggers
689             var thisevent;
690             while (thisevent = this.edittitleevents.shift()) {
691                 thisevent.detach();
692             }
693             var editform = activity.one(SELECTOR.ACTIVITYFORM),
694                 instructions = activity.one('#id_editinstructions');
695             if (editform) {
696                 editform.replace(editform.getData('anchor'));
697             }
698             if (instructions) {
699                 instructions.remove();
700             }
701         },
703         /**
704          * Set the visibility of the current resource (identified by the element)
705          * to match the hidden parameter (this is not a toggle).
706          * Only changes the visibility in the browser (no ajax update).
707          *
708          * @public This method is used by other modules.
709          * @method set_visibility_resource_ui
710          * @param args An object with 'element' being the A node containing the resource
711          *             and 'visible' being the state that the visibility should be set to.
712          */
713         set_visibility_resource_ui: function(args) {
714             var element = args.element,
715                 shouldbevisible = args.visible,
716                 buttonnode = element.one(SELECTOR.SHOW),
717                 visible = (buttonnode === null),
718                 action = 'show';
719             if (visible) {
720                 buttonnode = element.one(SELECTOR.HIDE);
721                 action = 'hide';
722             }
723             if (visible != shouldbevisible) {
724                 this.handle_resource_dim(buttonnode, buttonnode.getData('activity'), action);
725             }
726         }
727     }, {
728         NAME : 'course-resource-toolbox',
729         ATTRS : {
730             courseid : {
731                 'value' : 0
732             },
733             format : {
734                 'value' : 'topics'
735             }
736         }
737     });
739     var SECTIONTOOLBOX = function() {
740         SECTIONTOOLBOX.superclass.constructor.apply(this, arguments);
741     }
743     Y.extend(SECTIONTOOLBOX, TOOLBOX, {
744         /**
745          * Initialize the toolboxes module
746          *
747          * Updates all span.commands with relevant handlers and other required changes
748          */
749         initializer : function(config) {
750             this.setup_for_section();
751             M.course.coursebase.register_module(this);
753             // Section Highlighting
754             Y.delegate('click', this.toggle_highlight, SELECTOR.PAGECONTENT, SELECTOR.SECTIONLI + ' ' + SELECTOR.HIGHLIGHT, this);
755             // Section Visibility
756             Y.delegate('click', this.toggle_hide_section, SELECTOR.PAGECONTENT, SELECTOR.SECTIONLI + ' ' + SELECTOR.SHOWHIDE, this);
757         },
758         /**
759          * Update any section areas within the scope of the specified
760          * selector with AJAX equivelants
761          *
762          * @param baseselector The selector to limit scope to
763          * @return void
764          */
765         setup_for_section : function(baseselector) {
766             // Left here for potential future use - not currently needed due to YUI delegation in initializer()
767             /*if (!baseselector) {
768                 var baseselector = SELECTOR.PAGECONTENT;
769             }
771             Y.all(baseselector).each(this._setup_for_section, this);*/
772         },
773         _setup_for_section : function(toolboxtarget) {
774             // Left here for potential future use - not currently needed due to YUI delegation in initializer()
775         },
776         toggle_hide_section : function(e) {
777             // Prevent the default button action
778             e.preventDefault();
780             // Get the section we're working on
781             var section = e.target.ancestor(M.course.format.get_section_selector(Y));
782             var button = e.target.ancestor('a', true);
783             var hideicon = button.one('img');
785             // The value to submit
786             var value;
787             // The text for strings and images. Also determines the icon to display.
788             var action,
789                 nextaction;
791             if (!section.hasClass(CSS.SECTIONHIDDENCLASS)) {
792                 section.addClass(CSS.SECTIONHIDDENCLASS);
793                 value = 0;
794                 action = 'hide';
795                 nextaction = 'show';
796             } else {
797                 section.removeClass(CSS.SECTIONHIDDENCLASS);
798                 value = 1;
799                 action = 'show';
800                 nextaction = 'hide';
801             }
803             var newstring = M.util.get_string(nextaction + 'fromothers', 'format_' + this.get('format'));
804             hideicon.setAttrs({
805                 'alt' : newstring,
806                 'src'   : M.util.image_url('i/' + nextaction)
807             });
808             button.set('title', newstring);
810             // Change the highlight status
811             var data = {
812                 'class' : 'section',
813                 'field' : 'visible',
814                 'id'    : this.get_section_id(section.ancestor(M.course.format.get_section_wrapper(Y), true)),
815                 'value' : value
816             };
818             var lightbox = M.util.add_lightbox(Y, section);
819             lightbox.show();
821             var response = this.send_request(data, lightbox);
823             var activities = section.all(SELECTOR.ACTIVITYLI);
824             activities.each(function(node) {
825                 if (node.one(SELECTOR.SHOW)) {
826                     var button = node.one(SELECTOR.SHOW);
827                 } else {
828                     var button = node.one(SELECTOR.HIDE);
829                 }
830                 var activityid = this.get_element_id(node);
832                 if (Y.Array.indexOf(response.resourcestotoggle, activityid) != -1) {
833                     node.getData('toolbox').handle_resource_dim(button, node, action);
834                 }
835             }, this);
836         },
837         toggle_highlight : function(e) {
838             // Prevent the default button action
839             e.preventDefault();
841             // Get the section we're working on
842             var section = e.target.ancestor(M.course.format.get_section_selector(Y));
843             var button = e.target.ancestor('a', true);
844             var buttonicon = button.one('img');
846             // Determine whether the marker is currently set
847             var togglestatus = section.hasClass('current');
848             var value = 0;
850             // Set the current highlighted item text
851             var old_string = M.util.get_string('markthistopic', 'moodle');
852             Y.one(SELECTOR.PAGECONTENT)
853                 .all(M.course.format.get_section_selector(Y) + '.current ' + SELECTOR.HIGHLIGHT)
854                 .set('title', old_string);
855             Y.one(SELECTOR.PAGECONTENT)
856                 .all(M.course.format.get_section_selector(Y) + '.current ' + SELECTOR.HIGHLIGHT + ' img')
857                 .set('alt', old_string)
858                 .set('src', M.util.image_url('i/marker'));
860             // Remove the highlighting from all sections
861             var allsections = Y.one(SELECTOR.PAGECONTENT).all(M.course.format.get_section_selector(Y))
862                 .removeClass('current');
864             // Then add it if required to the selected section
865             if (!togglestatus) {
866                 section.addClass('current');
867                 value = this.get_section_id(section.ancestor(M.course.format.get_section_wrapper(Y), true));
868                 var new_string = M.util.get_string('markedthistopic', 'moodle');
869                 button
870                     .set('title', new_string);
871                 buttonicon
872                     .set('alt', new_string)
873                     .set('src', M.util.image_url('i/marked'));
874             }
876             // Change the highlight status
877             var data = {
878                 'class' : 'course',
879                 'field' : 'marker',
880                 'value' : value
881             };
882             var lightbox = M.util.add_lightbox(Y, section);
883             lightbox.show();
884             this.send_request(data, lightbox);
885         }
886     }, {
887         NAME : 'course-section-toolbox',
888         ATTRS : {
889             courseid : {
890                 'value' : 0
891             },
892             format : {
893                 'value' : 'topics'
894             }
895         }
896     });
898     M.course = M.course || {};
899     M.course.resource_toolbox = null;
900     M.course.init_resource_toolbox = function(config) {
901         M.course.resource_toolbox = new RESOURCETOOLBOX(config);
902         return M.course.resource_toolbox;
903     };
905     M.course.init_section_toolbox = function(config) {
906         return new SECTIONTOOLBOX(config);
907     };
909     M.course.register_new_module = function(module) {
910         if (typeof module === 'string') {
911             module = Y.one(module);
912         }
913         if (M.course.resource_toolbox !== null) {
914             module.setData('toolbox', M.course.resource_toolbox);
915             module.all(SELECTOR.COMMANDSPAN+ ' ' + SELECTOR.ACTIVITYACTION).each(function(){
916                 this.setData('activity', module);
917             });
918         }
919     }
921 },
922 '@VERSION@', {
923     requires : ['base', 'node', 'io', 'moodle-course-coursebase']
925 );