Skip to content
This repository has been archived by the owner on May 29, 2019. It is now read-only.

Commit

Permalink
fix(dropdown): remove extra uib-keyboard-nav
Browse files Browse the repository at this point in the history
Closes #4891

BREAKING CHANGE: `keyboard-nav` for the dropdown is not longer a directive and to use it you have to use `keyboard-nav` instead of `uib-keyboard-nav`.
  • Loading branch information
Foxandxss committed Nov 13, 2015
1 parent 4dab96e commit 57f72b2
Show file tree
Hide file tree
Showing 3 changed files with 9 additions and 48 deletions.
4 changes: 2 additions & 2 deletions src/dropdown/docs/demo.html
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@

<hr>
<!-- Single button with keyboard nav -->
<div class="btn-group" uib-dropdown uib-keyboard-nav>
<div class="btn-group" uib-dropdown keyboard-nav>
<button id="simple-btn-keyboard-nav" type="button" class="btn btn-primary" uib-dropdown-toggle>
Dropdown with keyboard navigation <span class="caret"></span>
</button>
Expand All @@ -92,7 +92,7 @@ <h4>append-to vs. append-to-body vs. inline example</h4>
<div id="dropdown-scrollable-container" style="height: 15em; overflow: auto;">
<div id="dropdown-long-content">
<div id="dropdown-hidden-container">
<div class="btn-group" uib-dropdown dropdown-append-to="appendToEl">
<div class="btn-group" uib-dropdown keyboard-nav dropdown-append-to="appendToEl">
<button id="btn-append-to" type="button" class="btn btn-primary" uib-dropdown-toggle>
Dropdown in Container <span class="caret"></span>
</button>
Expand Down
41 changes: 1 addition & 40 deletions src/dropdown/dropdown.js
Original file line number Diff line number Diff line change
Expand Up @@ -101,7 +101,7 @@ angular.module('ui.bootstrap.dropdown', ['ui.bootstrap.position'])
}

appendToBody = angular.isDefined($attrs.dropdownAppendToBody);
keynavEnabled = angular.isDefined($attrs.uibKeyboardNav);
keynavEnabled = angular.isDefined($attrs.keyboardNav);

if (appendToBody && !appendTo) {
appendTo = body;
Expand Down Expand Up @@ -298,45 +298,6 @@ angular.module('ui.bootstrap.dropdown', ['ui.bootstrap.position'])
};
})

.directive('uibKeyboardNav', function() {
return {
restrict: 'A',
require: '?^uibDropdown',
link: function(scope, element, attrs, dropdownCtrl) {
element.bind('keydown', function(e) {
if ([38, 40].indexOf(e.which) !== -1) {
e.preventDefault();
e.stopPropagation();

var elems = dropdownCtrl.dropdownMenu.find('a');

switch (e.which) {
case 40: { // Down
if (!angular.isNumber(dropdownCtrl.selectedOption)) {
dropdownCtrl.selectedOption = 0;
} else {
dropdownCtrl.selectedOption = dropdownCtrl.selectedOption === elems.length - 1 ?
dropdownCtrl.selectedOption : dropdownCtrl.selectedOption + 1;
}
break;
}
case 38: { // Up
if (!angular.isNumber(dropdownCtrl.selectedOption)) {
dropdownCtrl.selectedOption = elems.length - 1;
} else {
dropdownCtrl.selectedOption = dropdownCtrl.selectedOption === 0 ?
0 : dropdownCtrl.selectedOption - 1;
}
break;
}
}
elems[dropdownCtrl.selectedOption].focus();
}
});
}
};
})

.directive('uibDropdownToggle', function() {
return {
require: '?^uibDropdown',
Expand Down
12 changes: 6 additions & 6 deletions src/dropdown/test/dropdown.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -547,7 +547,7 @@ describe('dropdownToggle', function() {

describe('`keyboard-nav` option', function() {
function dropdown() {
return $compile('<li uib-dropdown uib-keyboard-nav><a href uib-dropdown-toggle></a><ul><li><a href>Hello</a></li><li><a href>Hello Again</a></li></ul></li>')($rootScope);
return $compile('<li uib-dropdown keyboard-nav><a href uib-dropdown-toggle></a><ul><li><a href>Hello</a></li><li><a href>Hello Again</a></li></ul></li>')($rootScope);
}
beforeEach(function() {
element = dropdown();
Expand Down Expand Up @@ -586,7 +586,7 @@ describe('dropdownToggle', function() {

describe('`keyboard-nav` option', function() {
function dropdown() {
return $compile('<li uib-dropdown uib-keyboard-nav><a href uib-dropdown-toggle></a><ul><li><a href>Hello</a></li><li><a href>Hello Again</a></li></ul></li>')($rootScope);
return $compile('<li uib-dropdown keyboard-nav><a href uib-dropdown-toggle></a><ul><li><a href>Hello</a></li><li><a href>Hello Again</a></li></ul></li>')($rootScope);
}
beforeEach(function() {
element = dropdown();
Expand Down Expand Up @@ -699,7 +699,7 @@ describe('dropdownToggle', function() {

describe('`keyboard-nav` option with `dropdown-append-to-body` option', function() {
function dropdown() {
return $compile('<li uib-dropdown dropdown-append-to-body uib-keyboard-nav><a href uib-dropdown-toggle></a><ul class="uib-dropdown-menu" id="dropdown-menu"><li><a href>Hello On Body</a></li><li><a href>Hello Again</a></li></ul></li>')($rootScope);
return $compile('<li uib-dropdown dropdown-append-to-body keyboard-nav><a href uib-dropdown-toggle></a><ul class="uib-dropdown-menu" id="dropdown-menu"><li><a href>Hello On Body</a></li><li><a href>Hello Again</a></li></ul></li>')($rootScope);
}

beforeEach(function() {
Expand All @@ -709,7 +709,7 @@ describe('dropdownToggle', function() {
it('should focus first list element when down arrow pressed', function() {
clickDropdownToggle();

triggerKeyDown(element, 40);
triggerKeyDown($document, 40);

var dropdownMenu = $document.find('#dropdown-menu');

Expand All @@ -720,8 +720,8 @@ describe('dropdownToggle', function() {

it('should focus second list element when down arrow pressed twice', function() {
clickDropdownToggle();
triggerKeyDown(element, 40);
triggerKeyDown(element, 40);
triggerKeyDown($document, 40);
triggerKeyDown($document, 40);

var dropdownMenu = $document.find('#dropdown-menu');

Expand Down

0 comments on commit 57f72b2

Please sign in to comment.