/**
 * updates.js — YouTube Player
 * לוגיקת בדיקת עדכונים עם מנגנון מניעת כפילויות חכם (yt-dlp)
 */

const UPDATES_KEY = 'yt_updates_feed'; // מפתח ב-localStorage לשמירת היסטוריית העדכונים

// ─── Helpers ──────────────────────────────────────────────────

/** הפעלת בדיקה מהדרופ-דאון עם אנימציית אייקון */
async function triggerDropdownCheck() {
    const btn  = document.getElementById('dropdownCheckBtn');
    const icon = document.getElementById('dropdownCheckIcon');
    if (!btn || !icon) { checkForUpdates(false); return; }

    // אנימציית לחיצה
    btn.style.transform = 'scale(0.9)';
    setTimeout(() => btn.style.transform = 'scale(1)', 150);

    // מצב טעינה
    icon.className = 'fas fa-spinner fa-spin';
    btn.style.pointerEvents = 'none';
    btn.style.opacity = '0.7';

    await checkForUpdates(false);

    // חזרה למצב רגיל עם אנימציית הצלחה
    icon.className = 'fas fa-check';
    btn.style.background = 'rgba(34,197,94,0.15)';
    btn.style.borderColor = 'rgba(34,197,94,0.4)';
    btn.style.color = '#4ade80';
    btn.style.pointerEvents = 'auto';
    btn.style.opacity = '1';

    setTimeout(() => {
        icon.className = 'fas fa-sync-alt';
        btn.style.background = 'rgba(124,58,237,0.1)';
        btn.style.borderColor = 'rgba(124,58,237,0.25)';
        btn.style.color = '#a78bfa';
    }, 2000);
}

/** מפיק מזהה ייחודי ונקי להשוואה (Video ID) */
function getNormalizedId(ep) {
    const vid = ep.guid || (typeof extractYouTubeVideoId === 'function' ? extractYouTubeVideoId(ep.audioUrl) : null);
    return (vid || ep.audioUrl || ep.title || '').toString().trim();
}

// ─── Public API ───────────────────────────────────────────────

/**
 * בודק עדכונים לכל הערוצים שיש להם rssUrl (דרך השרת המקומי).
 * @param {boolean} showFeedAfter — אם true, עובר ל-viewUpdates בסיום הבדיקה
 */
