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

feat(dropdown): uib- prefix #4510

Closed
wants to merge 1 commit into from
Closed

feat(dropdown): uib- prefix #4510

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
38 changes: 19 additions & 19 deletions src/dropdown/docs/demo.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,23 +1,23 @@

<div ng-controller="DropdownCtrl">
<!-- Simple dropdown -->
<span dropdown on-toggle="toggled(open)">
<a href id="simple-dropdown" dropdown-toggle>
<span uib-dropdown on-toggle="toggled(open)">
<a href id="simple-dropdown" uib-dropdown-toggle>
Click me for a dropdown, yo!
</a>
<ul class="dropdown-menu" aria-labelledby="simple-dropdown">
<ul class="uib-dropdown-menu" aria-labelledby="simple-dropdown">
<li ng-repeat="choice in items">
<a href>{{choice}}</a>
</li>
</ul>
</span>

<!-- Single button -->
<div class="btn-group" dropdown is-open="status.isopen">
<button id="single-button" type="button" class="btn btn-primary" dropdown-toggle ng-disabled="disabled">
<div class="btn-group" uib-dropdown is-open="status.isopen">
<button id="single-button" type="button" class="btn btn-primary" uib-dropdown-toggle ng-disabled="disabled">
Button dropdown <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="single-button">
<ul class="uib-dropdown-menu" role="menu" aria-labelledby="single-button">
<li role="menuitem"><a href="#">Action</a></li>
<li role="menuitem"><a href="#">Another action</a></li>
<li role="menuitem"><a href="#">Something else here</a></li>
Expand All @@ -27,13 +27,13 @@
</div>

<!-- Split button -->
<div class="btn-group" dropdown>
<div class="btn-group" uib-dropdown>
<button id="split-button" type="button" class="btn btn-danger">Action</button>
<button type="button" class="btn btn-danger" dropdown-toggle>
<button type="button" class="btn btn-danger" uib-dropdown-toggle>
<span class="caret"></span>
<span class="sr-only">Split button!</span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="split-button">
<ul class="uib-dropdown-menu" role="menu" aria-labelledby="split-button">
<li role="menuitem"><a href="#">Action</a></li>
<li role="menuitem"><a href="#">Another action</a></li>
<li role="menuitem"><a href="#">Something else here</a></li>
Expand All @@ -43,11 +43,11 @@
</div>

<!-- Single button using append-to-body -->
<div class="btn-group" dropdown dropdown-append-to-body>
<button id="btn-append-to-body" type="button" class="btn btn-primary" dropdown-toggle>
<div class="btn-group" uib-dropdown dropdown-append-to-body>
<button id="btn-append-to-body" type="button" class="btn btn-primary" uib-dropdown-toggle>
Dropdown on Body <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="btn-append-to-body">
<ul class="uib-dropdown-menu" role="menu" aria-labelledby="btn-append-to-body">
<li role="menuitem"><a href="#">Action</a></li>
<li role="menuitem"><a href="#">Another action</a></li>
<li role="menuitem"><a href="#">Something else here</a></li>
Expand All @@ -57,11 +57,11 @@
</div>

<!-- Single button using template-url -->
<div class="btn-group" dropdown>
<button id="button-template-url" type="button" class="btn btn-primary" dropdown-toggle ng-disabled="disabled">
<div class="btn-group" uib-dropdown>
<button id="button-template-url" type="button" class="btn btn-primary" uib-dropdown-toggle ng-disabled="disabled">
Dropdown using template <span class="caret"></span>
</button>
<ul class="dropdown-menu" template-url="dropdown.html" aria-labelledby="button-template-url">
<ul class="uib-dropdown-menu" template-url="dropdown.html" aria-labelledby="button-template-url">
</ul>
</div>

Expand All @@ -73,11 +73,11 @@

<hr>
<!-- Single button with keyboard nav -->
<div class="btn-group" dropdown keyboard-nav>
<button id="simple-btn-keyboard-nav" type="button" class="btn btn-primary" dropdown-toggle>
<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>
<ul class="dropdown-menu" role="menu" aria-labelledby="simple-btn-keyboard-nav">
<ul class="uib-dropdown-menu" role="menu" aria-labelledby="simple-btn-keyboard-nav">
<li role="menuitem"><a href="#">Action</a></li>
<li role="menuitem"><a href="#">Another action</a></li>
<li role="menuitem"><a href="#">Something else here</a></li>
Expand All @@ -87,7 +87,7 @@
</div>

<script type="text/ng-template" id="dropdown.html">
<ul class="dropdown-menu" role="menu" aria-labelledby="button-template-url">
<ul class="uib-dropdown-menu" role="menu" aria-labelledby="button-template-url">
<li role="menuitem"><a href="#">Action in Template</a></li>
<li role="menuitem"><a href="#">Another action in Template</a></li>
<li role="menuitem"><a href="#">Something else here</a></li>
Expand Down
76 changes: 63 additions & 13 deletions src/dropdown/dropdown.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ angular.module('ui.bootstrap.dropdown', ['ui.bootstrap.position'])
openClass: 'open'
})

