templates/index.html aktualisiert

templates/index.html

@@ -120,13 +120,18 @@
     </div>
 
     <script>
+        let termDataDisposable = null;
         document.addEventListener('DOMContentLoaded', function() {
             // 1. GridStack Initialisierung
             var grid = GridStack.init({
                 cellHeight: 80,
                 margin: 10,
                 float: true,
-                handle: '.widget-header'
+                handle: '.widget-header',
+
+                resizable: {
+                    handles: 'all'
+                }
             });
 
             // Layout speichern/laden
@@ -191,12 +196,40 @@
 
             // 5. Node Funktionen
             window.openTerminal = function(ip) {
-                if(window.termWs) window.termWs.close();
+
+                // alte websocket schließen
+                if (window.termWs) {
+                    window.termWs.close();
+                    window.termWs = null;
+                }
+
+                // alten onData listener entfernen ✅
+                if (termDataDisposable) {
+                    termDataDisposable.dispose();
+                    termDataDisposable = null;
+                }
+
                 term.clear();
                 term.write(`\r\n\x1b[34m>>> Verbinde mit ${ip}...\x1b[0m\r\n`);
+
                 window.termWs = new WebSocket(`ws://${location.host}/ws/terminal/${ip}`);
-                window.termWs.onmessage = (ev) => term.write(ev.data);
+
-                term.onData(data => { if(window.termWs) window.termWs.send(data); });
+                window.termWs.onmessage = (ev) => {
+                    term.write(ev.data);
+                };
+
+                window.termWs.onclose = () => {
+                    term.write("\r\n\x1b[31m[Session beendet]\x1b[0m\r\n");
+                };
+
+                // NEUEN listener registrieren
+                termDataDisposable = term.onData(data => {
+                    if (window.termWs &&
+                        window.termWs.readyState === WebSocket.OPEN) {
+                        window.termWs.send(data);
+                    }
+                });
+
                 setTimeout(() => window.fitAddon.fit(), 100);
             };