fuck you, undo that shit

components/footer.js

@@ -1,57 +1 @@
-class CustomFooter extends HTMLElement {
-  connectedCallback() {
-    this.attachShadow({ mode: 'open' });
-    this.shadowRoot.innerHTML = `
-      <style>
-        footer {
-          background: var(--panel-bg-color);
-          color: var(--text-primary);
-padding: 2rem;
-          text-align: center;
-          margin-top: auto;
-        }
-        .footer-content {
-          max-width: 1200px;
-          margin: 0 auto;
-        }
-        .footer-links {
-          display: flex;
-          justify-content: center;
-          gap: 2rem;
-          margin-bottom: 1.5rem;
-        }
-        .footer-links a {
-          color: #93c5fd;
-          text-decoration: none;
-          transition: color 0.2s;
-        }
-        .footer-links a:hover {
-          color: white;
-        }
-        .copyright {
-          font-size: 0.875rem;
-          color: #9ca3af;
-        }
-        @media (max-width: 640px) {
-          .footer-links {
-            flex-direction: column;
-            gap: 1rem;
-          }
-        }
-      </style>
-      <footer>
-        <div class="footer-content">
-          <div class="footer-links">
-            <a href="#"><i data-feather="github"></i> GitHub</a>
-            <a href="#"><i data-feather="file-text"></i> Documentation</a>
-            <a href="#"><i data-feather="mail"></i> Contact</a>
-          </div>
-          <div class="copyright">
-            &copy; ${new Date().getFullYear()} FileMaster Control Panel. All rights reserved.
-          </div>
-        </div>
-      </footer>
-    `;
-  }
-}
-customElements.define('custom-footer', CustomFooter);
+

components/navbar.js

@@ -1,76 +1 @@
-class CustomNavbar extends HTMLElement {
-  connectedCallback() {
-    this.attachShadow({ mode: 'open' });
-    this.shadowRoot.innerHTML = `
-      <style>
-        nav {
-          background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-hover) 100%);
-padding: 1rem 2rem;
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
-          position: relative;
-          z-index: 50;
-        }
-        .logo {
-          color: white;
-          font-weight: bold;
-          font-size: 1.5rem;
-          display: flex;
-          align-items: center;
-          gap: 0.5rem;
-        }
-        .logo-icon {
-          width: 24px;
-          height: 24px;
-        }
-        ul {
-          display: flex;
-          gap: 1.5rem;
-          list-style: none;
-          margin: 0;
-          padding: 0;
-        }
-        a {
-          color: white;
-          text-decoration: none;
-          font-weight: 500;
-          padding: 0.5rem 1rem;
-          border-radius: 0.375rem;
-          transition: background-color 0.2s;
-        }
-        a:hover {
-          background-color: rgba(255, 255, 255, 0.1);
-        }
-        @media (max-width: 640px) {
-          nav {
-            flex-direction: column;
-            padding: 1rem;
-          }
-          ul {
-            margin-top: 1rem;
-            width: 100%;
-            justify-content: space-around;
-          }
-          a {
-            padding: 0.5rem;
-          }
-        }
-      </style>
-      <nav>
-        <div class="logo">
-          <svg class="logo-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path>
-          </svg>
-          <span>FileMaster</span>
-        </div>
-        <ul>
-          <li><a href="#"><i data-feather="home"></i> Home</a></li>
-          <li><a href="#"><i data-feather="help-circle"></i> Documentation</a></li>
-        </ul>
-      </nav>
-    `;
-  }
-}
-customElements.define('custom-navbar', CustomNavbar);
+

index.html