.service('dropdownService', ['$document', '$rootScope', function($document, $rootScope) {
.service('uibDropdownService', ['$document', '$rootScope', function($document, $rootScope) {
var openScope = null;

this.open = function(dropdownScope) {
Expand Down Expand Up @@ -65,7 +65,7 @@ angular.module('ui.bootstrap.dropdown', ['ui.bootstrap.position'])
};
}])

.controller('DropdownController', ['$scope', '$attrs', '$parse', 'dropdownConfig', 'dropdownService', '$animate', '$position', '$document', '$compile', '$templateRequest', function($scope, $attrs, $parse, dropdownConfig, dropdownService, $animate, $position, $document, $compile, $templateRequest) {
.controller('UibDropdownController', ['$scope', '$attrs', '$parse', 'dropdownConfig', 'uibDropdownService', '$animate', '$position', '$document', '$compile', '$templateRequest', function($scope, $attrs, $parse, dropdownConfig, uibDropdownService, $animate, $position, $document, $compile, $templateRequest) {
var self = this,
scope = $scope.$new(), // create a child scope so we are not polluting original one
templateScope,
Expand All @@ -91,7 +91,7 @@ angular.module('ui.bootstrap.dropdown', ['ui.bootstrap.position'])
}

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

if (appendToBody && self.dropdownMenu) {
body.append(self.dropdownMenu);
Expand Down Expand Up @@ -207,7 +207,7 @@ angular.module('ui.bootstrap.dropdown', ['ui.bootstrap.position'])
}

scope.focusToggleElement();
dropdownService.open(scope);
uibDropdownService.open(scope);
} else {
if (self.dropdownMenuTemplateUrl) {
if (templateScope) {
Expand All @@ -218,7 +218,7 @@ angular.module('ui.bootstrap.dropdown', ['ui.bootstrap.position'])
self.dropdownMenu = newEl;
}

dropdownService.close(scope);
uibDropdownService.close(scope);
self.selectedOption = null;
}

Expand All @@ -239,20 +239,20 @@ angular.module('ui.bootstrap.dropdown', ['ui.bootstrap.position'])
scope.$on('$destroy', offDestroy);
}])

.directive('dropdown', function() {
.directive('uibDropdown', function() {
return {
controller: 'DropdownController',
controller: 'UibDropdownController',
link: function(scope, element, attrs, dropdownCtrl) {
dropdownCtrl.init(element);
element.addClass('dropdown');
}
};
})

.directive('dropdownMenu', function() {
.directive('uibDropdownMenu', function() {
return {
restrict: 'AC',
require: '?^dropdown',
require: '?^uibDropdown',
link: function(scope, element, attrs, dropdownCtrl) {
if (!dropdownCtrl) {
return;
Expand All @@ -268,10 +268,10 @@ angular.module('ui.bootstrap.dropdown', ['ui.bootstrap.position'])
};
})

.directive('keyboardNav', function() {
.directive('uibKeyboardNav', function() {
return {
restrict: 'A',
require: '?^dropdown',
require: '?^uibDropdown',
link: function(scope, element, attrs, dropdownCtrl) {
element.bind('keydown', function(e) {
if ([38, 40].indexOf(e.which) !== -1) {
Expand Down Expand Up @@ -307,9 +307,9 @@ angular.module('ui.bootstrap.dropdown', ['ui.bootstrap.position'])
};
})

.directive('dropdownToggle', function() {
.directive('uibDropdownToggle', function() {
return {
require: '?^dropdown',
require: '?^uibDropdown',
link: function(scope, element, attrs, dropdownCtrl) {
if (!dropdownCtrl) {
return;
Expand Down Expand Up @@ -343,3 +343,53 @@ angular.module('ui.bootstrap.dropdown', ['ui.bootstrap.position'])
}
};
});

/* Depreciated drop down below */

angular.module('ui.bootstrap.dropdown')
.value('$dropdownSuppressWarning', false)
.directive('dropdown', ['$log', '$dropdownSuppressWarning', function($log, $dropdownSuppressWarning) {
return {
link: function(scope, element, attrs, dropdownCtrl) {
if (!$dropdownSuppressWarning) {
$log.warn('dropdown is now deprecated. Use uib-dropdown instead.');
}
}
};
}])

.directive('dropdownMenu', ['$log', '$dropdownSuppressWarning', function($log, $dropdownSuppressWarning) {
return {
restrict: 'AC',
require: '?^dropdown',
link: function(scope, element, attrs, dropdownCtrl) {
if (!$dropdownSuppressWarning) {
$log.warn('dropdown-menu is now deprecated. Use uib-dropdown-menu instead.');
}
}
};
}])

.directive('keyboardNav', ['$log', '$dropdownSuppressWarning', function($log, $dropdownSuppressWarning) {
return {
restrict: 'A',
require: '?^dropdown',
link: function(scope, element, attrs, dropdownCtrl) {
if (!$dropdownSuppressWarning) {
$log.warn('keyboard-nav is now deprecated. Use uib-keyboard-nav instead.');
}
}
};
}])

.directive('dropdownToggle', ['$log', '$dropdownSuppressWarning', function($log, $dropdownSuppressWarning) {
return {
require: '?^dropdown',
link: function(scope, element, attrs, dropdownCtrl) {
if (!$dropdownSuppressWarning) {
$log.warn('dropdown-toggle is now deprecated. Use uib-dropdown-toggle instead.');
}
}
};
}]);

Loading