async function checkForUpdates(showFeedAfter = false) {
    const allData = await getFullData();
    const channels = [];
    
    allData.forEach(cat => {
        (cat.channels || []).forEach(ch => {
            // בודק רק ערוצים במעקב שיש להם כתובת מקור
            if (ch.rssUrl && ch.isTracked !== false) {
                channels.push({ ch, catName: cat.name });
            }
        });
    });

    if (channels.length === 0) {
        if (showFeedAfter) {
            showToast('אין ערוצים במעקב לבדיקה', 'info');
            showUpdatesView();
        }
        return;
    }

    // עדכון זמן בדיקה אחרון
    localStorage.setItem('last_update_check', Date.now().toString());

    // הצגת אינדיקציית טעינה בפעמון
    const notifBtn = document.getElementById('notificationBtn');
    if (notifBtn) notifBtn.innerHTML = '<i class="fas fa-spinner fa-spin" style="font-size:15px;"></i>';

    let totalNew = 0;
    const feedItems = _getStoredFeed();

    // הגדרת כמות סרטונים לבדיקה
    const maxEpisodes = parseInt(localStorage.getItem('yt_max_episodes') ?? '50') || 50;
    const checkLimit  = Math.min(maxEpisodes, 50);

    for (const { ch, catName } of channels) {
        try {
            const res = await fetch(ENDPOINTS.YOUTUBE, {
                method:  'POST',
                headers: { 'Content-Type': 'application/json' },
                body:    JSON.stringify({ url: ch.rssUrl, maxEpisodes: checkLimit })
            });
            
            if (!res.ok) continue;
            const newData = await res.json();

            const currentEps = ch.episodes || [];
            // יצירת סט של מזהים קיימים למניעת כפילויות
            const existingIds = new Set(currentEps.map(ep => getNormalizedId(ep)));

            // סינון סרטונים שבאמת חדשים
            const freshEps = (newData.episodes || []).filter(ep => {
                const id = getNormalizedId(ep);
                return id && !existingIds.has(id);
            });

            if (freshEps.length > 0) {
                // סימון כחדש ושמירה לספרייה
                freshEps.forEach(ep => ep.isNew = true);

                ch.episodes     = [...freshEps, ...currentEps];
                ch.episodeCount = ch.episodes.length;
                ch.newCount     = (ch.newCount || 0) + freshEps.length;
                ch.lastFetch    = new Date().toISOString();
                
                // עדכון מידע בסיסי אם השתנה — לא מחליפים תמונה עובדת בכתובת חסומה
                const blockedDomains = ['yt3.ggpht.com', 'yt3.googleusercontent.com', 'lh3.googleusercontent.com'];
                const isBlocked = (url) => url && blockedDomains.some(d => url.includes(d));
                if (newData.image && !isBlocked(newData.image)) ch.image = newData.image;
                if (newData.description) ch.description = newData.description;
                
                await updateChannelInStorage(ch);
                totalNew += freshEps.length;

                // הוספה לפיד העדכונים הכללי
                freshEps.forEach(ep => {
                    feedItems.unshift({
                        id:           getNormalizedId(ep),
                        title:        ep.title  || '',
                        pubDate:      ep.pubDate || new Date().toISOString(),
                        duration:     ep.duration || '',
                        audioUrl:     ep.audioUrl || '',
                        channelId:    ch.id,
                        channelTitle: ch.title,
                        channelImage: ch.image || '',
                        categoryName: catName,
                        ytVideoId:    extractYouTubeVideoId(ep.audioUrl) || ep.guid,
                        isRead:       false,
                        savedAt:      new Date().toISOString()
                    });
                });
            }
        } catch(e) {
            console.warn('[Updates] Failed for channel:', ch.title);
        }
    }

    // שמירת הפיד (עד 300 פריטים אחרונים)
    _storeFeed(feedItems.slice(0, 300));

    // עדכון ממשק המשתמש
    updateNotificationUI();
    if (notifBtn) notifBtn.innerHTML = '<i class="fas fa-bell" style="font-size:15px;"></i>';

    if (totalNew > 0) {
        showToast(`נמצאו ${totalNew} סרטונים חדשים ✓`, 'success');
        await loadDataFromServer();
        if (typeof renderLibrary === 'function') renderLibrary();
    } else if (showFeedAfter) {
        showToast('הכל מעודכן, אין חדש', 'info');
    }

    if (showFeedAfter) showUpdatesView();
}

/** מעדכן את ה-Badge ואת תוכן הדרופ-דאון */
function updateNotificationUI() {
    const feed   = _getStoredFeed();
    const unread = feed.filter(f => !f.isRead).length;

    const badge = document.getElementById('notificationBadge');
    if (badge) {
        if (unread > 0) badge.classList.remove('hidden');
        else            badge.classList.add('hidden');
    }

    _renderDropdownList(feed.slice(0, 8));
}

// ─── Views ────────────────────────────────────────────────────

function showUpdatesView() {
    document.getElementById('viewDashboard')?.classList.add('hidden');
    document.getElementById('viewChannel')?.classList.add('hidden');
    document.getElementById('viewFavorites')?.classList.add('hidden');
    document.getElementById('viewUpdates')?.classList.remove('hidden');
    document.getElementById('notificationDropdown')?.classList.add('hidden');
    
    renderUpdatesFeed();
    window.scrollTo(0, 0);
}

function markAllAsRead() {
    const feed = _getStoredFeed().map(f => ({ ...f, isRead: true }));
    _storeFeed(feed);
    updateNotificationUI();
    renderUpdatesFeed();
}

function clearNotifications() {
    if (!confirm('למחוק את כל היסטוריית העדכונים?')) return;
    _storeFeed([]);
    updateNotificationUI();
    renderUpdatesFeed();
    document.getElementById('notificationDropdown')?.classList.add('hidden');
}

// ─── Rendering ────────────────────────────────────────────────

