local-cmd-runner 1.0.4 → 1.0.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "local-cmd-runner",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "description": "Run local shell commands from a web page",
   "homepage": "https://github.com/codewoow/local_cmd#readme",
   "bugs": {

package/public/app.js

@@ -206,6 +206,14 @@ function renderTree(items, relPath) {
     
     if (item.isDirectory) {
       el.onclick = () => loadTree(item.path);
+      
+      const uploadDirBtn = document.createElement('button');
+      uploadDirBtn.innerHTML = '上传到此';
+      uploadDirBtn.onclick = (e) => {
+        e.stopPropagation();
+        triggerDirectoryUpload(item.path);
+      };
+      actions.appendChild(uploadDirBtn);
     } else {
       const previewBtn = document.createElement('button');
       previewBtn.innerHTML = '查看';
@@ -226,15 +234,21 @@ function renderTree(items, relPath) {
   });
 }
 
+let pendingUploadPath = '';
+function triggerDirectoryUpload(targetPath) {
+  pendingUploadPath = targetPath;
+  fmUploadInput.click();
+}
+
 if (fmRefreshBtn) {
   fmRefreshBtn.onclick = () => loadTree(currentRelPath);
-  fmUploadBtn.onclick = () => fmUploadInput.click();
+  fmUploadBtn.onclick = () => triggerDirectoryUpload(currentRelPath);
   fmUploadInput.onchange = async (e) => {
     const file = e.target.files[0];
     if (!file) return;
     const formData = new FormData();
     formData.append('file', file);
-    formData.append('path', currentRelPath);
+    formData.append('path', pendingUploadPath);
     
     try {
       fmUploadBtn.textContent = '...';
@@ -255,14 +269,43 @@ if (fmRefreshBtn) {
 
 async function previewFile(path) {
   try {
-    const res = await fetch(`/cmd/api/preview?path=${encodeURIComponent(path)}`);
-    if (!res.ok) throw new Error('获取预览失败');
-    const text = await res.text();
     previewTitle.textContent = path;
-    previewBody.textContent = text;
     previewModal.classList.remove('hidden');
+    previewBody.innerHTML = '<div style="margin: 20px;">加载中...</div>';
+    
+    const ext = path.split('.').pop().toLowerCase();
+    const isImage = ['png', 'jpg', 'jpeg', 'gif', 'svg', 'webp', 'ico'].includes(ext);
+    const isHtml = ['html', 'htm'].includes(ext);
+    const isVideo = ['mp4', 'webm', 'ogg'].includes(ext);
+    const isAudio = ['mp3', 'wav', 'ogg'].includes(ext);
+
+    const fileUrl = `/cmd/api/preview?path=${encodeURIComponent(path)}`;
+
+    if (isImage) {
+      previewBody.innerHTML = `<img src="${fileUrl}" style="max-width: 100%; max-height: 70vh; object-fit: contain; border-radius: 4px;" />`;
+    } else if (isVideo) {
+      previewBody.innerHTML = `<video src="${fileUrl}" controls style="max-width: 100%; max-height: 70vh; border-radius: 4px;"></video>`;
+    } else if (isAudio) {
+      previewBody.innerHTML = `<audio src="${fileUrl}" controls style="width: 100%; margin-top: 20px;"></audio>`;
+    } else if (isHtml) {
+      previewBody.innerHTML = `<iframe src="${fileUrl}" style="width: 100%; min-height: 60vh; border: none; background: white; border-radius: 4px;"></iframe>`;
+    } else {
+      const res = await fetch(fileUrl);
+      if (!res.ok) throw new Error('获取预览失败');
+      const text = await res.text();
+      previewBody.innerHTML = '';
+      const pre = document.createElement('pre');
+      pre.textContent = text;
+      pre.style.whiteSpace = 'pre-wrap';
+      pre.style.wordBreak = 'break-all';
+      pre.style.margin = '0';
+      pre.style.fontFamily = "'Fira Code', monospace";
+      pre.style.width = "100%";
+      previewBody.appendChild(pre);
+    }
   } catch (err) {
     alert('预览失败: ' + err.message);
+    previewModal.classList.add('hidden');
   }
 }
 

package/public/index.html

@@ -68,7 +68,7 @@
   <div id="previewModal" class="modal-overlay hidden">
     <div class="modal-content preview-modal-content">
       <h3 id="previewTitle" style="word-break: break-all;">文件预览</h3>
-      <pre class="preview-body" id="previewBody"></pre>
+      <div class="preview-body" id="previewBody" style="display: flex; flex-direction: column; align-items: center; justify-content: center;"></div>
       <div class="modal-actions">
         <button id="previewClose" class="btn-primary">关闭</button>
       </div>

package/server.js

@@ -64,8 +64,7 @@ app.get('/cmd/api/tree', async (req, res) => {
 app.get('/cmd/api/preview', async (req, res) => {
   try {
     const targetPath = getSecurePath(req.query.path);
-    const content = await fs.promises.readFile(targetPath, 'utf8');
-    res.send(content);
+    res.sendFile(targetPath);
   } catch (err) {
     res.status(500).send(err.message);
   }