@@ -1,100 +1 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>FileMaster Control Panel</title>
-    <link rel="stylesheet" href="style.css">
-    <script src="https://cdn.tailwindcss.com"></script>
-    <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
-    <script src="https://unpkg.com/feather-icons"></script>
-    <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.globe.min.js"></script>
-    <script src="components/navbar.js"></script>
-    <script src="components/footer.js"></script>
-</head>
-<body class="bg-gray-100 min-h-screen flex flex-col">
-    <custom-navbar></custom-navbar>
-    <main class="flex-grow container mx-auto px-4 py-8">
-        <div id="vanta-bg" class="absolute top-0 left-0 w-full h-full z-0"></div>
-        
-        <div class="relative z-10 max-w-4xl mx-auto">
-            <header class="text-center mb-8">
-                <h1 class="text-4xl font-bold text-primary mb-2">FileMaster Control Panel</h1>
-                <p class="text-xl text-secondary">A client to interact with the File Operations toolkit server</p>
-            </header>
-            
-            <div class="bg-panel-bg-color rounded-xl shadow-lg p-6 mb-8 border border-border-color">
-<div class="mb-6">
-                    <label for="tool-select" class="block text-lg font-medium text-gray-700 mb-2">Select a Tool</label>
-                    <select id="tool-select" class="w-full p-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
-                        <option value="list_files">List Files</option>
-                        <option value="read_file">Read File</option>
-                        <option value="create_file">Create File</option>
-                        <option value="write_file">Write to File</option>
-                        <option value="delete_file">Delete File</option>
-                        <option value="identify_log_errors">Identify Log Errors</option>
-                    </select>
-                    <p id="tool-description" class="mt-2 text-gray-600">Lists files and directories in a given path.</p>
-                </div>
-                
-                <form id="tool-form">
-                    <div id="parameters-container">
-                        <div class="mb-4">
-                            <label for="path" class="block text-sm font-medium text-gray-700 mb-1">Directory Path</label>
-                            <input type="text" id="path" name="path" class="w-full p-2 border border-gray-300 rounded-md" value="C:\temp" required>
-                        </div>
-                    </div>
-                    
-                    <button type="submit" class="w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-4 rounded-lg transition duration-200 flex items-center justify-center">
-                        <span id="submit-text">Run: List Files</span>
-                        <div id="loader" class="hidden ml-2">
-                            <div class="inline-block animate-spin rounded-full h-5 w-5 border-b-2 border-white"></div>
-                        </div>
-                    </button>
-                </form>
-            </div>
-            
-            <div id="status-card" class="hidden bg-blue-50 rounded-xl shadow-lg p-6 mb-8 text-center">
-                <div class="flex justify-center mb-4">
-                    <div class="animate-pulse flex space-x-2">
-                        <div class="h-3 w-3 bg-blue-500 rounded-full"></div>
-                        <div class="h-3 w-3 bg-blue-500 rounded-full"></div>
-                        <div class="h-3 w-3 bg-blue-500 rounded-full"></div>
-                    </div>
-                </div>
-                <p class="text-blue-700">Communicating with FileMaster Server...</p>
-            </div>
-            
-            <div id="error-card" class="hidden bg-red-50 rounded-xl shadow-lg p-6 mb-8">
-                <h2 class="text-xl font-bold text-red-700 mb-2">Error</h2>
-                <pre id="error-message" class="text-red-600 whitespace-pre-wrap"></pre>
-            </div>
-            
-            <div id="result-card" class="hidden bg-green-50 rounded-xl shadow-lg p-6">
-                <h2 id="result-title" class="text-xl font-bold text-green-700 mb-2"></h2>
-                <pre id="result-content" class="text-gray-800 whitespace-pre-wrap"></pre>
-            </div>
-        </div>
-    </main>
-    
-    <custom-footer></custom-footer>
-    
-    <script src="script.js"></script>
-    <script>
-        feather.replace();
-        VANTA.GLOBE({
-            el: "#vanta-bg",
-            mouseControls: true,
-            touchControls: true,
-            gyroControls: false,
-            minHeight: 200.00,
-            minWidth: 200.00,
-            scale: 1.00,
-            scaleMobile: 1.00,
-            color: 0x3b82f6,
-            backgroundColor: 0xf1f5f9
-        });
-    </script>
-<script src="https://huggingface.co/deepsite/deepsite-badge.js"></script>
-</body>
-</html>
+

script.js

