refactor: Modularize UI components and utilities
- Extract UI components into separate JS files - Centralize configuration values in config.js - Introduce a dedicated logger module - Improve file tree drag-and-drop and undo functionality - Refactor modal handling to a single manager - Add URL routing support for SPA navigation - Implement view mode for read-only access
This commit is contained in:
		| @@ -30,10 +30,13 @@ | ||||
|     <!-- Navbar --> | ||||
|     <nav class="navbar navbar-expand-lg"> | ||||
|         <div class="container-fluid"> | ||||
|             <span class="navbar-brand"> | ||||
|             <!-- Left: Logo and Title --> | ||||
|             <span class="navbar-brand mb-0"> | ||||
|                 <i class="bi bi-markdown"></i> Markdown Editor | ||||
|             </span> | ||||
|             <div class="d-flex gap-2"> | ||||
|  | ||||
|             <!-- Center: Edit Mode Buttons --> | ||||
|             <div class="navbar-center d-flex gap-2"> | ||||
|                 <button id="newBtn" class="btn btn-success btn-sm"> | ||||
|                     <i class="bi bi-file-plus"></i> New | ||||
|                 </button> | ||||
| @@ -43,7 +46,13 @@ | ||||
|                 <button id="deleteBtn" class="btn btn-danger btn-sm"> | ||||
|                     <i class="bi bi-trash"></i> Delete | ||||
|                 </button> | ||||
|                 <button id="darkModeBtn" class="btn btn-secondary btn-sm">🌙</button> | ||||
|             </div> | ||||
|  | ||||
|             <!-- Right: Dark Mode Toggle --> | ||||
|             <div class="navbar-right"> | ||||
|                 <button id="darkModeBtn" class="btn btn-secondary btn-sm"> | ||||
|                     <i class="bi bi-moon-fill"></i> | ||||
|                 </button> | ||||
|             </div> | ||||
|         </div> | ||||
|     </nav> | ||||
| @@ -126,7 +135,8 @@ | ||||
|     </div> | ||||
|  | ||||
|     <!-- Confirmation Modal --> | ||||
|     <div class="modal fade" id="confirmationModal" tabindex="-1" aria-labelledby="confirmationModalLabel" aria-hidden="true"> | ||||
|     <div class="modal fade" id="confirmationModal" tabindex="-1" aria-labelledby="confirmationModalLabel" | ||||
|         aria-hidden="true"> | ||||
|         <div class="modal-dialog"> | ||||
|             <div class="modal-content"> | ||||
|                 <div class="modal-header"> | ||||
| @@ -178,16 +188,31 @@ | ||||
|     <!-- Mermaid for diagrams --> | ||||
|     <script src="https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.min.js"></script> | ||||
|  | ||||
|     <!-- Application Configuration (must load first) --> | ||||
|     <script src="/static/js/config.js"></script> | ||||
|     <script src="/static/js/logger.js"></script> | ||||
|     <script src="/static/js/event-bus.js"></script> | ||||
|     <script src="/static/js/utils.js"></script> | ||||
|     <script src="/static/js/notification-service.js"></script> | ||||
|  | ||||
|     <!-- UI Components --> | ||||
|     <script src="/static/js/ui-utils.js" defer></script> | ||||
|     <script src="/static/js/context-menu.js" defer></script> | ||||
|     <script src="/static/js/file-upload.js" defer></script> | ||||
|     <script src="/static/js/dark-mode.js" defer></script> | ||||
|     <script src="/static/js/collection-selector.js" defer></script> | ||||
|     <script src="/static/js/editor-drop-handler.js" defer></script> | ||||
|  | ||||
|     <!-- Core Application Modules --> | ||||
|     <script src="/static/js/webdav-client.js" defer></script> | ||||
|     <script src="/static/js/file-tree.js" defer></script> | ||||
|     <script src="/static/js/editor.js" defer></script> | ||||
|     <script src="/static/js/ui-utils.js" defer></script> | ||||
|     <script src="/static/js/confirmation.js" defer></script> | ||||
|     <script src="/static/js/file-tree-actions.js" defer></script> | ||||
|     <script src="/static/js/column-resizer.js" defer></script> | ||||
|     <script src="/static/js/app.js" defer></script> | ||||
|    <script src="/static/js/macro-parser.js" defer></script> | ||||
|    <script src="/static/js/macro-processor.js" defer></script> | ||||
|     <script src="/static/js/macro-parser.js" defer></script> | ||||
|     <script src="/static/js/macro-processor.js" defer></script> | ||||
| </body> | ||||
|  | ||||
| </html> | ||||
		Reference in New Issue
	
	Block a user