*

1 files changed, 24 insertions, 18 deletions

diff --git a/html/file-system/index.html b/html/file-system/index.html
index 03ee17b..75a7daa 100644
--- a/html/file-system/index.html
+++ b/html/file-system/index.html
@@ -320,7 +320,7 @@
         }
 
         @keyframes inch {
-            /* Going forward */
+            /* Forward */
             0% { 
                 left: 0; 
                 transform: scaleX(1) scaleY(1);
@@ -358,13 +358,13 @@
                 transform: scaleX(1.3) scaleY(0.7);
             }
             
-            /* Pause at end */
+            /* Rest */
             42% { 
                 left: 120px; 
                 transform: scaleX(1) scaleY(1);
             }
             
-            /* Going back */
+            /* Backwards */
             45% { 
                 left: 120px; 
                 transform: scaleX(0.4) scaleY(1.4);
@@ -398,7 +398,7 @@
                 transform: scaleX(1.3) scaleY(0.7);
             }
             
-            /* Pause at start */
+            /* Rest */
             85% { 
                 left: 0; 
                 transform: scaleX(1) scaleY(1);
@@ -483,7 +483,7 @@
 
         /* Grid view styles */
         .grid-view {
-            display: none; /* Hidden by default */
+            display: none;
             grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
             gap: 1em;
             padding: 1em;
@@ -514,14 +514,13 @@
             max-width: 100%;
         }
 
-        /* Update container to accommodate breadcrumbs */
         #fileSystemContainer {
             display: flex;
             flex-direction: column;
         }
 
         .grid-view {
-            padding-top: 0; /* Remove top padding since breadcrumbs provide spacing */
+            padding-top: 0;
         }
     </style>
 </head>
@@ -542,8 +541,8 @@
     <ul id="fileSystemTree"></ul>
     <div class="grid-view"></div>
     <div class="empty-state" style="display: none;">
-        <div class="empty-state-text">No folders yet</div>
-        <div class="empty-state-hint">Right-click or use the menu to create a folder</div>
+        <div class="empty-state-text">No folders yet.</div>
+        <div class="empty-state-hint">Right-click and use the context menu to create a folder.</div>
     </div>
 </div>
 
@@ -691,9 +690,6 @@ const deleteItem = () => {
     const folderName = parts[parts.length - 1];
     const parentPath = parts.slice(0, -1).join('/') || 'root';
 
-    console.log('Parent path:', parentPath); // Debug log
-    console.log('Folder to delete:', folderName); // Debug log
-
     // Create new file system and delete the folder
     const newFileSystem = clone(state.fileSystem);
     const parent = parentPath === 'root' ? 
@@ -707,6 +703,7 @@ const deleteItem = () => {
         document.getElementById('editor').style.display = 'none';
         render();
     }
+    hideContextMenu();
 };
 
 const copyItem = () => {
@@ -714,12 +711,16 @@ const copyItem = () => {
     if (folder) {
         state.copiedFolderData = clone(folder); // Store a deep copy of the folder
         state.copiedItemPath = state.currentFolderPath; // Store the path so that we can remove later
-        // console.log('Folder copied:', state.copiedFolderData);
     }
+    hideContextMenu();
 };
 
 const pasteItem = () => {
-    if (!state.copiedItemPath || !state.copiedFolderData) return alert('No item to paste');
+    if (!state.copiedItemPath || !state.copiedFolderData) {
+        alert('No item to paste');
+        hideContextMenu();
+        return;
+    }
 
     const [oldPath, folderName] = state.copiedItemPath.split(/\/([^\/]+)$/);
     const updatedFileSystem = addFolder(state.currentFolderPath, folderName, state.copiedFolderData, state.fileSystem);
@@ -732,6 +733,7 @@ const pasteItem = () => {
     } else {
         alert('Error pasting item');
     }
+    hideContextMenu();
 };
 
 const saveFolderContent = () => {
@@ -896,12 +898,14 @@ const render = () => {
     // Update folder tree and empty state
     document.getElementById('fileSystemTree').innerHTML = renderFolderTree(state.fileSystem.root);
     const emptyState = document.querySelector('.empty-state');
-    emptyState.style.display = isEmpty ? 'flex' : 'none';
+    const hasNoFolders = Object.keys(state.fileSystem.root.children).length === 0;
+    emptyState.style.display = hasNoFolders ? 'flex' : 'none';
 };
 
 const createFolderPrompt = () => {
     const name = prompt('Enter folder name:');
     if (name) createFolder(state.currentFolderPath, name);
+    hideContextMenu();
 };
 
 const contextMenu = document.getElementById('contextMenu');
@@ -1104,9 +1108,6 @@ const renameFolder = () => {
     const oldName = parts[parts.length - 1];
     const parentPath = parts.slice(0, -1).join('/') || 'root';
 
-    console.log('Parent path:', parentPath); // Debug log
-    console.log('Folder to rename:', oldName); // Debug log
-
     const newName = prompt(`Rename "${oldName}" to:`, oldName);
     if (!newName || newName === oldName) return;
 
@@ -1130,6 +1131,7 @@ const renameFolder = () => {
             `${parentPath}/${newName}`;
         render();
     }
+    hideContextMenu();
 };
 
 // Add double-click to rename
@@ -1197,6 +1199,10 @@ const renderGridView = (folder) => {
     `).join('');
 };
 
+const hideContextMenu = () => {
+    contextMenu.classList.remove('active');
+};
+
 render();
 </script>