@@ -1,186 +1 @@
-// Tool definitions
-const TOOLS = [
-    { 
-        value: 'list_files', 
-        label: 'List Files', 
-        description: 'Lists files and directories in a given path.', 
-        params: [{ name: 'path', type: 'text', label: 'Directory Path' }],
-        color: 'var(--color-primary)'
-    },
-{ 
-        value: 'read_file', 
-        label: 'Read File', 
-        description: 'Reads the content of a specific file.', 
-        params: [{ name: 'path', type: 'text', label: 'File Path' }] 
-    },
-    { 
-        value: 'create_file', 
-        label: 'Create File', 
-        description: 'Creates a new file with optional content.', 
-        params: [
-            { name: 'path', type: 'text', label: 'New File Path' }, 
-            { name: 'content', type: 'textarea', label: 'Initial Content (optional)' }
-        ] 
-    },
-    { 
-        value: 'write_file', 
-        label: 'Write to File', 
-        description: 'Writes content to a file, creating a backup first.', 
-        params: [
-            { name: 'path', type: 'text', label: 'File Path' }, 
-            { name: 'content', type: 'textarea', label: 'New Content' }
-        ] 
-    },
-    { 
-        value: 'delete_file', 
-        label: 'Delete File', 
-        description: 'Deletes a specific file.', 
-        params: [{ name: 'path', type: 'text', label: 'File to Delete' }] 
-    },
-    { 
-        value: 'identify_log_errors', 
-        label: 'Identify Log Errors', 
-        description: 'Scans a log file for common error messages.', 
-        params: [{ name: 'log_file_path', type: 'text', label: 'Log File Path' }] 
-    }
-];
 
-// DOM elements
-const toolSelect = document.getElementById('tool-select');
-const toolDescription = document.getElementById('tool-description');
-const parametersContainer = document.getElementById('parameters-container');
-const toolForm = document.getElementById('tool-form');
-const submitText = document.getElementById('submit-text');
-const loader = document.getElementById('loader');
-const statusCard = document.getElementById('status-card');
-const errorCard = document.getElementById('error-card');
-const errorMessage = document.getElementById('error-message');
-const resultCard = document.getElementById('result-card');
-const resultTitle = document.getElementById('result-title');
-const resultContent = document.getElementById('result-content');
-
-// Current tool state
-let currentTool = TOOLS[0];
-let parameters = { path: 'C:\\temp' };
-
-// Initialize the form
-function initializeForm() {
-    // Set initial tool description
-    toolDescription.textContent = currentTool.description;
-    
-    // Set initial submit button text
-    submitText.textContent = `Run: ${currentTool.label}`;
-    
-    // Build parameters UI
-    buildParametersUI();
-}
-
-// Build parameters UI based on current tool
-function buildParametersUI() {
-    parametersContainer.innerHTML = '';
-    
-    currentTool.params.forEach(param => {
-        const div = document.createElement('div');
-        div.className = 'mb-4';
-        
-        const label = document.createElement('label');
-        label.className = 'block text-sm font-medium text-gray-700 mb-1';
-        label.htmlFor = param.name;
-        label.textContent = param.label;
-        
-        let input;
-        
-        if (param.type === 'textarea') {
-            input = document.createElement('textarea');
-            input.className = 'w-full p-2 border border-gray-300 rounded-md';
-            input.id = param.name;
-            input.name = param.name;
-            input.value = parameters[param.name] || '';
-        } else {
-            input = document.createElement('input');
-            input.type = 'text';
-            input.className = 'w-full p-2 border border-gray-300 rounded-md';
-            input.id = param.name;
-            input.name = param.name;
-            input.value = parameters[param.name] || '';
-        }
-        
-        input.required = true;
-        
-        div.appendChild(label);
-        div.appendChild(input);
-        parametersContainer.appendChild(div);
-        
-        // Add event listener to update parameters state
-        input.addEventListener('input', (e) => {
-            parameters[param.name] = e.target.value;
-        });
-    });
-}
-
-// Handle tool selection change
-toolSelect.addEventListener('change', (e) => {
-    const toolValue = e.target.value;
-    currentTool = TOOLS.find(tool => tool.value === toolValue);
-    
-    // Update UI
-    toolDescription.textContent = currentTool.description;
-    submitText.textContent = `Run: ${currentTool.label}`;
-    
-    // Reset parameters
-    parameters = {};
-    
-    // Rebuild parameters UI
-    buildParametersUI();
-});
-
-// Handle form submission
-toolForm.addEventListener('submit', async (e) => {
-    e.preventDefault();
-    
-    // Show loading state
-    loader.classList.remove('hidden');
-    submitText.textContent = 'Running...';
-    statusCard.classList.remove('hidden');
-    errorCard.classList.add('hidden');
-    resultCard.classList.add('hidden');
-    
-    const invocation_id = `filemaster-ui-${Date.now()}`;
-    const endpoint = `http://127.0.0.1:8000/mcp/invoke/${currentTool.value}`;
-    
-    try {
-        const res = await fetch(endpoint, {
-            method: 'POST',
-            headers: { 'Content-Type': 'application/json' },
-            body: JSON.stringify({
-                tool_name: currentTool.value,
-                invocation_id,
-                parameters,
-            }),
-        });
-        
-        const data = await res.json();
-        
-        if (!res.ok || data.result?.status === 'error') {
-            throw new Error(data.result?.message || `Server responded with status: ${res.status}`);
-        }
-        
-        // Show success result
-        resultTitle.textContent = `Result for Invocation: ${data.invocation_id}`;
-        resultContent.textContent = JSON.stringify(data.result, null, 2);
-        resultCard.classList.remove('hidden');
-        
-    } catch (err) {
-        // Show error
-        errorMessage.textContent = err instanceof Error ? err.message : 'An unknown error occurred.';
-        errorCard.classList.remove('hidden');
-    } finally {
-        // Hide loading state
-        loader.classList.add('hidden');
-        submitText.textContent = `Run: ${currentTool.label}`;
-        statusCard.classList.add('hidden');
-    }
-});
-
-// Initialize the app
-initializeForm();

