From 324d931ed0b0401abf51c969de79ce1ff00ff544 Mon Sep 17 00:00:00 2001 From: Bas Brands Date: Mon, 24 Feb 2020 14:39:31 +0100 Subject: [PATCH] MDL-67863 theme_boost: change keyboard tab order Move navdrawer up in the dom for a more logical tab order Hide navdrawer links for tab / screenreader when navdrawer is closed --- theme/boost/amd/build/drawer.min.js | 2 +- theme/boost/amd/build/drawer.min.js.map | 2 +- theme/boost/amd/src/drawer.js | 5 +++-- theme/boost/scss/moodle/drawer.scss | 4 ++++ theme/boost/style/moodle.css | 3 +++ theme/boost/templates/columns2.mustache | 2 +- theme/classic/style/moodle.css | 3 +++ user/tests/behat/view_participants.feature | 4 ++-- 8 files changed, 18 insertions(+), 7 deletions(-) diff --git a/theme/boost/amd/build/drawer.min.js b/theme/boost/amd/build/drawer.min.js index a2faa9de5a3fc..f7469f25f3ff4 100644 --- a/theme/boost/amd/build/drawer.min.js +++ b/theme/boost/amd/build/drawer.min.js @@ -1,2 +1,2 @@ -define ("theme_boost/drawer",["jquery","core/custom_interaction_events","core/log","core/pubsub"],function(a,b,c,d){var f={TOGGLE_REGION:"[data-region=\"drawer-toggle\"]",TOGGLE_ACTION:"[data-action=\"toggle-drawer\"]",TOGGLE_TARGET:"aria-controls",TOGGLE_SIDE:"left",BODY:"body",SECTION:".list-group-item[href*=\"#section-\"]",DRAWER:"#nav-drawer"},g=768>a(document).width(),h=function(){if(!a(f.TOGGLE_REGION).length){c.debug("Page is missing a drawer region")}if(!a(f.TOGGLE_ACTION).length){c.debug("Page is missing a drawer toggle link")}a(f.TOGGLE_REGION).each(function(b,c){var d=a(c).find(f.TOGGLE_ACTION),e=d.attr("aria-controls"),h=a(document.getElementById(e)),i="false"==d.attr("aria-expanded"),j=d.attr("data-side"),k=a(f.BODY),l=d.attr("data-preference");if(g){M.util.set_user_preference(l,"false")}h.on("mousewheel DOMMouseScroll",this.preventPageScroll);if(!i){k.addClass("drawer-open-"+j);d.attr("aria-expanded","true")}else{d.attr("aria-expanded","false")}}.bind(this));this.registerEventListeners();if(g){this.closeAll()}};h.prototype.closeAll=function(){a(f.TOGGLE_REGION).each(function(b,c){var d=a(c).find(f.TOGGLE_ACTION),e=d.attr("data-side"),h=a(f.BODY),i=d.attr("aria-controls"),j=a(document.getElementById(i)),k=d.attr("data-preference");d.attr("aria-expanded","false");h.removeClass("drawer-open-"+e);j.attr("aria-hidden","true");j.addClass("closed");if(!g){M.util.set_user_preference(k,"false")}})};h.prototype.toggleDrawer=function(b){var c=a(b.target).closest("[data-action=toggle-drawer]"),e=c.attr("aria-controls"),h=a(document.getElementById(e)),i=a(f.BODY),j=c.attr("data-side"),k=c.attr("data-preference");if(g){M.util.set_user_preference(k,"false")}i.addClass("drawer-ease");var l="true"==c.attr("aria-expanded");if(!l){c.attr("aria-expanded","true");h.attr("aria-hidden","false");h.focus();i.addClass("drawer-open-"+j);h.removeClass("closed");if(!g){M.util.set_user_preference(k,"true")}}else{i.removeClass("drawer-open-"+j);c.attr("aria-expanded","false");h.attr("aria-hidden","true");h.addClass("closed");if(!g){M.util.set_user_preference(k,"false")}}d.publish("nav-drawer-toggle-start",l)};h.prototype.preventPageScroll=function(b){var c=b.wheelDelta||b.originalEvent&&b.originalEvent.wheelDelta||-b.originalEvent.detail,d=0<=this.scrollTop+a(this).outerHeight()-this.scrollHeight,e=0>=this.scrollTop;if(0>c&&d||0a(document).width(),h=function(){if(!a(f.TOGGLE_REGION).length){c.debug("Page is missing a drawer region")}if(!a(f.TOGGLE_ACTION).length){c.debug("Page is missing a drawer toggle link")}a(f.TOGGLE_REGION).each(function(b,c){var d=a(c).find(f.TOGGLE_ACTION),e=d.attr("aria-controls"),h=a(document.getElementById(e)),i="false"==d.attr("aria-expanded"),j=d.attr("data-side"),k=a(f.BODY),l=d.attr("data-preference");if(g){M.util.set_user_preference(l,"false")}h.on("mousewheel DOMMouseScroll",this.preventPageScroll);if(!i){k.addClass("drawer-open-"+j);d.attr("aria-expanded","true")}else{d.attr("aria-expanded","false")}}.bind(this));this.registerEventListeners();if(g){this.closeAll()}};h.prototype.closeAll=function(){a(f.TOGGLE_REGION).each(function(b,c){var d=a(c).find(f.TOGGLE_ACTION),e=d.attr("data-side"),h=a(f.BODY),i=d.attr("aria-controls"),j=a(document.getElementById(i)),k=d.attr("data-preference");d.attr("aria-expanded","false");h.removeClass("drawer-open-"+e);j.attr("aria-hidden","true");j.addClass("closed");if(!g){M.util.set_user_preference(k,"false")}})};h.prototype.toggleDrawer=function(b){var c=a(b.target).closest("[data-action=toggle-drawer]"),e=c.attr("aria-controls"),h=a(document.getElementById(e)),i=a(f.BODY),j=c.attr("data-side"),k=c.attr("data-preference");if(g){M.util.set_user_preference(k,"false")}i.addClass("drawer-ease");var l="true"==c.attr("aria-expanded");if(!l){c.attr("aria-expanded","true");h.attr("aria-hidden","false");h.focus();i.addClass("drawer-open-"+j);h.removeClass("closed");if(!g){M.util.set_user_preference(k,"true")}}else{i.removeClass("drawer-open-"+j);c.attr("aria-expanded","false");h.addClass("closed").delay(500).queue(function(){a(this).attr("aria-hidden","true").dequeue()});if(!g){M.util.set_user_preference(k,"false")}}d.publish("nav-drawer-toggle-start",l)};h.prototype.preventPageScroll=function(b){var c=b.wheelDelta||b.originalEvent&&b.originalEvent.wheelDelta||-b.originalEvent.detail,d=0<=this.scrollTop+a(this).outerHeight()-this.scrollHeight,e=0>=this.scrollTop;if(0>c&&d||0.\n\n/**\n * Contain the logic for a drawer.\n *\n * @package theme_boost\n * @copyright 2016 Damyon Wiese\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\ndefine(['jquery', 'core/custom_interaction_events', 'core/log', 'core/pubsub'],\n function($, CustomEvents, Log, PubSub) {\n\n var SELECTORS = {\n TOGGLE_REGION: '[data-region=\"drawer-toggle\"]',\n TOGGLE_ACTION: '[data-action=\"toggle-drawer\"]',\n TOGGLE_TARGET: 'aria-controls',\n TOGGLE_SIDE: 'left',\n BODY: 'body',\n SECTION: '.list-group-item[href*=\"#section-\"]',\n DRAWER: '#nav-drawer'\n };\n\n var small = $(document).width() < 768;\n\n /**\n * Constructor for the Drawer.\n *\n * @param {object} root The root jQuery element for the modal\n */\n var Drawer = function() {\n\n if (!$(SELECTORS.TOGGLE_REGION).length) {\n Log.debug('Page is missing a drawer region');\n }\n if (!$(SELECTORS.TOGGLE_ACTION).length) {\n Log.debug('Page is missing a drawer toggle link');\n }\n $(SELECTORS.TOGGLE_REGION).each(function(index, ele) {\n var trigger = $(ele).find(SELECTORS.TOGGLE_ACTION);\n var drawerid = trigger.attr('aria-controls');\n var drawer = $(document.getElementById(drawerid));\n var hidden = trigger.attr('aria-expanded') == 'false';\n var side = trigger.attr('data-side');\n var body = $(SELECTORS.BODY);\n var preference = trigger.attr('data-preference');\n if (small) {\n M.util.set_user_preference(preference, 'false');\n }\n\n drawer.on('mousewheel DOMMouseScroll', this.preventPageScroll);\n\n if (!hidden) {\n body.addClass('drawer-open-' + side);\n trigger.attr('aria-expanded', 'true');\n } else {\n trigger.attr('aria-expanded', 'false');\n }\n }.bind(this));\n\n this.registerEventListeners();\n if (small) {\n this.closeAll();\n }\n };\n\n Drawer.prototype.closeAll = function() {\n $(SELECTORS.TOGGLE_REGION).each(function(index, ele) {\n var trigger = $(ele).find(SELECTORS.TOGGLE_ACTION);\n var side = trigger.attr('data-side');\n var body = $(SELECTORS.BODY);\n var drawerid = trigger.attr('aria-controls');\n var drawer = $(document.getElementById(drawerid));\n var preference = trigger.attr('data-preference');\n\n trigger.attr('aria-expanded', 'false');\n body.removeClass('drawer-open-' + side);\n drawer.attr('aria-hidden', 'true');\n drawer.addClass('closed');\n if (!small) {\n M.util.set_user_preference(preference, 'false');\n }\n });\n };\n\n /**\n * Open / close the blocks drawer.\n *\n * @method toggleDrawer\n * @param {Event} e\n */\n Drawer.prototype.toggleDrawer = function(e) {\n var trigger = $(e.target).closest('[data-action=toggle-drawer]');\n var drawerid = trigger.attr('aria-controls');\n var drawer = $(document.getElementById(drawerid));\n var body = $(SELECTORS.BODY);\n var side = trigger.attr('data-side');\n var preference = trigger.attr('data-preference');\n if (small) {\n M.util.set_user_preference(preference, 'false');\n }\n\n body.addClass('drawer-ease');\n var open = trigger.attr('aria-expanded') == 'true';\n if (!open) {\n // Open.\n trigger.attr('aria-expanded', 'true');\n drawer.attr('aria-hidden', 'false');\n drawer.focus();\n body.addClass('drawer-open-' + side);\n drawer.removeClass('closed');\n if (!small) {\n M.util.set_user_preference(preference, 'true');\n }\n } else {\n // Close.\n body.removeClass('drawer-open-' + side);\n trigger.attr('aria-expanded', 'false');\n drawer.attr('aria-hidden', 'true');\n drawer.addClass('closed');\n if (!small) {\n M.util.set_user_preference(preference, 'false');\n }\n }\n\n // Publish an event to tell everything that the drawer has been toggled.\n // The drawer transitions closed so another event will fire once teh transition\n // has completed.\n PubSub.publish('nav-drawer-toggle-start', open);\n };\n\n /**\n * Prevent the page from scrolling when the drawer is at max scroll.\n *\n * @method preventPageScroll\n * @param {Event} e\n */\n Drawer.prototype.preventPageScroll = function(e) {\n var delta = e.wheelDelta || (e.originalEvent && e.originalEvent.wheelDelta) || -e.originalEvent.detail,\n bottomOverflow = (this.scrollTop + $(this).outerHeight() - this.scrollHeight) >= 0,\n topOverflow = this.scrollTop <= 0;\n\n if ((delta < 0 && bottomOverflow) || (delta > 0 && topOverflow)) {\n e.preventDefault();\n }\n };\n\n /**\n * Set up all of the event handling for the modal.\n *\n * @method registerEventListeners\n */\n Drawer.prototype.registerEventListeners = function() {\n\n $(SELECTORS.TOGGLE_ACTION).each(function(index, element) {\n CustomEvents.define($(element), [CustomEvents.events.activate]);\n $(element).on(CustomEvents.events.activate, function(e, data) {\n this.toggleDrawer(data.originalEvent);\n data.originalEvent.preventDefault();\n }.bind(this));\n }.bind(this));\n\n $(SELECTORS.SECTION).click(function() {\n if (small) {\n this.closeAll();\n }\n }.bind(this));\n\n // Publish an event to tell everything that the drawer completed the transition\n // to either an open or closed state.\n $(SELECTORS.DRAWER).on('webkitTransitionEnd msTransitionEnd transitionend', function(e) {\n var drawer = $(e.target).closest(SELECTORS.DRAWER);\n var open = drawer.attr('aria-hidden') == 'false';\n PubSub.publish('nav-drawer-toggle-end', open);\n });\n };\n\n return {\n 'init': function() {\n return new Drawer();\n }\n };\n});\n"],"file":"drawer.min.js"} \ No newline at end of file +{"version":3,"sources":["../src/drawer.js"],"names":["define","$","CustomEvents","Log","PubSub","SELECTORS","TOGGLE_REGION","TOGGLE_ACTION","TOGGLE_TARGET","TOGGLE_SIDE","BODY","SECTION","DRAWER","small","document","width","Drawer","length","debug","each","index","ele","trigger","find","drawerid","attr","drawer","getElementById","hidden","side","body","preference","M","util","set_user_preference","on","preventPageScroll","addClass","bind","registerEventListeners","closeAll","prototype","removeClass","toggleDrawer","e","target","closest","open","focus","delay","queue","dequeue","publish","delta","wheelDelta","originalEvent","detail","bottomOverflow","scrollTop","outerHeight","scrollHeight","topOverflow","preventDefault","element","events","activate","data","click"],"mappings":"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","sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see .\n\n/**\n * Contain the logic for a drawer.\n *\n * @package theme_boost\n * @copyright 2016 Damyon Wiese\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\ndefine(['jquery', 'core/custom_interaction_events', 'core/log', 'core/pubsub'],\n function($, CustomEvents, Log, PubSub) {\n\n var SELECTORS = {\n TOGGLE_REGION: '[data-region=\"drawer-toggle\"]',\n TOGGLE_ACTION: '[data-action=\"toggle-drawer\"]',\n TOGGLE_TARGET: 'aria-controls',\n TOGGLE_SIDE: 'left',\n BODY: 'body',\n SECTION: '.list-group-item[href*=\"#section-\"]',\n DRAWER: '#nav-drawer'\n };\n\n var small = $(document).width() < 768;\n\n /**\n * Constructor for the Drawer.\n *\n * @param {object} root The root jQuery element for the modal\n */\n var Drawer = function() {\n\n if (!$(SELECTORS.TOGGLE_REGION).length) {\n Log.debug('Page is missing a drawer region');\n }\n if (!$(SELECTORS.TOGGLE_ACTION).length) {\n Log.debug('Page is missing a drawer toggle link');\n }\n $(SELECTORS.TOGGLE_REGION).each(function(index, ele) {\n var trigger = $(ele).find(SELECTORS.TOGGLE_ACTION);\n var drawerid = trigger.attr('aria-controls');\n var drawer = $(document.getElementById(drawerid));\n var hidden = trigger.attr('aria-expanded') == 'false';\n var side = trigger.attr('data-side');\n var body = $(SELECTORS.BODY);\n var preference = trigger.attr('data-preference');\n if (small) {\n M.util.set_user_preference(preference, 'false');\n }\n\n drawer.on('mousewheel DOMMouseScroll', this.preventPageScroll);\n\n if (!hidden) {\n body.addClass('drawer-open-' + side);\n trigger.attr('aria-expanded', 'true');\n } else {\n trigger.attr('aria-expanded', 'false');\n }\n }.bind(this));\n\n this.registerEventListeners();\n if (small) {\n this.closeAll();\n }\n };\n\n Drawer.prototype.closeAll = function() {\n $(SELECTORS.TOGGLE_REGION).each(function(index, ele) {\n var trigger = $(ele).find(SELECTORS.TOGGLE_ACTION);\n var side = trigger.attr('data-side');\n var body = $(SELECTORS.BODY);\n var drawerid = trigger.attr('aria-controls');\n var drawer = $(document.getElementById(drawerid));\n var preference = trigger.attr('data-preference');\n\n trigger.attr('aria-expanded', 'false');\n body.removeClass('drawer-open-' + side);\n drawer.attr('aria-hidden', 'true');\n drawer.addClass('closed');\n if (!small) {\n M.util.set_user_preference(preference, 'false');\n }\n });\n };\n\n /**\n * Open / close the blocks drawer.\n *\n * @method toggleDrawer\n * @param {Event} e\n */\n Drawer.prototype.toggleDrawer = function(e) {\n var trigger = $(e.target).closest('[data-action=toggle-drawer]');\n var drawerid = trigger.attr('aria-controls');\n var drawer = $(document.getElementById(drawerid));\n var body = $(SELECTORS.BODY);\n var side = trigger.attr('data-side');\n var preference = trigger.attr('data-preference');\n if (small) {\n M.util.set_user_preference(preference, 'false');\n }\n\n body.addClass('drawer-ease');\n var open = trigger.attr('aria-expanded') == 'true';\n if (!open) {\n // Open.\n trigger.attr('aria-expanded', 'true');\n drawer.attr('aria-hidden', 'false');\n drawer.focus();\n body.addClass('drawer-open-' + side);\n drawer.removeClass('closed');\n if (!small) {\n M.util.set_user_preference(preference, 'true');\n }\n } else {\n // Close.\n body.removeClass('drawer-open-' + side);\n trigger.attr('aria-expanded', 'false');\n drawer.addClass('closed').delay(500).queue(function() {\n $(this).attr('aria-hidden', 'true').dequeue();\n });\n if (!small) {\n M.util.set_user_preference(preference, 'false');\n }\n }\n\n // Publish an event to tell everything that the drawer has been toggled.\n // The drawer transitions closed so another event will fire once teh transition\n // has completed.\n PubSub.publish('nav-drawer-toggle-start', open);\n };\n\n /**\n * Prevent the page from scrolling when the drawer is at max scroll.\n *\n * @method preventPageScroll\n * @param {Event} e\n */\n Drawer.prototype.preventPageScroll = function(e) {\n var delta = e.wheelDelta || (e.originalEvent && e.originalEvent.wheelDelta) || -e.originalEvent.detail,\n bottomOverflow = (this.scrollTop + $(this).outerHeight() - this.scrollHeight) >= 0,\n topOverflow = this.scrollTop <= 0;\n\n if ((delta < 0 && bottomOverflow) || (delta > 0 && topOverflow)) {\n e.preventDefault();\n }\n };\n\n /**\n * Set up all of the event handling for the modal.\n *\n * @method registerEventListeners\n */\n Drawer.prototype.registerEventListeners = function() {\n\n $(SELECTORS.TOGGLE_ACTION).each(function(index, element) {\n CustomEvents.define($(element), [CustomEvents.events.activate]);\n $(element).on(CustomEvents.events.activate, function(e, data) {\n this.toggleDrawer(data.originalEvent);\n data.originalEvent.preventDefault();\n }.bind(this));\n }.bind(this));\n\n $(SELECTORS.SECTION).click(function() {\n if (small) {\n this.closeAll();\n }\n }.bind(this));\n\n // Publish an event to tell everything that the drawer completed the transition\n // to either an open or closed state.\n $(SELECTORS.DRAWER).on('webkitTransitionEnd msTransitionEnd transitionend', function(e) {\n var drawer = $(e.target).closest(SELECTORS.DRAWER);\n var open = drawer.attr('aria-hidden') == 'false';\n PubSub.publish('nav-drawer-toggle-end', open);\n });\n };\n\n return {\n 'init': function() {\n return new Drawer();\n }\n };\n});\n"],"file":"drawer.min.js"} \ No newline at end of file diff --git a/theme/boost/amd/src/drawer.js b/theme/boost/amd/src/drawer.js index 55b1db102e4ff..45b0391933d95 100644 --- a/theme/boost/amd/src/drawer.js +++ b/theme/boost/amd/src/drawer.js @@ -128,8 +128,9 @@ define(['jquery', 'core/custom_interaction_events', 'core/log', 'core/pubsub'], // Close. body.removeClass('drawer-open-' + side); trigger.attr('aria-expanded', 'false'); - drawer.attr('aria-hidden', 'true'); - drawer.addClass('closed'); + drawer.addClass('closed').delay(500).queue(function() { + $(this).attr('aria-hidden', 'true').dequeue(); + }); if (!small) { M.util.set_user_preference(preference, 'false'); } diff --git a/theme/boost/scss/moodle/drawer.scss b/theme/boost/scss/moodle/drawer.scss index c261e05eb355d..c75703d6f3c0c 100644 --- a/theme/boost/scss/moodle/drawer.scss +++ b/theme/boost/scss/moodle/drawer.scss @@ -24,6 +24,10 @@ $drawer-offscreen-gutter: 20px !default; left: -($drawer-width + $drawer-offscreen-gutter); } +#nav-drawer[aria-hidden=true] .list-group-item { + display: none; +} + /* Use a variable for the drawer background colors. */ $drawer-bg: darken($body-bg, 5%) !default; diff --git a/theme/boost/style/moodle.css b/theme/boost/style/moodle.css index 1dbc9ff9a216c..dde41d71f1f83 100644 --- a/theme/boost/style/moodle.css +++ b/theme/boost/style/moodle.css @@ -13626,6 +13626,9 @@ span.editinstructions { #nav-drawer.closed { left: -305px; } +#nav-drawer[aria-hidden=true] .list-group-item { + display: none; } + /* Use a variable for the drawer background colors. */ [data-region="drawer"] { position: fixed; diff --git a/theme/boost/templates/columns2.mustache b/theme/boost/templates/columns2.mustache index 28a50ad895e2f..b109c93ffcad7 100644 --- a/theme/boost/templates/columns2.mustache +++ b/theme/boost/templates/columns2.mustache @@ -58,6 +58,7 @@ {{{ output.standard_top_of_body_html }}} {{> theme_boost/navbar }} + {{> theme_boost/nav-drawer }}
{{{ output.full_header }}} @@ -89,7 +90,6 @@
{{{ output.standard_after_main_region_html }}} - {{> theme_boost/nav-drawer }} {{> theme_boost/footer }} diff --git a/theme/classic/style/moodle.css b/theme/classic/style/moodle.css index 542c6e1337251..222ba3649e015 100644 --- a/theme/classic/style/moodle.css +++ b/theme/classic/style/moodle.css @@ -13884,6 +13884,9 @@ span.editinstructions { #nav-drawer.closed { left: -305px; } +#nav-drawer[aria-hidden=true] .list-group-item { + display: none; } + /* Use a variable for the drawer background colors. */ [data-region="drawer"] { position: fixed; diff --git a/user/tests/behat/view_participants.feature b/user/tests/behat/view_participants.feature index 6f433b1dec8b4..aa732e49c8d93 100644 --- a/user/tests/behat/view_participants.feature +++ b/user/tests/behat/view_participants.feature @@ -113,12 +113,12 @@ Feature: View course participants And I am on "Course 1" course homepage And I navigate to course participants And I follow "Email address" - When I follow "2" + When I click on "2" "link" in the "//nav[@aria-label='Page']" "xpath_element" Then I should not see "student0x@example.com" And I should not see "student19x@example.com" And I should see "teacher1x@example.com" And I follow "Email address" - And I follow "2" + And I click on "2" "link" in the "//nav[@aria-label='Page']" "xpath_element" And I should not see "teacher1x@example.com" And I should not see "student19x@example.com" And I should not see "student1x@example.com"