show item path on Recent + Favorites, add go to parent folder, fix Folder browsing in Favorites

2026-05-06 17:43:30 +02:00
parent 405721c679
commit 8e1e9fe201
28 changed files with 217 additions and 23 deletions
@@ -0,0 +1,78 @@
+/**
+ * Path tooltip — shows the full path of a hovered file/folder item
+ * in an overlay at the bottom-left of the content area.
+ *
+ * Usage: call init(container) after rendering items, destroy(container) on teardown.
+ * Only file-item elements with a data-path attribute trigger the tooltip.
+ */
+
+/** @type {HTMLElement|null} */
+let _tooltip = null;
+
+function _getOrCreateTooltip() {
+    if (_tooltip) return _tooltip;
+    _tooltip = document.getElementById('path-tooltip');
+    if (!_tooltip) {
+        _tooltip = document.createElement('div');
+        _tooltip.id = 'path-tooltip';
+        _tooltip.className = 'path-tooltip hidden';
+        document.querySelector('.main-content')?.appendChild(_tooltip);
+    }
+    return _tooltip;
+}
+
+/**
+ * @param {MouseEvent} e
+ */
+function _onEnter(e) {
+    const item = /** @type {HTMLElement} */ (e.currentTarget);
+    const path = item.dataset.path;
+    if (!path) return;
+
+    const tooltip = _getOrCreateTooltip();
+    tooltip.textContent = path;
+    tooltip.classList.remove('hidden');
+}
+
+function _onLeave() {
+    _tooltip?.classList.add('hidden');
+}
+
+/** @type {WeakMap<HTMLElement, {enter: Function, leave: Function}>} */
+const _listeners = new WeakMap();
+
+/**
+ * Attach path tooltip listeners to all file-item elements inside container.
+ * @param {HTMLElement} container
+ */
+function init(container) {
+    const items = container.querySelectorAll('.file-item[data-path]');
+    items.forEach((item) => {
+        const el = /** @type {HTMLElement} */ (item);
+        const enter = (e) => _onEnter(e);
+        const leave = () => _onLeave();
+        el.addEventListener('mouseenter', enter);
+        el.addEventListener('mouseleave', leave);
+        _listeners.set(el, { enter, leave });
+    });
+}
+
+/**
+ * Remove path tooltip listeners from all file-item elements inside container.
+ * @param {HTMLElement} container
+ */
+function destroy(container) {
+    const items = container.querySelectorAll('.file-item');
+    items.forEach((item) => {
+        const el = /** @type {HTMLElement} */ (item);
+        const fns = _listeners.get(el);
+        if (fns) {
+            el.removeEventListener('mouseenter', fns.enter);
+            el.removeEventListener('mouseleave', fns.leave);
+            _listeners.delete(el);
+        }
+    });
+    _onLeave();
+}
+
+export { destroy, init };