function renderUpdatesFeed() {
    const container  = document.getElementById('updatesFeedList');
    const emptyState = document.getElementById('noUpdatesState');
    if (!container) return;
    
    container.innerHTML = '';
    const feed = _getStoredFeed();
    
    if (feed.length === 0) {
        emptyState?.classList.remove('hidden');
        return;
    }
    emptyState?.classList.add('hidden');

    // סימון הכל כנקרא בעת כניסה למסך
    const updatedFeed = feed.map(f => ({ ...f, isRead: true }));
    _storeFeed(updatedFeed);
    updateNotificationUI();

    // קיבוץ לפי ערוץ לנוחות קריאה
    const byChannel = {};
    updatedFeed.forEach(item => {
        if (!byChannel[item.channelId]) {
            byChannel[item.channelId] = { 
                title: item.channelTitle, 
                image: item.channelImage, 
                items: [] 
            };
        }
        byChannel[item.channelId].items.push(item);
    });

    Object.values(byChannel).forEach(group => {
        const section = document.createElement('div');
        section.className = 'animate-fade-in';
        section.style.marginBottom = '32px';

        section.innerHTML = `
            <div style="display:flex; align-items:center; gap:10px; margin-bottom:14px; padding-bottom:10px; border-bottom:1px solid var(--border);">
                <img src="${group.image}" style="width:32px; height:32px; border-radius:50%; object-fit:cover; border:1px solid var(--border);" onerror="this.style.display='none'">
                <span style="font-size:14px; font-weight:700; color:var(--text-primary);">${group.title}</span>
                <span style="font-size:11px; background:rgba(239,68,68,0.12); color:#f87171; padding:2px 8px; border-radius:20px; font-weight:700;">${group.items.length} חדשים</span>
            </div>`;

        const grid = document.createElement('div');
        grid.className = 'grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-3';

        group.items.forEach(item => {
            grid.appendChild(_createFeedCard(item));
        });

        section.appendChild(grid);
        container.appendChild(section);
    });
}

function _renderDropdownList(items) {
    const list = document.getElementById('notificationList');
    if (!list) return;
    list.innerHTML = '';

    if (items.length === 0) {
        list.innerHTML = '<p style="font-size:12px; color:var(--text-muted); text-align:center; padding:16px 0;">אין עדכונים חדשים</p>';
        return;
    }

    items.forEach(item => {
        const el = document.createElement('div');
        el.className = 'notif-dropdown-item';
        el.style.cssText = `
            display: flex; gap: 10px; padding: 8px; border-radius: 10px;
            cursor: pointer; transition: background 0.15s; align-items: flex-start;
            ${!item.isRead ? 'background: rgba(124,58,237,0.06);' : ''}
        `;

        const thumb = item.ytVideoId
            ? `https://img.youtube.com/vi/${item.ytVideoId}/default.jpg`
            : item.channelImage;

        el.innerHTML = `
            <img src="${thumb}" style="width:48px; height:27px; object-fit:cover; border-radius:6px; flex-shrink:0; border:1px solid var(--border);" onerror="this.style.display='none'">
            <div style="flex:1; min-width:0;">
                <p style="font-size:11px; font-weight:600; color:var(--text-primary); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; line-height:1.4;">${item.title}</p>
                <p style="font-size:10px; color:var(--text-muted); margin-top:2px;">${item.channelTitle}</p>
            </div>
            <div style="display:flex; flex-direction:column; align-items:center; gap:6px; flex-shrink:0;">
                ${!item.isRead ? '<div style="width:6px; height:6px; border-radius:50%; background:#7c3aed;"></div>' : ''}
                <button class="dropdown-nav-arrow" data-channel="${item.channelId}" title="עבור לרשימת הסרטונים"
                    style="width:20px; height:20px; border-radius:50%; background:transparent; border:1px solid transparent; color:var(--text-muted); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.2s; padding:0;">
                    <i class="fas fa-arrow-left" style="font-size:8px; pointer-events:none;"></i>
                </button>
            </div>
        `;

        // לחיצה על החץ — ניווט לרשימה
        el.querySelector('.dropdown-nav-arrow').addEventListener('mouseover', function() {
            this.style.background = 'rgba(124,58,237,0.2)';
            this.style.borderColor = 'rgba(124,58,237,0.5)';
            this.style.color = '#a78bfa';
            this.style.transform = 'translateX(-2px)';
        });
        el.querySelector('.dropdown-nav-arrow').addEventListener('mouseout', function() {
            this.style.background = 'transparent';
            this.style.borderColor = 'transparent';
            this.style.color = 'var(--text-muted)';
            this.style.transform = 'translateX(0)';
        });
        el.querySelector('.dropdown-nav-arrow').addEventListener('click', (e) => {
            e.stopPropagation();
            document.getElementById('notificationDropdown')?.classList.add('hidden');
            _navigateToChannelFromFeed(item.channelId);
        });

        el.onclick = () => {
            if (typeof openYTModal === 'function') openYTModal(item.ytVideoId, item.title);
            document.getElementById('notificationDropdown')?.classList.add('hidden');
        };
        list.appendChild(el);
    });
}

