documentation for all JS files

static/js/rooms/viewManager.js

@@ -1,4 +1,23 @@
+/**
+ * @fileoverview Manages the file view functionality for the room interface.
+ * This file handles:
+ * - Grid and list view rendering
+ * - File sorting and organization
+ * - Breadcrumb navigation
+ * - File action buttons
+ * - Multi-select functionality
+ */
+
+/**
+ * @class ViewManager
+ * @classdesc Manages the visual representation and interaction of files in the room interface.
+ * Handles view switching, file rendering, sorting, and UI updates.
+ */
 export class ViewManager {
+    /**
+     * Creates a new ViewManager instance.
+     * @param {RoomManager} roomManager - The parent RoomManager instance
+     */
     constructor(roomManager) {
         console.log('[ViewManager] Initializing...');
         this.roomManager = roomManager;
@@ -8,6 +27,11 @@ export class ViewManager {
         console.log('[ViewManager] Initialized with roomManager:', roomManager);
     }
     
+    /**
+     * Initializes the view with user preferences.
+     * Fetches and applies the user's preferred view type.
+     * @async
+     */
     async initializeView() {
         console.log('[ViewManager] Initializing view...');
         try {
@@ -29,6 +53,12 @@ export class ViewManager {
         }
     }
     
+    /**
+     * Toggles between grid and list views.
+     * Updates UI and saves user preference.
+     * @async
+     * @param {string} view - The view type to switch to ('grid' or 'list')
+     */
     async toggleView(view) {
         console.log('[ViewManager] Toggling view to:', view);
         this.currentView = view;
@@ -60,6 +90,11 @@ export class ViewManager {
         }
     }
     
+    /**
+     * Renders the file list in the current view mode.
+     * @async
+     * @param {Array<Object>} files - Array of file objects to render
+     */
     async renderFiles(files) {
         console.log('[ViewManager] Rendering files:', files);
         const fileGrid = document.getElementById('fileGrid');
@@ -83,6 +118,10 @@ export class ViewManager {
         }
     }
     
+    /**
+     * Renders the breadcrumb navigation.
+     * Shows the current path and provides navigation controls.
+     */
     renderBreadcrumb() {
         console.log('[ViewManager] Rendering breadcrumb');
         const breadcrumb = document.getElementById('breadcrumb');
@@ -140,6 +179,11 @@ export class ViewManager {
         console.log('[ViewManager] Breadcrumb rendered');
     }
     
+    /**
+     * Renders the file list in list view mode.
+     * @async
+     * @param {Array<Object>} files - Array of file objects to render
+     */
     async renderListView(files) {
         console.log('[ViewManager] Rendering list view');
         const fileGrid = document.getElementById('fileGrid');
@@ -172,6 +216,11 @@ export class ViewManager {
         console.log('[ViewManager] List view rendered');
     }
     
+    /**
+     * Renders the file list in grid view mode.
+     * @async
+     * @param {Array<Object>} files - Array of file objects to render
+     */
     async renderGridView(files) {
         console.log('[ViewManager] Rendering grid view');
         const fileGrid = document.getElementById('fileGrid');
@@ -193,6 +242,12 @@ export class ViewManager {
         console.log('[ViewManager] Grid view rendered');
     }
     
+    /**
+     * Renders a single file row for list view.
+     * @param {Object} file - The file object to render
+     * @param {number} index - The index of the file in the list
+     * @returns {string} HTML string for the file row
+     */
     renderFileRow(file, index) {
         console.log('[ViewManager] Rendering file row:', { file, index });
         const isFolder = file.type === 'folder';
@@ -226,6 +281,12 @@ export class ViewManager {
         `;
     }
     
+    /**
+     * Renders a single file card for grid view.
+     * @param {Object} file - The file object to render
+     * @param {number} index - The index of the file in the list
+     * @returns {string} HTML string for the file card
+     */
     renderFileCard(file, index) {
         console.log('[ViewManager] Rendering file card:', { file, index });
         const isFolder = file.type === 'folder';
@@ -260,6 +321,12 @@ export class ViewManager {
         `;
     }
     
+    /**
+     * Renders the action buttons for a file.
+     * @param {Object} file - The file object
+     * @param {number} index - The index of the file in the list
+     * @returns {string} HTML string for the action buttons
+     */
     renderFileActions(file, index) {
         console.log('[ViewManager] Rendering file actions:', { file, index });
         const actions = [];
@@ -321,6 +388,11 @@ export class ViewManager {
         return actions.join('');
     }
     
+    /**
+     * Sorts the file list based on current sort settings.
+     * @param {Array<Object>} files - Array of file objects to sort
+     * @returns {Array<Object>} Sorted array of file objects
+     */
     sortFiles(files) {
         console.log('[ViewManager] Sorting files:', { 
             column: this.sortColumn, 
@@ -342,6 +414,11 @@ export class ViewManager {
         });
     }
     
+    /**
+     * Gets the appropriate icon class for a file based on its extension.
+     * @param {string} filename - The name of the file
+     * @returns {string} Font Awesome icon class name
+     */
     getFileIcon(filename) {
         const extension = filename.split('.').pop().toLowerCase();
         console.log('[ViewManager] Getting icon for file:', { filename, extension });
@@ -368,6 +445,11 @@ export class ViewManager {
         return iconMap[extension] || 'fa-file';
     }
     
+    /**
+     * Formats a file size in bytes to a human-readable string.
+     * @param {number} bytes - The file size in bytes
+     * @returns {string} Formatted file size string
+     */
     formatFileSize(bytes) {
         if (!bytes) return '0 B';
         
@@ -383,6 +465,9 @@ export class ViewManager {
         return `${size.toFixed(1)} ${units[unitIndex]}`;
     }
     
+    /**
+     * Updates the multi-select UI based on current selection state.
+     */
     updateMultiSelectUI() {
         console.log('[ViewManager] Updating multi-select UI');
         const selectedItems = this.roomManager.fileManager.getSelectedItems();