diff --git a/index.html b/index.html index 92125e0..7a0dab1 100644 --- a/index.html +++ b/index.html @@ -1,17 +1,18 @@ + Docker P2P Manager - + - + - +
- + - +

Add a Connection

- + - +
@@ -231,18 +262,20 @@
+
- +
- + - + - + + \ No newline at end of file diff --git a/libs/terminal.js b/libs/terminal.js index 90cbc02..a546319 100644 --- a/libs/terminal.js +++ b/libs/terminal.js @@ -6,11 +6,17 @@ const terminalModal = document.getElementById('terminal-modal'); const terminalTitle = document.getElementById('terminal-title'); const terminalContainer = document.getElementById('terminal-container'); const tray = document.getElementById('tray'); +const terminalHeader = document.querySelector('#terminal-modal .header'); // Terminal variables let terminalSessions = {}; // Track terminal sessions per containerId let activeContainerId = null; // Currently displayed containerId +// Variables for resizing +let isResizing = false; +let startY = 0; +let startHeight = 0; + // Kill Terminal button functionality document.getElementById('kill-terminal-btn').onclick = () => { killActiveTerminal(); @@ -39,6 +45,42 @@ function killActiveTerminal() { } } +// Start resizing when the mouse is down on the header +terminalHeader.addEventListener('mousedown', (e) => { + isResizing = true; + startY = e.clientY; // Track the initial Y position + startHeight = terminalModal.offsetHeight; // Track the initial height + document.body.style.cursor = 'ns-resize'; // Change cursor to indicate resizing + e.preventDefault(); // Prevent text selection +}); + +// Resize the modal while dragging +document.addEventListener('mousemove', (e) => { + if (isResizing) { + const deltaY = startY - e.clientY; // Calculate how much the mouse moved + const newHeight = Math.min( + Math.max(startHeight + deltaY, 150), // Minimum height: 150px + window.innerHeight * 0.9 // Maximum height: 90% of viewport height + ); + + terminalModal.style.height = `${newHeight}px`; // Set new height + terminalContainer.style.height = `${newHeight - 40}px`; // Adjust terminal container height + + const activeSession = terminalSessions[activeContainerId]; + if (activeSession) { + setTimeout(() => activeSession.fitAddon.fit(), 10); // Adjust terminal content + } + } +}); + +// Stop resizing when the mouse is released +document.addEventListener('mouseup', () => { + if (isResizing) { + isResizing = false; + document.body.style.cursor = 'default'; // Reset cursor + } +}); + // Start terminal session function startTerminal(containerId, containerName) { if (!window.activePeer) {