Add in Font Awesome Icons for Actions

This commit is contained in:
Raven Scott 2024-11-29 16:40:37 -05:00
parent 4753207c02
commit 76825acb15

48
app.js
View File

@ -145,9 +145,9 @@ function addConnection(topicHex) {
switchConnection(topicId);
}
});
}
}
function disconnectConnection(topicId, connectionItem) {
function disconnectConnection(topicId, connectionItem) {
const connection = connections[topicId];
if (!connection) {
console.error(`[ERROR] No connection found for topicId: ${topicId}`);
@ -205,15 +205,15 @@ function addConnection(topicHex) {
// Refresh the connections view
resetConnectionsView();
}
// Function to reset the container list
function resetContainerList() {
}
// Function to reset the container list
function resetContainerList() {
containerList.innerHTML = ''; // Clear the existing list
console.log('[INFO] Container list cleared.');
}
}
// Function to reset the connections view
function resetConnectionsView() {
// Function to reset the connections view
function resetConnectionsView() {
// Clear the connection list
connectionList.innerHTML = '';
@ -243,7 +243,7 @@ function addConnection(topicHex) {
});
console.log('[INFO] Connections view reset.');
}
}
// Update connection status
function updateConnectionStatus(topicId, isConnected) {
@ -274,7 +274,7 @@ function switchConnection(topicId) {
console.log('[INFO] Sending "listContainers" command');
sendCommand('listContainers');
}
}
// Attach switchConnection to the global window object
window.switchConnection = switchConnection;
@ -312,11 +312,21 @@ function renderContainers(containers) {
<td class="memory">0</td>
<td class="ip-address">-</td>
<td>
<button class="btn btn-success btn-sm action-start" ${container.State === 'running' ? 'disabled' : ''}>Start</button>
<button class="btn btn-warning btn-sm action-stop" ${container.State !== 'running' ? 'disabled' : ''}>Stop</button>
<button class="btn btn-danger btn-sm action-remove">Remove</button>
<button class="btn btn-primary btn-sm action-terminal" ${container.State !== 'running' ? 'disabled' : ''}>Terminal</button>
<button class="btn btn-secondary btn-sm action-duplicate">Duplicate</button>
<button class="btn btn-success btn-sm action-start" ${container.State === 'running' ? 'disabled' : ''}>
<i class="fas fa-play"></i>
</button>
<button class="btn btn-warning btn-sm action-stop" ${container.State !== 'running' ? 'disabled' : ''}>
<i class="fas fa-stop"></i>
</button>
<button class="btn btn-danger btn-sm action-remove">
<i class="fas fa-trash"></i>
</button>
<button class="btn btn-primary btn-sm action-terminal" ${container.State !== 'running' ? 'disabled' : ''}>
<i class="fas fa-terminal"></i>
</button>
<button class="btn btn-secondary btn-sm action-duplicate">
<i class="fas fa-clone"></i>
</button>
</td>
`;
containerList.appendChild(row);
@ -328,7 +338,7 @@ function renderContainers(containers) {
const duplicateBtn = row.querySelector('.action-duplicate');
duplicateBtn.addEventListener('click', () => openDuplicateModal(container));
});
}
}
// Add event listeners to action buttons
@ -380,7 +390,7 @@ function updateContainerStats(stats) {
row.querySelector('.cpu').textContent = stats.cpu.toFixed(2);
row.querySelector('.memory').textContent = (stats.memory / (1024 * 1024)).toFixed(2);
row.querySelector('.ip-address').textContent = stats.ip || '-';
}
}
// Function to open the Duplicate Modal with container configurations
function openDuplicateModal(container) {
@ -411,7 +421,7 @@ function openDuplicateModal(container) {
// Show the modal
duplicateModal.show();
};
}
}
// Handle the Duplicate Container Form Submission
@ -447,7 +457,7 @@ duplicateContainerForm.addEventListener('submit', (e) => {
console.log('[INFO] Fetching updated container list after duplication');
sendCommand('listContainers');
}, 2000); // Wait for duplication to complete
});
});
// Attach startTerminal to the global window object