webinterface/client/js/shared_functions.js

// Alert Box
// Function to show the custom alert with a message and type
export function showAlert(message, type = 'error') {
    const alertBox = document.getElementById('custom-alert');
    const alertMessage = document.getElementById('alert-message');
    const closeButton = document.getElementById('close-alert');

    alertMessage.textContent = message;  // Set the message to display
    alertBox.style.display = 'block';    // Show the alert box

    // Reset previous styles
    alertBox.classList.remove('success', 'error');
    alertBox.classList.add(type);  // Add the appropriate class (success/error)

    // Add event listener to close the alert box
    closeButton.addEventListener('click', () => {
        alertBox.style.display = 'none';  // Hide the alert box when the button is clicked
    });
}

export function showConfirm(message, type = 'error') {
    return new Promise((resolve) => {
        const alertBox = document.getElementById('custom-alert-confirm');
        const alertMessage = document.getElementById('alert-message-confirm');
        const closeButton = document.getElementById('close-alert-confirm');
        const confirmButton = document.getElementById('confirm-alert-confirm');

        alertMessage.textContent = message;  // Set the message to display
        alertBox.style.display = 'block';    // Show the alert box

        // Reset previous styles
        alertBox.classList.remove('success', 'error');
        alertBox.classList.add(type);  // Add the appropriate class (success/error)

        // Display the confirm button
        confirmButton.style.display = 'inline-block';
        closeButton.style.display = 'inline-block';

        // When "Confirm" button is clicked
        confirmButton.addEventListener('click', () => {
            alertBox.style.display = 'none';  // Hide the alert box
            resolve(true);  // Resolve the promise as true (user confirmed)
        });

        // When "Close" button is clicked
        closeButton.addEventListener('click', () => {
            alertBox.style.display = 'none';  // Hide the alert box
            resolve(false);  // Resolve the promise as false (user canceled)
        });
    });
}