style.css

@@ -1,82 +1 @@
-@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
-:root {
-  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-  --font-mono: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace;
 
-  --bg-color: #111827;
-  --panel-bg-color: #1f2937;
-  --input-bg-color: #111827;
-  --modal-bg-color: #1f2937;
-  
-  --border-color: #374151;
-  --border-color-focus: #10b981;
-
-  --text-primary: #f3f4f6;
-  --text-secondary: #9ca3af;
-  --text-muted: #6b7285;
-
-  --color-primary: #10b981;
-  --color-primary-hover: #10f9b1;
-  --color-secondary: #22d3ee;
-  --color-secondary-hover: #67e8f9;
-  --color-tertiary: #facc15;
-  --color-quaternary: #a78bfa;
-  --color-danger: #f87171;
-  --color-orange: #f97316;
-  
-  --win-item-hover-bg: rgba(255, 255, 255, 0.08);
-}
-
-body {
-    font-family: var(--font-sans);
-    background-color: var(--bg-color);
-    color: var(--text-primary);
-}
-
-#vanta-bg {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    z-index: -1;
-    opacity: 0.1;
-}
-pre {
-    background-color: var(--input-bg-color);
-    padding: 1rem;
-    border-radius: 0.5rem;
-    overflow-x: auto;
-    border: 1px solid var(--border-color);
-    color: var(--text-primary);
-}
-
-textarea {
-    min-height: 150px;
-    resize: vertical;
-    background-color: var(--input-bg-color);
-    border: 1px solid var(--border-color);
-    color: var(--text-primary);
-}
-
-.button {
-    background-color: var(--color-primary);
-    color: white;
-    border: none;
-    padding: 0.5rem 1rem;
-    border-radius: 0.5rem;
-    cursor: pointer;
-    transition: background-color 0.2s;
-}
-
-.button:hover {
-    background-color: var(--color-primary-hover);
-}
-@keyframes spin {
-    from { transform: rotate(0deg); }
-    to { transform: rotate(360deg); }
-}
-
-.animate-spin {
-    animation: spin 1s linear infinite;
-}