mirror/blockbench
2
0
Fork 0
mirror of https://github.com/JannisX11/blockbench.git synced 2025-02-11 16:12:06 +08:00
Code Issues Packages Projects Releases Wiki Activity

Fix menu overflow

Browse Source
This commit is contained in:
JannisX11 2021-01-10 23:57:55 +01:00
parent 51d4a9bd3a
commit 661563e1f3
2 changed files with 30 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
css/window.css
View File

@ -354,7 +354,7 @@
padding: 0 8px;
padding-top: 2px;
display: inline-block;
height: 29px;
height: 28px;
font-weight: normal;
}
li.menu_bar_point.opened {
@ -502,7 +502,7 @@
margin-top: 40px;
max-width: 1000px;
height: auto;
max-height: calc(100% - 80px);
max-height: calc(100% - 50px);
margin-left: auto;
margin-right: auto;
background-color: var(--color-ui);

37
js/interface/menu.js
View File

@ -1,4 +1,21 @@
var open_menu;
function handleMenuOverflow(node) {
node = node.get(0);
if (!node) return;
// Todo: mobile support
node.addEventListener('wheel', e => {
e.stopPropagation();
let top = parseInt(node.style.top);
let offset = top - $(node).offset().top;
top = Math.clamp(
top - e.deltaY,
window.innerHeight - node.clientHeight + offset,
offset + 26
);
node.style.top = `${top}px`;
})
}
class Menu {
constructor(structure) {
var scope = this;
@ -35,17 +52,20 @@ class Menu {
}
}
let window_height = $(window).height() - 26;
let window_height = window.innerHeight - 26;
if (offset.top + el_height > window_height) {
childlist.css('margin-top', 4-childlist.height() + 'px')
if (el_height > window_height) {
childlist.css('margin-top', '0').css('top', '0')
childlist.css('top', (-childlist.offset().top + 26) + 'px')
handleMenuOverflow(childlist);
} else if (offset.top + el_height > window_height) {
console.log('b')
childlist.css('margin-top', 26-childlist.height() + 'px')
if (childlist.offset().top < 26) {
childlist.offset({top: 26})
}
}
if (el_height > $(window).height()) {
childlist.css('height', $(window).height()+'px').css('overflow-y', 'scroll')
}
}
}
keyNavigate(e) {
@ -170,7 +190,6 @@ class Menu {
createChildList(s, entry)
} else {
entry.on('click', (e) => {s.trigger(e)})
//entry[0].addEventListener('click', )
}
parent.append(entry)
@ -257,7 +276,7 @@ class Menu {
var el_width = ctxmenu.width()
var el_height = ctxmenu.height()
let window_height = $(window).height() - 26;
let window_height = window.innerHeight - 26;
if (position && position.clientX !== undefined) {
var offset_left = position.clientX
@ -290,7 +309,7 @@ class Menu {
ctxmenu.css('top', offset_top +'px')
if (el_height > window_height) {
ctxmenu.css('height', window_height+'px').css('overflow-y', 'scroll')
handleMenuOverflow(ctxmenu);
}
$(scope.node).filter(':not(.tx)').addClass('tx').click(function(ev) {