alphard/ComfyUI-Lora-Manager
1
0
Fork 0
mirror of https://github.com/willmiao/ComfyUI-Lora-Manager.git synced 2026-08-21 13:01:27 -03:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): keep loras widget context menu within viewport bounds

Browse Source
This commit is contained in:
Will Miao
2026-08-21 08:07:50 +08:00
parent 45e7c25308
commit bbe0acac5c
1 changed files with 17 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/comfyui/loras_widget_events.js
+17
View File
@@ -722,6 +722,8 @@ export function createContextMenu(x, y, loraName, widget, previewTooltip, render
menu.className = 'lm-lora-context-menu'; menu.className = 'lm-lora-context-menu';
menu.style.left = `${x}px`; menu.style.left = `${x}px`;
menu.style.top = `${y}px`; menu.style.top = `${y}px`;
// Render off-screen until measured so we can adjust for viewport edges
menu.style.visibility = 'hidden';
// View on Civitai option with globe icon // View on Civitai option with globe icon
const viewOnCivitaiOption = createMenuItem( const viewOnCivitaiOption = createMenuItem(
@@ -978,6 +980,21 @@ export function createContextMenu(x, y, loraName, widget, previewTooltip, render
document.body.appendChild(menu); document.body.appendChild(menu);
// Flip/clamp position so the menu stays fully inside the viewport
const VIEWPORT_MARGIN = 8;
const menuRect = menu.getBoundingClientRect();
let menuLeft = x;
let menuTop = y;
if (menuLeft + menuRect.width > window.innerWidth - VIEWPORT_MARGIN) {
menuLeft = Math.max(VIEWPORT_MARGIN, window.innerWidth - menuRect.width - VIEWPORT_MARGIN);
}
if (menuTop + menuRect.height > window.innerHeight - VIEWPORT_MARGIN) {
menuTop = Math.max(VIEWPORT_MARGIN, window.innerHeight - menuRect.height - VIEWPORT_MARGIN);
}
menu.style.left = `${menuLeft}px`;
menu.style.top = `${menuTop}px`;
menu.style.visibility = '';
// Close menu when clicking outside // Close menu when clicking outside
const closeMenu = (e) => { const closeMenu = (e) => {
if (!menu.contains(e.target)) { if (!menu.contains(e.target)) {