1
0
mirror of https://github.com/bitwarden/web synced 2025-12-10 13:23:15 +00:00

make dropdown append more generic

This commit is contained in:
Kyle Spearrin
2017-04-18 10:19:42 -04:00
parent f904558315
commit 3728f012d7
10 changed files with 39 additions and 36 deletions

View File

@@ -52,10 +52,11 @@ angular
$scope.$broadcast('vaultAddFolder');
};
// Append dropdown menus to body
// Append dropdown menu somewhere else
var bodyScrollbarWidth,
bodyDropdownMenu,
bodyDropdownMenuParent;
appendedDropdownMenu,
appendedDropdownMenuParent;
var dropdownHelpers = {
scrollbarWidth: function () {
if (!bodyScrollbarWidth) {
@@ -77,58 +78,60 @@ angular
};
$(window).on('show.bs.dropdown', function (e) {
var target = bodyDropdownMenuParent = $(e.target);
if (!target.hasClass('dropdown-to-body')) {
var target = appendedDropdownMenuParent = $(e.target);
var appendTo = target.data('appendTo');
if (!appendTo) {
return true;
}
bodyDropdownMenu = target.find('.dropdown-menu');
var body = $('body');
body.append(bodyDropdownMenu.detach());
appendedDropdownMenu = target.find('.dropdown-menu');
var appendToEl = $(appendTo);
appendToEl.append(appendedDropdownMenu.detach());
var eOffset = target.offset();
var offset = target.offset();
var css = {
display: 'block',
top: eOffset.top + target.outerHeight()
top: offset.top + target.outerHeight()
};
if (bodyDropdownMenu.hasClass('dropdown-menu-right')) {
if (appendedDropdownMenu.hasClass('dropdown-menu-right')) {
var scrollbarInfo = dropdownHelpers.scrollbarInfo();
var scrollbarWidth = 0;
if (scrollbarInfo.visible && scrollbarInfo.width) {
scrollbarWidth = scrollbarInfo.width;
}
css.right = $window.innerWidth - scrollbarWidth - (eOffset.left + target.prop('offsetWidth')) + 'px';
css.right = $window.innerWidth - scrollbarWidth - (offset.left + target.prop('offsetWidth')) + 'px';
css.left = 'auto';
}
else {
css.left = eOffset.left + 'px';
css.left = offset.left + 'px';
css.right = 'auto';
}
bodyDropdownMenu.css(css);
appendedDropdownMenu.css(css);
});
$(window).on('hide.bs.dropdown', function (e) {
if (!bodyDropdownMenu) {
if (!appendedDropdownMenu) {
return true;
}
$(e.target).append(bodyDropdownMenu.detach());
bodyDropdownMenu.hide();
bodyDropdownMenu = null;
bodyDropdownMenuParent = null;
$(e.target).append(appendedDropdownMenu.detach());
appendedDropdownMenu.hide();
appendedDropdownMenu = null;
appendedDropdownMenuParent = null;
});
$scope.$on('removeBodyDropdownMenu', function (event, args) {
if (!bodyDropdownMenu && !bodyDropdownMenuParent) {
$scope.$on('removeAppendedDropdownMenu', function (event, args) {
if (!appendedDropdownMenu && !appendedDropdownMenuParent) {
return true;
}
bodyDropdownMenuParent.append(bodyDropdownMenu.detach());
bodyDropdownMenu.hide();
bodyDropdownMenu = null;
bodyDropdownMenuParent = null;
appendedDropdownMenuParent.append(appendedDropdownMenu.detach());
appendedDropdownMenu.hide();
appendedDropdownMenu = null;
appendedDropdownMenuParent = null;
});
});