function _createFeedCard(item) {
    const card = document.createElement('div');
    card.className = 'group relative rounded-xl overflow-hidden bg-white border border-gray-200 hover:border-gray-400 shadow-sm hover:shadow-md transition-all duration-300 animate-fade-in';

    const thumbUrl  = item.ytVideoId ? `https://img.youtube.com/vi/${item.ytVideoId}/mqdefault.jpg` : item.channelImage;
    const safeTitle = (item.title || '').replace(/'/g, "\\'").replace(/"/g, '&quot;');
    let dateStr = '';
    try { dateStr = new Date(item.pubDate).toLocaleDateString('he-IL'); } catch(e) {}

    card.innerHTML = `
        <div class="relative cursor-pointer" style="aspect-ratio:16/9;"
             onclick="openYTModal('${item.ytVideoId}', '${safeTitle}')">
            <img src="${thumbUrl}" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500" loading="lazy">
            <div class="absolute inset-0 flex items-center justify-center bg-black/5 group-hover:bg-black/20 transition-colors">
                <div class="w-10 h-10 rounded-full bg-red-600/90 flex items-center justify-center shadow-lg opacity-0 group-hover:opacity-100 scale-90 group-hover:scale-100 transition-all duration-200">
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" class="w-5 h-5 ml-0.5"><path d="M8 5v14l11-7z"/></svg>
                </div>
            </div>
            <span class="absolute top-2 right-2 text-[9px] bg-red-500 text-white px-1.5 py-0.5 rounded-full shadow font-bold">חדש</span>
            ${item.duration ? `<span class="absolute bottom-1.5 left-1.5 bg-black/60 text-white text-[9px] px-1.5 py-0.5 rounded-md font-mono">${item.duration}</span>` : ''}
        </div>
        <div class="p-2.5">
            <p class="text-gray-800 text-[11px] font-medium leading-snug line-clamp-2 mb-1">${item.title}</p>
            <div style="display:flex; align-items:center; justify-content:space-between; margin-top:4px;">
                <p class="text-gray-400 text-[10px]">${dateStr}</p>
                <button onclick="event.stopPropagation(); _navigateToChannelFromFeed('${item.channelId}')" title="עבור לרשימת הסרטונים"
                    style="width:22px; height:22px; border-radius:50%; background:rgba(124,58,237,0.08); border:1px solid rgba(124,58,237,0.2); color:#a78bfa; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.2s; flex-shrink:0;"
                    onmouseover="this.style.background='rgba(124,58,237,0.2)'; this.style.borderColor='rgba(124,58,237,0.5)'; this.style.transform='translateX(-2px)'"
                    onmouseout="this.style.background='rgba(124,58,237,0.08)'; this.style.borderColor='rgba(124,58,237,0.2)'; this.style.transform='translateX(0)'">
                    <i class="fas fa-arrow-left" style="font-size:9px;"></i>
                </button>
            </div>
        </div>`;
    return card;
}

// ─── Storage Helpers ──────────────────────────────────────────

/** מנווט לרשימת הסרטונים של הערוץ */
function _navigateToChannelFromFeed(channelId) {
    document.getElementById('viewUpdates')?.classList.add('hidden');
    if (typeof openChannel === 'function') {
        openChannel(channelId);
    } else if (typeof showDashboard === 'function') {
        showDashboard();
    }
}

function _getStoredFeed() {
    try {
        return JSON.parse(localStorage.getItem(UPDATES_KEY) || '[]');
    } catch(e) { return []; }
}

function _storeFeed(feed) {
    try { localStorage.setItem(UPDATES_KEY, JSON.stringify(feed)); } catch(e) {}
}