// loading-start.js - Загружается первым в <head>
(function() {
    // Конфигурация
    const CONFIG = {
        maxRetries: 3,
        retryDelay: 2000,
        timeout: 10000,
        showWarnings: true,
        maxLoadingTime: 15000, // Максимум 15 секунд
        minLoadingTime: 5000    // Минимум 5 секунд
    };
    
    // Генерация случайных цветов для градиента
    function getRandomGradient() {
        // Базовая палитра цветов для школы/образования
        const colorPalettes = [
            // Сине-фиолетовая гамма
            { start: '#667eea', end: '#764ba2' },
            { start: '#6B73FF', end: '#000DFF' },
            { start: '#5f72bd', end: '#9b23ea' },
            
            // Зелено-голубая гамма
            { start: '#11998e', end: '#38ef7d' },
            { start: '#0BA360', end: '#3CBBB2' },
            { start: '#1D976C', end: '#93F9B9' },
            
            // Оранжево-розовая гамма
            { start: '#f46b45', end: '#eea849' },
            { start: '#FF512F', end: '#DD2476' },
            { start: '#F09819', end: '#EDDE5D' },
            
            // Красная гамма
            { start: '#cb2d3e', end: '#ef473a' },
            { start: '#FF416C', end: '#FF4B2B' },
            { start: '#DC2424', end: '#4A569D' },
            
            // Фиолетовая гамма
            { start: '#8E2DE2', end: '#4A00E0' },
            { start: '#A770EF', end: '#CF8BF3' },
            { start: '#7F00FF', end: '#E100FF' },
            
            // Морская гамма
            { start: '#00B4DB', end: '#0083B0' },
            { start: '#00C9FF', end: '#92FE9D' },
            { start: '#1FA2FF', end: '#12D8FA' },
            
            // Осенняя гамма
            { start: '#FC4A1A', end: '#F7B733' },
            { start: '#ED213A', end: '#93291E' },
            { start: '#F12711', end: '#F5AF19' },
            
            // Ночная гамма
            { start: '#141E30', end: '#243B55' },
            { start: '#0F2027', end: '#203A43' },
            { start: '#1c1c1c', end: '#3a3a3a' },
            
            // Пастельная гамма
            { start: '#a8c0ff', end: '#3f2b96' },
            { start: '#c84e89', end: '#F15F79' },
            { start: '#b993d0', end: '#8ca6db' },
            
            // Школьная гамма
            { start: '#56ab2f', end: '#a8e063' },
            { start: '#1D976C', end: '#93F9B9' },
            { start: '#4CA1AF', end: '#2C3E50' }
        ];
        
        // Случайная палитра
        const palette = colorPalettes[Math.floor(Math.random() * colorPalettes.length)];
        
        // Случайное смещение градиента
        const directions = [
            '135deg', '90deg', '45deg', '180deg', '225deg', '270deg', '315deg'
        ];
        const direction = directions[Math.floor(Math.random() * directions.length)];
        
        return {
            background: `linear-gradient(${direction}, ${palette.start}, ${palette.end})`,
            start: palette.start,
            end: palette.end,
            direction: direction
        };
    }
    
    // Генерация случайного цвета для прогресс-бара
    function getRandomProgressColor() {
        const colors = [
            '#fff', '#ffd700', '#00ff87', '#00ffff', '#ff69b4', '#ffa500',
            '#ff6b6b', '#4ecdc4', '#45b7d1', '#96ceb4', '#ffeaa7', '#dfe6e9'
        ];
        return colors[Math.floor(Math.random() * colors.length)];
    }
    
    // Генерация случайного цвета для текста
    function getRandomTextColor() {
        const colors = [
            'white', '#f0f0f0', '#ffeaa7', '#dfe6e9', '#b2bec3', '#ffffff'
        ];
        return colors[Math.floor(Math.random() * colors.length)];
    }
    
    // Получаем случайные цвета для этой загрузки
    const gradientColors = getRandomGradient();
    const progressColor = getRandomProgressColor();
    const textColor = getRandomTextColor();
    const accentColor = getRandomProgressColor();
    
    // Статусы для динамического отображения
    const LOADING_STATUSES = [
        { emoji: '📦', text: 'Загрузка компонентов...', weight: 10 },
        { emoji: '🔧', text: 'Настройка модулей...', weight: 15 },
        { emoji: '⚙️', text: 'Инициализация системы...', weight: 20 },
        { emoji: '🔌', text: 'Подключение к серверу...', weight: 25 },
        { emoji: '📊', text: 'Загрузка данных...', weight: 30 },
        { emoji: '🧩', text: 'Сборка интерфейса...', weight: 35 },
        { emoji: '🎨', text: 'Отрисовка элементов...', weight: 40 },
        { emoji: '🔐', text: 'Проверка безопасности...', weight: 45 },
        { emoji: '📁', text: 'Загрузка файлов...', weight: 50 },
        { emoji: '🔄', text: 'Синхронизация...', weight: 55 },
        { emoji: '🧪', text: 'Тестирование модулей...', weight: 60 },
        { emoji: '📝', text: 'Подготовка задач...', weight: 65 },
        { emoji: '👥', text: 'Загрузка пользователей...', weight: 70 },
        { emoji: '📅', text: 'Обновление календаря...', weight: 75 },
        { emoji: '🔔', text: 'Настройка уведомлений...', weight: 80 },
        { emoji: '💾', text: 'Сохранение кэша...', weight: 85 },
        { emoji: '✨', text: 'Финальная обработка...', weight: 90 },
        { emoji: '🚀', text: 'Запуск приложения...', weight: 95 },
        { emoji: '✅', text: 'Почти готово...', weight: 98 }
    ];
    
    // Дополнительные случайные статусы
    const RANDOM_STATUSES = [
        { emoji: '☕', text: 'Наливаем кофе...' },
        { emoji: '🧹', text: 'Подметаем баги...' },
        { emoji: '🎮', text: 'Играем в косынку...' },
        { emoji: '📚', text: 'Читаем документацию...' },
        { emoji: '🎵', text: 'Включаем музыку...' },
        { emoji: '🧘', text: 'Медитируем...' },
        { emoji: '🏋️', text: 'Качаем бицепс...' },
        { emoji: '🍕', text: 'Заказываем пиццу...' },
        { emoji: '🌴', text: 'Улетаем в отпуск...' },
        { emoji: '🎪', text: 'Устраиваем цирк...' },
        { emoji: '🎭', text: 'Играем спектакль...' },
        { emoji: '🎯', text: 'Целимся в баги...' },
        { emoji: '🎲', text: 'Бросаем кубик...' },
        { emoji: '🎰', text: 'Крутим барабан...' },
        { emoji: '🦄', text: 'Ловим единорога...' },
        { emoji: '🌈', text: 'Красим радугу...' },
        { emoji: '🪄', text: 'Колдуем...' },
        { emoji: '🎩', text: 'Достаем кролика...' },
        { emoji: '🕯️', text: 'Зажигаем свечи...' },
        { emoji: '🔮', text: 'Гадаем на баги...' }
    ];
    
    // Функция для инициализации после загрузки DOM
    function initializeLoadingOverlay() {
        // Проверяем, существует ли уже оверлей
        if (document.getElementById('loading-overlay')) {
            return;
        }
        
        // Создаем контейнер для анимации загрузки
        const loadingOverlay = document.createElement('div');
        loadingOverlay.id = 'loading-overlay';
        loadingOverlay.innerHTML = `
            <div class="loading-container">
                <div class="loading-spinner">
                    <div class="spinner" id="loading-spinner"></div>
                </div>
                <div class="loading-text">
                    <h2 id="loading-title">School CRM</h2>
                    <p>Загрузка сервиса управления задачами...</p>
                    <div class="loading-progress">
                        <div class="progress-bar" id="loading-progress-bar"></div>
                    </div>
                    <div class="loading-status" id="loading-status">
                        <span class="status-icon">📦</span> Инициализация...
                    </div>
                    <div class="loading-percent" id="loading-percent">0%</div>
                    <div class="loading-details" id="loading-details"></div>
                </div>
                <div class="loading-footer">
                    <p>МАОУ - СОШ № 25 | Версия 0.9</p>
                    <p class="loading-tip" id="loading-tip"></p>
                </div>
            </div>
        `;
        
        // Добавляем стили для анимации со случайными цветами
        const styles = document.createElement('style');
        styles.textContent = `
            #loading-overlay {
                position: fixed;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: ${gradientColors.background};
                display: flex;
                justify-content: center;
                align-items: center;
                z-index: 9999;
                font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
                transition: opacity 0.5s ease-out;
            }
            
            #loading-overlay.fade-out {
                opacity: 0;
            }
            
            .loading-container {
                text-align: center;
                color: ${textColor};
                max-width: 500px;
                width: 90%;
                padding: 40px;
                background: rgba(255, 255, 255, 0.15);
                border-radius: 20px;
                backdrop-filter: blur(10px);
                box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
                animation: slideUp 0.8s ease-out;
                border: 1px solid rgba(255, 255, 255, 0.2);
            }
            
            @keyframes slideUp {
                from {
                    transform: translateY(50px);
                    opacity: 0;
                }
                to {
                    transform: translateY(0);
                    opacity: 1;
                }
            }
            
            .loading-spinner {
                margin-bottom: 30px;
            }
            
            .spinner {
                width: 80px;
                height: 80px;
                margin: 0 auto;
                border: 5px solid rgba(255, 255, 255, 0.2);
                border-radius: 50%;
                border-top-color: ${progressColor};
                border-left-color: ${accentColor};
                border-right-color: ${accentColor};
                animation: spin 1s ease-in-out infinite;
                box-shadow: 0 0 20px ${progressColor}40;
            }
            
            @keyframes spin {
                0% { transform: rotate(0deg); }
                100% { transform: rotate(360deg); }
            }
            
            .loading-text h2 {
                font-size: 32px;
                margin: 0 0 15px;
                text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
                letter-spacing: 2px;
                background: linear-gradient(135deg, ${textColor}, ${progressColor});
                -webkit-background-clip: text;
                -webkit-text-fill-color: transparent;
                background-clip: text;
            }
            
            .loading-text p {
                font-size: 18px;
                margin: 0 0 30px;
                opacity: 0.9;
                color: ${textColor};
            }
            
            .loading-progress {
                width: 100%;
                height: 12px;
                background: rgba(255, 255, 255, 0.15);
                border-radius: 6px;
                margin: 20px 0;
                overflow: hidden;
                box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
            }
            
            .progress-bar {
                width: 0%;
                height: 100%;
                background: linear-gradient(90deg, ${progressColor}, ${accentColor}, ${progressColor});
                border-radius: 6px;
                transition: width 0.3s ease;
                animation: progressPulse 2s ease-in-out infinite;
                background-size: 200% 100%;
            }
            
            @keyframes progressPulse {
                0%, 100% { opacity: 1; background-position: 0% 50%; }
                50% { opacity: 0.8; background-position: 100% 50%; }
            }
            
            .loading-status {
                font-size: 18px;
                margin: 15px 0;
                min-height: 28px;
                font-weight: 500;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                color: ${textColor};
                text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
            }
            
            .loading-percent {
                font-size: 42px;
                font-weight: bold;
                margin: 10px 0;
                text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.3);
                background: linear-gradient(135deg, ${textColor}, ${progressColor});
                -webkit-background-clip: text;
                -webkit-text-fill-color: transparent;
                background-clip: text;
                animation: percentPulse 1.5s ease-in-out infinite;
            }
            
            @keyframes percentPulse {
                0%, 100% { transform: scale(1); }
                50% { transform: scale(1.05); }
            }
            
            .loading-details {
                font-size: 13px;
                margin-top: 15px;
                opacity: 0.8;
                min-height: 20px;
                color: ${textColor};
                background: rgba(255, 255, 255, 0.1);
                padding: 8px 15px;
                border-radius: 20px;
                display: inline-block;
            }
            
            .loading-footer {
                margin-top: 30px;
                font-size: 14px;
                opacity: 0.8;
                color: ${textColor};
            }
            
            .loading-footer p {
                margin: 5px 0;
                color: ${textColor};
            }
            
            .loading-tip {
                font-size: 13px;
                font-style: italic;
                color: ${textColor};
                animation: fadeInOut 3s ease-in-out infinite;
                background: rgba(255, 255, 255, 0.1);
                padding: 5px 15px;
                border-radius: 20px;
                margin-top: 10px;
            }
            
            @keyframes fadeInOut {
                0%, 100% { opacity: 0.7; transform: translateY(0); }
                50% { opacity: 1; transform: translateY(-2px); }
            }
            
            .status-icon {
                display: inline-block;
                animation: bounce 1s ease infinite;
                filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
            }
            
            @keyframes bounce {
                0%, 100% { transform: translateY(0); }
                50% { transform: translateY(-5px); }
            }
            
            .retry-button {
                background: rgba(255, 255, 255, 0.2);
                border: 2px solid ${textColor};
                color: ${textColor};
                padding: 12px 30px;
                border-radius: 30px;
                cursor: pointer;
                font-size: 16px;
                margin-top: 20px;
                transition: all 0.3s ease;
                font-weight: bold;
                text-transform: uppercase;
                letter-spacing: 1px;
                box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
            }
            
            .retry-button:hover {
                background: ${progressColor};
                color: ${gradientColors.start};
                transform: scale(1.05);
                border-color: ${progressColor};
                box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
            }
            
            .warning {
                color: #ffd700;
                text-shadow: 0 0 10px #ffd700;
            }
            
            .error {
                color: #ff6b6b;
                text-shadow: 0 0 10px #ff6b6b;
            }
            
            .progress-dots {
                display: inline-block;
                min-width: 30px;
            }
            
            .progress-dots:after {
                content: '...';
                animation: dots 1.5s steps(4, end) infinite;
                font-weight: bold;
                letter-spacing: 2px;
            }
            
            @keyframes dots {
                0%, 20% { content: ''; }
                40% { content: '.'; }
                60% { content: '..'; }
                80%, 100% { content: '...'; }
            }
            
            /* Добавляем случайные частицы для эффекта */
            .loading-container::before {
                content: '';
                position: absolute;
                top: -50%;
                left: -50%;
                width: 200%;
                height: 200%;
                background: radial-gradient(circle, ${progressColor}20 1px, transparent 1px);
                background-size: 50px 50px;
                animation: particles 20s linear infinite;
                opacity: 0.1;
                pointer-events: none;
            }
            
            @keyframes particles {
                from { transform: rotate(0deg); }
                to { transform: rotate(360deg); }
            }
        `;
        
        // Добавляем элементы в DOM с проверкой
        if (document.head) {
            document.head.appendChild(styles);
        } else {
            document.addEventListener('DOMContentLoaded', () => {
                document.head.appendChild(styles);
            });
        }
        
        if (document.body) {
            document.body.appendChild(loadingOverlay);
        } else {
            document.addEventListener('DOMContentLoaded', () => {
                document.body.appendChild(loadingOverlay);
            });
        }
        
        // Логируем использованные цвета
        console.log('🎨 Случайные цвета загрузки:', {
            gradient: gradientColors,
            progress: progressColor,
            accent: accentColor,
            text: textColor
        });
    }
    
    // Инициализируем оверлей после загрузки DOM
    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', initializeLoadingOverlay);
    } else {
        initializeLoadingOverlay();
    }
    
    // Массив полезных советов
    const TIPS = [
        '💡 Совет: Используйте фильтры для быстрого поиска задач',
        '💡 Совет: Можно прикреплять до 15 файлов к задаче',
        '💡 Совет: Настраивайте уведомления в личном кабинете',
        '💡 Совет: Используйте Канбан-доску для визуализации задач',
        '💡 Совет: Отмечайте важные задачи цветными метками',
        '💡 Совет: Следите за просроченными задачами в отдельной вкладке',
        '💡 Совет: Создавайте шаблоны для частых типов задач',
        '💡 Совет: Используйте поиск для быстрого доступа к задачам',
        '💡 Совет: Комментируйте задачи для уточнения деталей',
        '💡 Совет: Прикрепляйте скриншоты к задачам в ИТ-отдел',
        '💡 Совет: Проверяйте уведомления на email ежедневно',
        '💡 Совет: Архивируйте выполненные задачи для чистоты списка',
        '🌟 Факт: Сегодняшний градиент - один из 30 возможных',
        '🎨 Факт: Цвета загрузки уникальны для каждого обновления',
        '🌈 Факт: У вас сегодня особенная цветовая схема'
    ];
    
    // Счетчик загруженных скриптов
    window.loadingScripts = {
        total: 0,
        loaded: 0,
        errors: [],
        retryCounts: {},
        startTime: Date.now(),
        scripts: [],
        animationInterval: null,
        tipInterval: null,
        loadingComplete: false,
        minTimeElapsed: false,
        
        updateProgress: function() {
            const percent = Math.min(Math.round((this.loaded / this.total) * 100), 100);
            const progressBar = document.getElementById('loading-progress-bar');
            const percentDisplay = document.getElementById('loading-percent');
            const statusDisplay = document.getElementById('loading-status');
            const detailsDisplay = document.getElementById('loading-details');
            
            if (progressBar) progressBar.style.width = percent + '%';
            if (percentDisplay) percentDisplay.textContent = percent + '%';
            
            // Обновляем статус в зависимости от процента загрузки
            if (statusDisplay) {
                if (this.errors.length > 0) {
                    statusDisplay.innerHTML = '<span class="status-icon warning">⚠️</span> Проблемы с загрузкой. Пытаемся восстановить...';
                } else {
                    // Находим подходящий статус по проценту загрузки
                    const currentStatus = LOADING_STATUSES.find(s => s.weight >= percent) || LOADING_STATUSES[LOADING_STATUSES.length - 1];
                    statusDisplay.innerHTML = `<span class="status-icon">${currentStatus.emoji}</span> ${currentStatus.text} <span class="progress-dots"></span>`;
                }
            }
            
            // Обновляем детальную информацию
            if (detailsDisplay) {
                const loadedScripts = this.loaded;
                const totalScripts = this.total;
                const errors = this.errors.length;
                const timeElapsed = ((Date.now() - this.startTime) / 1000).toFixed(1);
                
                let detailsHtml = `📊 ${loadedScripts}/${totalScripts} модулей • ⏱️ ${timeElapsed}с`;
                
                if (errors > 0) {
                    detailsHtml += `<br><span class="warning">⚠️ Ошибок: ${errors}</span>`;
                }
                
                detailsDisplay.innerHTML = detailsHtml;
            }
            
            // Проверяем, все ли скрипты загружены
            if (this.loaded >= this.total && this.total > 0 && !this.loadingComplete) {
                this.loadingComplete = true;
                this.checkAndFinishLoading();
            }
        },
        
        checkAndFinishLoading: function() {
            const elapsed = Date.now() - this.startTime;
            
            // Если прошло минимум 5 секунд, завершаем загрузку
            if (elapsed >= CONFIG.minLoadingTime) {
                this.finishLoading();
            } else {
                // Иначе ждем оставшееся время
                const remainingTime = CONFIG.minLoadingTime - elapsed;
                
                // Показываем сообщение о финальной подготовке
                const statusDisplay = document.getElementById('loading-status');
                if (statusDisplay) {
                    statusDisplay.innerHTML = '<span class="status-icon">✨</span> Финальная подготовка интерфейса... <span class="progress-dots"></span>';
                }
                
                setTimeout(() => {
                    this.finishLoading();
                }, remainingTime);
            }
        },
        
        startDynamicLoading: function() {
            // Запускаем анимацию прогресса
            let fakePercent = 0;
            const startTime = Date.now();
            
            this.animationInterval = setInterval(() => {
                const elapsed = Date.now() - startTime;
                const realPercent = Math.min(Math.round((this.loaded / this.total) * 100), 100);
                
                // Рассчитываем фейковый процент на основе реального и времени
                if (elapsed < CONFIG.maxLoadingTime && !this.loadingComplete) {
                    // Фейковый процент растет медленнее к концу
                    const timePercent = (elapsed / CONFIG.maxLoadingTime) * 100;
                    fakePercent = Math.min(
                        Math.max(realPercent, Math.floor(timePercent * 0.7 + Math.random() * 10)),
                        99 // Никогда не достигаем 100% фейком
                    );
                } else {
                    // Если загрузка завершена или прошло 15 секунд, показываем реальный процент
                    fakePercent = realPercent;
                }
                
                // Обновляем прогресс бар с фейковым процентом
                const progressBar = document.getElementById('loading-progress-bar');
                const percentDisplay = document.getElementById('loading-percent');
                
                if (progressBar) progressBar.style.width = fakePercent + '%';
                if (percentDisplay) percentDisplay.textContent = fakePercent + '%';
                
                // Случайно меняем статус для динамики
                if (Math.random() > 0.7 && !this.loadingComplete) {
                    const statusDisplay = document.getElementById('loading-status');
                    if (statusDisplay && this.errors.length === 0) {
                        const randomStatus = RANDOM_STATUSES[Math.floor(Math.random() * RANDOM_STATUSES.length)];
                        statusDisplay.innerHTML = `<span class="status-icon">${randomStatus.emoji}</span> ${randomStatus.text} <span class="progress-dots"></span>`;
                        
                        // Возвращаем нормальный статус через 2 секунды
                        setTimeout(() => {
                            const currentStatus = LOADING_STATUSES.find(s => s.weight >= fakePercent) || LOADING_STATUSES[LOADING_STATUSES.length - 1];
                            if (statusDisplay && !this.loadingComplete) {
                                statusDisplay.innerHTML = `<span class="status-icon">${currentStatus.emoji}</span> ${currentStatus.text} <span class="progress-dots"></span>`;
                            }
                        }, 2000);
                    }
                }
                
                // Проверяем, не пора ли закончить по времени
                if (elapsed >= CONFIG.maxLoadingTime && !this.loadingComplete) {
                    this.loadingComplete = true;
                    this.finishDynamicLoading();
                }
            }, 200);
            
            // Запускаем смену советов
            this.tipInterval = setInterval(() => {
                const tipElement = document.getElementById('loading-tip');
                if (tipElement) {
                    const randomTip = TIPS[Math.floor(Math.random() * TIPS.length)];
                    tipElement.textContent = randomTip;
                }
            }, 3000);
        },
        
        finishDynamicLoading: function() {
            if (this.animationInterval) {
                clearInterval(this.animationInterval);
                this.animationInterval = null;
            }
            
            // Показываем реальный прогресс
            const realPercent = Math.min(Math.round((this.loaded / this.total) * 100), 100);
            const progressBar = document.getElementById('loading-progress-bar');
            const percentDisplay = document.getElementById('loading-percent');
            
            if (progressBar) progressBar.style.width = realPercent + '%';
            if (percentDisplay) percentDisplay.textContent = realPercent + '%';
            
            // Завершаем загрузку
            this.finishLoading();
        },
        
        finishLoading: function() {
            // Останавливаем интервалы
            if (this.animationInterval) {
                clearInterval(this.animationInterval);
                this.animationInterval = null;
            }
            
            if (this.tipInterval) {
                clearInterval(this.tipInterval);
                this.tipInterval = null;
            }
            
            const loadingTime = ((Date.now() - this.startTime) / 1000).toFixed(1);
            const statusDisplay = document.getElementById('loading-status');
            const percentDisplay = document.getElementById('loading-percent');
            
            if (this.errors.length > 0) {
                if (statusDisplay) {
                    statusDisplay.innerHTML = `<span class="status-icon warning">⚠️</span> Загружено с ошибками (${this.errors.length}) за ${loadingTime}с`;
                }
                
                if (percentDisplay) {
                    percentDisplay.innerHTML = '⚠️';
                }
                
                // Показываем кнопку перезагрузки
                const detailsDisplay = document.getElementById('loading-details');
                if (detailsDisplay) {
                    const retryButton = document.createElement('button');
                    retryButton.className = 'retry-button';
                    retryButton.innerHTML = '🔄 Перезагрузить страницу';
                    retryButton.onclick = () => window.location.reload();
                    detailsDisplay.appendChild(retryButton);
                }
                
                // Автоматическая перезагрузка через 5 секунд
                setTimeout(() => {
                    if (confirm('Некоторые компоненты не загрузились. Перезагрузить страницу?')) {
                        window.location.reload();
                    }
                }, 5000);
            } else {
                if (statusDisplay) {
                    statusDisplay.innerHTML = `<span class="status-icon">✅</span> Загрузка завершена за ${loadingTime}с`;
                }
                
                if (percentDisplay) {
                    percentDisplay.innerHTML = '100%';
                }
                
                // Плавно скрываем оверлей
                setTimeout(() => {
                    const overlay = document.getElementById('loading-overlay');
                    if (overlay) {
                        overlay.classList.add('fade-out');
                        setTimeout(() => {
                            if (overlay && overlay.parentNode) {
                                overlay.parentNode.removeChild(overlay);
                            }
                        }, 500);
                    }
                }, 800);
            }
        },
        
        retryScript: function(scriptSrc) {
            if (!this.retryCounts[scriptSrc]) {
                this.retryCounts[scriptSrc] = 0;
            }
            
            if (this.retryCounts[scriptSrc] >= CONFIG.maxRetries) {
                console.error(`Не удалось загрузить скрипт после ${CONFIG.maxRetries} попыток: ${scriptSrc}`);
                return false;
            }
            
            this.retryCounts[scriptSrc]++;
            this.loaded--; // Уменьшаем счетчик загруженных
            
            const statusDisplay = document.getElementById('loading-status');
            if (statusDisplay) {
                statusDisplay.innerHTML = `<span class="status-icon">🔄</span> Перезагрузка: ${scriptSrc.split('/').pop()} (попытка ${this.retryCounts[scriptSrc]})`;
            }
            
            // Создаем новый script элемент
            const script = document.createElement('script');
            script.src = scriptSrc;
            script.async = false;
            
            script.onload = () => {
                this.loaded++;
                this.errors = this.errors.filter(e => e !== scriptSrc);
                this.updateProgress();
            };
            
            script.onerror = () => {
                setTimeout(() => this.retryScript(scriptSrc), CONFIG.retryDelay);
            };
            
            document.head.appendChild(script);
            return true;
        }
    };
    
    // Перехватываем загрузку скриптов
    const originalAppendChild = document.head ? document.head.appendChild : null;
    
    if (originalAppendChild) {
        document.head.appendChild = function(node) {
            if (node.tagName === 'SCRIPT' && node.src) {
                window.loadingScripts.total++;
                window.loadingScripts.scripts.push(node.src);
                
                // Устанавливаем таймаут для скрипта
                const timeoutId = setTimeout(() => {
                    console.warn(`Таймаут загрузки скрипта: ${node.src}`);
                    if (window.loadingScripts.retryScript(node.src)) {
                        // Удаляем старый скрипт
                        if (node.parentNode) {
                            node.parentNode.removeChild(node);
                        }
                    }
                }, CONFIG.timeout);
                
                // Обновляем обработчики событий
                const originalOnLoad = node.onload;
                node.onload = function() {
                    clearTimeout(timeoutId);
                    window.loadingScripts.loaded++;
                    window.loadingScripts.updateProgress();
                    if (originalOnLoad) originalOnLoad.apply(this, arguments);
                };
                
                const originalOnError = node.onerror;
                node.onerror = function() {
                    clearTimeout(timeoutId);
                    window.loadingScripts.errors.push(node.src);
                    window.loadingScripts.updateProgress();
                    
                    // Пытаемся перезагрузить скрипт
                    if (window.loadingScripts.retryScript(node.src)) {
                        // Удаляем старый скрипт
                        if (node.parentNode) {
                            node.parentNode.removeChild(node);
                        }
                    }
                    
                    if (originalOnError) originalOnError.apply(this, arguments);
                };
            }
            return originalAppendChild.call(this, node);
        };
    }
    
    // Добавляем обработчик для DOMContentLoaded
    document.addEventListener('DOMContentLoaded', () => {
        // Запускаем динамическую загрузку
        window.loadingScripts.startDynamicLoading();
        
        // Устанавливаем максимальное время загрузки 15 секунд
        setTimeout(() => {
            if (!window.loadingScripts.loadingComplete && window.loadingScripts.loaded < window.loadingScripts.total) {
                window.loadingScripts.loadingComplete = true;
                window.loadingScripts.finishDynamicLoading();
            }
        }, CONFIG.maxLoadingTime);
        
        // Проверяем, не зависла ли загрузка
        setTimeout(() => {
            if (window.loadingScripts.loaded < window.loadingScripts.total) {
                const unloadedScripts = window.loadingScripts.scripts.filter(src => 
                    !window.loadingScripts.retryCounts[src] || 
                    window.loadingScripts.retryCounts[src] < CONFIG.maxRetries
                );
                
                unloadedScripts.forEach(src => {
                    window.loadingScripts.retryScript(src);
                });
            }
        }, 5000);
    });
})();