ZDDC/mdedit/js/events.js
ZDDC 22c142e45a chore(headers): standardize across all 7 tools
Bring every tool's header in line with archive's pattern:

  [logo] [title] [version] [Add Local Directory] [⟳] ............... [◐] [?]
  ------------- header-left ---------------       ----- header-right -

Changes per tool:

* browse: rename "Select Directory" → "Add Local Directory"; add the
  red-non-stable wrap to the build label (was missing); add a help
  panel + bundle shared/help.js.

* classifier: rename selectDirectoryBtn → addDirectoryBtn,
  refreshBtn → refreshHeaderBtn for consistency. Update all JS
  callers and welcome-screen copy to the new label.

* mdedit: same id rename. Move the previously-in-pane refresh
  button into the header. Stop renaming the dir button to
  "Directory: <name>" once a folder is loaded — instead use the
  shared btn--subtle variant to de-emphasize while keeping the
  standard label.

* transmittal: convert non-standard <div class="app-header"> with
  spacer/icons containers to <header class="app-header"> with the
  canonical header-left/header-right pair. Move the publish split-
  button into header-left (Transmittal-specific primary action).
  Remove dead .app-header__spacer/__icons/header-icon-btn CSS now
  that nothing references those classes.

* landing, form: add help-btn + help-panel + bundle shared/help.js.
  Each panel is tool-specific (project picker docs for landing,
  schema-driven form docs for form).

Cross-cutting:

* shared/base.css: promote .btn--subtle from browse/css/tree.css
  so any tool with an online mode can de-emphasize Add Local
  Directory consistently.

Verified all 7 tools in headless Chromium: header structure correct,
build label red on non-stable cuts, help panel opens + closes via
button + Esc.
2026-05-04 07:49:17 -05:00

81 lines
2.6 KiB
JavaScript

/**
* Event listeners setup
*/
/**
* Set up all event listeners for the application
*/
function setupEventListeners() {
// Add Local Directory button (was id="select-directory" / "refresh-directory")
const selectDirectoryBtn = document.getElementById('addDirectoryBtn');
if (selectDirectoryBtn) {
selectDirectoryBtn.addEventListener('click', openDirectory);
}
// Refresh button (now in header, was in file-nav pane)
const refreshDirectoryBtn = document.getElementById('refreshHeaderBtn');
if (refreshDirectoryBtn) {
refreshDirectoryBtn.addEventListener('click', refreshDirectory);
}
// New file (root) button
const newFileRootBtn = document.getElementById('new-file-root');
if (newFileRootBtn) {
newFileRootBtn.addEventListener('click', () => {
if (directoryHandle) {
createNewFile('');
}
});
}
// Save All button
const saveAllBtn = document.getElementById('save-all');
if (saveAllBtn) {
saveAllBtn.addEventListener('click', saveAllFiles);
}
// Warn when leaving with unsaved changes
window.addEventListener('beforeunload', function (e) {
let hasUnsavedChanges = false;
editorInstances.forEach((instanceData) => {
if (instanceData.isDirty) {
hasUnsavedChanges = true;
}
});
if (hasUnsavedChanges) {
e.preventDefault();
return 'You have unsaved changes. If you leave now, your changes will be lost.';
}
});
}
/**
* Set up TOC depth selector
*/
function setupTocDepthSelector() {
const depthSelector = document.getElementById('toc-depth-selector');
if (!depthSelector) return;
depthSelector.value = tocMaxDepth.toString();
depthSelector.addEventListener('change', function () {
tocMaxDepth = parseInt(this.value, 10);
if (currentFileHandle && currentFileHandle.name.match(/\.(md|markdown)$/i)) {
const filePath = currentFileHandle.name;
const instance = editorInstances.get(filePath);
if (instance && instance.editor && instance.tocContainer) {
const content = instance.editor.getMarkdown();
try {
window.updateToc(content, instance.tocContainer, instance.editor, tocMaxDepth);
} catch (error) {
console.error('Error updating TOC depth:', error);
}
}
}
});
}