diff --git a/src/webui/www/private/index.html b/src/webui/www/private/index.html index 1b5eb46f8..4ed47a2c6 100644 --- a/src/webui/www/private/index.html +++ b/src/webui/www/private/index.html @@ -107,7 +107,7 @@
  • QBT_TR(Delete)QBT_TR QBT_TR(Delete)QBT_TR
  • QBT_TR(Category)QBT_TR QBT_TR(Category)QBT_TR - +
  • QBT_TR(Priority)QBT_TR diff --git a/src/webui/www/public/css/style.css b/src/webui/www/public/css/style.css index e101065fb..5eea81c7a 100644 --- a/src/webui/www/public/css/style.css +++ b/src/webui/www/public/css/style.css @@ -165,6 +165,11 @@ a.propButton img { margin-bottom: -4px; } +.scrollableMenu { + overflow-y: auto; + overflow-x: hidden; +} + /* context menu specific */ .contextMenu { border:1px solid #999; padding:0; background:#eee; list-style-type:none; display:none;} diff --git a/src/webui/www/public/scripts/contextmenu.js b/src/webui/www/public/scripts/contextmenu.js index 491595ea4..11cfbf222 100644 --- a/src/webui/www/public/scripts/contextmenu.js +++ b/src/webui/www/public/scripts/contextmenu.js @@ -57,6 +57,11 @@ var ContextMenu = new Class({ adjustMenuPosition: function(e) { this.updateMenuItems(); + var scrollableMenuMaxHeight = document.documentElement.clientHeight * 0.75; + + if (this.menu.hasClass('scrollableMenu')) + this.menu.setStyle('max-height', scrollableMenuMaxHeight); + // draw the menu off-screen to know the menu dimentions this.menu.setStyles({ left: '-999em', @@ -69,7 +74,7 @@ var ContextMenu = new Class({ if (xPos + this.menu.offsetWidth > document.documentElement.clientWidth) xPos -= this.menu.offsetWidth; if (yPos + this.menu.offsetHeight > document.documentElement.clientHeight) - yPos -= this.menu.offsetHeight; + yPos = document.documentElement.clientHeight - this.menu.offsetHeight; if (xPos < 0) xPos = 0; if (yPos < 0) @@ -85,6 +90,8 @@ var ContextMenu = new Class({ var uls = this.menu.getElementsByTagName('ul'); for (var i = 0; i < uls.length; i++) { var ul = uls[i]; + if (ul.hasClass('scrollableMenu')) + ul.setStyle('max-height', scrollableMenuMaxHeight); var rectParent = ul.parentNode.getBoundingClientRect(); var xPosOrigin = rectParent.left; var yPosOrigin = rectParent.bottom; @@ -93,7 +100,7 @@ var ContextMenu = new Class({ if (xPos + ul.offsetWidth > document.documentElement.clientWidth) xPos -= (ul.offsetWidth + rectParent.width - 2); if (yPos + ul.offsetHeight > document.documentElement.clientHeight) - yPos -= (ul.offsetHeight - rectParent.height - 2); + yPos = document.documentElement.clientHeight - ul.offsetHeight; if (xPos < 0) xPos = 0; if (yPos < 0) diff --git a/src/webui/www/public/scripts/dynamicTable.js b/src/webui/www/public/scripts/dynamicTable.js index 8f9a0caa7..9d711ea41 100644 --- a/src/webui/www/public/scripts/dynamicTable.js +++ b/src/webui/www/public/scripts/dynamicTable.js @@ -282,7 +282,7 @@ var DynamicTable = new Class({ var menuId = this.dynamicTableDivId + '_headerMenu'; - var ul = new Element('ul', {id: menuId, class: 'contextMenu'}); + var ul = new Element('ul', {id: menuId, class: 'contextMenu scrollableMenu'}); var createLi = function(columnName, text) { var html = '' + escapeHtml(text) + '';