Moved toast notification to general files

This commit is contained in:
Szymon Porwolik
2025-10-30 22:40:59 +01:00
parent a260376365
commit 20395a8884
4 changed files with 42 additions and 43 deletions

View File

@@ -3989,6 +3989,7 @@ if (isset($scripts) && is_array($scripts)){
}
}
?>
<!-- Toast Notification - used by showToast() from common.js -->
<div id="toast-container" class="position-fixed top-0 end-0 p-3" style="z-index: 1100;"></div>
</body>
</html>

View File

@@ -892,9 +892,6 @@ if (typeof window.DX_WATERFALL_FIELD_MAP === 'undefined') {
</div>
<!-- Toast Notification : TBD move to footer -->
<div id="toast-container" class="position-fixed bottom-0 end-0 p-3" style="z-index: 1100;"></div>
<script>
var station_callsign = "<?php echo $station_callsign; ?>";
</script>

View File

@@ -1281,6 +1281,46 @@ function shareModal(qso_data) {
});
}
// Show Bootstrap Toast
function showToast(title, text, type = 'bg-success text-white', delay = 3000) {
/*
Examples:
showToast('Saved', 'Your data was saved!', 'bg-success text-white', 3000);
showToast('Error', 'Failed to connect to server.', 'bg-danger text-white', 5000);
showToast('Warning', 'Please check your input.', 'bg-warning text-dark', 4000);
showToast('Info', 'System will restart soon.', 'bg-info text-dark', 4000);
*/
const container = document.getElementById('toast-container');
// Create toast element
const toastEl = document.createElement('div');
toastEl.className = `toast align-items-center ${type}`;
toastEl.setAttribute('role', 'alert');
toastEl.setAttribute('aria-live', 'assertive');
toastEl.setAttribute('aria-atomic', 'true');
toastEl.setAttribute('data-bs-delay', delay);
// Toast inner HTML
toastEl.innerHTML = `
<div class="d-flex">
<div class="toast-body">
<strong>${title}</strong><br>${text}
</div>
<button type="button" class="btn-close btn-close-white me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
`;
// Append and show
container.appendChild(toastEl);
const bsToast = new bootstrap.Toast(toastEl);
bsToast.show();
// Remove from DOM when hidden
toastEl.addEventListener('hidden.bs.toast', () => toastEl.remove());
}
console.log("Ready to unleash your coding prowess and join the fun?\n\n" +
"Check out our GitHub Repository and dive into the coding adventure:\n\n" +
"🚀 https://www.github.com/wavelog/wavelog");

View File

@@ -35,45 +35,6 @@ function resetTimers(qso_manual) {
}
}
// Show Bootstrap Toast - TBD move to general JS file
function showToast(title, text, type = 'bg-success text-white', delay = 3000) {
/*
Examples:
showToast('Saved', 'Your data was saved!', 'bg-success text-white', 3000);
showToast('Error', 'Failed to connect to server.', 'bg-danger text-white', 5000);
showToast('Warning', 'Please check your input.', 'bg-warning text-dark', 4000);
showToast('Info', 'System will restart soon.', 'bg-info text-dark', 4000);
*/
const container = document.getElementById('toast-container');
// Create toast element
const toastEl = document.createElement('div');
toastEl.className = `toast align-items-center ${type}`;
toastEl.setAttribute('role', 'alert');
toastEl.setAttribute('aria-live', 'assertive');
toastEl.setAttribute('aria-atomic', 'true');
toastEl.setAttribute('data-bs-delay', delay);
// Toast inner HTML
toastEl.innerHTML = `
<div class="d-flex">
<div class="toast-body">
<strong>${title}</strong><br>${text}
</div>
<button type="button" class="btn-close btn-close-white me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
`;
// Append and show
container.appendChild(toastEl);
const bsToast = new bootstrap.Toast(toastEl);
bsToast.show();
// Remove from DOM when hidden
toastEl.addEventListener('hidden.bs.toast', () => toastEl.remove());
}
function getUTCTimeStamp(el) {
var now = new Date();
$(el).attr('value', ("0" + now.getUTCHours()).slice(-2) + ':' + ("0" + now.getUTCMinutes()).slice(-2) + ':' + ("0" + now.getUTCSeconds()).slice(-2));