*/
_originalPosition: null,
+ /**
+ * The list of elements that have been aria hidden when displaying
+ * this dialogue.
+ *
+ * @property _hiddenSiblings
+ * @protected
+ * @type Array
+ */
+ _hiddenSiblings: null,
+
/**
* Initialise the dialogue.
*
initializer : function() {
var bb;
+ // Initialise the element cache.
+ this._hiddenSiblings = [];
+
if (this.get('render')) {
this.render();
}
var titlebar, bb;
if (e.attrName === 'visible') {
this.get('maskNode').addClass(CSS.LIGHTBOX);
+ // Going from visible to hidden.
if (e.prevVal && !e.newVal) {
bb = this.get('boundingBox');
if (this._resizeevent) {
this._orientationevent = null;
}
bb.detach('key', this.keyDelegation);
+
+ if (this.get('modal')) {
+ // Hide this dialogue from screen readers.
+ this.setAccessibilityHidden();
+ }
}
+ // Going from hidden to visible.
if (!e.prevVal && e.newVal) {
// This needs to be done each time the dialog is shown as new dialogs may have been opened.
this.applyZIndex();
}
}
this.keyDelegation();
+
+ // Only do accessibility hiding for modals because the ARIA spec
+ // says that all ARIA dialogues should be modal.
+ if (this.get('modal')) {
+ // Make this dialogue visible to screen readers.
+ this.setAccessibilityVisible();
+ }
}
if (this.get('center') && !e.prevVal && e.newVal) {
this.centerDialogue();
this.lockScroll.enableScrollLock(this.shouldResizeFullscreen());
}
- // Only do accessibility hiding for modals because the ARIA spec
- // says that all ARIA dialogues should be modal.
- if (this.get('modal')) {
- // Make this dialogue visible to screen readers.
- this.setAccessibilityVisible();
- }
-
// Try and find a node to focus on using the focusOnShowSelector attribute.
if (focusSelector !== null) {
focusNode = this.get('boundingBox').one(focusSelector);
}
}
- if (this.get('modal')) {
- // Hide this dialogue from screen readers.
- this.setAccessibilityHidden();
- }
-
// Unlock scroll if the plugin is present.
if (this.lockScroll) {
this.lockScroll.disableScrollLock();
// Get the element that contains this dialogue because we need it
// to filter out from the document.body child elements.
var container = this.get(BASE);
- // Keep a record of any elements we change so that they can be reverted later.
- this.hiddenSiblings = [];
// We need to get a list containing each sibling element and the shallowest
// non-ancestral nodes in the DOM. We can shortcut this a little by leveraging
if (hidden !== 'true') {
// Save their current state.
node.setData('previous-aria-hidden', hidden);
- this.hiddenSiblings.push(node);
+ this._hiddenSiblings.push(node);
// Hide this node from screen readers.
node.set('aria-hidden', 'true');
container.set('aria-hidden', 'true');
// Restore the sibling nodes back to their original values.
- Y.Array.each(this.hiddenSiblings, function(node) {
+ Y.Array.each(this._hiddenSiblings, function(node) {
var previousValue = node.getData('previous-aria-hidden');
// If the element didn't previously have an aria-hidden attribute
// then we can just remove the one we set.
});
// Clear the cache. No longer need to store these.
- this.hiddenSiblings = [];
+ this._hiddenSiblings = [];
}
}, {
NAME : DIALOGUE_NAME,