MDL-52127 js: check YUI modules with eslint
[moodle.git] / lib / yui / build / moodle-core-notification-dialogue / moodle-core-notification-dialogue-debug.js
CommitLineData
78686995
AN
1YUI.add('moodle-core-notification-dialogue', function (Y, NAME) {
2
a1587268 3/* eslint-disable */
78686995
AN
4var DIALOGUE_PREFIX,
5 BASE,
78686995
AN
6 CONFIRMYES,
7 CONFIRMNO,
8 TITLE,
9 QUESTION,
10 CSS;
11
12DIALOGUE_PREFIX = 'moodle-dialogue',
13BASE = 'notificationBase',
78686995
AN
14CONFIRMYES = 'yesLabel',
15CONFIRMNO = 'noLabel',
16TITLE = 'title',
17QUESTION = 'question',
18CSS = {
19 BASE : 'moodle-dialogue-base',
20 WRAP : 'moodle-dialogue-wrap',
21 HEADER : 'moodle-dialogue-hd',
22 BODY : 'moodle-dialogue-bd',
23 CONTENT : 'moodle-dialogue-content',
24 FOOTER : 'moodle-dialogue-ft',
25 HIDDEN : 'hidden',
26 LIGHTBOX : 'moodle-dialogue-lightbox'
27};
28
29// Set up the namespace once.
30M.core = M.core || {};
31/**
32 * The generic dialogue class for use in Moodle.
33 *
34 * @module moodle-core-notification
35 * @submodule moodle-core-notification-dialogue
36 */
37
38var DIALOGUE_NAME = 'Moodle dialogue',
bf7c86cf 39 DIALOGUE,
f2b235cb
SH
40 DIALOGUE_FULLSCREEN_CLASS = DIALOGUE_PREFIX + '-fullscreen',
41 DIALOGUE_HIDDEN_CLASS = DIALOGUE_PREFIX + '-hidden',
f2b235cb 42 DIALOGUE_SELECTOR =' [role=dialog]',
586d393f 43 MENUBAR_SELECTOR = '[role=menubar]',
ecf02bf5
BB
44 DOT = '.',
45 HAS_ZINDEX = 'moodle-has-zindex',
586d393f 46 CAN_RECEIVE_FOCUS_SELECTOR = 'input:not([type="hidden"]), a[href], button, textarea, select, [tabindex]';
78686995
AN
47
48/**
49 * A re-usable dialogue box with Moodle classes applied.
50 *
4246e5c7 51 * @param {Object} c Object literal specifying the dialogue configuration properties.
78686995
AN
52 * @constructor
53 * @class M.core.dialogue
1f777e5c 54 * @extends Panel
78686995 55 */
4246e5c7
AN
56DIALOGUE = function(c) {
57 var config = Y.clone(c);
d10e6118
AN
58 config.COUNT = Y.stamp(this);
59 var id = 'moodle-dialogue-' + config.COUNT;
78686995
AN
60 config.notificationBase =
61 Y.Node.create('<div class="'+CSS.BASE+'">')
557f44d9
AN
62 .append(Y.Node.create('<div id="' + id + '" role="dialog" ' +
63 'aria-labelledby="' + id + '-header-text" class="' + CSS.WRAP + '"></div>')
64 .append(Y.Node.create('<div id="' + id + '-header-text" class="'+CSS.HEADER+' yui3-widget-hd"></div>'))
78686995
AN
65 .append(Y.Node.create('<div class="'+CSS.BODY+' yui3-widget-bd"></div>'))
66 .append(Y.Node.create('<div class="'+CSS.FOOTER+' yui3-widget-ft"></div>')));
67 Y.one(document.body).append(config.notificationBase);
b59f2e3b
SH
68
69 if (config.additionalBaseClass) {
70 config.notificationBase.addClass(config.additionalBaseClass);
71 }
72
78686995 73 config.srcNode = '#'+id;
78686995 74
78686995
AN
75 // closeButton param to keep the stable versions API.
76 if (config.closeButton === false) {
77 config.buttons = null;
78 } else {
79 config.buttons = [
80 {
81 section: Y.WidgetStdMod.HEADER,
82 classNames: 'closebutton',
83 action: function () {
84 this.hide();
85 }
86 }
87 ];
88 }
89 DIALOGUE.superclass.constructor.apply(this, [config]);
90
91 if (config.closeButton !== false) {
92 // The buttons constructor does not allow custom attributes
93 this.get('buttons').header[0].setAttribute('title', this.get('closeButtonTitle'));
94 }
95};
96Y.extend(DIALOGUE, Y.Panel, {
d61c96b6
DW
97 // Window resize event listener.
98 _resizeevent : null,
99 // Orientation change event listener.
100 _orientationevent : null,
1389bcd7 101 _calculatedzindex : false,
1f777e5c 102
d247a501
AN
103 /**
104 * The original position of the dialogue before it was reposition to
105 * avoid browser jumping.
106 *
107 * @property _originalPosition
108 * @protected
109 * @type Array
110 */
111 _originalPosition: null,
112
f8f477ec
RW
113 /**
114 * The list of elements that have been aria hidden when displaying
115 * this dialogue.
116 *
117 * @property _hiddenSiblings
118 * @protected
119 * @type Array
120 */
121 _hiddenSiblings: null,
122
bf7c86cf
DW
123 /**
124 * Initialise the dialogue.
125 *
126 * @method initializer
bf7c86cf 127 */
2f5c1441 128 initializer : function() {
bf7c86cf
DW
129 var bb;
130
f8f477ec
RW
131 // Initialise the element cache.
132 this._hiddenSiblings = [];
133
d9bf4be4
SH
134 if (this.get('render')) {
135 this.render();
136 }
bf7c86cf 137 this.after('visibleChange', this.visibilityChanged, this);
2f5c1441 138 if (this.get('center')) {
dd66b6ab
DW
139 this.centerDialogue();
140 }
78686995 141
73747aea 142 if (this.get('modal')) {
f56ae5a7
RW
143 // If we're a modal then make sure our container is ARIA
144 // hidden by default. ARIA visibility is managed for modal dialogues.
145 this.get(BASE).set('aria-hidden', 'true');
73747aea
AN
146 this.plug(Y.M.core.LockScroll);
147 }
148
78686995
AN
149 // Workaround upstream YUI bug http://yuilibrary.com/projects/yui3/ticket/2532507
150 // and allow setting of z-index in theme.
d61c96b6 151 bb = this.get('boundingBox');
ecf02bf5 152 bb.addClass(HAS_ZINDEX);
bf7c86cf 153
2f5c1441
AN
154 // Add any additional classes that were specified.
155 Y.Array.each(this.get('extraClasses'), bb.addClass, bb);
156
157 if (this.get('visible')) {
bf7c86cf
DW
158 this.applyZIndex();
159 }
1389bcd7
JF
160 // Recalculate the zIndex every time the modal is altered.
161 this.on('maskShow', this.applyZIndex);
d247a501
AN
162
163 this.on('maskShow', function() {
164 // When the mask shows, position the boundingBox at the top-left of the window such that when it is
165 // focused, the position does not change.
166 var w = Y.one(Y.config.win),
167 bb = this.get('boundingBox');
168
169 if (!this.get('center')) {
170 this._originalPosition = bb.getXY();
171 }
2af57bdb
AN
172
173 if (bb.getStyle('position') !== 'fixed') {
174 // If the boundingBox has been positioned in a fixed manner, then it will not position correctly to scrollTop.
175 bb.setStyles({
176 top: w.get('scrollTop'),
177 left: w.get('scrollLeft')
178 });
179 }
d247a501 180 }, this);
0860dd78
AN
181
182 // Remove the dialogue from the DOM when it is destroyed.
183 this.after('destroyedChange', function(){
184 this.get(BASE).remove(true);
185 }, this);
bf7c86cf
DW
186 },
187
188 /**
189 * Either set the zindex to the supplied value, or set it to one more than the highest existing
190 * dialog in the page.
191 *
1f777e5c 192 * @method applyZIndex
bf7c86cf
DW
193 */
194 applyZIndex : function() {
1389bcd7
JF
195 var highestzindex = 1,
196 zindexvalue = 1,
f2b235cb 197 bb = this.get('boundingBox'),
1389bcd7 198 ol = this.get('maskNode'),
f2b235cb 199 zindex = this.get('zIndex');
1389bcd7 200 if (zindex !== 0 && !this._calculatedzindex) {
bf7c86cf 201 // The zindex was specified so we should use that.
f2b235cb 202 bb.setStyle('zIndex', zindex);
bf7c86cf 203 } else {
f2b235cb 204 // Determine the correct zindex by looking at all existing dialogs and menubars in the page.
ecf02bf5 205 Y.all(DIALOGUE_SELECTOR + ', ' + MENUBAR_SELECTOR + ', ' + DOT + HAS_ZINDEX).each(function (node) {
f2b235cb
SH
206 var zindex = this.findZIndex(node);
207 if (zindex > highestzindex) {
208 highestzindex = zindex;
bf7c86cf 209 }
f2b235cb 210 }, this);
bf7c86cf 211 // Only set the zindex if we found a wrapper.
1389bcd7
JF
212 zindexvalue = (highestzindex + 1).toString();
213 bb.setStyle('zIndex', zindexvalue);
1389bcd7 214 this.set('zIndex', zindexvalue);
0ef60744
AN
215 if (this.get('modal')) {
216 ol.setStyle('zIndex', zindexvalue);
5298d02f 217
218 // In IE8, the z-indexes do not take effect properly unless you toggle
219 // the lightbox from 'fixed' to 'static' and back. This code does so
220 // using the minimum setTimeouts that still actually work.
221 if (Y.UA.ie && Y.UA.compareVersions(Y.UA.ie, 9) < 0) {
222 setTimeout(function() {
223 ol.setStyle('position', 'static');
224 setTimeout(function() {
225 ol.setStyle('position', 'fixed');
226 }, 0);
227 }, 0);
228 }
0ef60744 229 }
1389bcd7 230 this._calculatedzindex = true;
bf7c86cf
DW
231 }
232 },
233
f2b235cb
SH
234 /**
235 * Finds the zIndex of the given node or its parent.
236 *
237 * @method findZIndex
1f777e5c
AN
238 * @param {Node} node The Node to apply the zIndex to.
239 * @return {Number} Either the zIndex, or 0 if one was not found.
f2b235cb
SH
240 */
241 findZIndex : function(node) {
242 // In most cases the zindex is set on the parent of the dialog.
243 var zindex = node.getStyle('zIndex') || node.ancestor().getStyle('zIndex');
244 if (zindex) {
245 return parseInt(zindex, 10);
246 }
247 return 0;
248 },
249
bf7c86cf
DW
250 /**
251 * Event listener for the visibility changed event.
252 *
253 * @method visibilityChanged
1f777e5c 254 * @param {EventFacade} e
bf7c86cf 255 */
78686995 256 visibilityChanged : function(e) {
586d393f 257 var titlebar, bb;
78686995
AN
258 if (e.attrName === 'visible') {
259 this.get('maskNode').addClass(CSS.LIGHTBOX);
f8f477ec 260 // Going from visible to hidden.
d61c96b6 261 if (e.prevVal && !e.newVal) {
586d393f 262 bb = this.get('boundingBox');
d61c96b6
DW
263 if (this._resizeevent) {
264 this._resizeevent.detach();
265 this._resizeevent = null;
266 }
267 if (this._orientationevent) {
268 this._orientationevent.detach();
269 this._orientationevent = null;
270 }
586d393f 271 bb.detach('key', this.keyDelegation);
f8f477ec
RW
272
273 if (this.get('modal')) {
274 // Hide this dialogue from screen readers.
275 this.setAccessibilityHidden();
276 }
d61c96b6 277 }
f8f477ec 278 // Going from hidden to visible.
bf7c86cf
DW
279 if (!e.prevVal && e.newVal) {
280 // This needs to be done each time the dialog is shown as new dialogs may have been opened.
281 this.applyZIndex();
282 // This needs to be done each time the dialog is shown as the window may have been resized.
283 this.makeResponsive();
284 if (!this.shouldResizeFullscreen()) {
285 if (this.get('draggable')) {
286 titlebar = '#' + this.get('id') + ' .' + CSS.HEADER;
287 this.plug(Y.Plugin.Drag, {handles : [titlebar]});
288 Y.one(titlebar).setStyle('cursor', 'move');
289 }
290 }
586d393f 291 this.keyDelegation();
f8f477ec
RW
292
293 // Only do accessibility hiding for modals because the ARIA spec
294 // says that all ARIA dialogues should be modal.
295 if (this.get('modal')) {
296 // Make this dialogue visible to screen readers.
297 this.setAccessibilityVisible();
298 }
bf7c86cf 299 }
78686995
AN
300 if (this.get('center') && !e.prevVal && e.newVal) {
301 this.centerDialogue();
302 }
78686995
AN
303 }
304 },
bf7c86cf
DW
305 /**
306 * If the responsive attribute is set on the dialog, and the window size is
307 * smaller than the responsive width - make the dialog fullscreen.
308 *
309 * @method makeResponsive
bf7c86cf
DW
310 */
311 makeResponsive : function() {
2af57bdb 312 var bb = this.get('boundingBox');
bf7c86cf
DW
313
314 if (this.shouldResizeFullscreen()) {
d61c96b6
DW
315 // Make this dialogue fullscreen on a small screen.
316 // Disable the page scrollbars.
bf7c86cf 317
d61c96b6
DW
318 // Size and position the fullscreen dialog.
319
2a808cef
DW
320 bb.addClass(DIALOGUE_FULLSCREEN_CLASS);
321 bb.setStyles({'left' : null,
322 'top' : null,
323 'width' : null,
324 'height' : null,
325 'right' : null,
326 'bottom' : null});
d61c96b6
DW
327 } else {
328 if (this.get('responsive')) {
329 // We must reset any of the fullscreen changes.
2a808cef
DW
330 bb.removeClass(DIALOGUE_FULLSCREEN_CLASS)
331 .setStyles({'width' : this.get('width'),
bf7c86cf 332 'height' : this.get('height')});
d61c96b6 333 }
d61c96b6 334 }
79e4a72f
DW
335
336 // Update Lock scroll if the plugin is present.
337 if (this.lockScroll) {
338 this.lockScroll.updateScrollLock(this.shouldResizeFullscreen());
339 }
bf7c86cf
DW
340 },
341 /**
342 * Center the dialog on the screen.
343 *
344 * @method centerDialogue
bf7c86cf
DW
345 */
346 centerDialogue : function() {
347 var bb = this.get('boundingBox'),
348 hidden = bb.hasClass(DIALOGUE_HIDDEN_CLASS),
349 x,
350 y;
351
352 // Don't adjust the position if we are in full screen mode.
353 if (this.shouldResizeFullscreen()) {
354 return;
355 }
356 if (hidden) {
357 bb.setStyle('top', '-1000px').removeClass(DIALOGUE_HIDDEN_CLASS);
358 }
359 x = Math.max(Math.round((bb.get('winWidth') - bb.get('offsetWidth'))/2), 15);
360 y = Math.max(Math.round((bb.get('winHeight') - bb.get('offsetHeight'))/2), 15) + Y.one(window).get('scrollTop');
361 bb.setStyles({ 'left' : x, 'top' : y});
78686995
AN
362
363 if (hidden) {
bf7c86cf 364 bb.addClass(DIALOGUE_HIDDEN_CLASS);
78686995 365 }
2af57bdb 366 this.makeResponsive();
d61c96b6 367 },
bf7c86cf 368 /**
1f777e5c
AN
369 * Return whether this dialogue should be fullscreen or not.
370 *
bf7c86cf
DW
371 * Responsive attribute must be true and we should not be in an iframe and the screen width should
372 * be less than the responsive width.
373 *
374 * @method shouldResizeFullscreen
1f777e5c 375 * @return {Boolean}
bf7c86cf
DW
376 */
377 shouldResizeFullscreen : function() {
378 return (window === window.parent) && this.get('responsive') &&
379 Math.floor(Y.one(document.body).get('winWidth')) < this.get('responsiveWidth');
2eaaae00
JF
380 },
381
d247a501 382 show: function() {
2eaaae00
JF
383 var result = null,
384 header = this.headerNode,
e5ddec38 385 content = this.bodyNode,
c1660772 386 focusSelector = this.get('focusOnShowSelector'),
e5ddec38 387 focusNode = null;
2eaaae00 388
b959e508
AN
389 result = DIALOGUE.superclass.show.call(this);
390
d247a501
AN
391 if (!this.get('center') && this._originalPosition) {
392 // Restore the dialogue position to it's location before it was moved at show time.
393 this.get('boundingBox').setXY(this._originalPosition);
394 }
395
c1660772
DW
396 // Try and find a node to focus on using the focusOnShowSelector attribute.
397 if (focusSelector !== null) {
e5ddec38 398 focusNode = this.get('boundingBox').one(focusSelector);
2eaaae00 399 }
e5ddec38
DW
400 if (!focusNode) {
401 // Fall back to the header or the content if no focus node was found yet.
402 if (header && header !== '') {
403 focusNode = header;
404 } else if (content && content !== '') {
405 focusNode = content;
406 }
407 }
c1660772
DW
408 if (focusNode) {
409 focusNode.focus();
410 }
2eaaae00 411 return result;
586d393f 412 },
73747aea 413
bf24abd2
AN
414 hide: function(e) {
415 if (e) {
416 // If the event was closed by an escape key event, then we need to check that this
417 // dialogue is currently focused to prevent closing all dialogues in the stack.
418 if (e.type === 'key' && e.keyCode === 27 && !this.get('focused')) {
419 return;
420 }
421 }
422
73747aea
AN
423 // Unlock scroll if the plugin is present.
424 if (this.lockScroll) {
425 this.lockScroll.disableScrollLock();
426 }
427
428 return DIALOGUE.superclass.hide.call(this, arguments);
429 },
586d393f 430 /**
431 * Setup key delegation to keep tabbing within the open dialogue.
432 *
433 * @method keyDelegation
434 */
435 keyDelegation : function() {
436 var bb = this.get('boundingBox');
437 bb.delegate('key', function(e){
438 var target = e.target;
439 var direction = 'forward';
440 if (e.shiftKey) {
441 direction = 'backward';
442 }
443 if (this.trapFocus(target, direction)) {
444 e.preventDefault();
445 }
446 }, 'down:9', CAN_RECEIVE_FOCUS_SELECTOR, this);
447 },
1f777e5c 448
586d393f 449 /**
450 * Trap the tab focus within the open modal.
451 *
1f777e5c
AN
452 * @method trapFocus
453 * @param {string} target the element target
454 * @param {string} direction tab key for forward and tab+shift for backward
455 * @return {Boolean} The result of the focus action.
586d393f 456 */
457 trapFocus : function(target, direction) {
458 var bb = this.get('boundingBox'),
459 firstitem = bb.one(CAN_RECEIVE_FOCUS_SELECTOR),
460 lastitem = bb.all(CAN_RECEIVE_FOCUS_SELECTOR).pop();
461
462 if (target === lastitem && direction === 'forward') { // Tab key.
463 return firstitem.focus();
464 } else if (target === firstitem && direction === 'backward') { // Tab+shift key.
465 return lastitem.focus();
466 }
f56ae5a7
RW
467 },
468
469 /**
470 * Sets the appropriate aria attributes on this dialogue and the other
471 * elements in the DOM to ensure that screen readers are able to navigate
472 * the dialogue popup correctly.
473 *
474 * @method setAccessibilityVisible
475 */
476 setAccessibilityVisible: function() {
477 // Get the element that contains this dialogue because we need it
478 // to filter out from the document.body child elements.
479 var container = this.get(BASE);
f56ae5a7
RW
480
481 // We need to get a list containing each sibling element and the shallowest
482 // non-ancestral nodes in the DOM. We can shortcut this a little by leveraging
483 // the fact that this dialogue is always appended to the document body therefore
484 // it's siblings are the shallowest non-ancestral nodes. If that changes then
485 // this code should also be updated.
486 Y.one(document.body).get('children').each(function(node) {
487 // Skip the element that contains us.
488 if (node !== container) {
489 var hidden = node.get('aria-hidden');
490 // If they are already hidden we can ignore them.
491 if (hidden !== 'true') {
492 // Save their current state.
493 node.setData('previous-aria-hidden', hidden);
f8f477ec 494 this._hiddenSiblings.push(node);
f56ae5a7
RW
495
496 // Hide this node from screen readers.
497 node.set('aria-hidden', 'true');
498 }
499 }
500 }, this);
501
502 // Make us visible to screen readers.
503 container.set('aria-hidden', 'false');
504 },
505
506 /**
507 * Restores the aria visibility on the DOM elements changed when displaying
508 * the dialogue popup and makes the dialogue aria hidden to allow screen
509 * readers to navigate the main page correctly when the dialogue is closed.
510 *
511 * @method setAccessibilityHidden
512 */
513 setAccessibilityHidden: function() {
514 var container = this.get(BASE);
515 container.set('aria-hidden', 'true');
516
517 // Restore the sibling nodes back to their original values.
f8f477ec 518 Y.Array.each(this._hiddenSiblings, function(node) {
f56ae5a7
RW
519 var previousValue = node.getData('previous-aria-hidden');
520 // If the element didn't previously have an aria-hidden attribute
521 // then we can just remove the one we set.
522 if (previousValue === null) {
523 node.removeAttribute('aria-hidden');
524 } else {
525 // Otherwise set it back to the old value (which will be false).
526 node.set('aria-hidden', previousValue);
527 }
528 });
529
530 // Clear the cache. No longer need to store these.
f8f477ec 531 this._hiddenSiblings = [];
78686995
AN
532 }
533}, {
534 NAME : DIALOGUE_NAME,
535 CSS_PREFIX : DIALOGUE_PREFIX,
536 ATTRS : {
537 notificationBase : {
538
539 },
540
541 /**
542 * Whether to display the dialogue modally and with a
543 * lightbox style.
544 *
545 * @attribute lightbox
546 * @type Boolean
547 * @default true
cff3b8fe 548 * @deprecated Since Moodle 2.7. Please use modal instead.
78686995 549 */
cff3b8fe
AN
550 lightbox: {
551 lazyAdd: false,
552 setter: function(value) {
557f44d9
AN
553 Y.log("The lightbox attribute of M.core.dialogue has been deprecated since Moodle 2.7, " +
554 "please use the modal attribute instead",
cff3b8fe
AN
555 'warn', 'moodle-core-notification-dialogue');
556 this.set('modal', value);
557 }
78686995
AN
558 },
559
560 /**
561 * Whether to display a close button on the dialogue.
562 *
563 * Note, we do not recommend hiding the close button as this has
564 * potential accessibility concerns.
565 *
566 * @attribute closeButton
567 * @type Boolean
568 * @default true
569 */
570 closeButton : {
571 validator : Y.Lang.isBoolean,
572 value : true
573 },
574
575 /**
576 * The title for the close button if one is to be shown.
577 *
578 * @attribute closeButtonTitle
579 * @type String
580 * @default 'Close'
581 */
582 closeButtonTitle : {
583 validator : Y.Lang.isString,
0d1d5423 584 value: M.util.get_string('closebuttontitle', 'moodle')
78686995
AN
585 },
586
587 /**
588 * Whether to display the dialogue centrally on the screen.
589 *
590 * @attribute center
591 * @type Boolean
592 * @default true
593 */
594 center : {
595 validator : Y.Lang.isBoolean,
596 value : true
597 },
598
599 /**
600 * Whether to make the dialogue movable around the page.
601 *
602 * @attribute draggable
603 * @type Boolean
604 * @default false
605 */
606 draggable : {
607 validator : Y.Lang.isBoolean,
608 value : false
609 },
bf7c86cf
DW
610
611 /**
612 * Used to generate a unique id for the dialogue.
613 *
614 * @attribute COUNT
d10e6118
AN
615 * @type String
616 * @default null
bf7c86cf 617 */
78686995 618 COUNT: {
d10e6118 619 value: null
d61c96b6 620 },
bf7c86cf
DW
621
622 /**
623 * Used to disable the fullscreen resizing behaviour if required.
624 *
625 * @attribute responsive
626 * @type Boolean
627 * @default true
628 */
d61c96b6
DW
629 responsive : {
630 validator : Y.Lang.isBoolean,
631 value : true
632 },
bf7c86cf
DW
633
634 /**
635 * The width that this dialogue should be resized to fullscreen.
636 *
637 * @attribute responsiveWidth
1f777e5c 638 * @type Number
bf7c86cf
DW
639 * @default 768
640 */
d61c96b6
DW
641 responsiveWidth : {
642 value : 768
c1660772
DW
643 },
644
645 /**
646 * Selector to a node that should recieve focus when this dialogue is shown.
647 *
648 * The default behaviour is to focus on the header.
649 *
650 * @attribute focusOnShowSelector
651 * @default null
652 * @type String
653 */
654 focusOnShowSelector: {
655 value: null
78686995 656 }
c1660772 657
78686995
AN
658 }
659});
660
16d02434
AN
661Y.Base.modifyAttrs(DIALOGUE, {
662 /**
663 * String with units, or number, representing the width of the Widget.
664 * If a number is provided, the default unit, defined by the Widgets
665 * DEF_UNIT, property is used.
666 *
667 * If a value of 'auto' is used, then an empty String is instead
668 * returned.
669 *
670 * @attribute width
671 * @default '400px'
672 * @type {String|Number}
673 */
674 width: {
675 value: '400px',
676 setter: function(value) {
677 if (value === 'auto') {
678 return '';
679 }
680 return value;
681 }
c46cca4f
AN
682 },
683
684 /**
685 * Boolean indicating whether or not the Widget is visible.
686 *
687 * We override this from the default Widget attribute value.
688 *
689 * @attribute visible
690 * @default false
691 * @type Boolean
692 */
693 visible: {
694 value: false
a67233e7
AN
695 },
696
697 /**
698 * A convenience Attribute, which can be used as a shortcut for the
699 * `align` Attribute.
700 *
701 * Note: We override this in Moodle such that it sets a value for the
702 * `center` attribute if set. The `centered` will always return false.
703 *
704 * @attribute centered
705 * @type Boolean|Node
706 * @default false
707 */
708 centered: {
709 setter: function(value) {
710 if (value) {
711 this.set('center', true);
712 }
713 return false;
714 }
d9bf4be4
SH
715 },
716
717 /**
718 * Boolean determining whether to render the widget during initialisation.
719 *
720 * We override this to change the default from false to true for the dialogue.
721 * We then proceed to early render the dialogue during our initialisation rather than waiting
722 * for YUI to render it after that.
723 *
724 * @attribute render
725 * @type Boolean
726 * @default true
727 */
728 render : {
729 value : true,
730 writeOnce : true
2f5c1441
AN
731 },
732
733 /**
734 * Any additional classes to add to the boundingBox.
735 *
1f777e5c 736 * @attribute extraClasses
2f5c1441
AN
737 * @type Array
738 * @default []
739 */
740 extraClasses: {
741 value: []
16d02434
AN
742 }
743});
744
29ee3cf7
AN
745Y.Base.mix(DIALOGUE, [Y.M.core.WidgetFocusAfterHide]);
746
78686995 747M.core.dialogue = DIALOGUE;
cfa770b4
AN
748/**
749 * A dialogue type designed to display informative messages to users.
750 *
751 * @module moodle-core-notification
752 */
753
754/**
755 * Extends core Dialogue to provide a type of dialogue which can be used
756 * for informative message which are modal, and centered.
757 *
758 * @param {Object} config Object literal specifying the dialogue configuration properties.
759 * @constructor
760 * @class M.core.notification.info
761 * @extends M.core.dialogue
762 */
763var INFO = function() {
764 INFO.superclass.constructor.apply(this, arguments);
765};
766
767Y.extend(INFO, M.core.dialogue, {
78ee66c0
MM
768 initializer: function() {
769 this.show();
770 }
cfa770b4
AN
771}, {
772 NAME: 'Moodle information dialogue',
773 CSS_PREFIX: DIALOGUE_PREFIX
774});
775
776Y.Base.modifyAttrs(INFO, {
cfa770b4
AN
777 /**
778 * Whether the widget should be modal or not.
779 *
780 * We override this to change the default from false to true for a subset of dialogues.
781 *
782 * @attribute modal
783 * @type Boolean
784 * @default true
785 */
786 modal: {
787 validator: Y.Lang.isBoolean,
788 value: true
789 }
790});
791
792M.core.notification = M.core.notification || {};
793M.core.notification.info = INFO;
78686995
AN
794
795
29ee3cf7
AN
796}, '@VERSION@', {
797 "requires": [
798 "base",
799 "node",
800 "panel",
cd6e149c 801 "escape",
29ee3cf7
AN
802 "event-key",
803 "dd-plugin",
804 "moodle-core-widget-focusafterclose",
805 "moodle-core-lockscroll"
806 ]
807});