From a7b49a7d92a0efa640179b775e309002afc50390 Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Thu, 17 May 2012 00:23:11 -0700 Subject: nearly everything working with activedescendant... then decide it's wrong. --- docs/assets/js/bootstrap-dropdown.js | 84 ++++++++++++++++++++++++++++++------ 1 file changed, 70 insertions(+), 14 deletions(-) (limited to 'docs/assets/js/bootstrap-dropdown.js') diff --git a/docs/assets/js/bootstrap-dropdown.js b/docs/assets/js/bootstrap-dropdown.js index ec0588dc1..84560642f 100644 --- a/docs/assets/js/bootstrap-dropdown.js +++ b/docs/assets/js/bootstrap-dropdown.js @@ -27,6 +27,7 @@ * ========================= */ var toggle = '[data-toggle="dropdown"]' + , active = 'aria-active' , Dropdown = function (element) { var $el = $(element).on('click.dropdown.data-api', this.toggle) $('html').on('click.dropdown.data-api', function () { @@ -41,34 +42,87 @@ , toggle: function (e) { var $this = $(this) , $parent - , selector , isActive if ($this.is('.disabled, :disabled')) return - selector = $this.attr('data-target') - - if (!selector) { - selector = $this.attr('href') - selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') //strip for ie7 - } - - $parent = $(selector) - $parent.length || ($parent = $this.parent()) + $parent = getParent($this) isActive = $parent.hasClass('open') clearMenus() - if (!isActive) $parent.toggleClass('open') + if (!isActive) { + $parent.toggleClass('open') + $this.focus() + } return false } + , keydown: function (e) { + var $this = $(this) + , $items + , $active + , $parent + , index + + if (e.keyCode == 27) return $this.click() + + if (!/(38|40|13)/.test(e.keyCode)) return + + e.preventDefault() + e.stopPropagation() + + if ($this.is('.disabled, :disabled')) return + + $parent = getParent($this) + + $parent.hasClass('open') || $this.click() + + $items = $('[role=menu] li:not(.divider)', $parent) + + if (!$items.length) return + + index = $items.index($items.filter('#' + active)) + + $items + .eq(index) + .attr('id', '') + + if (e.keyCode == 38 && index > 0) index-- // up + else if (e.keyCode == 40 && index < $items.length - 1) index++ // down + else if (e.keyCode == 13 && ~index) return $items.eq(index).find('a').click() // enter + + if (!~index) index = 0 + + $items + .eq(index) + .attr('id', active) + } + } function clearMenus() { - $(toggle).parent().removeClass('open') + getParent($(toggle)) + .removeClass('open') + .find('#' + active) + .attr('id', '') + } + + function getParent($this) { + var selector = $this.attr('data-target') + , $parent + + if (!selector) { + selector = $this.attr('href') + selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') //strip for ie7 + } + + $parent = $(selector) + $parent.length || ($parent = $this.parent()) + + return $parent } @@ -91,10 +145,12 @@ * =================================== */ $(function () { - $('html').on('click.dropdown.data-api', clearMenus) + $('html') + .on('click.dropdown.data-api', clearMenus) $('body') .on('click.dropdown', '.dropdown form', function (e) { e.stopPropagation() }) - .on('click.dropdown.data-api', toggle, Dropdown.prototype.toggle) + .on('click.dropdown.data-api' , toggle, Dropdown.prototype.toggle) + .on('keydown.dropdown.data-api', toggle, Dropdown.prototype.keydown) }) }(window.jQuery); \ No newline at end of file -- cgit v1.2.3 From 9889948f5851f5ce19668073b1f88eb4b6082ea6 Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Thu, 17 May 2012 00:39:14 -0700 Subject: abandon activedescendant because it was awful --- docs/assets/js/bootstrap-dropdown.js | 34 +++++++++++++++------------------- 1 file changed, 15 insertions(+), 19 deletions(-) (limited to 'docs/assets/js/bootstrap-dropdown.js') diff --git a/docs/assets/js/bootstrap-dropdown.js b/docs/assets/js/bootstrap-dropdown.js index 84560642f..313d993b2 100644 --- a/docs/assets/js/bootstrap-dropdown.js +++ b/docs/assets/js/bootstrap-dropdown.js @@ -26,8 +26,7 @@ /* DROPDOWN CLASS DEFINITION * ========================= */ - var toggle = '[data-toggle="dropdown"]' - , active = 'aria-active' + var toggle = '[data-toggle=dropdown]' , Dropdown = function (element) { var $el = $(element).on('click.dropdown.data-api', this.toggle) $('html').on('click.dropdown.data-api', function () { @@ -61,15 +60,16 @@ } , keydown: function (e) { - var $this = $(this) + var $this , $items , $active , $parent + , isActive , index - if (e.keyCode == 27) return $this.click() + if (!/(38|40|27)/.test(e.keyCode)) return - if (!/(38|40|13)/.test(e.keyCode)) return + $this = $(this) e.preventDefault() e.stopPropagation() @@ -78,27 +78,23 @@ $parent = getParent($this) - $parent.hasClass('open') || $this.click() + isActive = $parent.hasClass('open') - $items = $('[role=menu] li:not(.divider)', $parent) + if (!isActive || (isActive && e.keyCode == 27)) return $this.click() + + $items = $('[role=menu] li:not(.divider) a', $parent) if (!$items.length) return - index = $items.index($items.filter('#' + active)) - - $items - .eq(index) - .attr('id', '') + index = $items.index($items.filter(':focus')) if (e.keyCode == 38 && index > 0) index-- // up - else if (e.keyCode == 40 && index < $items.length - 1) index++ // down - else if (e.keyCode == 13 && ~index) return $items.eq(index).find('a').click() // enter - + if (e.keyCode == 40 && index < $items.length - 1) index++ // down if (!~index) index = 0 $items .eq(index) - .attr('id', active) + .focus() } } @@ -106,8 +102,6 @@ function clearMenus() { getParent($(toggle)) .removeClass('open') - .find('#' + active) - .attr('id', '') } function getParent($this) { @@ -145,12 +139,14 @@ * =================================== */ $(function () { + console.log(toggle + ', ' + toggle + ' + [role=menu]') + $('html') .on('click.dropdown.data-api', clearMenus) $('body') .on('click.dropdown', '.dropdown form', function (e) { e.stopPropagation() }) .on('click.dropdown.data-api' , toggle, Dropdown.prototype.toggle) - .on('keydown.dropdown.data-api', toggle, Dropdown.prototype.keydown) + .on('keydown.dropdown.data-api', toggle + ', [role=menu]' , Dropdown.prototype.keydown) }) }(window.jQuery); \ No newline at end of file -- cgit v1.2.3