This commit is contained in:
Vanessa 2022-08-15 09:29:34 +08:00
parent e837fc315a
commit 455bb1c050
2 changed files with 26 additions and 20 deletions

View file

@ -34,28 +34,32 @@ export class Menu {
return;
}
itemElement.classList.add("b3-menu__item--show");
const rect = subMenuElement.getBoundingClientRect();
let style = "";
const leftPosition = rect.left - this.element.clientWidth - rect.width;
if (rect.right > window.innerWidth && (
leftPosition > 0 || Math.abs(leftPosition) < (rect.right - window.innerWidth))) {
if (leftPosition >= 0) {
style = "left:auto;right:100%;";
} else {
style = `z-index:1;mix-blend-mode: normal;left:-${this.element.style.left};`;
}
} else if (rect.right > window.innerWidth) {
style = `z-index:1;mix-blend-mode: normal;left:${window.innerWidth - rect.width - this.element.offsetLeft}px;`;
}
if (rect.bottom > window.innerHeight) {
style += `top: auto;bottom:-5px;max-height:${Math.min(rect.top, window.innerHeight * 0.4)}px`;
}
if (style) {
subMenuElement.setAttribute("style", style);
}
this.showSubMenu(subMenuElement);
});
}
public showSubMenu(subMenuElement: Element) {
const rect = subMenuElement.getBoundingClientRect();
let style = "";
const leftPosition = rect.left - this.element.clientWidth - rect.width;
if (rect.right > window.innerWidth && (
leftPosition > 0 || Math.abs(leftPosition) < (rect.right - window.innerWidth))) {
if (leftPosition >= 0) {
style = "left:auto;right:100%;";
} else {
style = `z-index:1;mix-blend-mode: normal;left:-${this.element.style.left};`;
}
} else if (rect.right > window.innerWidth) {
style = `z-index:1;mix-blend-mode: normal;left:${window.innerWidth - rect.width - this.element.offsetLeft}px;`;
}
if (rect.bottom > window.innerHeight) {
style += `top: auto;bottom:-5px;max-height:${Math.min(rect.top, window.innerHeight * 0.4)}px`;
}
if (style) {
subMenuElement.setAttribute("style", style);
}
}
private preventDefault(event: KeyboardEvent) {
if (!hasClosestByClassName(event.target as Element, "b3-menu")) {
event.preventDefault();

View file

@ -605,7 +605,9 @@ ${unicode2Emoji(emoji.unicode, true)}</button>`;
x: rect.left,
y: rect.top
}, true);
window.siyuan.menus.menu.element.querySelector('[data-id="assetSubMenu"]').classList.add("b3-menu__item--show");
const itemElement = window.siyuan.menus.menu.element.querySelector('[data-id="assetSubMenu"]')
itemElement.classList.add("b3-menu__item--show");
window.siyuan.menus.menu.showSubMenu(itemElement.querySelector(".b3-menu__submenu"));
window.siyuan.menus.menu.element.querySelectorAll("input")[0].focus();
} else if (value === "---") {
focusBlock(nodeElement);