ec8f0250b23917af88beea5b0aa01d1bae870dfe
[moodle.git] / availability / yui / build / moodle-core_availability-form / moodle-core_availability-form-debug.js
1 YUI.add('moodle-core_availability-form', function (Y, NAME) {
3 /**
4  * Provides interface for users to edit availability settings on the
5  * module/section editing form.
6  *
7  * The system works using this JavaScript plus form.js files inside each
8  * condition plugin.
9  *
10  * The overall concept is that data is held in a textarea in the form in JSON
11  * format. This JavaScript converts the textarea into a set of controls
12  * generated here and by the relevant plugins.
13  *
14  * (Almost) all data is held directly by the state of the HTML controls, and
15  * can be updated to the form field by calling the 'update' method, which
16  * this code and the plugins call if any HTML control changes.
17  *
18  * @module moodle-core_availability-form
19  */
20 M.core_availability = M.core_availability || {};
22 /**
23  * Core static functions for availability settings in editing form.
24  *
25  * @class M.core_availability.form
26  * @static
27  */
28 M.core_availability.form = {
29     /**
30      * Object containing installed plugins. They are indexed by plugin name.
31      *
32      * @property plugins
33      * @type Object
34      */
35     plugins : {},
37     /**
38      * Availability field (textarea).
39      *
40      * @property field
41      * @type Y.Node
42      */
43     field : null,
45     /**
46      * Main div that replaces the availability field.
47      *
48      * @property mainDiv
49      * @type Y.Node
50      */
51     mainDiv : null,
53     /**
54      * Object that represents the root of the tree.
55      *
56      * @property rootList
57      * @type M.core_availability.List
58      */
59     rootList : null,
61     /**
62      * Counter used when creating anything that needs an id.
63      *
64      * @property idCounter
65      * @type Number
66      */
67     idCounter : 0,
69     /**
70      * The 'Restrict by group' button if present.
71      *
72      * @property restrictByGroup
73      * @type Y.Node
74      */
75     restrictByGroup : null,
77     /**
78      * Called to initialise the system when the page loads. This method will
79      * also call the init method for each plugin.
80      *
81      * @method init
82      */
83     init : function(pluginParams) {
84         // Init all plugins.
85         for(var plugin in pluginParams) {
86             var params = pluginParams[plugin];
87             var pluginClass = M[params[0]].form;
88             pluginClass.init.apply(pluginClass, params);
89         }
91         // Get the availability field, hide it, and replace with the main div.
92         this.field = Y.one('#id_availabilityconditionsjson');
93         this.field.setAttribute('aria-hidden', 'true');
94         // The fcontainer class here is inappropriate, but is necessary
95         // because otherwise it is impossible to make Behat work correctly on
96         // these controls as Behat incorrectly decides they're a moodleform
97         // textarea. IMO Behat should not know about moodleforms at all and
98         // should look purely at HTML elements on the page, but until it is
99         // fixed to do this or fixed in some other way to only detect moodleform
100         // elements that specifically match what those elements should look like,
101         // then there is no good solution.
102         this.mainDiv = Y.Node.create('<div class="availability-field fcontainer"></div>');
103         this.field.insert(this.mainDiv, 'after');
105         // Get top-level tree as JSON.
106         var value = this.field.get('value');
107         var data = null;
108         if (value !== '') {
109             try {
110                 data = Y.JSON.parse(value);
111             } catch(x) {
112                 // If the JSON data is not valid, treat it as empty.
113                 this.field.set('value', '');
114             }
115         }
116         this.rootList = new M.core_availability.List(data, true);
117         this.mainDiv.appendChild(this.rootList.node);
119         // Update JSON value after loading (to reflect any changes that need
120         // to be made to make it valid).
121         this.update();
122         this.rootList.renumber();
124         // Mark main area as dynamically updated.
125         this.mainDiv.setAttribute('aria-live', 'polite');
127         // Listen for form submission - to avoid having our made-up fields
128         // submitted, we need to disable them all before submit.
129         this.field.ancestor('form').on('submit', function() {
130             this.mainDiv.all('input,textarea,select').set('disabled', true);
131         }, this);
133         // If the form has group mode and/or grouping options, there is a
134         // 'add restriction' button there.
135         this.restrictByGroup = Y.one('#restrictbygroup');
136         if (this.restrictByGroup) {
137             this.restrictByGroup.on('click', this.addRestrictByGroup, this);
138             var groupmode = Y.one('#id_groupmode');
139             var groupingid = Y.one('#id_groupingid');
140             if (groupmode) {
141                 groupmode.on('change', this.updateRestrictByGroup, this);
142             }
143             if (groupingid) {
144                 groupingid.on('change', this.updateRestrictByGroup, this);
145             }
146             this.updateRestrictByGroup();
147         }
148     },
150     /**
151      * Called at any time to update the hidden field value.
152      *
153      * This should be called whenever any value changes in the form settings.
154      *
155      * @method update
156      */
157     update : function() {
158         // Convert tree to value.
159         var jsValue = this.rootList.getValue();
161         // Store any errors (for form reporting) in 'errors' value if present.
162         var errors = [];
163         this.rootList.fillErrors(errors);
164         if (errors.length !== 0) {
165             jsValue.errors = errors;
166         }
168         // Set into hidden form field, JS-encoded.
169         this.field.set('value', Y.JSON.stringify(jsValue));
171         // Also update the restrict by group button if present.
172         this.updateRestrictByGroup();
173     },
175     /**
176      * Updates the status of the 'restrict by group' button (enables or disables
177      * it) based on current availability restrictions and group/grouping settings.
178      */
179     updateRestrictByGroup : function() {
180         if (!this.restrictByGroup) {
181             return;
182         }
184         // If the root list is anything other than the default 'and' type, disable.
185         if (this.rootList.getValue().op !== '&') {
186             this.restrictByGroup.set('disabled', true);
187             return;
188         }
190         // If there's already a group restriction, disable it.
191         var alreadyGot = this.rootList.hasItemOfType('group') ||
192                 this.rootList.hasItemOfType('grouping');
193         if (alreadyGot) {
194             this.restrictByGroup.set('disabled', true);
195             return;
196         }
198         // If the groupmode and grouping id aren't set, disable it.
199         var groupmode = Y.one('#id_groupmode');
200         var groupingid = Y.one('#id_groupingid');
201         if ((!groupmode || Number(groupmode.get('value')) === 0) &&
202                 (!groupingid || Number(groupingid.get('value')) === 0)) {
203             this.restrictByGroup.set('disabled', true);
204             return;
205         }
207         this.restrictByGroup.set('disabled', false);
208     },
210     /**
211      * Called when the user clicks on the 'restrict by group' button. This is
212      * a special case that adds a group or grouping restriction.
213      *
214      * By default this restriction is not shown which makes it similar to the
215      *
216      * @param e Button click event
217      */
218     addRestrictByGroup : function(e) {
219         // If you don't prevent default, it submits the form for some reason.
220         e.preventDefault();
222         // Add the condition.
223         var groupingid = Y.one('#id_groupingid');
224         var newChild;
225         if (groupingid && Number(groupingid.get('value')) !== 0) {
226             // Add a grouping restriction if one is specified.
227             newChild = new M.core_availability.Item(
228                     {type : 'grouping', id : Number(groupingid.get('value'))}, true);
229         } else {
230             // Otherwise just add a group restriction.
231             newChild = new M.core_availability.Item({type : 'group'}, true);
232         }
234         // Refresh HTML.
235         this.rootList.addChild(newChild);
236         this.update();
237         this.rootList.renumber();
238         this.rootList.updateHtml();
239     }
240 };
243 /**
244  * Base object for plugins. Plugins should use Y.Object to extend this class.
245  *
246  * @class M.core_availability.plugin
247  * @static
248  */
249 M.core_availability.plugin = {
250     /**
251      * True if users are allowed to add items of this plugin at the moment.
252      *
253      * @property allowAdd
254      * @type Boolean
255      */
256     allowAdd : false,
258     /**
259      * Called (from PHP) to initialise the plugin. Should usually not be
260      * overridden by child plugin.
261      *
262      * @method init
263      * @param {String} component Component name e.g. 'availability_date'
264      */
265     init : function(component, allowAdd, params) {
266         var name = component.replace(/^availability_/, '');
267         this.allowAdd = allowAdd;
268         M.core_availability.form.plugins[name] = this;
269         this.initInner.apply(this, params);
270     },
272     /**
273      * Init method for plugin to override. (Default does nothing.)
274      *
275      * This method will receive any parameters defined in frontend.php
276      * get_javascript_init_params.
277      *
278      * @method initInner
279      * @protected
280      */
281     initInner : function() {
282     },
284     /**
285      * Gets a YUI node representing the controls for this plugin on the form.
286      *
287      * Must be implemented by sub-object; default throws an exception.
288      *
289      * @method getNode
290      * @return {Y.Node} YUI node
291      */
292     getNode : function() {
293         throw 'getNode not implemented';
294     },
296     /**
297      * Fills in the value from this plugin's controls into a value object,
298      * which will later be converted to JSON and stored in the form field.
299      *
300      * Must be implemented by sub-object; default throws an exception.
301      *
302      * @method fillValue
303      * @param {Object} value Value object (to be written to)
304      * @param {Y.Node} node YUI node (same one returned from getNode)
305      */
306     fillValue : function() {
307         throw 'fillValue not implemented';
308     },
310     /**
311      * Fills in any errors from this plugin's controls. If there are any
312      * errors, push them into the supplied array.
313      *
314      * Errors are Moodle language strings in format component:string, e.g.
315      * 'availability_date:error_date_past_end_of_world'.
316      *
317      * The default implementation does nothing.
318      *
319      * @method fillErrors
320      * @param {Array} errors Array of errors (push new errors here)
321      * @param {Y.Node} node YUI node (same one returned from getNode)
322      */
323     fillErrors : function() {
324     },
326     /**
327      * Focuses the first thing in the plugin after it has been added.
328      *
329      * The default implementation uses a simple algorithm to identify the
330      * first focusable input/select and then focuses it.
331      */
332     focusAfterAdd : function(node) {
333         var target = node.one('input:not([disabled]),select:not([disabled])');
334         target.focus();
335     }
336 };
339 /**
340  * Maintains a list of children and settings for how they are combined.
341  *
342  * @class M.core_availability.List
343  * @constructor
344  * @param {Object} json Decoded JSON value
345  * @param {Boolean} [false] root True if this is root level list
346  * @param {Boolean} [false] root True if parent is root level list
347  */
348 M.core_availability.List = function(json, root, parentRoot) {
349     // Set default value for children. (You can't do this in the prototype
350     // definition, or it ends up sharing the same array between all of them.)
351     this.children = [];
353     if (root !== undefined) {
354         this.root = root;
355     }
356     var strings = M.str.availability;
357     // Create DIV structure (without kids).
358     this.node = Y.Node.create('<div class="availability-list"><h3 class="accesshide"></h3>' +
359             '<div class="availability-inner">' +
360             '<div class="availability-header">' + strings.listheader_sign_before +
361             ' <label><span class="accesshide">' + strings.label_sign +
362             ' </span><select class="availability-neg" title="' + strings.label_sign + '">' +
363             '<option value="">' + strings.listheader_sign_pos + '</option>' +
364             '<option value="!">' + strings.listheader_sign_neg + '</option></select></label> ' +
365             '<span class="availability-single">' + strings.listheader_single + '</span>' +
366             '<span class="availability-multi">' + strings.listheader_multi_before +
367             ' <label><span class="accesshide">' + strings.label_multi + ' </span>' +
368             '<select class="availability-op" title="' + strings.label_multi + '"><option value="&">' +
369             strings.listheader_multi_and + '</option>' +
370             '<option value="|">' + strings.listheader_multi_or + '</option></select></label> ' +
371             strings.listheader_multi_after + '</span></div>' +
372             '<div class="availability-children"></div>' +
373             '<div class="availability-none">' + M.str.moodle.none + '</div>' +
374             '<div class="availability-button"></div></div></div>');
375     if (!root) {
376         this.node.addClass('availability-childlist');
377     }
378     this.inner = this.node.one('> .availability-inner');
380     var shown = true;
381     if (root) {
382         // If it's the root, add an eye icon as first thing in header.
383         if (json && json.show !== undefined) {
384             shown = json.show;
385         }
386         this.eyeIcon = new M.core_availability.EyeIcon(false, shown);
387         this.node.one('.availability-header').get('firstChild').insert(
388                 this.eyeIcon.span, 'before');
389     } else if (parentRoot) {
390         // When the parent is root, add an eye icon before the main list div.
391         if (json && json.showc !== undefined) {
392             shown = json.showc;
393         }
394         this.eyeIcon = new M.core_availability.EyeIcon(false, shown);
395         this.inner.insert(this.eyeIcon.span, 'before');
396     }
398     if (!root) {
399         // If it's not the root, add a delete button to the 'none' option.
400         // You can only delete lists when they have no children so this will
401         // automatically appear at the correct time.
402         var deleteIcon = new M.core_availability.DeleteIcon(this);
403         var noneNode = this.node.one('.availability-none');
404         noneNode.appendChild(document.createTextNode(' '));
405         noneNode.appendChild(deleteIcon.span);
407         // Also if it's not the root, none is actually invalid, so add a label.
408         noneNode.appendChild(Y.Node.create('<span class="label label-warning">' +
409                 M.str.availability.invalid + '</span>'));
410     }
412     // Create the button and add it.
413     var button = Y.Node.create('<button type="button" class="btn btn-default">' +
414             M.str.availability.addrestriction + '</button>');
415     button.on("click", function() { this.clickAdd(); }, this);
416     this.node.one('div.availability-button').appendChild(button);
418     if (json) {
419         // Set operator from JSON data.
420         switch (json.op) {
421             case '&' :
422             case '|' :
423                 this.node.one('.availability-neg').set('value', '');
424                 break;
425             case '!&' :
426             case '!|' :
427                 this.node.one('.availability-neg').set('value', '!');
428                 break;
429         }
430         switch (json.op) {
431             case '&' :
432             case '!&' :
433                 this.node.one('.availability-op').set('value', '&');
434                 break;
435             case '|' :
436             case '!|' :
437                 this.node.one('.availability-op').set('value', '|');
438                 break;
439         }
441         // Construct children.
442         for (var i = 0; i < json.c.length; i++) {
443             var child = json.c[i];
444             if (this.root && json && json.showc !== undefined) {
445                 child.showc = json.showc[i];
446             }
447             var newItem;
448             if (child.type !== undefined) {
449                 // Plugin type.
450                 newItem = new M.core_availability.Item(child, this.root);
451             } else {
452                 // List type.
453                 newItem = new M.core_availability.List(child, false, this.root);
454             }
455             this.addChild(newItem);
456         }
457     }
459     // Add update listeners to the dropdowns.
460     this.node.one('.availability-neg').on('change', function() {
461         // Update hidden field and HTML.
462         M.core_availability.form.update();
463         this.updateHtml();
464     }, this);
465     this.node.one('.availability-op').on('change', function() {
466         // Update hidden field.
467         M.core_availability.form.update();
468         this.updateHtml();
469     }, this);
471     // Update HTML to hide unnecessary parts.
472     this.updateHtml();
473 };
475 /**
476  * Adds a child to the end of the list (in HTML and stored data).
477  *
478  * @method addChild
479  * @private
480  * @param {M.core_availability.Item|M.core_availability.List} newItem Child to add
481  */
482 M.core_availability.List.prototype.addChild = function(newItem) {
483     if (this.children.length > 0) {
484         // Create connecting label (text will be filled in later by updateHtml).
485         this.inner.one('.availability-children').appendChild(Y.Node.create(
486                 '<div class="availability-connector">' +
487                 '<span class="label"></span>' +
488                 '</div>'));
489     }
490     // Add item to array and to HTML.
491     this.children.push(newItem);
492     this.inner.one('.availability-children').appendChild(newItem.node);
493 };
495 /**
496  * Focuses something after a new list is added.
497  *
498  * @method focusAfterAdd
499  */
500 M.core_availability.List.prototype.focusAfterAdd = function() {
501     this.inner.one('button').focus();
502 };
504 /**
505  * Checks whether this list uses the individual show icons or the single one.
506  *
507  * (Basically, AND and the equivalent NOT OR list can have individual show icons
508  * so that you hide the activity entirely if a user fails one condition, but
509  * may display it with information about the condition if they fail a different
510  * one. That isn't possible with OR and NOT AND because for those types, there
511  * is not really a concept of which single condition caused the user to fail
512  * it.)
513  *
514  * Method can only be called on the root list.
515  *
516  * @method isIndividualShowIcons
517  * @return {Boolean} True if using the individual icons
518  */
519 M.core_availability.List.prototype.isIndividualShowIcons = function() {
520     if (!this.root) {
521         throw 'Can only call this on root list';
522     }
523     var neg = this.node.one('.availability-neg').get('value') === '!';
524     var isor = this.node.one('.availability-op').get('value') === '|';
525     return (!neg && !isor) || (neg && isor);
526 };
528 /**
529  * Renumbers the list and all children.
530  *
531  * @method renumber
532  * @param {String} parentNumber Number to use in heading for this list
533  */
534 M.core_availability.List.prototype.renumber = function(parentNumber) {
535     // Update heading for list.
536     var headingParams = { count: this.children.length };
537     var prefix;
538     if (parentNumber === undefined) {
539         headingParams.number = '';
540         prefix = '';
541     } else {
542         headingParams.number = parentNumber + ':';
543         prefix = parentNumber + '.';
544     }
545     var heading = M.util.get_string('setheading', 'availability', headingParams);
546     this.node.one('> h3').set('innerHTML', heading);
548     // Do children.
549     for (var i = 0; i < this.children.length; i++) {
550         var child = this.children[i];
551         child.renumber(prefix + (i + 1));
552     }
553 };
555 /**
556  * Updates HTML for the list based on the current values, for example showing
557  * the 'None' text if there are no children.
558  *
559  * @method updateHtml
560  */
561 M.core_availability.List.prototype.updateHtml = function() {
562     // Control children appearing or not appearing.
563     if (this.children.length > 0) {
564         this.inner.one('> .availability-children').removeAttribute('aria-hidden');
565         this.inner.one('> .availability-none').setAttribute('aria-hidden', 'true');
566         this.inner.one('> .availability-header').removeAttribute('aria-hidden');
567         if (this.children.length > 1) {
568             this.inner.one('.availability-single').setAttribute('aria-hidden', 'true');
569             this.inner.one('.availability-multi').removeAttribute('aria-hidden');
570         } else {
571             this.inner.one('.availability-single').removeAttribute('aria-hidden');
572             this.inner.one('.availability-multi').setAttribute('aria-hidden', 'true');
573         }
574     } else {
575         this.inner.one('> .availability-children').setAttribute('aria-hidden', 'true');
576         this.inner.one('> .availability-none').removeAttribute('aria-hidden');
577         this.inner.one('> .availability-header').setAttribute('aria-hidden', 'true');
578     }
580     // For root list, control eye icons.
581     if (this.root) {
582         var showEyes = this.isIndividualShowIcons();
584         // Individual icons.
585         for (var i = 0; i < this.children.length; i++) {
586             var child = this.children[i];
587             if (showEyes) {
588                 child.eyeIcon.span.removeAttribute('aria-hidden');
589             } else {
590                 child.eyeIcon.span.setAttribute('aria-hidden', 'true');
591             }
592         }
594         // Single icon is the inverse.
595         if (showEyes) {
596             this.eyeIcon.span.setAttribute('aria-hidden', 'true');
597         } else {
598             this.eyeIcon.span.removeAttribute('aria-hidden');
599         }
600     }
602     // Update connector text.
603     var connectorText;
604     if (this.inner.one('.availability-op').get('value') === '&') {
605         connectorText = M.str.availability.and;
606     } else {
607         connectorText = M.str.availability.or;
608     }
609     this.inner.all('> .availability-children > .availability-connector span.label').each(function(span) {
610         span.set('innerHTML', connectorText);
611     });
612 };
614 /**
615  * Deletes a descendant item (Item or List). Called when the user clicks a
616  * delete icon.
617  *
618  * This is a recursive function.
619  *
620  * @method deleteDescendant
621  * @param {M.core_availability.Item|M.core_availability.List} descendant Item to delete
622  * @return {Boolean} True if it was deleted
623  */
624 M.core_availability.List.prototype.deleteDescendant = function(descendant) {
625     // Loop through children.
626     for (var i = 0; i < this.children.length; i++) {
627         var child = this.children[i];
628         if (child === descendant) {
629             // Remove from internal array.
630             this.children.splice(i, 1);
631             var target = child.node;
632             // Remove one of the connector nodes around target (if any left).
633             if (this.children.length > 0) {
634                 if (target.previous('.availability-connector')) {
635                     target.previous('.availability-connector').remove();
636                 } else {
637                     target.next('.availability-connector').remove();
638                 }
639             }
640             // Remove target itself.
641             this.inner.one('> .availability-children').removeChild(target);
642             // Update the form and the list HTML.
643             M.core_availability.form.update();
644             this.updateHtml();
645             // Focus add button for this list.
646             this.inner.one('> .availability-button').one('button').focus();
647             return true;
648         } else if (child instanceof M.core_availability.List) {
649             // Recursive call.
650             var found = child.deleteDescendant(descendant);
651             if (found) {
652                 return true;
653             }
654         }
655     }
657     return false;
658 };
660 /**
661  * Shows the 'add restriction' dialogue box.
662  *
663  * @method clickAdd
664  */
665 M.core_availability.List.prototype.clickAdd = function() {
666     var content = Y.Node.create('<div>' +
667             '<ul class="list-unstyled"></ul>' +
668             '<div class="availability-buttons mdl-align">' +
669             '<button type="button" class="btn btn-default">' + M.str.moodle.cancel +
670             '</button></div></div>');
671     var cancel = content.one('button');
673     // Make a list of all the dialog options.
674     var dialogRef = { dialog: null };
675     var ul = content.one('ul');
676     var li, id, button, label;
677     for (var type in M.core_availability.form.plugins) {
678         // Plugins might decide not to display their add button.
679         if (!M.core_availability.form.plugins[type].allowAdd) {
680             continue;
681         }
682         // Add entry for plugin.
683         li = Y.Node.create('<li class="clearfix"></li>');
684         id = 'availability_addrestriction_' + type;
685         var pluginStrings = M.str['availability_' + type];
686         button = Y.Node.create('<button type="button" class="btn btn-default"' +
687                 'id="' + id + '">' + pluginStrings.title + '</button>');
688         button.on('click', this.getAddHandler(type, dialogRef), this);
689         li.appendChild(button);
690         label = Y.Node.create('<label for="' + id + '">' +
691                 pluginStrings.description + '</label>');
692         li.appendChild(label);
693         ul.appendChild(li);
694     }
695     // Extra entry for lists.
696     li = Y.Node.create('<li class="clearfix"></li>');
697     id = 'availability_addrestriction_list_';
698     button = Y.Node.create('<button type="button" class="btn btn-default"' +
699             'id="' + id + '">' + M.str.availability.condition_group + '</button>');
700     button.on('click', this.getAddHandler(null, dialogRef), this);
701     li.appendChild(button);
702     label = Y.Node.create('<label for="' + id + '">' +
703             M.str.availability.condition_group_info + '</label>');
704     li.appendChild(label);
705     ul.appendChild(li);
707     var config = {
708         headerContent : M.str.availability.addrestriction,
709         bodyContent : content,
710         additionalBaseClass : 'availability-dialogue',
711         draggable : true,
712         modal : true,
713         closeButton : false,
714         width : '450px'
715     };
716     dialogRef.dialog = new M.core.dialogue(config);
717     dialogRef.dialog.show();
718     cancel.on('click', function() {
719         dialogRef.dialog.destroy();
720         // Focus the button they clicked originally.
721         this.inner.one('> .availability-button').one('button').focus();
722     }, this);
723 };
725 /**
726  * Gets an add handler function used by the dialogue to add a particular item.
727  *
728  * @method getAddHandler
729  * @param {String|Null} type Type name of plugin or null to add lists
730  * @param {Object} dialogRef Reference to object that contains dialog
731  * @param {M.core.dialogue} dialogRef.dialog Dialog object
732  * @return {Function} Add handler function to call when adding that thing
733  */
734 M.core_availability.List.prototype.getAddHandler = function(type, dialogRef) {
735     return function() {
736         if (type) {
737             // Create an Item object to represent the child.
738             newItem = new M.core_availability.Item({ type: type, creating: true }, this.root);
739         } else {
740             // Create a new List object to represent the child.
741             newItem = new M.core_availability.List({ c: [], showc: true }, false, this.root);
742         }
743         // Add to list.
744         this.addChild(newItem);
745         // Update the form and list HTML.
746         M.core_availability.form.update();
747         M.core_availability.form.rootList.renumber();
748         this.updateHtml();
749         // Hide dialog.
750         dialogRef.dialog.destroy();
751         newItem.focusAfterAdd();
752     };
753 };
755 /**
756  * Gets the value of the list ready to convert to JSON and fill form field.
757  *
758  * @method getValue
759  * @return {Object} Value of list suitable for use in JSON
760  */
761 M.core_availability.List.prototype.getValue = function() {
762     // Work out operator from selects.
763     var value = {};
764     value.op = this.node.one('.availability-neg').get('value') +
765             this.node.one('.availability-op').get('value');
767     // Work out children from list.
768     value.c = [];
769     var i;
770     for (i = 0; i < this.children.length; i++) {
771         value.c.push(this.children[i].getValue());
772     }
774     // Work out show/showc for root level.
775     if (this.root) {
776         if (this.isIndividualShowIcons()) {
777             value.showc = [];
778             for (i = 0; i < this.children.length; i++) {
779                 value.showc.push(!this.children[i].eyeIcon.isHidden());
780             }
781         } else {
782             value.show = !this.eyeIcon.isHidden();
783         }
784     }
785     return value;
786 };
788 /**
789  * Checks whether this list has any errors (incorrect user input). If so,
790  * an error string identifier in the form langfile:langstring should be pushed
791  * into the errors array.
792  *
793  * @method fillErrors
794  * @param {Array} errors Array of errors so far
795  */
796 M.core_availability.List.prototype.fillErrors = function(errors) {
797     // List with no items is an error (except root).
798     if (this.children.length === 0 && !this.root) {
799         errors.push('availability:error_list_nochildren');
800     }
801     // Pass to children.
802     for (var i = 0; i < this.children.length; i++) {
803         this.children[i].fillErrors(errors);
804     }
805 };
807 /**
808  * Checks whether the list contains any items of the given type name.
809  *
810  * @method hasItemOfType
811  * @param {String} pluginType Required plugin type (name)
812  * @return {Boolean} True if there is one
813  */
814 M.core_availability.List.prototype.hasItemOfType = function(pluginType) {
815     // Check each item.
816     for (var i = 0; i < this.children.length; i++) {
817         var child = this.children[i];
818         if (child instanceof M.core_availability.List) {
819             // Recursive call.
820             if (child.hasItemOfType(pluginType)) {
821                 return true;
822             }
823         } else {
824             if (child.pluginType === pluginType) {
825                 return true;
826             }
827         }
828     }
829     return false;
830 };
832 /**
833  * Eye icon for this list (null if none).
834  *
835  * @property eyeIcon
836  * @type M.core_availability.EyeIcon
837  */
838 M.core_availability.List.prototype.eyeIcon = null;
840 /**
841  * True if list is special root level list.
842  *
843  * @property root
844  * @type Boolean
845  */
846 M.core_availability.List.prototype.root = false;
848 /**
849  * Array containing children (Lists or Items).
850  *
851  * @property children
852  * @type M.core_availability.List[]|M.core_availability.Item[]
853  */
854 M.core_availability.List.prototype.children = null;
856 /**
857  * HTML outer node for list.
858  *
859  * @property node
860  * @type Y.Node
861  */
862 M.core_availability.List.prototype.node = null;
864 /**
865  * HTML node for inner div that actually is the displayed list.
866  *
867  * @property node
868  * @type Y.Node
869  */
870 M.core_availability.List.prototype.inner = null;
873 /**
874  * Represents a single condition.
875  *
876  * @class M.core_availability.Item
877  * @constructor
878  * @param {Object} json Decoded JSON value
879  * @param {Boolean} root True if this item is a child of the root list.
880  */
881 M.core_availability.Item = function(json, root) {
882     this.pluginType = json.type;
883     if (M.core_availability.form.plugins[json.type] === undefined) {
884         // Handle undefined plugins.
885         this.plugin = null;
886         this.pluginNode = Y.Node.create('<div class="availability-warning">' +
887                 M.str.availability.missingplugin + '</div>');
888     } else {
889         // Plugin is known.
890         this.plugin = M.core_availability.form.plugins[json.type];
891         this.pluginNode = this.plugin.getNode(json);
893         // Add a class with the plugin Frankenstyle name to make CSS easier in plugin.
894         this.pluginNode.addClass('availability_' + json.type);
895     }
897     this.node = Y.Node.create('<div class="availability-item"><h3 class="accesshide"></h3></div>');
899     // Add eye icon if required. This icon is added for root items, but may be
900     // hidden depending on the selected list operator.
901     if (root) {
902         var shown = true;
903         if(json.showc !== undefined) {
904             shown = json.showc;
905         }
906         this.eyeIcon = new M.core_availability.EyeIcon(true, shown);
907         this.node.appendChild(this.eyeIcon.span);
908     }
910     // Add plugin controls.
911     this.pluginNode.addClass('availability-plugincontrols');
912     this.node.appendChild(this.pluginNode);
914     // Add delete button for node.
915     var deleteIcon = new M.core_availability.DeleteIcon(this);
916     this.node.appendChild(deleteIcon.span);
918     // Add the invalid marker (empty).
919     this.node.appendChild(document.createTextNode(' '));
920     this.node.appendChild(Y.Node.create('<span class="label label-warning"/>'));
921 };
923 /**
924  * Obtains the value of this condition, which will be serialized into JSON
925  * format and stored in the form.
926  *
927  * @method getValue
928  * @return {Object} JavaScript object containing value of this item
929  */
930 M.core_availability.Item.prototype.getValue = function() {
931     value = { 'type' : this.pluginType };
932     if (this.plugin) {
933         this.plugin.fillValue(value, this.pluginNode);
934     }
935     return value;
936 };
938 /**
939  * Checks whether this condition has any errors (incorrect user input). If so,
940  * an error string identifier in the form langfile:langstring should be pushed
941  * into the errors array.
942  *
943  * @method fillErrors
944  * @param {Array} errors Array of errors so far
945  */
946 M.core_availability.Item.prototype.fillErrors = function(errors) {
947     var before = errors.length;
948     if (this.plugin) {
949         // Pass to plugin.
950         this.plugin.fillErrors(errors, this.pluginNode);
951     } else {
952         // Unknown plugin is an error
953         errors.push('core_availability:item_unknowntype');
954     }
955     // If any errors were added, add the marker to this item.
956     var errorLabel = this.node.one('> .label-warning');
957     if (errors.length !== before && !errorLabel.get('firstChild')) {
958         errorLabel.appendChild(document.createTextNode(M.str.availability.invalid));
959     } else if (errors.length === before && errorLabel.get('firstChild')) {
960         errorLabel.get('firstChild').remove();
961     }
962 };
964 /**
965  * Renumbers the item.
966  *
967  * @method renumber
968  * @param {String} number Number to use in heading for this item
969  */
970 M.core_availability.Item.prototype.renumber = function(number) {
971     // Update heading for item.
972     var headingParams = { number: number };
973     if (this.plugin) {
974         headingParams.type = M.str['availability_' + this.pluginType].title;
975     } else {
976         headingParams.type = '[' + this.pluginType + ']';
977     }
978     headingParams.number = number + ':';
979     var heading = M.util.get_string('itemheading', 'availability', headingParams);
980     this.node.one('> h3').set('innerHTML', heading);
981 };
983 /**
984  * Focuses something after a new item is added.
985  *
986  * @method focusAfterAdd
987  */
988 M.core_availability.Item.prototype.focusAfterAdd = function() {
989     this.plugin.focusAfterAdd(this.pluginNode);
990 };
992 /**
993  * Name of plugin.
994  *
995  * @property pluginType
996  * @type String
997  */
998 M.core_availability.Item.prototype.pluginType = null;
1000 /**
1001  * Object representing plugin form controls.
1002  *
1003  * @property plugin
1004  * @type Object
1005  */
1006 M.core_availability.Item.prototype.plugin = null;
1008 /**
1009  * Eye icon for item.
1010  *
1011  * @property eyeIcon
1012  * @type M.core_availability.EyeIcon
1013  */
1014 M.core_availability.Item.prototype.eyeIcon = null;
1016 /**
1017  * HTML node for item.
1018  *
1019  * @property node
1020  * @type Y.Node
1021  */
1022 M.core_availability.Item.prototype.node = null;
1024 /**
1025  * Inner part of node that is owned by plugin.
1026  *
1027  * @property pluginNode
1028  * @type Y.Node
1029  */
1030 M.core_availability.Item.prototype.pluginNode = null;
1033 /**
1034  * Eye icon (to control show/hide of the activity if the user fails a condition).
1035  *
1036  * There are individual eye icons (show/hide control for a single condition) and
1037  * 'all' eye icons (show/hide control that applies to the entire item, whatever
1038  * reason it fails for). This is necessary because the individual conditions
1039  * don't make sense for OR and AND NOT lists.
1040  *
1041  * @class M.core_availability.EyeIcon
1042  * @constructor
1043  * @param {Boolean} individual True if the icon is controlling a single condition
1044  * @param {Boolean} shown True if icon is initially in shown state
1045  */
1046 M.core_availability.EyeIcon = function(individual, shown) {
1047     this.individual = individual;
1048     this.span = Y.Node.create('<a class="availability-eye" href="#" role="button">');
1049     var icon = Y.Node.create('<img />');
1050     this.span.appendChild(icon);
1052     // Set up button text and icon.
1053     var suffix = individual ? '_individual' : '_all';
1054     var setHidden = function() {
1055         icon.set('src', M.util.image_url('i/show', 'core'));
1056         icon.set('alt', M.str.availability['hidden' + suffix]);
1057         this.span.set('title', M.str.availability['hidden' + suffix] + ' \u2022 ' +
1058                 M.str.availability.show_verb);
1059     };
1060     var setShown = function() {
1061         icon.set('src', M.util.image_url('i/hide', 'core'));
1062         icon.set('alt', M.str.availability['shown' + suffix]);
1063         this.span.set('title', M.str.availability['shown' + suffix] + ' \u2022 ' +
1064                 M.str.availability.hide_verb);
1065     };
1066     if(shown) {
1067         setShown.call(this);
1068     } else {
1069         setHidden.call(this);
1070     }
1072     // Update when button is clicked.
1073     var click = function(e) {
1074         e.preventDefault();
1075         if (this.isHidden()) {
1076             setShown.call(this);
1077         } else {
1078             setHidden.call(this);
1079         }
1080         M.core_availability.form.update();
1081     };
1082     this.span.on('click', click, this);
1083     this.span.on('key', click, 'up:32', this);
1084     this.span.on('key', function(e) { e.preventDefault(); }, 'down:32', this);
1085 };
1087 /**
1088  * True if this eye icon is an individual one (see above).
1089  *
1090  * @property individual
1091  * @type Boolean
1092  */
1093 M.core_availability.EyeIcon.prototype.individual = false;
1095 /**
1096  * YUI node for the span that contains this icon.
1097  *
1098  * @property span
1099  * @type Y.Node
1100  */
1101 M.core_availability.EyeIcon.prototype.span = null;
1103 /**
1104  * Checks the current state of the icon.
1105  *
1106  * @method isHidden
1107  * @return {Boolean} True if this icon is set to 'hidden'
1108  */
1109 M.core_availability.EyeIcon.prototype.isHidden = function() {
1110     var suffix = this.individual ? '_individual' : '_all';
1111     var compare = M.str.availability['hidden' + suffix];
1112     return this.span.one('img').get('alt') === compare;
1113 };
1116 /**
1117  * Delete icon (to delete an Item or List).
1118  *
1119  * @class M.core_availability.DeleteIcon
1120  * @constructor
1121  * @param {M.core_availability.Item|M.core_availability.List} toDelete Thing to delete
1122  */
1123 M.core_availability.DeleteIcon = function(toDelete) {
1124     this.span = Y.Node.create('<a class="availability-delete" href="#" title="' +
1125             M.str.moodle['delete'] + '" role="button">');
1126     var img = Y.Node.create('<img src="' + M.util.image_url('t/delete', 'core') +
1127             '" alt="' + M.str.moodle['delete'] + '" />');
1128     this.span.appendChild(img);
1129     var click = function(e) {
1130         e.preventDefault();
1131         M.core_availability.form.rootList.deleteDescendant(toDelete);
1132         M.core_availability.form.rootList.renumber();
1133     };
1134     this.span.on('click', click, this);
1135     this.span.on('key', click, 'up:32', this);
1136     this.span.on('key', function(e) { e.preventDefault(); }, 'down:32', this);
1137 };
1139 /**
1140  * YUI node for the span that contains this icon.
1141  *
1142  * @property span
1143  * @type Y.Node
1144  */
1145 M.core_availability.DeleteIcon.prototype.span = null;
1148 }, '@VERSION@', {"requires": ["base", "node", "event", "panel", "moodle-core-notification-dialogue", "json"]});