Flask-Files/app/static/js/common.js

/**
 * Common JavaScript functions used across the application
 */

// Modal handling
function openModal(modalId) {
    const modal = typeof modalId === 'string' ? document.getElementById(modalId) : modalId;
    if (modal) {
        modal.style.display = 'flex';
        document.body.classList.add('modal-open');
    }
}

function closeModal(modalId) {
    const modal = typeof modalId === 'string' ? document.getElementById(modalId) : modalId;
    if (modal) {
        modal.style.display = 'none';
        document.body.classList.remove('modal-open');
    }
}

// Hide all modals on page load
function setupModals() {
    document.querySelectorAll('.modal').forEach(modal => {
        modal.style.display = 'none';
    });

    // Close modals when clicking outside or on close button
    document.addEventListener('click', function (e) {
        if (e.target.classList.contains('modal')) {
            closeModal(e.target);
        } else if (e.target.classList.contains('modal-close') || e.target.classList.contains('modal-cancel')) {
            const modal = e.target.closest('.modal');
            closeModal(modal);
        }
    });

    // Escape key to close modals
    document.addEventListener('keydown', function (e) {
        if (e.key === 'Escape') {
            document.querySelectorAll('.modal.visible').forEach(modal => {
                closeModal(modal);
            });
        }
    });
}

// Alerts
function showAlert(message, type = 'info') {
    // Create alerts container if it doesn't exist
    let alertsContainer = document.querySelector('.alerts');
    if (!alertsContainer) {
        alertsContainer = document.createElement('div');
        alertsContainer.className = 'alerts';
        document.body.appendChild(alertsContainer);
    }

    // Create alert
    const alert = document.createElement('div');
    alert.className = `alert ${type}`;
    alert.innerHTML = `
        <div class="alert-content">${message}</div>
        <button class="close" aria-label="Close">&times;</button>
    `;

    // Add to container
    alertsContainer.appendChild(alert);

    // Setup dismiss
    const closeBtn = alert.querySelector('.close');
    closeBtn.addEventListener('click', function () {
        alert.classList.add('fade-out');
        setTimeout(() => {
            alert.remove();
        }, 300);
    });

    // Auto dismiss
    setTimeout(() => {
        if (alert.parentNode) {
            alert.classList.add('fade-out');
            setTimeout(() => {
                if (alert.parentNode) {
                    alert.remove();
                }
            }, 300);
        }
    }, 5000);
}

// Helper functions
function formatSize(bytes) {
    if (bytes === 0) return '0 Bytes';
    const k = 1024;
    const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
    const i = Math.floor(Math.log(bytes) / Math.log(k));
    return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
}

function formatDate(dateString) {
    if (!dateString) return 'Unknown';
    const date = new Date(dateString);
    return date.toLocaleString();
}

function escapeHtml(unsafe) {
    return unsafe
        .replace(/&/g, "&amp;")
        .replace(/</g, "&lt;")
        .replace(/>/g, "&gt;")
        .replace(/"/g, "&quot;")
        .replace(/'/g, "&#039;");
}

function getFileIconClass(fileName) {
    if (!fileName) return 'fa-file';

    const ext = fileName.split('.').pop().toLowerCase();

    // Images
    if (['jpg', 'jpeg', 'png', 'gif', 'bmp', 'svg', 'webp'].includes(ext)) {
        return 'fa-file-image';
    }
    // Videos
    else if (['mp4', 'avi', 'mov', 'wmv', 'flv', 'mkv'].includes(ext)) {
        return 'fa-file-video';
    }
    // Audio
    else if (['mp3', 'wav', 'ogg', 'flac', 'm4a'].includes(ext)) {
        return 'fa-file-audio';
    }
    // Documents
    else if (['doc', 'docx', 'odt'].includes(ext)) {
        return 'fa-file-word';
    }
    // Spreadsheets
    else if (['xls', 'xlsx', 'ods', 'csv'].includes(ext)) {
        return 'fa-file-excel';
    }
    // Presentations
    else if (['ppt', 'pptx', 'odp'].includes(ext)) {
        return 'fa-file-powerpoint';
    }
    // PDFs
    else if (['pdf'].includes(ext)) {
        return 'fa-file-pdf';
    }
    // Archives
    else if (['zip', 'rar', '7z', 'tar', 'gz', 'bz2'].includes(ext)) {
        return 'fa-file-archive';
    }
    // Text
    else if (['txt', 'rtf', 'md', 'log'].includes(ext)) {
        return 'fa-file-alt';
    }
    // Code
    else if (['html', 'css', 'js', 'php', 'py', 'java', 'c', 'cpp', 'h', 'xml', 'json', 'sql'].includes(ext)) {
        return 'fa-file-code';
    }

    return 'fa-file';
}