codecringebinge 7c4c8f324a Rework overlay/dialog detection, add shift-speed and custom selectors
js/arrow_key_canvas_navigation.js:
- Replace the hardcoded CANVAS_BLOCKING_UI_WINDOW_CLASSES selector
  string with isDialogOpen(), which detects blocking UI more robustly:
  ARIA dialogs/modals via document.activeElement, PrimeVue overlay
  masks, native <dialog> elements, and a generic fallback that flags
  any full-viewport, high-z-index fixed-position div. This removes the
  need to hardcode every third-party node's CSS class.
- Add a "Manual Overlay CSS Selectors (to Disable Panning)" setting so
  users can add selectors for overlays the automatic detection misses,
  without editing the source file or restarting ComfyUI.
- Add a "Pan Speed Multiplier (Shift + Arrow Key)" setting (default 3x)
  for faster panning while holding Shift.
- Switch from the deprecated app.ui.settings API to
  app.extensionManager.setting.
- Replace the event.composedPath()[0] focus check with
  document.activeElement, and also treat contentEditable elements and
  litegraph's inline "property_value" span as focused inputs.
- Extract isInputFocused()/hasImageCarousel() into named helper
  functions and reorder the keydown handler into early-exit "fast
  path" checks for readability.

README.md:
- Update docs to match the above: mention the Shift multiplier, and
  replace the outdated instructions to edit the
  CANVAS_BLOCKING_UI_WINDOW_CLASSES constant with instructions to use
  the new Manual Overlay CSS Selectors setting instead.

Also normalized 6 files (.github/workflows/publish.yml, .gitignore,
LICENSE, README.md, __init__.py, pyproject.toml) back to LF line
endings — they had been accidentally converted to CRLF with no actual
content changes, which was producing a noisy ~800-line diff.
2026-07-20 17:00:53 -07:00
2024-09-28 20:08:04 -07:00

ComfyUI-Arrow-Key-Canvas-Navigation

This custom "node" for ComfyUI enables pan navigation of the canvas using the arrow keys, with a customizable pan speed (and a Shift-key speed multiplier) in ComfyUI's Settings, under the "codecringebinge" subsection of the Settings Dialog's left panel.

Note:

  • There are specific cases in which the arrow keys intentionally will not pan the canvas, such as when a node with more than one image is selected (as the arrow keys should retain their standard behavior of cycling through said images), or when the canvas is blocked by another UI window (e.g. the Comfy Manager, Comfy Settings, the pythongosssss Image Gallery, modals, etc.). Text inputs and text areas are also excluded so typing still works as expected.
  • Blocking UI windows are detected automatically in most cases (ARIA dialogs, native <dialog> elements, PrimeVue overlay masks, and full-viewport high-z-index overlays). If you encounter a scenario where the arrow keys are panning the canvas when they shouldn't (e.g. a custom node opens a UI window that isn't being detected), you can report this in the GitHub Issues section of this repo, or for a faster fix, identify a CSS selector for the window in question (e.g. via your browser's Developer Tools) and add it to the "Manual Overlay CSS Selectors (to Disable Panning)" setting (comma-separated list) — no restart required.

Installation

If using ComfyUI Manager:

  1. Look for ComfyUI-Arrow-Key-Canvas-Navigation, confirm the author is codecringebinge, and install it.

If installing manually:

  1. Clone this repo into the custom_nodes folder.

Thanks and cheers! 🍻

S
Description
No description provided
Readme GPL-3.0
51 KiB
Languages
JavaScript 98.5%
Python 1.5%