57 lines
2.4 KiB
JavaScript
57 lines
2.4 KiB
JavaScript
// js/utils.js
|
|
|
|
// Note: We are 'exporting' each function so other files can import them.
|
|
export const showLoading = (show) => {
|
|
const loadingSpinner = document.getElementById('loading-spinner');
|
|
loadingSpinner.innerHTML = show ? `<div class="inline-block animate-spin rounded-full h-16 w-16 border-t-2 border-b-2 border-blue-500"></div>` : '';
|
|
};
|
|
|
|
// Keep a reference to the timer so we can reset it if a new message appears
|
|
let messageTimer = null;
|
|
|
|
export const showMessage = (message, type = 'success', duration = 4000) => { // duration is 4 seconds
|
|
const messageBox = document.getElementById('message-box');
|
|
|
|
// The HTML for the message itself, using Tailwind classes for styling
|
|
messageBox.innerHTML = `
|
|
<div class="p-4 rounded-lg shadow-xl flex items-center justify-between animate-fade-in-down
|
|
${type === 'error' ? 'bg-red-100 text-red-700' : 'bg-green-100 text-green-700'}"
|
|
role="alert">
|
|
<span>${message}</span>
|
|
<button onclick="this.parentElement.parentElement.classList.add('hidden')"
|
|
class="font-bold text-lg hover:text-black">
|
|
×
|
|
</button>
|
|
</div>`;
|
|
|
|
messageBox.classList.remove('hidden');
|
|
|
|
// Clear any previous timer that might be running
|
|
clearTimeout(messageTimer);
|
|
|
|
// Set a new timer to hide the message box after the specified duration
|
|
messageTimer = setTimeout(() => {
|
|
messageBox.classList.add('hidden');
|
|
}, duration);
|
|
};
|
|
export const formatDecimal = (ms) => ms ? (ms / 3600000).toFixed(2) : '0.00';
|
|
|
|
export const formatDateTime = (s) => s ? new Date(s).toLocaleString(undefined, { month: '2-digit', day: '2-digit', year: '2-digit', hour: 'numeric', minute: '2-digit' }) : 'N/A';
|
|
|
|
export const formatDate = (s) => s ? new Date(s).toLocaleDateString(undefined, { month: '2-digit', day: '2-digit', year: '2-digit' }) : 'N/A';
|
|
|
|
export const toLocalISO = (d) => {
|
|
if (!d) return '';
|
|
const date = new Date(d);
|
|
return new Date(date.getTime() - (date.getTimezoneOffset() * 60000)).toISOString().slice(0, 16);
|
|
};
|
|
|
|
export const formatDuration = (ms) => {
|
|
if (!ms || ms < 0) return '00:00:00';
|
|
const totalSeconds = Math.floor(ms / 1000);
|
|
const h = Math.floor(totalSeconds / 3600);
|
|
const m = Math.floor((totalSeconds % 3600) / 60);
|
|
const s = totalSeconds % 60;
|
|
return `${String(h).padStart(2, '0')}:${String(m).padStart(2, '0')}:${String(s).padStart(2, '0')}`;
|
|
};
|