MDL-50971 ActionMenu: Action menus cause page to jump when closing
This patch changes the behavior of open action menus when using a mouse. Before this patch when clicking on the page with an open action menu the focus would be returned to the action menu's call button. This could cause the page to jump when a mouse user did not close an action menu, scrolled and then tried to perform another action on the page. After this patch when clicking the focus will not be returned to the action menu's call button. The behavior of the script will not be changed when using the keyboard.
This commit is contained in:
@@ -497,7 +497,7 @@ Y.extend(RESOURCETOOLBOX, TOOLBOX, {
|
||||
};
|
||||
this.send_request(data);
|
||||
if (M.core.actionmenu && M.core.actionmenu.instance) {
|
||||
M.core.actionmenu.instance.hideMenu();
|
||||
M.core.actionmenu.instance.hideMenu(ev);
|
||||
}
|
||||
|
||||
}, this);
|
||||
@@ -744,7 +744,7 @@ Y.extend(RESOURCETOOLBOX, TOOLBOX, {
|
||||
|
||||
this.send_request(data, null, function(response) {
|
||||
if (M.core.actionmenu && M.core.actionmenu.instance) {
|
||||
M.core.actionmenu.instance.hideMenu();
|
||||
M.core.actionmenu.instance.hideMenu(ev);
|
||||
}
|
||||
|
||||
// Try to retrieve the existing string from the server
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -497,7 +497,7 @@ Y.extend(RESOURCETOOLBOX, TOOLBOX, {
|
||||
};
|
||||
this.send_request(data);
|
||||
if (M.core.actionmenu && M.core.actionmenu.instance) {
|
||||
M.core.actionmenu.instance.hideMenu();
|
||||
M.core.actionmenu.instance.hideMenu(ev);
|
||||
}
|
||||
|
||||
}, this);
|
||||
@@ -744,7 +744,7 @@ Y.extend(RESOURCETOOLBOX, TOOLBOX, {
|
||||
|
||||
this.send_request(data, null, function(response) {
|
||||
if (M.core.actionmenu && M.core.actionmenu.instance) {
|
||||
M.core.actionmenu.instance.hideMenu();
|
||||
M.core.actionmenu.instance.hideMenu(ev);
|
||||
}
|
||||
|
||||
// Try to retrieve the existing string from the server
|
||||
|
||||
+2
-2
@@ -293,7 +293,7 @@ Y.extend(RESOURCETOOLBOX, TOOLBOX, {
|
||||
};
|
||||
this.send_request(data);
|
||||
if (M.core.actionmenu && M.core.actionmenu.instance) {
|
||||
M.core.actionmenu.instance.hideMenu();
|
||||
M.core.actionmenu.instance.hideMenu(ev);
|
||||
}
|
||||
|
||||
}, this);
|
||||
@@ -540,7 +540,7 @@ Y.extend(RESOURCETOOLBOX, TOOLBOX, {
|
||||
|
||||
this.send_request(data, null, function(response) {
|
||||
if (M.core.actionmenu && M.core.actionmenu.instance) {
|
||||
M.core.actionmenu.instance.hideMenu();
|
||||
M.core.actionmenu.instance.hideMenu(ev);
|
||||
}
|
||||
|
||||
// Try to retrieve the existing string from the server
|
||||
|
||||
@@ -126,6 +126,8 @@ information provided here is intended especially for developers.
|
||||
enrol_cohort_enrol_all_users()
|
||||
enrol_cohort_search_cohorts()
|
||||
* The never unused webdav_locks table was dropped.
|
||||
* The actionmenu hideMenu() function now expects an EventFacade object to be passed to it,
|
||||
i.e. a call to M.core.actionmenu.instance.hideMenu() should be change to M.core.actionmenu.instance.hideMenu(e)
|
||||
|
||||
=== 2.9.1 ===
|
||||
|
||||
|
||||
@@ -247,9 +247,10 @@ ACTIONMENU.prototype = {
|
||||
|
||||
/**
|
||||
* Hides the menu if it is visible.
|
||||
* @param {EventFacade} e
|
||||
* @method hideMenu
|
||||
*/
|
||||
hideMenu : function() {
|
||||
hideMenu : function(e) {
|
||||
if (this.dialogue) {
|
||||
Y.log('Hiding an action menu', 'debug', ACTIONMENU.NAME);
|
||||
this.dialogue.removeClass('show');
|
||||
@@ -268,7 +269,9 @@ ACTIONMENU.prototype = {
|
||||
}
|
||||
|
||||
if (this.menulink) {
|
||||
this.menulink.focus();
|
||||
if (e.type != 'click') {
|
||||
this.menulink.focus();
|
||||
}
|
||||
this.menulink = null;
|
||||
}
|
||||
},
|
||||
@@ -295,7 +298,7 @@ ACTIONMENU.prototype = {
|
||||
|
||||
// Prevent event propagation as it will trigger the hideIfOutside event handler in certain situations.
|
||||
e.halt(true);
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
if (menuvisible) {
|
||||
// The menu was visible and the user has clicked to toggle it again.
|
||||
return;
|
||||
@@ -324,7 +327,7 @@ ACTIONMENU.prototype = {
|
||||
this.lastMenuChild.focus();
|
||||
e.preventDefault();
|
||||
} else if (e.keyCode === 9 && e.shiftKey) {
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
e.preventDefault();
|
||||
}
|
||||
return this;
|
||||
@@ -332,7 +335,7 @@ ACTIONMENU.prototype = {
|
||||
|
||||
if (e.keyCode === 27) {
|
||||
// The escape key was pressed so close the menu.
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
e.preventDefault();
|
||||
|
||||
} else if (e.keyCode === 32) {
|
||||
@@ -344,10 +347,10 @@ ACTIONMENU.prototype = {
|
||||
// We only override the Shift + Tab on the first option, and Tab on the last option to change where the
|
||||
// focus is moved to.
|
||||
if (e.target === this.firstMenuChild && e.shiftKey) {
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
e.preventDefault();
|
||||
} else if (e.target === this.lastMenuChild && !e.shiftKey) {
|
||||
if (this.hideMenu()) {
|
||||
if (this.hideMenu(e)) {
|
||||
// Determine the next selector and focus on it.
|
||||
next = this.menulink.next(SELECTOR.CAN_RECEIVE_FOCUS_SELECTOR);
|
||||
if (next) {
|
||||
@@ -414,7 +417,7 @@ ACTIONMENU.prototype = {
|
||||
*/
|
||||
hideIfOutside : function(e) {
|
||||
if (!e.target.ancestor(SELECTOR.MENUCHILD, true)) {
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
}
|
||||
},
|
||||
|
||||
@@ -469,7 +472,7 @@ ACTIONMENU.prototype = {
|
||||
if (e.currentTarget.test(SELECTOR.KEEPOPEN)) {
|
||||
return;
|
||||
}
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
}, SELECTOR.MENUCHILD, this));
|
||||
|
||||
return true;
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -246,9 +246,10 @@ ACTIONMENU.prototype = {
|
||||
|
||||
/**
|
||||
* Hides the menu if it is visible.
|
||||
* @param {EventFacade} e
|
||||
* @method hideMenu
|
||||
*/
|
||||
hideMenu : function() {
|
||||
hideMenu : function(e) {
|
||||
if (this.dialogue) {
|
||||
this.dialogue.removeClass('show');
|
||||
this.dialogue.one(SELECTOR.MENUCONTENT).set('aria-hidden', true);
|
||||
@@ -266,7 +267,9 @@ ACTIONMENU.prototype = {
|
||||
}
|
||||
|
||||
if (this.menulink) {
|
||||
this.menulink.focus();
|
||||
if (e.type != 'click') {
|
||||
this.menulink.focus();
|
||||
}
|
||||
this.menulink = null;
|
||||
}
|
||||
},
|
||||
@@ -293,7 +296,7 @@ ACTIONMENU.prototype = {
|
||||
|
||||
// Prevent event propagation as it will trigger the hideIfOutside event handler in certain situations.
|
||||
e.halt(true);
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
if (menuvisible) {
|
||||
// The menu was visible and the user has clicked to toggle it again.
|
||||
return;
|
||||
@@ -322,7 +325,7 @@ ACTIONMENU.prototype = {
|
||||
this.lastMenuChild.focus();
|
||||
e.preventDefault();
|
||||
} else if (e.keyCode === 9 && e.shiftKey) {
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
e.preventDefault();
|
||||
}
|
||||
return this;
|
||||
@@ -330,7 +333,7 @@ ACTIONMENU.prototype = {
|
||||
|
||||
if (e.keyCode === 27) {
|
||||
// The escape key was pressed so close the menu.
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
e.preventDefault();
|
||||
|
||||
} else if (e.keyCode === 32) {
|
||||
@@ -342,10 +345,10 @@ ACTIONMENU.prototype = {
|
||||
// We only override the Shift + Tab on the first option, and Tab on the last option to change where the
|
||||
// focus is moved to.
|
||||
if (e.target === this.firstMenuChild && e.shiftKey) {
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
e.preventDefault();
|
||||
} else if (e.target === this.lastMenuChild && !e.shiftKey) {
|
||||
if (this.hideMenu()) {
|
||||
if (this.hideMenu(e)) {
|
||||
// Determine the next selector and focus on it.
|
||||
next = this.menulink.next(SELECTOR.CAN_RECEIVE_FOCUS_SELECTOR);
|
||||
if (next) {
|
||||
@@ -411,7 +414,7 @@ ACTIONMENU.prototype = {
|
||||
*/
|
||||
hideIfOutside : function(e) {
|
||||
if (!e.target.ancestor(SELECTOR.MENUCHILD, true)) {
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
}
|
||||
},
|
||||
|
||||
@@ -465,7 +468,7 @@ ACTIONMENU.prototype = {
|
||||
if (e.currentTarget.test(SELECTOR.KEEPOPEN)) {
|
||||
return;
|
||||
}
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
}, SELECTOR.MENUCHILD, this));
|
||||
|
||||
return true;
|
||||
|
||||
+12
-9
@@ -245,9 +245,10 @@ ACTIONMENU.prototype = {
|
||||
|
||||
/**
|
||||
* Hides the menu if it is visible.
|
||||
* @param {EventFacade} e
|
||||
* @method hideMenu
|
||||
*/
|
||||
hideMenu : function() {
|
||||
hideMenu : function(e) {
|
||||
if (this.dialogue) {
|
||||
Y.log('Hiding an action menu', 'debug', ACTIONMENU.NAME);
|
||||
this.dialogue.removeClass('show');
|
||||
@@ -266,7 +267,9 @@ ACTIONMENU.prototype = {
|
||||
}
|
||||
|
||||
if (this.menulink) {
|
||||
this.menulink.focus();
|
||||
if (e.type != 'click') {
|
||||
this.menulink.focus();
|
||||
}
|
||||
this.menulink = null;
|
||||
}
|
||||
},
|
||||
@@ -293,7 +296,7 @@ ACTIONMENU.prototype = {
|
||||
|
||||
// Prevent event propagation as it will trigger the hideIfOutside event handler in certain situations.
|
||||
e.halt(true);
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
if (menuvisible) {
|
||||
// The menu was visible and the user has clicked to toggle it again.
|
||||
return;
|
||||
@@ -322,7 +325,7 @@ ACTIONMENU.prototype = {
|
||||
this.lastMenuChild.focus();
|
||||
e.preventDefault();
|
||||
} else if (e.keyCode === 9 && e.shiftKey) {
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
e.preventDefault();
|
||||
}
|
||||
return this;
|
||||
@@ -330,7 +333,7 @@ ACTIONMENU.prototype = {
|
||||
|
||||
if (e.keyCode === 27) {
|
||||
// The escape key was pressed so close the menu.
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
e.preventDefault();
|
||||
|
||||
} else if (e.keyCode === 32) {
|
||||
@@ -342,10 +345,10 @@ ACTIONMENU.prototype = {
|
||||
// We only override the Shift + Tab on the first option, and Tab on the last option to change where the
|
||||
// focus is moved to.
|
||||
if (e.target === this.firstMenuChild && e.shiftKey) {
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
e.preventDefault();
|
||||
} else if (e.target === this.lastMenuChild && !e.shiftKey) {
|
||||
if (this.hideMenu()) {
|
||||
if (this.hideMenu(e)) {
|
||||
// Determine the next selector and focus on it.
|
||||
next = this.menulink.next(SELECTOR.CAN_RECEIVE_FOCUS_SELECTOR);
|
||||
if (next) {
|
||||
@@ -412,7 +415,7 @@ ACTIONMENU.prototype = {
|
||||
*/
|
||||
hideIfOutside : function(e) {
|
||||
if (!e.target.ancestor(SELECTOR.MENUCHILD, true)) {
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
}
|
||||
},
|
||||
|
||||
@@ -467,7 +470,7 @@ ACTIONMENU.prototype = {
|
||||
if (e.currentTarget.test(SELECTOR.KEEPOPEN)) {
|
||||
return;
|
||||
}
|
||||
this.hideMenu();
|
||||
this.hideMenu(e);
|
||||
}, SELECTOR.MENUCHILD, this));
|
||||
|
||||
return true;
|
||||
|
||||
+2
-2
@@ -399,7 +399,7 @@ Y.extend(RESOURCETOOLBOX, TOOLBOX, {
|
||||
Y.Moodle.mod_quiz.util.slot.remove(element);
|
||||
this.reorganise_edit_page();
|
||||
if (M.core.actionmenu && M.core.actionmenu.instance) {
|
||||
M.core.actionmenu.instance.hideMenu();
|
||||
M.core.actionmenu.instance.hideMenu(ev);
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -441,7 +441,7 @@ Y.extend(RESOURCETOOLBOX, TOOLBOX, {
|
||||
|
||||
this.send_request(data, null, function(response) {
|
||||
if (M.core.actionmenu && M.core.actionmenu.instance) {
|
||||
M.core.actionmenu.instance.hideMenu();
|
||||
M.core.actionmenu.instance.hideMenu(ev);
|
||||
}
|
||||
|
||||
// Try to retrieve the existing string from the server.
|
||||
|
||||
+2
-2
File diff suppressed because one or more lines are too long
@@ -399,7 +399,7 @@ Y.extend(RESOURCETOOLBOX, TOOLBOX, {
|
||||
Y.Moodle.mod_quiz.util.slot.remove(element);
|
||||
this.reorganise_edit_page();
|
||||
if (M.core.actionmenu && M.core.actionmenu.instance) {
|
||||
M.core.actionmenu.instance.hideMenu();
|
||||
M.core.actionmenu.instance.hideMenu(ev);
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -441,7 +441,7 @@ Y.extend(RESOURCETOOLBOX, TOOLBOX, {
|
||||
|
||||
this.send_request(data, null, function(response) {
|
||||
if (M.core.actionmenu && M.core.actionmenu.instance) {
|
||||
M.core.actionmenu.instance.hideMenu();
|
||||
M.core.actionmenu.instance.hideMenu(ev);
|
||||
}
|
||||
|
||||
// Try to retrieve the existing string from the server.
|
||||
|
||||
+2
-2
@@ -177,7 +177,7 @@ Y.extend(RESOURCETOOLBOX, TOOLBOX, {
|
||||
Y.Moodle.mod_quiz.util.slot.remove(element);
|
||||
this.reorganise_edit_page();
|
||||
if (M.core.actionmenu && M.core.actionmenu.instance) {
|
||||
M.core.actionmenu.instance.hideMenu();
|
||||
M.core.actionmenu.instance.hideMenu(ev);
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -219,7 +219,7 @@ Y.extend(RESOURCETOOLBOX, TOOLBOX, {
|
||||
|
||||
this.send_request(data, null, function(response) {
|
||||
if (M.core.actionmenu && M.core.actionmenu.instance) {
|
||||
M.core.actionmenu.instance.hideMenu();
|
||||
M.core.actionmenu.instance.hideMenu(ev);
|
||||
}
|
||||
|
||||
// Try to retrieve the existing string from the server.
|
||||
|
||||
Reference in New Issue
Block a user