1
0
mirror of https://github.com/d47081/qBittorrent.git synced 2025-01-12 15:57:57 +00:00

Make too tall menus scrollable

This commit is contained in:
buinsky 2016-07-18 22:33:16 +03:00
parent 134e4c1eb9
commit 3dfcd6db6a
4 changed files with 16 additions and 4 deletions

View File

@ -107,7 +107,7 @@
<li class="separator"><a href="#Delete"><img src="theme/list-remove" alt="QBT_TR(Delete)QBT_TR"/> QBT_TR(Delete)QBT_TR</a></li>
<li class="separator">
<a href="#Category" class="arrow-right"><img src="theme/view-categories" alt="QBT_TR(Category)QBT_TR"/> QBT_TR(Category)QBT_TR</a>
<ul id="contextCategoryList"></ul>
<ul id="contextCategoryList" class="scrollableMenu"></ul>
</li>
<li id="queueingMenuItems" class="separator">
<a href="#priority" class="arrow-right"><span style="display: inline-block; width:16px"></span> QBT_TR(Priority)QBT_TR</a>

View File

@ -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;}

View File

@ -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)

View File

@ -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 = '<a href="#' + columnName + '" ><img src="theme/checked"/>' + escapeHtml(text) + '</a>';