How depaulo/markmapeditor works
Purpose and Runtime Entry
MarkmapEditor is a browser-hosted, single-file Markmap editing application, delivered as static assets rather than a server application. index.html is the document entry point; js/main.js initializes application behavior and js/app/script-loader.js manages script loading. Styling is partitioned by editor, map, workspace, menus, overlays, and theme under css/.
Application State and Modes
js/core/context.js provides shared application context, while js/core/mode-session.js represents mode-scoped state. Workspace-specific mode lifecycles are coordinated in js/workspace/mode-runtime-sessions.js. This boundary separates global editor/application state from workspace and mode runtime concerns.
Editor and Document Authoring
The editing surface is bootstrapped through js/editor/codemirror-bootstrap.js. Authoring extensions include image insertion (js/editor/add-image.js), frontmatter visibility (js/editor/frontmatter-visibility.js), and editor visibility management (js/editor/editor-visibility.js). The editor’s document content is the primary source for rendering, links, export, and workspace indexing.
Rendering and Presentation
js/render/render-controller.js is the rendering control boundary between edited source and the visual Markmap/output experience. Presentation is supported by focused CSS layers such as css/map.css, css/html-preview.css, and css/layout.css. Rendering is client-side; no backend renderer or API service is represented in the repository tree.
Workspace Discovery and Navigation
Workspace functionality is decomposed into host, controller, state, scanning, parsing, indexing, opening, and sidebar layers. js/workspace/workspace-host.js establishes the workspace host boundary; js/workspace/workspace-controller.js coordinates operations; js/workspace/workspace-scanner.js and js/workspace/workspace-parser.js discover and interpret workspace documents. Indexing is split between js/workspace/workspace-index-document.js and js/workspace/workspace-index-workspace.js. Navigation history is maintained separately in js/navigation/navigation-history.js.
Document Relationships and Actions
Wiki-style references are interpreted in js/links/wiki-links.js, connecting document content to workspace navigation. User-facing workspace actions and capability checks are separated into js/workspace/workspace-actions.js and js/workspace/workspace-capabilities.js. This suggests a control flow of user action → capability/state validation → workspace open/index/navigation updates.
Export, Offline Delivery, and Planned Reporting
Export commands and UI are handled by js/export/export-actions.js and js/export/export-menu.js; js/export/pandoc-layout-engine.js is the notable external-layout integration boundary. Offline/PWA behavior is represented by manifest.webmanifest, sw.js, and js/pwa/diagnostics.js. Reporting-related files exist under js/report/, but the README explicitly states Report Mode is planned and not available in the current runtime.
Components 19
Browser Runtime
Static application entry and offline delivery.
- Document Entry · Static browser entry point.
index.html - Application Bootstrap
js/main.js - Script Loader
js/app/script-loader.js - Application Context
js/core/context.js - Mode Session
js/core/mode-session.js - Offline PWA · Supports offline static delivery.
sw.js
Authoring & Rendering
- CodeMirror Editor · Primary document authoring surface.
js/editor/codemirror-bootstrap.js - Editor Extensions · Image insertion, frontmatter, and editor visibility.
js/editor/add-image.js - Render Controller · Transforms edited source into the visual Markmap output.
js/render/render-controller.js
Workspace & Navigation
- Workspace Host
js/workspace/workspace-host.js - Workspace Controller
js/workspace/workspace-controller.js - Workspace Mode Runtime
js/workspace/mode-runtime-sessions.js - Workspace Discovery · Discovers and interprets workspace documents.
js/workspace/workspace-scanner.js - Workspace Indexing · Builds document and workspace indexes.
js/workspace/workspace-index-workspace.js - Wiki Links · Connects document references to workspace navigation.
js/links/wiki-links.js - Workspace Actions
js/workspace/workspace-actions.js - Navigation History
js/navigation/navigation-history.js
Export
- Export Actions
js/export/export-actions.js - Pandoc Layout Engine
js/export/pandoc-layout-engine.js
Connections 19
- Document Entry → Script Loader: loads
- Script Loader → Application Bootstrap: loads
- Application Bootstrap → Application Context: initializes
- Application Bootstrap → CodeMirror Editor: boots
- Application Bootstrap → Workspace Host: starts
- Application Bootstrap → Offline PWA: registers
- Application Context → Mode Session: shares state with
- Editor Extensions → CodeMirror Editor: extends
- CodeMirror Editor → Render Controller: document source
- CodeMirror Editor → Wiki Links: document references
- CodeMirror Editor → Export Actions: document source
- Workspace Host → Workspace Controller: hosts
- Workspace Controller → Workspace Mode Runtime: coordinates modes
- Workspace Controller → Workspace Discovery: scans workspace
- Workspace Discovery → Workspace Indexing: documents
- Workspace Actions → Workspace Controller: requests operations
- Workspace Controller → Navigation History: updates navigation
- Wiki Links → Workspace Controller: opens linked documents
- Export Actions → Pandoc Layout Engine: uses layout integration