pi_admin/templates/index.html aktualisiert

pi_admin/templates/index.html

@@ -25,6 +25,45 @@
         </div>
     </div>
 
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/xterm@5.1.0/css/xterm.css" />
+<script src="https://cdn.jsdelivr.net/npm/xterm@5.1.0/lib/xterm.js"></script>
+
+<div class="flex flex-col h-full">
+    <div class="flex flex-1 overflow-hidden">
+        </div>
+
+    <div class="h-1/3 border-t border-gray-600 bg-black flex">
+        <div id="install-log" class="w-1/2 p-2 text-xs font-mono overflow-y-auto text-green-400 border-r border-gray-700">
+            > System bereit. Warte auf Befehle...
+        </div>
+        
+        <div id="terminal" class="w-1/2"></div>
+    </div>
+</div>
+
+    <script>
+        // Xterm.js Initialisierung
+        const term = new Terminal({ theme: { background: '#000' }, cursorBlink: true });
+        term.open(document.getElementById('terminal'));
+        term.write('Verfügbare Terminals: Wähle einen Node aus...\r\n');
+
+        // WebSocket für Installation-Logs
+        const logWs = new WebSocket(`ws://${location.host}/ws/install_logs`);
+        logWs.onmessage = (event) => {
+            const logDiv = document.getElementById('install-log');
+            logDiv.innerHTML += `<div>${event.data}</div>`;
+            logDiv.scrollTop = logDiv.scrollHeight;
+        };
+
+        function startInstallation(ip, user, pass) {
+            // Diese Funktion wird gerufen, wenn ein neuer Node hinzugefügt wird
+            fetch('/api/setup_node', {
+                method: 'POST', 
+                body: JSON.stringify({ip, user, pass})
+            });
+        }
+    </script>
+    
     <script>
         const ws = new WebSocket(`ws://${location.host}/ws/chat`);
         const chatWindow = document.getElementById('chat-window');