diff --git a/requirements.txt b/requirements.txt index dfbb0f1..f60fe59 100644 --- a/requirements.txt +++ b/requirements.txt @@ -10,3 +10,4 @@ websockets python-multipart aiosmtplib geonamescache>=2.0 +telethon diff --git a/src/agents/orchestrator.py b/src/agents/orchestrator.py index d6de3b2..34b48e9 100644 --- a/src/agents/orchestrator.py +++ b/src/agents/orchestrator.py @@ -535,6 +535,7 @@ class AgentOrchestrator: description = incident["description"] or "" incident_type = incident["type"] or "adhoc" international = bool(incident["international_sources"]) if "international_sources" in incident.keys() else True + include_telegram = bool(incident["include_telegram"]) if "include_telegram" in incident.keys() else False visibility = incident["visibility"] if "visibility" in incident.keys() else "public" created_by = incident["created_by"] if "created_by" in incident.keys() else None tenant_id = incident["tenant_id"] if "tenant_id" in incident.keys() else None @@ -620,11 +621,24 @@ class AgentOrchestrator: logger.info(f"Claude-Recherche: {len(results)} Ergebnisse") return results, usage - # Beide Pipelines parallel starten - (rss_articles, rss_feed_usage), (search_results, search_usage) = await asyncio.gather( - _rss_pipeline(), - _web_search_pipeline(), - ) + async def _telegram_pipeline(): + """Telegram-Kanal-Suche.""" + from feeds.telegram_parser import TelegramParser + tg_parser = TelegramParser() + articles = await tg_parser.search_channels(title, tenant_id=tenant_id, keywords=None) + logger.info(f"Telegram-Pipeline: {len(articles)} Nachrichten") + return articles, None + + # Pipelines parallel starten (RSS + WebSearch + optional Telegram) + pipelines = [_rss_pipeline(), _web_search_pipeline()] + if include_telegram: + pipelines.append(_telegram_pipeline()) + + pipeline_results = await asyncio.gather(*pipelines) + + (rss_articles, rss_feed_usage) = pipeline_results[0] + (search_results, search_usage) = pipeline_results[1] + telegram_articles = pipeline_results[2][0] if include_telegram else [] if rss_feed_usage: usage_acc.add(rss_feed_usage) @@ -635,7 +649,7 @@ class AgentOrchestrator: self._check_cancelled(incident_id) # Alle Ergebnisse zusammenführen - all_results = rss_articles + search_results + all_results = rss_articles + search_results + telegram_articles # Duplikate entfernen (normalisierte URL + Headline-Ähnlichkeit) seen_urls = set() diff --git a/src/config.py b/src/config.py index 6ccd0e7..f712bda 100644 --- a/src/config.py +++ b/src/config.py @@ -76,3 +76,9 @@ MAX_ARTICLES_PER_DOMAIN_RSS = 10 # Max. Artikel pro Domain nach RSS-Fetch # Magic Link MAGIC_LINK_EXPIRE_MINUTES = 10 MAGIC_LINK_BASE_URL = os.environ.get("MAGIC_LINK_BASE_URL", "https://monitor.aegis-sight.de") + +# Telegram (Telethon) +TELEGRAM_API_ID = int(os.environ.get("TELEGRAM_API_ID", "2040")) +TELEGRAM_API_HASH = os.environ.get("TELEGRAM_API_HASH", "b18441a1ff607e10a989891a5462e627") +TELEGRAM_SESSION_PATH = os.environ.get("TELEGRAM_SESSION_PATH", "/home/claude-dev/.telegram/telegram_session") + diff --git a/src/database.py b/src/database.py index ff9790f..3d99fcf 100644 --- a/src/database.py +++ b/src/database.py @@ -259,6 +259,12 @@ async def init_db(): await db.execute("ALTER TABLE incidents ADD COLUMN visibility TEXT DEFAULT 'public'") await db.commit() + if "include_telegram" not in columns: + await db.execute("ALTER TABLE incidents ADD COLUMN include_telegram INTEGER DEFAULT 0") + await db.commit() + logger.info("Migration: include_telegram zu incidents hinzugefuegt") + + if "tenant_id" not in columns: await db.execute("ALTER TABLE incidents ADD COLUMN tenant_id INTEGER REFERENCES organizations(id)") await db.commit() diff --git a/src/feeds/telegram_parser.py b/src/feeds/telegram_parser.py new file mode 100644 index 0000000..be3b49f --- /dev/null +++ b/src/feeds/telegram_parser.py @@ -0,0 +1,251 @@ +"""Telegram-Kanal Parser: Liest Nachrichten aus konfigurierten Telegram-Kanaelen.""" +import asyncio +import logging +import os +from datetime import datetime, timezone +from typing import Optional + +from config import TIMEZONE, TELEGRAM_API_ID, TELEGRAM_API_HASH, TELEGRAM_SESSION_PATH + +logger = logging.getLogger("osint.telegram") + +# Stoppwoerter (gleich wie RSS-Parser) +STOP_WORDS = { + "und", "oder", "der", "die", "das", "ein", "eine", "in", "im", "am", "an", + "auf", "fuer", "mit", "von", "zu", "zum", "zur", "bei", "nach", "vor", + "ueber", "unter", "ist", "sind", "hat", "the", "and", "for", "with", "from", +} + + +class TelegramParser: + """Durchsucht Telegram-Kanaele nach relevanten Nachrichten.""" + + _client = None + _lock = asyncio.Lock() + + async def _get_client(self): + """Telethon-Client erstellen oder wiederverwenden.""" + if TelegramParser._client is not None: + if TelegramParser._client.is_connected(): + return TelegramParser._client + + async with TelegramParser._lock: + # Double-check nach Lock + if TelegramParser._client is not None and TelegramParser._client.is_connected(): + return TelegramParser._client + + try: + from telethon import TelegramClient + session_path = TELEGRAM_SESSION_PATH + if not os.path.exists(session_path + ".session") and not os.path.exists(session_path): + logger.error("Telegram-Session nicht gefunden: %s", session_path) + return None + + client = TelegramClient(session_path, TELEGRAM_API_ID, TELEGRAM_API_HASH) + await client.connect() + + if not await client.is_user_authorized(): + logger.error("Telegram-Session nicht autorisiert. Bitte neu einloggen.") + await client.disconnect() + return None + + TelegramParser._client = client + me = await client.get_me() + logger.info("Telegram verbunden als: %s (%s)", me.first_name, me.phone) + return client + except ImportError: + logger.error("telethon nicht installiert: pip install telethon") + return None + except Exception as e: + logger.error("Telegram-Verbindung fehlgeschlagen: %s", e) + return None + + async def search_channels(self, search_term: str, tenant_id: int = None, + keywords: list[str] = None) -> list[dict]: + """Liest Nachrichten aus konfigurierten Telegram-Kanaelen. + + Gibt Artikel-Dicts zurueck (kompatibel mit RSS-Parser-Format). + """ + client = await self._get_client() + if not client: + logger.warning("Telegram-Client nicht verfuegbar, ueberspringe Telegram-Pipeline") + return [] + + # Telegram-Kanaele aus DB laden + channels = await self._get_telegram_channels(tenant_id) + if not channels: + logger.info("Keine Telegram-Kanaele konfiguriert") + return [] + + # Suchwoerter vorbereiten + if keywords: + search_words = [w.lower().strip() for w in keywords if w.strip()] + else: + search_words = [ + w for w in search_term.lower().split() + if w not in STOP_WORDS and len(w) >= 3 + ] + if not search_words: + search_words = search_term.lower().split()[:2] + + # Kanaele parallel abrufen + tasks = [] + for ch in channels: + channel_id = ch["url"] or ch["name"] + tasks.append(self._fetch_channel(client, channel_id, search_words)) + + results = await asyncio.gather(*tasks, return_exceptions=True) + + all_articles = [] + for i, result in enumerate(results): + if isinstance(result, Exception): + logger.warning("Telegram-Kanal %s: %s", channels[i]["name"], result) + continue + all_articles.extend(result) + + logger.info("Telegram: %d relevante Nachrichten aus %d Kanaelen", len(all_articles), len(channels)) + return all_articles + + async def _get_telegram_channels(self, tenant_id: int = None) -> list[dict]: + """Laedt Telegram-Kanaele aus der sources-Tabelle.""" + try: + from database import get_db + db = await get_db() + try: + cursor = await db.execute( + """SELECT id, name, url FROM sources + WHERE source_type = 'telegram_channel' + AND status = 'active' + AND (tenant_id IS NULL OR tenant_id = ?)""", + (tenant_id,), + ) + rows = await cursor.fetchall() + return [dict(row) for row in rows] + finally: + await db.close() + except Exception as e: + logger.error("Fehler beim Laden der Telegram-Kanaele: %s", e) + return [] + + async def _fetch_channel(self, client, channel_id: str, search_words: list[str], + limit: int = 50) -> list[dict]: + """Letzte N Nachrichten eines Kanals abrufen und nach Keywords filtern.""" + articles = [] + try: + # Kanal-Identifier normalisieren + identifier = channel_id.strip() + if identifier.startswith("https://t.me/"): + identifier = identifier.replace("https://t.me/", "") + if identifier.startswith("t.me/"): + identifier = identifier.replace("t.me/", "") + + # Privater Invite-Link + if identifier.startswith("+") or identifier.startswith("joinchat/"): + entity = await client.get_entity(channel_id) + else: + # Oeffentlicher Kanal + if not identifier.startswith("@"): + identifier = "@" + identifier + entity = await client.get_entity(identifier) + + messages = await client.get_messages(entity, limit=limit) + + channel_title = getattr(entity, "title", identifier) + channel_username = getattr(entity, "username", identifier.replace("@", "")) + + for msg in messages: + if not msg.text: + continue + + text = msg.text + text_lower = text.lower() + + # Keyword-Matching (gleiche Logik wie RSS-Parser) + min_matches = min(2, max(1, (len(search_words) + 1) // 2)) + match_count = sum(1 for word in search_words if word in text_lower) + + if match_count < min_matches: + continue + + # Erste Zeile als Headline, Rest als Content + lines = text.strip().split("\n") + headline = lines[0][:200] if lines else text[:200] + content = text + + # Datum + published = None + if msg.date: + try: + published = msg.date.astimezone(TIMEZONE).isoformat() + except Exception: + published = msg.date.isoformat() + + # Source-URL: t.me/channel/msg_id + if channel_username: + source_url = "https://t.me/%s/%s" % (channel_username, msg.id) + else: + source_url = "https://t.me/c/%s/%s" % (entity.id, msg.id) + + relevance_score = match_count / len(search_words) if search_words else 0.0 + + articles.append({ + "headline": headline, + "headline_de": headline if self._is_german(headline) else None, + "source": "Telegram: %s" % channel_title, + "source_url": source_url, + "content_original": content[:2000], + "content_de": content[:2000] if self._is_german(content) else None, + "language": "de" if self._is_german(content) else "en", + "published_at": published, + "relevance_score": relevance_score, + }) + + except Exception as e: + logger.warning("Telegram-Kanal %s: %s", channel_id, e) + + return articles + + async def validate_channel(self, channel_id: str) -> Optional[dict]: + """Prueft ob ein Telegram-Kanal erreichbar ist und gibt Info zurueck.""" + client = await self._get_client() + if not client: + return None + + try: + identifier = channel_id.strip() + if identifier.startswith("https://t.me/"): + identifier = identifier.replace("https://t.me/", "") + if identifier.startswith("t.me/"): + identifier = identifier.replace("t.me/", "") + + if identifier.startswith("+") or identifier.startswith("joinchat/"): + return {"valid": True, "name": "Privater Kanal", "description": "Privater Einladungslink", "subscribers": None} + + if not identifier.startswith("@"): + identifier = "@" + identifier + + entity = await client.get_entity(identifier) + + from telethon.tl.functions.channels import GetFullChannelRequest + full = await client(GetFullChannelRequest(entity)) + + return { + "valid": True, + "name": getattr(entity, "title", identifier), + "description": getattr(full.full_chat, "about", "") or "", + "subscribers": getattr(full.full_chat, "participants_count", None), + "username": getattr(entity, "username", ""), + } + except Exception as e: + logger.warning("Telegram-Kanal-Validierung fehlgeschlagen fuer %s: %s", channel_id, e) + return None + + def _is_german(self, text: str) -> bool: + """Einfache Heuristik ob ein Text deutsch ist.""" + german_words = {"der", "die", "das", "und", "ist", "von", "mit", "fuer", "auf", "ein", + "eine", "den", "dem", "des", "sich", "wird", "nach", "bei", "auch", + "ueber", "wie", "aus", "hat", "zum", "zur", "als", "noch", "mehr", + "nicht", "aber", "oder", "sind", "vor", "einem", "einer", "wurde"} + words = set(text.lower().split()) + matches = words & german_words + return len(matches) >= 2 diff --git a/src/models.py b/src/models.py index 9c0b7db..c31ccb4 100644 --- a/src/models.py +++ b/src/models.py @@ -52,6 +52,7 @@ class IncidentCreate(BaseModel): refresh_interval: int = Field(default=15, ge=10, le=10080) retention_days: int = Field(default=0, ge=0, le=999) international_sources: bool = True + include_telegram: bool = False visibility: str = Field(default="public", pattern="^(public|private)$") @@ -64,6 +65,7 @@ class IncidentUpdate(BaseModel): refresh_interval: Optional[int] = Field(default=None, ge=10, le=10080) retention_days: Optional[int] = Field(default=None, ge=0, le=999) international_sources: Optional[bool] = None + include_telegram: Optional[bool] = None visibility: Optional[str] = Field(default=None, pattern="^(public|private)$") @@ -80,6 +82,7 @@ class IncidentResponse(BaseModel): summary: Optional[str] sources_json: Optional[str] = None international_sources: bool = True + include_telegram: bool = False created_by: int created_by_username: str = "" created_at: str @@ -95,7 +98,7 @@ class SourceCreate(BaseModel): name: str = Field(min_length=1, max_length=200) url: Optional[str] = None domain: Optional[str] = None - source_type: str = Field(default="rss_feed", pattern="^(rss_feed|web_source|excluded)$") + source_type: str = Field(default="rss_feed", pattern="^(rss_feed|web_source|excluded|telegram_channel)$") category: str = Field(default="sonstige", pattern="^(nachrichtenagentur|oeffentlich-rechtlich|qualitaetszeitung|behoerde|fachmedien|think-tank|international|regional|boulevard|sonstige)$") status: str = Field(default="active", pattern="^(active|inactive)$") notes: Optional[str] = None @@ -105,7 +108,7 @@ class SourceUpdate(BaseModel): name: Optional[str] = Field(default=None, max_length=200) url: Optional[str] = None domain: Optional[str] = None - source_type: Optional[str] = Field(default=None, pattern="^(rss_feed|web_source|excluded)$") + source_type: Optional[str] = Field(default=None, pattern="^(rss_feed|web_source|excluded|telegram_channel)$") category: Optional[str] = Field(default=None, pattern="^(nachrichtenagentur|oeffentlich-rechtlich|qualitaetszeitung|behoerde|fachmedien|think-tank|international|regional|boulevard|sonstige)$") status: Optional[str] = Field(default=None, pattern="^(active|inactive)$") notes: Optional[str] = None diff --git a/src/routers/incidents.py b/src/routers/incidents.py index b05ab6a..f7b0694 100644 --- a/src/routers/incidents.py +++ b/src/routers/incidents.py @@ -20,7 +20,7 @@ router = APIRouter(prefix="/api/incidents", tags=["incidents"]) INCIDENT_UPDATE_COLUMNS = { "title", "description", "type", "status", "refresh_mode", - "refresh_interval", "retention_days", "international_sources", "visibility", + "refresh_interval", "retention_days", "international_sources", "include_telegram", "visibility", } @@ -105,9 +105,9 @@ async def create_incident( now = datetime.now(TIMEZONE).strftime('%Y-%m-%d %H:%M:%S') cursor = await db.execute( """INSERT INTO incidents (title, description, type, refresh_mode, refresh_interval, - retention_days, international_sources, visibility, + retention_days, international_sources, include_telegram, visibility, tenant_id, created_by, created_at, updated_at) - VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)""", + VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)""", ( data.title, data.description, @@ -116,6 +116,7 @@ async def create_incident( data.refresh_interval, data.retention_days, 1 if data.international_sources else 0, + 1 if data.include_telegram else 0, data.visibility, tenant_id, current_user["id"], @@ -721,6 +722,7 @@ def _build_json_export( "updated_at": incident.get("updated_at"), "summary": incident.get("summary"), "international_sources": bool(incident.get("international_sources")), + "include_telegram": bool(incident.get("include_telegram")), }, "sources": sources, "fact_checks": [ diff --git a/src/routers/sources.py b/src/routers/sources.py index f7b9b33..e67edc8 100644 --- a/src/routers/sources.py +++ b/src/routers/sources.py @@ -87,6 +87,7 @@ async def get_source_stats( stats = { "rss_feed": {"count": 0, "articles": 0}, "web_source": {"count": 0, "articles": 0}, + "telegram_channel": {"count": 0, "articles": 0}, "excluded": {"count": 0, "articles": 0}, } for row in rows: @@ -516,6 +517,32 @@ async def delete_source( await db.commit() + + +@router.post("/telegram/validate") +async def validate_telegram_channel( + data: dict, + current_user: dict = Depends(get_current_user), +): + """Prueft ob ein Telegram-Kanal erreichbar ist und gibt Kanalinfo zurueck.""" + channel_id = data.get("channel_id", "").strip() + if not channel_id: + raise HTTPException(status_code=400, detail="channel_id ist erforderlich") + + try: + from feeds.telegram_parser import TelegramParser + parser = TelegramParser() + result = await parser.validate_channel(channel_id) + if result: + return result + raise HTTPException(status_code=404, detail="Kanal nicht erreichbar oder nicht gefunden") + except HTTPException: + raise + except Exception as e: + logger.error("Telegram-Validierung fehlgeschlagen: %s", e, exc_info=True) + raise HTTPException(status_code=500, detail="Telegram-Validierung fehlgeschlagen") + + @router.post("/refresh-counts") async def trigger_refresh_counts( current_user: dict = Depends(get_current_user), diff --git a/src/static/dashboard.html b/src/static/dashboard.html index 5284a94..2829177 100644 --- a/src/static/dashboard.html +++ b/src/static/dashboard.html @@ -339,6 +339,14 @@
DE + internationale Feeds (Reuters, BBC, Al Jazeera etc.)
+
+ +
Nachrichten aus konfigurierten Telegram-Kanälen berücksichtigen
+
@@ -427,6 +435,7 @@ + diff --git a/src/static/js/app.js b/src/static/js/app.js index 3ceb140..e69de29 100644 --- a/src/static/js/app.js +++ b/src/static/js/app.js @@ -1,3204 +0,0 @@ -/** - * OSINT Lagemonitor - Hauptanwendungslogik. - */ - -/** Feste Zeitzone fuer alle Anzeigen — NIEMALS aendern. */ -const TIMEZONE = 'Europe/Berlin'; - -/** Gibt Jahr/Monat(0-basiert)/Tag/Stunde/Minute in Berliner Zeit zurueck. */ -function _tz(d) { - const s = d.toLocaleString('en-CA', { - timeZone: TIMEZONE, year: 'numeric', month: '2-digit', day: '2-digit', - hour: '2-digit', minute: '2-digit', second: '2-digit', hour12: false - }); - const m = s.match(/(\d{4})-(\d{2})-(\d{2}),?\s*(\d{2}):(\d{2}):(\d{2})/); - if (!m) return { year: d.getFullYear(), month: d.getMonth(), date: d.getDate(), hours: d.getHours(), minutes: d.getMinutes() }; - return { year: +m[1], month: +m[2] - 1, date: +m[3], hours: +m[4], minutes: +m[5] }; -} - -/** - * Theme Manager: Dark/Light Theme Toggle mit localStorage-Persistenz. - */ -const ThemeManager = { - _key: 'osint_theme', - init() { - const saved = localStorage.getItem(this._key); - const theme = saved || 'dark'; - document.documentElement.setAttribute('data-theme', theme); - this._updateIcon(theme); - }, - toggle() { - const current = document.documentElement.getAttribute('data-theme') || 'dark'; - const next = current === 'dark' ? 'light' : 'dark'; - document.documentElement.setAttribute('data-theme', next); - localStorage.setItem(this._key, next); - this._updateIcon(next); - UI.updateMapTheme(); - }, - _updateIcon(theme) { - const el = document.getElementById('theme-toggle'); - if (!el) return; - el.classList.remove('dark', 'light'); - el.classList.add(theme); - el.setAttribute('aria-checked', theme === 'dark' ? 'true' : 'false'); - } -}; - -/** - * Barrierefreiheits-Manager: Panel mit 4 Schaltern (Kontrast, Focus, Schrift, Animationen). - */ -const A11yManager = { - _key: 'osint_a11y', - _isOpen: false, - _settings: { contrast: false, focus: false, fontsize: false, motion: false }, - - init() { - // Einstellungen aus localStorage laden - try { - const saved = JSON.parse(localStorage.getItem(this._key) || '{}'); - Object.keys(this._settings).forEach(k => { - if (typeof saved[k] === 'boolean') this._settings[k] = saved[k]; - }); - } catch (e) { /* Ungültige Daten ignorieren */ } - - // Button + Panel dynamisch in .header-right einfügen (vor Theme-Toggle) - const headerRight = document.querySelector('.header-right'); - const themeToggle = document.getElementById('theme-toggle'); - if (!headerRight) return; - - const container = document.createElement('div'); - container.className = 'a11y-center'; - container.innerHTML = ` - - - `; - - if (themeToggle) { - headerRight.insertBefore(container, themeToggle); - } else { - headerRight.prepend(container); - } - - // Toggle-Event-Listener - ['contrast', 'focus', 'fontsize', 'motion'].forEach(key => { - document.getElementById('a11y-' + key).addEventListener('change', () => this.toggle(key)); - }); - - // Button öffnet/schließt Panel - document.getElementById('a11y-btn').addEventListener('click', (e) => { - e.stopPropagation(); - this._isOpen ? this._closePanel() : this._openPanel(); - }); - - // Klick außerhalb schließt Panel - document.addEventListener('click', (e) => { - if (this._isOpen && !container.contains(e.target)) { - this._closePanel(); - } - }); - - // Keyboard: Esc schließt, Pfeiltasten navigieren - container.addEventListener('keydown', (e) => { - if (e.key === 'Escape' && this._isOpen) { - e.stopPropagation(); - this._closePanel(); - return; - } - if (!this._isOpen) return; - if (e.key === 'ArrowDown' || e.key === 'ArrowUp') { - e.preventDefault(); - const options = Array.from(document.querySelectorAll('.a11y-option input[type="checkbox"]')); - const idx = options.indexOf(document.activeElement); - let next; - if (e.key === 'ArrowDown') { - next = idx < options.length - 1 ? idx + 1 : 0; - } else { - next = idx > 0 ? idx - 1 : options.length - 1; - } - options[next].focus(); - } - }); - - // Einstellungen anwenden + Checkboxen synchronisieren - this._apply(); - this._syncUI(); - }, - - toggle(key) { - this._settings[key] = !this._settings[key]; - this._apply(); - this._syncUI(); - this._save(); - }, - - _apply() { - const root = document.documentElement; - Object.keys(this._settings).forEach(k => { - if (this._settings[k]) { - root.setAttribute('data-a11y-' + k, 'true'); - } else { - root.removeAttribute('data-a11y-' + k); - } - }); - }, - - _syncUI() { - Object.keys(this._settings).forEach(k => { - const cb = document.getElementById('a11y-' + k); - if (cb) cb.checked = this._settings[k]; - }); - }, - - _save() { - localStorage.setItem(this._key, JSON.stringify(this._settings)); - }, - - _openPanel() { - this._isOpen = true; - document.getElementById('a11y-panel').style.display = ''; - document.getElementById('a11y-btn').setAttribute('aria-expanded', 'true'); - // Fokus auf erste Option setzen - requestAnimationFrame(() => { - const first = document.querySelector('.a11y-option input[type="checkbox"]'); - if (first) first.focus(); - }); - }, - - _closePanel() { - this._isOpen = false; - document.getElementById('a11y-panel').style.display = 'none'; - const btn = document.getElementById('a11y-btn'); - btn.setAttribute('aria-expanded', 'false'); - btn.focus(); - } -}; - -/** - * Notification-Center: Glocke mit Badge + History-Panel. - */ -const NotificationCenter = { - _notifications: [], - _unreadCount: 0, - _isOpen: false, - _maxItems: 50, - _syncTimer: null, - - async init() { - // Glocken-Container dynamisch in .header-right vor #header-user einfügen - const headerRight = document.querySelector('.header-right'); - const headerUser = document.getElementById('header-user'); - if (!headerRight || !headerUser) return; - - const container = document.createElement('div'); - container.className = 'notification-center'; - container.innerHTML = ` - - - `; - headerRight.insertBefore(container, headerUser); - - // Event-Listener - document.getElementById('notification-bell').addEventListener('click', (e) => { - e.stopPropagation(); - this.toggle(); - }); - document.getElementById('notification-mark-read').addEventListener('click', (e) => { - e.stopPropagation(); - this.markAllRead(); - }); - // Klick außerhalb schließt Panel - document.addEventListener('click', (e) => { - if (this._isOpen && !container.contains(e.target)) { - this.close(); - } - }); - - // Notifications aus DB laden - await this._loadFromDB(); - }, - - add(notification) { - // Optimistisches UI: sofort anzeigen - notification.read = false; - notification.timestamp = notification.timestamp || new Date().toISOString(); - this._notifications.unshift(notification); - if (this._notifications.length > this._maxItems) { - this._notifications.pop(); - } - this._unreadCount++; - this._updateBadge(); - this._renderList(); - - // DB-Sync mit Debounce (Orchestrator schreibt parallel in DB) - clearTimeout(this._syncTimer); - this._syncTimer = setTimeout(() => this._syncFromDB(), 500); - }, - - toggle() { - this._isOpen ? this.close() : this.open(); - }, - - open() { - this._isOpen = true; - const panel = document.getElementById('notification-panel'); - if (panel) panel.style.display = 'flex'; - const bell = document.getElementById('notification-bell'); - if (bell) bell.setAttribute('aria-expanded', 'true'); - }, - - close() { - this._isOpen = false; - const panel = document.getElementById('notification-panel'); - if (panel) panel.style.display = 'none'; - const bell = document.getElementById('notification-bell'); - if (bell) bell.setAttribute('aria-expanded', 'false'); - }, - - async markAllRead() { - this._notifications.forEach(n => n.read = true); - this._unreadCount = 0; - this._updateBadge(); - this._renderList(); - - // In DB als gelesen markieren (fire-and-forget) - try { - await API.markNotificationsRead(null); - } catch (e) { - console.warn('Notifications als gelesen markieren fehlgeschlagen:', e); - } - }, - - _updateBadge() { - const badge = document.getElementById('notification-badge'); - if (!badge) return; - if (this._unreadCount > 0) { - badge.style.display = 'flex'; - badge.textContent = this._unreadCount > 99 ? '99+' : this._unreadCount; - document.title = `(${this._unreadCount}) ${App._originalTitle}`; - } else { - badge.style.display = 'none'; - document.title = App._originalTitle; - } - }, - - _renderList() { - const list = document.getElementById('notification-panel-list'); - if (!list) return; - - if (this._notifications.length === 0) { - list.innerHTML = '
Keine Benachrichtigungen
'; - return; - } - - list.innerHTML = this._notifications.map(n => { - const time = new Date(n.timestamp); - const timeStr = time.toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit', timeZone: TIMEZONE }); - const unreadClass = n.read ? '' : ' unread'; - const icon = n.icon || 'info'; - return `
-
${this._iconSymbol(icon)}
-
-
${this._escapeHtml(n.title)}
-
${this._escapeHtml(n.text)}
-
-
${timeStr}
-
`; - }).join(''); - }, - - _handleClick(incidentId) { - this.close(); - if (incidentId) { - App.selectIncident(incidentId); - } - }, - - _iconSymbol(type) { - switch (type) { - case 'success': return '\u2713'; - case 'warning': return '!'; - case 'error': return '\u2717'; - default: return 'i'; - } - }, - - _escapeHtml(text) { - const d = document.createElement('div'); - d.textContent = text || ''; - return d.innerHTML; - }, - - async _loadFromDB() { - try { - const items = await API.listNotifications(50); - this._notifications = items.map(n => ({ - id: n.id, - incident_id: n.incident_id, - title: n.title, - text: n.text, - icon: n.icon || 'info', - type: n.type, - read: !!n.is_read, - timestamp: n.created_at, - })); - this._unreadCount = this._notifications.filter(n => !n.read).length; - this._updateBadge(); - this._renderList(); - } catch (e) { - console.warn('Notifications laden fehlgeschlagen:', e); - } - }, - - async _syncFromDB() { - try { - const items = await API.listNotifications(50); - this._notifications = items.map(n => ({ - id: n.id, - incident_id: n.incident_id, - title: n.title, - text: n.text, - icon: n.icon || 'info', - type: n.type, - read: !!n.is_read, - timestamp: n.created_at, - })); - this._unreadCount = this._notifications.filter(n => !n.read).length; - this._updateBadge(); - this._renderList(); - } catch (e) { - console.warn('Notifications sync fehlgeschlagen:', e); - } - }, -}; - -const App = { - currentIncidentId: null, - incidents: [], - _originalTitle: document.title, - _refreshingIncidents: new Set(), - _editingIncidentId: null, - _currentArticles: [], - _currentIncidentType: 'adhoc', - _sidebarFilter: 'all', - _currentUsername: '', - _allSources: [], - _sourcesOnly: [], - _myExclusions: [], // [{domain, notes, created_at}] - _expandedGroups: new Set(), - _editingSourceId: null, - _timelineFilter: 'all', - _timelineRange: 'all', - _activePointIndex: null, - _timelineSearchTimer: null, - _pendingComplete: null, - _pendingCompleteTimer: null, - - async init() { - ThemeManager.init(); - A11yManager.init(); - // Auth prüfen - const token = localStorage.getItem('osint_token'); - if (!token) { - window.location.href = '/'; - return; - } - - try { - const user = await API.getMe(); - this._currentUsername = user.email; - document.getElementById('header-user').textContent = user.email; - - // Dropdown-Daten befuellen - const orgNameEl = document.getElementById('header-org-name'); - if (orgNameEl) orgNameEl.textContent = user.org_name || '-'; - - const licInfoEl = document.getElementById('header-license-info'); - if (licInfoEl) { - const licenseLabels = { - trial: 'Trial', - annual: 'Jahreslizenz', - permanent: 'Permanent', - }; - const label = user.read_only ? 'Abgelaufen' - : licenseLabels[user.license_type] || user.license_status || '-'; - licInfoEl.textContent = label; - } - - // Dropdown Toggle - const userBtn = document.getElementById('header-user-btn'); - const userDropdown = document.getElementById('header-user-dropdown'); - if (userBtn && userDropdown) { - userBtn.addEventListener('click', (e) => { - e.stopPropagation(); - const isOpen = userDropdown.classList.toggle('open'); - userBtn.setAttribute('aria-expanded', isOpen); - }); - document.addEventListener('click', () => { - userDropdown.classList.remove('open'); - userBtn.setAttribute('aria-expanded', 'false'); - }); - } - - // Warnung bei abgelaufener Lizenz - const warningEl = document.getElementById('header-license-warning'); - if (warningEl && user.read_only) { - warningEl.textContent = 'Lizenz abgelaufen – nur Lesezugriff'; - warningEl.classList.add('visible'); - } - } catch { - window.location.href = '/'; - return; - } - - // Event-Listener - document.getElementById('logout-btn').addEventListener('click', () => this.logout()); - document.getElementById('new-incident-btn').addEventListener('click', () => openModal('modal-new')); - document.getElementById('new-incident-form').addEventListener('submit', (e) => this.handleFormSubmit(e)); - document.getElementById('refresh-btn').addEventListener('click', () => this.handleRefresh()); - document.getElementById('delete-incident-btn').addEventListener('click', () => this.handleDelete()); - document.getElementById('edit-incident-btn').addEventListener('click', () => this.handleEdit()); - document.getElementById('archive-incident-btn').addEventListener('click', () => this.handleArchive()); - document.getElementById('inc-international').addEventListener('change', () => updateSourcesHint()); - document.getElementById('inc-visibility').addEventListener('change', () => updateVisibilityHint()); - - // Feedback - document.getElementById('feedback-form').addEventListener('submit', (e) => this.submitFeedback(e)); - document.getElementById('fb-message').addEventListener('input', (e) => { - document.getElementById('fb-char-count').textContent = e.target.value.length.toLocaleString('de-DE'); - }); - - // Sidebar-Chevrons initial auf offen setzen (Archiv geschlossen) - document.querySelectorAll('.sidebar-chevron').forEach(c => c.classList.add('open')); - document.getElementById('chevron-archived-incidents').classList.remove('open'); - - // Lagen laden (frueh, damit Sidebar sofort sichtbar) - await this.loadIncidents(); - - // Notification-Center initialisieren - try { await NotificationCenter.init(); } catch (e) { console.warn('NotificationCenter:', e); } - - // WebSocket - WS.connect(); - WS.on('status_update', (msg) => this.handleStatusUpdate(msg)); - WS.on('refresh_complete', (msg) => this.handleRefreshComplete(msg)); - WS.on('refresh_summary', (msg) => this.handleRefreshSummary(msg)); - WS.on('refresh_error', (msg) => this.handleRefreshError(msg)); - WS.on('refresh_cancelled', (msg) => this.handleRefreshCancelled(msg)); - - // Laufende Refreshes wiederherstellen - try { - const data = await API.getRefreshingIncidents(); - if (data.refreshing && data.refreshing.length > 0) { - data.refreshing.forEach(id => this._refreshingIncidents.add(id)); - // Sidebar-Dots aktualisieren - data.refreshing.forEach(id => this._updateSidebarDot(id)); - } - } catch (e) { /* Kein kritischer Fehler */ } - - // Zuletzt ausgewählte Lage wiederherstellen - const savedId = localStorage.getItem('selectedIncidentId'); - if (savedId) { - const id = parseInt(savedId, 10); - if (this.incidents.some(inc => inc.id === id)) { - await this.selectIncident(id); - } - } - - // Leaflet-Karte nachladen falls CDN langsam war - setTimeout(() => UI.retryPendingMap(), 2000); - }, - - async loadIncidents() { - try { - this.incidents = await API.listIncidents(); - this.renderSidebar(); - } catch (err) { - UI.showToast('Fehler beim Laden der Lagen: ' + err.message, 'error'); - } - }, - - renderSidebar() { - const activeContainer = document.getElementById('active-incidents'); - const researchContainer = document.getElementById('active-research'); - const archivedContainer = document.getElementById('archived-incidents'); - - // Filter-Buttons aktualisieren - document.querySelectorAll('.sidebar-filter-btn').forEach(btn => { - const isActive = btn.dataset.filter === this._sidebarFilter; - btn.classList.toggle('active', isActive); - btn.setAttribute('aria-pressed', String(isActive)); - }); - - // Lagen nach Filter einschränken - let filtered = this.incidents; - if (this._sidebarFilter === 'mine') { - filtered = filtered.filter(i => i.created_by_username === this._currentUsername); - } - - // Aktive Lagen nach Typ aufteilen - const activeAdhoc = filtered.filter(i => i.status === 'active' && (!i.type || i.type === 'adhoc')); - const activeResearch = filtered.filter(i => i.status === 'active' && i.type === 'research'); - const archived = filtered.filter(i => i.status === 'archived'); - - const emptyLabelAdhoc = this._sidebarFilter === 'mine' ? 'Keine eigenen Ad-hoc-Lagen' : 'Keine Ad-hoc-Lagen'; - const emptyLabelResearch = this._sidebarFilter === 'mine' ? 'Keine eigenen Recherchen' : 'Keine Recherchen'; - - activeContainer.innerHTML = activeAdhoc.length - ? activeAdhoc.map(i => UI.renderIncidentItem(i, i.id === this.currentIncidentId)).join('') - : `
${emptyLabelAdhoc}
`; - - researchContainer.innerHTML = activeResearch.length - ? activeResearch.map(i => UI.renderIncidentItem(i, i.id === this.currentIncidentId)).join('') - : `
${emptyLabelResearch}
`; - - archivedContainer.innerHTML = archived.length - ? archived.map(i => UI.renderIncidentItem(i, i.id === this.currentIncidentId)).join('') - : '
Kein Archiv
'; - - // Zähler aktualisieren - const countAdhoc = document.getElementById('count-active-incidents'); - const countResearch = document.getElementById('count-active-research'); - const countArchived = document.getElementById('count-archived-incidents'); - if (countAdhoc) countAdhoc.textContent = `(${activeAdhoc.length})`; - if (countResearch) countResearch.textContent = `(${activeResearch.length})`; - if (countArchived) countArchived.textContent = `(${archived.length})`; - - // Sidebar-Stats aktualisieren - this.updateSidebarStats(); - }, - - setSidebarFilter(filter) { - this._sidebarFilter = filter; - this.renderSidebar(); - }, - - _announceForSR(text) { - let el = document.getElementById('sr-announcement'); - if (!el) { - el = document.createElement('div'); - el.id = 'sr-announcement'; - el.setAttribute('role', 'status'); - el.setAttribute('aria-live', 'polite'); - el.className = 'sr-only'; - document.body.appendChild(el); - } - el.textContent = ''; - requestAnimationFrame(() => { el.textContent = text; }); - }, - - async selectIncident(id) { - this.closeRefreshHistory(); - this.currentIncidentId = id; - localStorage.setItem('selectedIncidentId', id); - const inc = this.incidents.find(i => i.id === id); - if (inc) this._announceForSR('Lage ausgewählt: ' + inc.title); - this.renderSidebar(); - - var mc = document.getElementById("main-content"); - mc.scrollTop = 0; - - document.getElementById('empty-state').style.display = 'none'; - document.getElementById('incident-view').style.display = 'flex'; - - // GridStack-Animation deaktivieren und Scroll komplett sperren - // bis alle Tile-Resize-Operationen (doppeltes rAF) abgeschlossen sind - var gridEl = document.querySelector('.grid-stack'); - if (gridEl) gridEl.classList.remove('grid-stack-animate'); - var scrollLock = function() { mc.scrollTop = 0; }; - mc.addEventListener('scroll', scrollLock); - - // gridstack-Layout initialisieren (einmalig) - if (typeof LayoutManager !== 'undefined') LayoutManager.init(); - - // Refresh-Status fuer diese Lage wiederherstellen - const isRefreshing = this._refreshingIncidents.has(id); - this._updateRefreshButton(isRefreshing); - if (isRefreshing) { - UI.showProgress('researching'); - } else { - UI.hideProgress(); - } - -// Alte Inhalte sofort leeren um Flackern beim Wechsel zu vermeiden - var el; - el = document.getElementById("incident-title"); if (el) el.textContent = ""; - el = document.getElementById("summary-content"); if (el) el.scrollTop = 0; - el = document.getElementById("summary-text"); if (el) el.innerHTML = ""; - el = document.getElementById("factcheck-filters"); if (el) el.innerHTML = ""; - el = document.querySelector(".factcheck-list"); if (el) el.scrollTop = 0; - el = document.getElementById("factcheck-list"); if (el) el.innerHTML = ""; - el = document.getElementById("source-overview-content"); if (el) el.innerHTML = ""; - el = document.getElementById("timeline-entries"); if (el) el.innerHTML = ""; - await this.loadIncidentDetail(id); - - // Scroll-Sperre nach 3 Frames aufheben (nach allen doppelten rAF-Callbacks) - mc.scrollTop = 0; - requestAnimationFrame(() => { - requestAnimationFrame(() => { - requestAnimationFrame(() => { - mc.scrollTop = 0; - mc.removeEventListener('scroll', scrollLock); - if (gridEl) gridEl.classList.add('grid-stack-animate'); - }); - }); - }); - - - - }, - - async loadIncidentDetail(id) { - try { - const [incident, articles, factchecks, snapshots, locations] = await Promise.all([ - API.getIncident(id), - API.getArticles(id), - API.getFactChecks(id), - API.getSnapshots(id), - API.getLocations(id).catch(() => []), - ]); - - this.renderIncidentDetail(incident, articles, factchecks, snapshots, locations); - } catch (err) { - UI.showToast('Fehler beim Laden: ' + err.message, 'error'); - } - }, - - renderIncidentDetail(incident, articles, factchecks, snapshots, locations) { - // Header Strip - document.getElementById('incident-title').textContent = incident.title; - document.getElementById('incident-description').textContent = incident.description || ''; - - // Typ-Badge - const typeBadge = document.getElementById('incident-type-badge'); - typeBadge.className = 'incident-type-badge ' + (incident.type === 'research' ? 'type-research' : 'type-adhoc'); - typeBadge.textContent = incident.type === 'research' ? 'Recherche' : 'Breaking'; - - // Archiv-Button Text - this._updateArchiveButton(incident.status); - - // Ersteller anzeigen - const creatorEl = document.getElementById('incident-creator'); - if (creatorEl) { - creatorEl.textContent = (incident.created_by_username || '').split('@')[0]; - } - - // Delete-Button: nur Ersteller darf löschen - const deleteBtn = document.getElementById('delete-incident-btn'); - const isCreator = incident.created_by_username === this._currentUsername; - deleteBtn.disabled = !isCreator; - deleteBtn.title = isCreator ? '' : `Nur ${(incident.created_by_username || '').split('@')[0]} kann diese Lage löschen`; - - // Zusammenfassung mit Quellenverzeichnis - const summaryText = document.getElementById('summary-text'); - if (incident.summary) { - summaryText.innerHTML = UI.renderSummary( - incident.summary, - incident.sources_json, - incident.type - ); - } else { - summaryText.innerHTML = 'Noch keine Zusammenfassung. Klicke auf "Aktualisieren" um die Recherche zu starten.'; - } - - // Meta (im Header-Strip) — relative Zeitangabe mit vollem Datum als Tooltip - const updated = incident.updated_at ? parseUTC(incident.updated_at) : null; - const metaUpdated = document.getElementById('meta-updated'); - if (updated) { - const fullDate = `${updated.toLocaleDateString('de-DE', { timeZone: TIMEZONE })} ${updated.toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit', timeZone: TIMEZONE })}`; - metaUpdated.textContent = `Stand: ${App._timeAgo(updated)}`; - metaUpdated.title = fullDate; - } else { - metaUpdated.textContent = ''; - metaUpdated.title = ''; - } - - // Zeitstempel direkt im Lagebild-Card-Header - const lagebildTs = document.getElementById('lagebild-timestamp'); - if (lagebildTs) { - lagebildTs.textContent = updated - ? `Stand: ${updated.toLocaleDateString('de-DE', { day: '2-digit', month: '2-digit', year: 'numeric', timeZone: TIMEZONE })} ${updated.toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit', timeZone: TIMEZONE })} Uhr` - : ''; - } - - document.getElementById('meta-refresh-mode').textContent = incident.refresh_mode === 'auto' - ? `Auto alle ${App._formatInterval(incident.refresh_interval)}` - : 'Manuell'; - - // International-Badge - const intlBadge = document.getElementById('intl-badge'); - if (intlBadge) { - const isIntl = incident.international_sources !== false && incident.international_sources !== 0; - intlBadge.className = 'intl-badge ' + (isIntl ? 'intl-yes' : 'intl-no'); - intlBadge.textContent = isIntl ? 'International' : 'Nur DE'; - } - - // Faktencheck - const fcFilters = document.getElementById('fc-filters'); - const factcheckList = document.getElementById('factcheck-list'); - if (factchecks.length > 0) { - fcFilters.innerHTML = UI.renderFactCheckFilters(factchecks); - factcheckList.innerHTML = factchecks.map(fc => UI.renderFactCheck(fc)).join(''); - } else { - fcFilters.innerHTML = ''; - factcheckList.innerHTML = '
Noch keine Fakten geprüft
'; - } - - // Quellenübersicht - const sourceOverview = document.getElementById('source-overview-content'); - if (sourceOverview) { - sourceOverview.innerHTML = UI.renderSourceOverview(articles); - // Kachel an Inhalt anpassen - if (typeof LayoutManager !== 'undefined' && LayoutManager._grid) { - if (sourceOverview.style.display !== 'none') { - // Offen → an Inhalt anpassen - requestAnimationFrame(() => requestAnimationFrame(() => { - LayoutManager.resizeTileToContent('quellen'); - })); - } else { - // Geschlossen → einheitliche Default-Höhe - const defaults = LayoutManager.DEFAULT_LAYOUT.find(d => d.id === 'quellen'); - if (defaults) { - const node = LayoutManager._grid.engine.nodes.find( - n => n.el && n.el.getAttribute('gs-id') === 'quellen' - ); - if (node) LayoutManager._grid.update(node.el, { h: defaults.h }); - } - } - } - } - - // Timeline - Artikel + Snapshots zwischenspeichern und rendern - this._currentArticles = articles; - this._currentSnapshots = snapshots || []; - this._currentIncidentType = incident.type; - this._timelineFilter = 'all'; - this._timelineRange = 'all'; - this._activePointIndex = null; - document.getElementById('timeline-search').value = ''; - document.querySelectorAll('.ht-filter-btn').forEach(btn => { - const isActive = btn.dataset.filter === 'all'; - btn.classList.toggle('active', isActive); - btn.setAttribute('aria-pressed', String(isActive)); - }); - document.querySelectorAll('.ht-range-btn').forEach(btn => { - const isActive = btn.dataset.range === 'all'; - btn.classList.toggle('active', isActive); - btn.setAttribute('aria-pressed', String(isActive)); - }); - this.rerenderTimeline(); - this._resizeTimelineTile(); - - // Karte rendern - UI.renderMap(locations || []); - }, - - _collectEntries(filterType, searchTerm, range) { - const type = this._currentIncidentType; - const getArticleDate = (a) => (type === 'research' && a.published_at) ? a.published_at : a.collected_at; - - let entries = []; - - if (filterType === 'all' || filterType === 'articles') { - let articles = this._currentArticles || []; - if (searchTerm) { - articles = articles.filter(a => { - const text = `${a.headline || ''} ${a.headline_de || ''} ${a.source || ''} ${a.content_de || ''} ${a.content_original || ''}`.toLowerCase(); - return text.includes(searchTerm); - }); - } - articles.forEach(a => entries.push({ kind: 'article', data: a, timestamp: getArticleDate(a) || '' })); - } - - if (filterType === 'all' || filterType === 'snapshots') { - let snapshots = this._currentSnapshots || []; - if (searchTerm) { - snapshots = snapshots.filter(s => (s.summary || '').toLowerCase().includes(searchTerm)); - } - snapshots.forEach(s => entries.push({ kind: 'snapshot', data: s, timestamp: s.created_at || '' })); - } - - if (range && range !== 'all') { - const now = Date.now(); - const cutoff = range === '24h' ? now - 24 * 60 * 60 * 1000 : now - 7 * 24 * 60 * 60 * 1000; - entries = entries.filter(e => new Date(e.timestamp || 0).getTime() >= cutoff); - } - - return entries; - }, - - _updateTimelineCount(entries) { - const articleCount = entries.filter(e => e.kind === 'article').length; - const snapshotCount = entries.filter(e => e.kind === 'snapshot').length; - const countEl = document.getElementById('article-count'); - if (articleCount > 0 && snapshotCount > 0) { - countEl.innerHTML = ` ${articleCount} Meldung${articleCount !== 1 ? 'en' : ''} + ${snapshotCount} Lagebericht${snapshotCount !== 1 ? 'e' : ''}`; - } else if (articleCount > 0) { - countEl.innerHTML = ` ${articleCount} Meldung${articleCount !== 1 ? 'en' : ''}`; - } else if (snapshotCount > 0) { - countEl.innerHTML = ` ${snapshotCount} Lagebericht${snapshotCount !== 1 ? 'e' : ''}`; - } else { - countEl.textContent = '0 Meldungen'; - } - }, - - debouncedRerenderTimeline() { - clearTimeout(this._timelineSearchTimer); - this._timelineSearchTimer = setTimeout(() => this.rerenderTimeline(), 250); - }, - - rerenderTimeline() { - const container = document.getElementById('timeline'); - const searchTerm = (document.getElementById('timeline-search').value || '').toLowerCase(); - const filterType = this._timelineFilter; - const range = this._timelineRange; - - let entries = this._collectEntries(filterType, searchTerm, range); - this._updateTimelineCount(entries); - - if (entries.length === 0) { - this._activePointIndex = null; - container.innerHTML = (searchTerm || range !== 'all') - ? '
Keine Einträge im gewählten Zeitraum.
' - : '
Noch keine Meldungen. Starte eine Recherche mit "Aktualisieren".
'; - return; - } - - entries.sort((a, b) => new Date(a.timestamp || 0) - new Date(b.timestamp || 0)); - - const granularity = this._calcGranularity(entries, range); - let buckets = this._buildBuckets(entries, granularity); - buckets = this._mergeCloseBuckets(buckets); - - // Aktiven Index validieren - if (this._activePointIndex !== null && this._activePointIndex >= buckets.length) { - this._activePointIndex = null; - } - - // Achsen-Bereich - const rangeStart = buckets[0].timestamp; - const rangeEnd = buckets[buckets.length - 1].timestamp; - const maxCount = Math.max(...buckets.map(b => b.entries.length)); - - // Stunden- vs. Tages-Granularität - const isHourly = granularity === 'hour'; - const axisLabels = this._buildAxisLabels(buckets, granularity, true); - - // HTML aufbauen - let html = `
`; - - // Datums-Marker (immer anzeigen, ausgedünnt) - const dayMarkers = this._thinLabels(this._buildDayMarkers(buckets, rangeStart, rangeEnd), 10); - html += '
'; - dayMarkers.forEach(m => { - html += `
`; - html += `
${UI.escape(m.text)}
`; - html += `
`; - html += `
`; - }); - html += '
'; - - // Punkte - html += '
'; - buckets.forEach((bucket, idx) => { - const pos = this._bucketPositionPercent(bucket, rangeStart, rangeEnd, buckets.length); - const size = this._calcPointSize(bucket.entries.length, maxCount); - const hasSnapshots = bucket.entries.some(e => e.kind === 'snapshot'); - const hasArticles = bucket.entries.some(e => e.kind === 'article'); - - let pointClass = 'ht-point'; - if (filterType === 'snapshots') { - pointClass += ' ht-snapshot-point'; - } else if (hasSnapshots) { - pointClass += ' ht-mixed-point'; - } - if (this._activePointIndex === idx) pointClass += ' active'; - - const tooltip = `${bucket.label}: ${bucket.entries.length} Eintr${bucket.entries.length === 1 ? 'ag' : 'äge'}`; - - html += `
`; - html += `
${UI.escape(tooltip)}
`; - html += `
`; - }); - html += '
'; - - // Achsenlinie - html += '
'; - - // Achsen-Labels (ausgedünnt um Überlappung zu vermeiden) - const thinned = this._thinLabels(axisLabels); - html += '
'; - thinned.forEach(lbl => { - html += `
${UI.escape(lbl.text)}
`; - }); - html += '
'; - html += '
'; - - // Detail-Panel (wenn ein Punkt aktiv ist) - if (this._activePointIndex !== null && this._activePointIndex < buckets.length) { - html += this._renderDetailPanel(buckets[this._activePointIndex]); - } - - container.innerHTML = html; - }, - - _calcGranularity(entries, range) { - if (entries.length < 2) return 'day'; - const timestamps = entries.map(e => new Date(e.timestamp || 0).getTime()).filter(t => t > 0); - if (timestamps.length < 2) return 'day'; - const span = Math.max(...timestamps) - Math.min(...timestamps); - if (range === '24h' || span <= 48 * 60 * 60 * 1000) return 'hour'; - return 'day'; - }, - - _buildBuckets(entries, granularity) { - const bucketMap = {}; - entries.forEach(e => { - const d = new Date(e.timestamp || 0); - const b = _tz(d); - let key, label, ts; - if (granularity === 'hour') { - key = `${b.year}-${b.month + 1}-${b.date}-${b.hours}`; - label = d.toLocaleDateString('de-DE', { day: '2-digit', month: 'short', timeZone: TIMEZONE }) + ', ' + b.hours.toString().padStart(2, '0') + ':00'; - ts = new Date(b.year, b.month, b.date, b.hours).getTime(); - } else { - key = `${b.year}-${b.month + 1}-${b.date}`; - label = d.toLocaleDateString('de-DE', { weekday: 'short', day: '2-digit', month: 'short', timeZone: TIMEZONE }); - ts = new Date(b.year, b.month, b.date, 12).getTime(); - } - if (!bucketMap[key]) { - bucketMap[key] = { key, label, timestamp: ts, entries: [] }; - } - bucketMap[key].entries.push(e); - }); - return Object.values(bucketMap).sort((a, b) => a.timestamp - b.timestamp); - }, - - _mergeCloseBuckets(buckets) { - if (buckets.length < 2) return buckets; - const rangeStart = buckets[0].timestamp; - const rangeEnd = buckets[buckets.length - 1].timestamp; - if (rangeEnd <= rangeStart) return buckets; - - const container = document.getElementById('timeline'); - const axisWidth = (container ? container.offsetWidth : 800) * 0.92; - const maxCount = Math.max(...buckets.map(b => b.entries.length)); - const result = [buckets[0]]; - - for (let i = 1; i < buckets.length; i++) { - const prev = result[result.length - 1]; - const curr = buckets[i]; - - const distPx = ((curr.timestamp - prev.timestamp) / (rangeEnd - rangeStart)) * axisWidth; - const prevSize = Math.min(32, this._calcPointSize(prev.entries.length, maxCount)); - const currSize = Math.min(32, this._calcPointSize(curr.entries.length, maxCount)); - const minDistPx = (prevSize + currSize) / 2 + 6; - - if (distPx < minDistPx) { - prev.entries = prev.entries.concat(curr.entries); - } else { - result.push(curr); - } - } - return result; - }, - - _bucketPositionPercent(bucket, rangeStart, rangeEnd, totalBuckets) { - if (totalBuckets === 1) return 50; - if (rangeEnd === rangeStart) return 50; - return ((bucket.timestamp - rangeStart) / (rangeEnd - rangeStart)) * 100; - }, - - _calcPointSize(count, maxCount) { - if (maxCount <= 1) return 16; - const minSize = 12; - const maxSize = 32; - const logScale = Math.log(count + 1) / Math.log(maxCount + 1); - return Math.round(minSize + logScale * (maxSize - minSize)); - }, - - _buildAxisLabels(buckets, granularity, timeOnly) { - if (buckets.length === 0) return []; - const maxLabels = 8; - const labels = []; - const rangeStart = buckets[0].timestamp; - const rangeEnd = buckets[buckets.length - 1].timestamp; - - const getLabelText = (b) => { - if (timeOnly) { - // Bei Tages-Granularität: Uhrzeit des ersten Eintrags nehmen - const ts = (granularity === 'day' && b.entries && b.entries.length > 0) - ? new Date(b.entries[0].timestamp || b.timestamp) - : new Date(b.timestamp); - const tp = _tz(ts); - return tp.hours.toString().padStart(2, '0') + ':' + tp.minutes.toString().padStart(2, '0'); - } - return b.label; - }; - - if (buckets.length <= maxLabels) { - buckets.forEach(b => { - labels.push({ text: getLabelText(b), pos: this._bucketPositionPercent(b, rangeStart, rangeEnd, buckets.length) }); - }); - } else { - const step = (buckets.length - 1) / (maxLabels - 1); - for (let i = 0; i < maxLabels; i++) { - const idx = Math.round(i * step); - const b = buckets[idx]; - labels.push({ text: getLabelText(b), pos: this._bucketPositionPercent(b, rangeStart, rangeEnd, buckets.length) }); - } - } - return labels; - }, - - _thinLabels(labels, minGapPercent) { - if (!labels || labels.length <= 1) return labels; - const gap = minGapPercent || 8; - const result = [labels[0]]; - for (let i = 1; i < labels.length; i++) { - if (labels[i].pos - result[result.length - 1].pos >= gap) { - result.push(labels[i]); - } - } - return result; - }, - - _buildDayMarkers(buckets, rangeStart, rangeEnd) { - const seen = {}; - const markers = []; - buckets.forEach(b => { - const d = new Date(b.timestamp); - const bp = _tz(d); - const dayKey = `${bp.year}-${bp.month}-${bp.date}`; - if (!seen[dayKey]) { - seen[dayKey] = true; - const np = _tz(new Date()); - const todayKey = `${np.year}-${np.month}-${np.date}`; - const yp = _tz(new Date(Date.now() - 86400000)); - const yesterdayKey = `${yp.year}-${yp.month}-${yp.date}`; - let label; - const dateStr = d.toLocaleDateString('de-DE', { day: '2-digit', month: 'short', timeZone: TIMEZONE }); - if (dayKey === todayKey) { - label = 'Heute, ' + dateStr; - } else if (dayKey === yesterdayKey) { - label = 'Gestern, ' + dateStr; - } else { - label = d.toLocaleDateString('de-DE', { weekday: 'short', day: '2-digit', month: 'short', timeZone: TIMEZONE }); - } - const pos = this._bucketPositionPercent(b, rangeStart, rangeEnd, buckets.length); - markers.push({ text: label, pos }); - } - }); - return markers; - }, - - _renderDetailPanel(bucket) { - const type = this._currentIncidentType; - const sorted = [...bucket.entries].sort((a, b) => { - if (a.kind === 'snapshot' && b.kind !== 'snapshot') return -1; - if (a.kind !== 'snapshot' && b.kind === 'snapshot') return 1; - return new Date(b.timestamp || 0) - new Date(a.timestamp || 0); - }); - - let entriesHtml = ''; - sorted.forEach(e => { - if (e.kind === 'snapshot') { - entriesHtml += this._renderSnapshotEntry(e.data); - } else { - entriesHtml += this._renderArticleEntry(e.data, type, 0); - } - }); - - return `
-
- ${UI.escape(bucket.label)} (${bucket.entries.length} Eintr${bucket.entries.length === 1 ? 'ag' : 'äge'}) - -
-
${entriesHtml}
-
`; - }, - - setTimelineFilter(filter) { - this._timelineFilter = filter; - this._activePointIndex = null; - document.querySelectorAll('.ht-filter-btn').forEach(btn => { - const isActive = btn.dataset.filter === filter; - btn.classList.toggle('active', isActive); - btn.setAttribute('aria-pressed', String(isActive)); - }); - this.rerenderTimeline(); - }, - - setTimelineRange(range) { - this._timelineRange = range; - this._activePointIndex = null; - document.querySelectorAll('.ht-range-btn').forEach(btn => { - const isActive = btn.dataset.range === range; - btn.classList.toggle('active', isActive); - btn.setAttribute('aria-pressed', String(isActive)); - }); - this.rerenderTimeline(); - }, - - openTimelineDetail(bucketIndex) { - if (this._activePointIndex === bucketIndex) { - this._activePointIndex = null; - } else { - this._activePointIndex = bucketIndex; - } - this.rerenderTimeline(); - this._resizeTimelineTile(); - }, - - closeTimelineDetail() { - this._activePointIndex = null; - this.rerenderTimeline(); - this._resizeTimelineTile(); - }, - - _resizeTimelineTile() { - if (typeof LayoutManager === 'undefined' || !LayoutManager._grid) return; - requestAnimationFrame(() => { requestAnimationFrame(() => { - // Prüfen ob Detail-Panel oder expandierter Eintrag offen ist - const hasDetail = document.querySelector('.ht-detail-panel') !== null; - const hasExpanded = document.querySelector('.timeline-card .vt-entry.expanded') !== null; - - if (hasDetail || hasExpanded) { - LayoutManager.resizeTileToContent('timeline'); - } else { - // Zurück auf Default-Höhe - const defaults = LayoutManager.DEFAULT_LAYOUT.find(d => d.id === 'timeline'); - if (defaults) { - const node = LayoutManager._grid.engine.nodes.find( - n => n.el && n.el.getAttribute('gs-id') === 'timeline' - ); - if (node) { - LayoutManager._grid.update(node.el, { h: defaults.h }); - LayoutManager._debouncedSave(); - } - } - } - // Scroll in Sicht - const card = document.querySelector('.timeline-card'); - const main = document.querySelector('.main-content'); - if (!card || !main) return; - const cardBottom = card.getBoundingClientRect().bottom; - const mainBottom = main.getBoundingClientRect().bottom; - if (cardBottom > mainBottom) { - main.scrollBy({ top: cardBottom - mainBottom + 16, behavior: document.documentElement.dataset.a11yMotion ? 'instant' : 'smooth' }); - } - }); }); - }, - - _buildFullVerticalTimeline(filterType, searchTerm) { - let entries = this._collectEntries(filterType, searchTerm); - if (entries.length === 0) { - return '
Keine Einträge.
'; - } - - entries.sort((a, b) => new Date(b.timestamp || 0) - new Date(a.timestamp || 0)); - const granularity = this._calcGranularity(entries); - const groups = this._groupByTimePeriod(entries, granularity); - - let html = '
'; - groups.forEach(g => { - html += `
`; - html += `
${UI.escape(g.label)}
`; - html += this._renderTimeGroupEntries(g.entries, this._currentIncidentType); - html += `
`; - }); - html += '
'; - return html; - }, - - /** - * Einträge nach Zeitperiode gruppieren. - */ - _groupByTimePeriod(entries, granularity) { - const np = _tz(new Date()); - const todayKey = `${np.year}-${np.month}-${np.date}`; - const yp = _tz(new Date(Date.now() - 86400000)); - const yesterdayKey = `${yp.year}-${yp.month}-${yp.date}`; - - const groups = []; - let currentGroup = null; - - entries.forEach(entry => { - const d = entry.timestamp ? new Date(entry.timestamp) : null; - let key, label; - - if (!d || isNaN(d.getTime())) { - key = 'unknown'; - label = 'Unbekannt'; - } else if (granularity === 'hour') { - const ep = _tz(d); - key = `${ep.year}-${ep.month}-${ep.date}-${ep.hours}`; - label = `${ep.hours.toString().padStart(2, '0')}:00 Uhr`; - } else { - const ep = _tz(d); - key = `${ep.year}-${ep.month}-${ep.date}`; - if (key === todayKey) { - label = 'Heute'; - } else if (key === yesterdayKey) { - label = 'Gestern'; - } else { - label = d.toLocaleDateString('de-DE', { weekday: 'short', day: 'numeric', month: 'short', timeZone: TIMEZONE }); - } - } - - if (!currentGroup || currentGroup.key !== key) { - currentGroup = { key, label, entries: [] }; - groups.push(currentGroup); - } - currentGroup.entries.push(entry); - }); - - return groups; - }, - - /** - * Entries einer Zeitgruppe rendern, mit Cluster-Erkennung. - */ - _renderTimeGroupEntries(entries, type) { - // Cluster-Erkennung: ≥4 Artikel pro Minute - const minuteCounts = {}; - entries.forEach(e => { - if (e.kind === 'article') { - const mk = this._getMinuteKey(e.timestamp); - minuteCounts[mk] = (minuteCounts[mk] || 0) + 1; - } - }); - - const minuteRendered = {}; - let html = ''; - - entries.forEach(e => { - if (e.kind === 'snapshot') { - html += this._renderSnapshotEntry(e.data); - } else { - const mk = this._getMinuteKey(e.timestamp); - const isCluster = minuteCounts[mk] >= 4; - const isFirstInCluster = isCluster && !minuteRendered[mk]; - if (isFirstInCluster) minuteRendered[mk] = true; - html += this._renderArticleEntry(e.data, type, isFirstInCluster ? minuteCounts[mk] : 0); - } - }); - - return html; - }, - - /** - * Artikel-Eintrag für den Zeitstrahl rendern. - */ - _renderArticleEntry(article, type, clusterCount) { - const dateField = (type === 'research' && article.published_at) - ? article.published_at : article.collected_at; - const time = dateField - ? (parseUTC(dateField) || new Date(dateField)).toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit', timeZone: TIMEZONE }) - : '--:--'; - - const headline = article.headline_de || article.headline; - const sourceUrl = article.source_url - ? `${UI.escape(article.source)}` - : UI.escape(article.source); - - const langBadge = article.language && article.language !== 'de' - ? `${article.language.toUpperCase()}` : ''; - - const clusterBadge = clusterCount > 0 - ? `${clusterCount}` : ''; - - const content = article.content_de || article.content_original || ''; - const hasContent = content.length > 0; - - let detailHtml = ''; - if (hasContent) { - const truncated = content.length > 400 ? content.substring(0, 400) + '...' : content; - detailHtml = `
-
${UI.escape(truncated)}
- ${article.source_url ? `Artikel öffnen →` : ''} -
`; - } - - return `
-
- ${time} - ${sourceUrl} - ${langBadge}${clusterBadge} -
-
${UI.escape(headline)}
- ${detailHtml} -
`; - }, - - /** - * Snapshot/Lagebericht-Eintrag für den Zeitstrahl rendern. - */ - _renderSnapshotEntry(snapshot) { - const time = snapshot.created_at - ? (parseUTC(snapshot.created_at) || new Date(snapshot.created_at)).toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit', timeZone: TIMEZONE }) - : '--:--'; - - const stats = []; - if (snapshot.article_count) stats.push(`${snapshot.article_count} Artikel`); - if (snapshot.fact_check_count) stats.push(`${snapshot.fact_check_count} Fakten`); - const statsText = stats.join(', '); - - // Vorschau: erste 200 Zeichen der Zusammenfassung - const summaryText = snapshot.summary || ''; - const preview = summaryText.length > 200 ? summaryText.substring(0, 200) + '...' : summaryText; - - // Vollständige Zusammenfassung via UI.renderSummary - const fullSummary = UI.renderSummary(snapshot.summary, snapshot.sources_json, this._currentIncidentType); - - return ``; - }, - - /** - * Timeline-Eintrag auf-/zuklappen (mutual-exclusive pro Zeitgruppe). - */ - toggleTimelineEntry(el) { - const container = el.closest('.ht-detail-content') || el.closest('.vt-time-group'); - if (container) { - container.querySelectorAll('.vt-entry.expanded').forEach(item => { - if (item !== el) item.classList.remove('expanded'); - }); - } - el.classList.toggle('expanded'); - if (el.classList.contains('expanded')) { - requestAnimationFrame(() => { - var scrollParent = el.closest('.ht-detail-content'); - if (scrollParent && el.classList.contains('vt-snapshot')) { - scrollParent.scrollTo({ top: 0, behavior: document.documentElement.dataset.a11yMotion ? 'instant' : 'smooth' }); - } else { - el.scrollIntoView({ behavior: document.documentElement.dataset.a11yMotion ? 'instant' : 'smooth', block: 'nearest' }); - } - }); - } - // Timeline-Kachel an Inhalt anpassen - this._resizeTimelineTile(); - }, - - /** - * Minutenschlüssel für Cluster-Erkennung. - */ - _getMinuteKey(timestamp) { - if (!timestamp) return 'none'; - const d = new Date(timestamp); - const p = _tz(d); - return `${p.year}-${p.month}-${p.date}-${p.hours}-${p.minutes}`; - }, - - // === Event Handlers === - - _getFormData() { - const value = parseInt(document.getElementById('inc-refresh-value').value) || 15; - const unit = parseInt(document.getElementById('inc-refresh-unit').value) || 1; - const interval = Math.max(10, Math.min(10080, value * unit)); - return { - title: document.getElementById('inc-title').value.trim(), - description: document.getElementById('inc-description').value.trim() || null, - type: document.getElementById('inc-type').value, - refresh_mode: document.getElementById('inc-refresh-mode').value, - refresh_interval: interval, - retention_days: parseInt(document.getElementById('inc-retention').value) || 0, - international_sources: document.getElementById('inc-international').checked, - visibility: document.getElementById('inc-visibility').checked ? 'public' : 'private', - }; - }, - - _clearFormErrors(formEl) { - formEl.querySelectorAll('.form-error').forEach(el => el.remove()); - formEl.querySelectorAll('[aria-invalid]').forEach(el => { - el.removeAttribute('aria-invalid'); - el.removeAttribute('aria-describedby'); - }); - }, - - _showFieldError(field, message) { - field.setAttribute('aria-invalid', 'true'); - const errorId = field.id + '-error'; - field.setAttribute('aria-describedby', errorId); - const errorEl = document.createElement('div'); - errorEl.className = 'form-error'; - errorEl.id = errorId; - errorEl.setAttribute('role', 'alert'); - errorEl.textContent = message; - field.parentNode.appendChild(errorEl); - }, - - async handleFormSubmit(e) { - e.preventDefault(); - const submitBtn = document.getElementById('modal-new-submit'); - const form = document.getElementById('new-incident-form'); - this._clearFormErrors(form); - - // Validierung - const titleField = document.getElementById('inc-title'); - if (!titleField.value.trim()) { - this._showFieldError(titleField, 'Bitte einen Titel eingeben.'); - titleField.focus(); - return; - } - - submitBtn.disabled = true; - - try { - const data = this._getFormData(); - - if (this._editingIncidentId) { - // Edit-Modus: ID sichern bevor closeModal sie löscht - const editId = this._editingIncidentId; - await API.updateIncident(editId, data); - - // E-Mail-Subscription speichern - await API.updateSubscription(editId, { - notify_email_summary: document.getElementById('inc-notify-summary').checked, - notify_email_new_articles: document.getElementById('inc-notify-new-articles').checked, - notify_email_status_change: document.getElementById('inc-notify-status-change').checked, - }); - - closeModal('modal-new'); - await this.loadIncidents(); - await this.loadIncidentDetail(editId); - UI.showToast('Lage aktualisiert.', 'success'); - } else { - // Create-Modus - const incident = await API.createIncident(data); - - // E-Mail-Subscription speichern - await API.updateSubscription(incident.id, { - notify_email_summary: document.getElementById('inc-notify-summary').checked, - notify_email_new_articles: document.getElementById('inc-notify-new-articles').checked, - notify_email_status_change: document.getElementById('inc-notify-status-change').checked, - }); - - closeModal('modal-new'); - - await this.loadIncidents(); - await this.selectIncident(incident.id); - - // Sofort ersten Refresh starten - this._refreshingIncidents.add(incident.id); - this._updateRefreshButton(true); - UI.showProgress('queued'); - await API.refreshIncident(incident.id); - UI.showToast(`Lage "${incident.title}" angelegt. Recherche gestartet.`, 'success'); - } - } catch (err) { - UI.showToast('Fehler: ' + err.message, 'error'); - } finally { - submitBtn.disabled = false; - this._editingIncidentId = null; - } - }, - - async handleRefresh() { - if (!this.currentIncidentId) return; - if (this._refreshingIncidents.has(this.currentIncidentId)) { - UI.showToast('Recherche läuft bereits...', 'warning'); - return; - } - try { - this._refreshingIncidents.add(this.currentIncidentId); - this._updateRefreshButton(true); - UI.showProgress('queued'); - const result = await API.refreshIncident(this.currentIncidentId); - if (result && result.status === 'skipped') { - this._refreshingIncidents.delete(this.currentIncidentId); - this._updateRefreshButton(false); - UI.hideProgress(); - UI.showToast('Recherche läuft bereits oder ist in der Warteschlange.', 'warning'); - } - } catch (err) { - this._refreshingIncidents.delete(this.currentIncidentId); - this._updateRefreshButton(false); - UI.hideProgress(); - UI.showToast('Fehler: ' + err.message, 'error'); - } - }, - - _geoparsePolling: null, - - async triggerGeoparse() { - if (!this.currentIncidentId) return; - const btn = document.getElementById('geoparse-btn'); - if (btn) { btn.disabled = true; btn.textContent = 'Wird gestartet...'; } - try { - const result = await API.triggerGeoparse(this.currentIncidentId); - if (result.status === 'done') { - UI.showToast(result.message, 'info'); - if (btn) { btn.disabled = false; btn.textContent = 'Orte erkennen'; } - return; - } - UI.showToast(result.message, 'info'); - this._pollGeoparse(this.currentIncidentId); - } catch (err) { - UI.showToast('Geoparsing fehlgeschlagen: ' + err.message, 'error'); - if (btn) { btn.disabled = false; btn.textContent = 'Orte erkennen'; } - } - }, - - _pollGeoparse(incidentId) { - if (this._geoparsePolling) clearInterval(this._geoparsePolling); - const btn = document.getElementById('geoparse-btn'); - this._geoparsePolling = setInterval(async () => { - try { - const st = await API.getGeoparseStatus(incidentId); - if (st.status === 'running') { - if (btn) btn.textContent = `${st.processed}/${st.total} Artikel...`; - } else { - clearInterval(this._geoparsePolling); - this._geoparsePolling = null; - if (btn) { btn.disabled = false; btn.textContent = 'Orte erkennen'; } - if (st.status === 'done' && st.locations > 0) { - UI.showToast(`${st.locations} Orte aus ${st.processed} Artikeln erkannt`, 'success'); - const locations = await API.getLocations(incidentId).catch(() => []); - UI.renderMap(locations); - } else if (st.status === 'done') { - UI.showToast('Keine neuen Orte gefunden', 'info'); - } else if (st.status === 'error') { - UI.showToast('Geoparsing fehlgeschlagen: ' + (st.error || ''), 'error'); - } - } - } catch { - clearInterval(this._geoparsePolling); - this._geoparsePolling = null; - if (btn) { btn.disabled = false; btn.textContent = 'Orte erkennen'; } - } - }, 3000); - }, - - _formatInterval(minutes) { - if (minutes >= 10080 && minutes % 10080 === 0) { - const w = minutes / 10080; - return w === 1 ? '1 Woche' : `${w} Wochen`; - } - if (minutes >= 1440 && minutes % 1440 === 0) { - const d = minutes / 1440; - return d === 1 ? '1 Tag' : `${d} Tage`; - } - if (minutes >= 60 && minutes % 60 === 0) { - const h = minutes / 60; - return h === 1 ? '1 Stunde' : `${h} Stunden`; - } - return `${minutes} Min.`; - }, - - _setIntervalFields(minutes) { - let value, unit; - if (minutes >= 10080 && minutes % 10080 === 0) { - value = minutes / 10080; unit = '10080'; - } else if (minutes >= 1440 && minutes % 1440 === 0) { - value = minutes / 1440; unit = '1440'; - } else if (minutes >= 60 && minutes % 60 === 0) { - value = minutes / 60; unit = '60'; - } else { - value = minutes; unit = '1'; - } - const input = document.getElementById('inc-refresh-value'); - input.value = value; - input.min = unit === '1' ? 10 : 1; - document.getElementById('inc-refresh-unit').value = unit; - }, - - _refreshHistoryOpen: false, - - toggleRefreshHistory() { - if (this._refreshHistoryOpen) { - this.closeRefreshHistory(); - } else { - this._openRefreshHistory(); - } - }, - - async _openRefreshHistory() { - if (!this.currentIncidentId) return; - const popover = document.getElementById('refresh-history-popover'); - if (!popover) return; - - this._refreshHistoryOpen = true; - popover.style.display = 'flex'; - - // Lade Refresh-Log - const list = document.getElementById('refresh-history-list'); - list.innerHTML = '
Lade...
'; - - try { - const logs = await API.getRefreshLog(this.currentIncidentId, 20); - this._renderRefreshHistory(logs); - } catch (e) { - list.innerHTML = '
Fehler beim Laden
'; - } - - // Outside-Click Listener - setTimeout(() => { - const handler = (e) => { - if (!popover.contains(e.target) && !e.target.closest('.meta-updated-link')) { - this.closeRefreshHistory(); - document.removeEventListener('click', handler); - } - }; - document.addEventListener('click', handler); - popover._outsideHandler = handler; - }, 0); - }, - - closeRefreshHistory() { - this._refreshHistoryOpen = false; - const popover = document.getElementById('refresh-history-popover'); - if (popover) { - popover.style.display = 'none'; - if (popover._outsideHandler) { - document.removeEventListener('click', popover._outsideHandler); - delete popover._outsideHandler; - } - } - }, - - _renderRefreshHistory(logs) { - const list = document.getElementById('refresh-history-list'); - if (!list) return; - - if (!logs || logs.length === 0) { - list.innerHTML = '
Noch keine Refreshes durchgeführt
'; - return; - } - - list.innerHTML = logs.map(log => { - const started = parseUTC(log.started_at) || new Date(log.started_at); - const timeStr = started.toLocaleDateString('de-DE', { day: '2-digit', month: '2-digit', timeZone: TIMEZONE }) + ' ' + - started.toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit', timeZone: TIMEZONE }); - - let detail = ''; - if (log.status === 'completed') { - detail = `${log.articles_found} Artikel`; - if (log.duration_seconds != null) { - detail += ` in ${this._formatDuration(log.duration_seconds)}`; - } - } else if (log.status === 'running') { - detail = 'Läuft...'; - } else if (log.status === 'error') { - detail = ''; - } - - const retryInfo = log.retry_count > 0 ? ` (Versuch ${log.retry_count + 1})` : ''; - const errorHtml = log.error_message - ? `
${log.error_message}
` - : ''; - - return `
-
-
-
${timeStr}${retryInfo}
- ${detail ? `
${detail}
` : ''} - ${errorHtml} -
- ${log.trigger_type === 'auto' ? 'Auto' : 'Manuell'} -
`; - }).join(''); - }, - - _formatDuration(seconds) { - if (seconds == null) return ''; - if (seconds < 60) return `${Math.round(seconds)}s`; - const m = Math.floor(seconds / 60); - const s = Math.round(seconds % 60); - return s > 0 ? `${m}m ${s}s` : `${m}m`; - }, - - _timeAgo(date) { - if (!date) return ''; - const now = new Date(); - const diff = Math.floor((now - date) / 1000); - if (diff < 60) return 'gerade eben'; - if (diff < 3600) return `vor ${Math.floor(diff / 60)}m`; - if (diff < 86400) return `vor ${Math.floor(diff / 3600)}h`; - return `vor ${Math.floor(diff / 86400)}d`; - }, - - _updateRefreshButton(disabled) { - const btn = document.getElementById('refresh-btn'); - if (!btn) return; - btn.disabled = disabled; - btn.textContent = disabled ? 'Läuft...' : 'Aktualisieren'; - }, - - async handleDelete() { - if (!this.currentIncidentId) return; - if (!await confirmDialog('Lage wirklich löschen? Alle gesammelten Daten gehen verloren.')) return; - - try { - await API.deleteIncident(this.currentIncidentId); - this.currentIncidentId = null; - if (typeof LayoutManager !== 'undefined') LayoutManager.destroy(); - document.getElementById('incident-view').style.display = 'none'; - document.getElementById('empty-state').style.display = 'flex'; - await this.loadIncidents(); - UI.showToast('Lage gelöscht.', 'success'); - } catch (err) { - UI.showToast('Fehler: ' + err.message, 'error'); - } - }, - - async handleEdit() { - if (!this.currentIncidentId) return; - const incident = this.incidents.find(i => i.id === this.currentIncidentId); - if (!incident) return; - - this._editingIncidentId = this.currentIncidentId; - - // Formular mit aktuellen Werten füllen - document.getElementById('inc-title').value = incident.title; - document.getElementById('inc-description').value = incident.description || ''; - document.getElementById('inc-type').value = incident.type || 'adhoc'; - document.getElementById('inc-refresh-mode').value = incident.refresh_mode; - App._setIntervalFields(incident.refresh_interval); - document.getElementById('inc-retention').value = incident.retention_days; - document.getElementById('inc-international').checked = incident.international_sources !== false && incident.international_sources !== 0; - document.getElementById('inc-visibility').checked = incident.visibility !== 'private'; - updateVisibilityHint(); - updateSourcesHint(); - toggleTypeDefaults(); - toggleRefreshInterval(); - - // Modal-Titel und Submit ändern - document.getElementById('modal-new-title').textContent = 'Lage bearbeiten'; - document.getElementById('modal-new-submit').textContent = 'Speichern'; - - // E-Mail-Subscription laden - try { - const sub = await API.getSubscription(this.currentIncidentId); - document.getElementById('inc-notify-summary').checked = !!sub.notify_email_summary; - document.getElementById('inc-notify-new-articles').checked = !!sub.notify_email_new_articles; - document.getElementById('inc-notify-status-change').checked = !!sub.notify_email_status_change; - } catch (e) { - document.getElementById('inc-notify-summary').checked = false; - document.getElementById('inc-notify-new-articles').checked = false; - document.getElementById('inc-notify-status-change').checked = false; - } - - openModal('modal-new'); - }, - - async handleArchive() { - if (!this.currentIncidentId) return; - const incident = this.incidents.find(i => i.id === this.currentIncidentId); - if (!incident) return; - - const isArchived = incident.status === 'archived'; - const action = isArchived ? 'wiederherstellen' : 'archivieren'; - - if (!await confirmDialog(`Lage wirklich ${action}?`)) return; - - try { - const newStatus = isArchived ? 'active' : 'archived'; - await API.updateIncident(this.currentIncidentId, { status: newStatus }); - await this.loadIncidents(); - await this.loadIncidentDetail(this.currentIncidentId); - this._updateArchiveButton(newStatus); - UI.showToast(isArchived ? 'Lage wiederhergestellt.' : 'Lage archiviert.', 'success'); - } catch (err) { - UI.showToast('Fehler: ' + err.message, 'error'); - } - }, - - _updateSidebarDot(incidentId, mode) { - const dot = document.getElementById(`dot-${incidentId}`); - if (!dot) return; - const incident = this.incidents.find(i => i.id === incidentId); - const baseClass = incident ? (incident.status === 'active' ? 'active' : 'archived') : 'active'; - - if (mode === 'error') { - dot.className = `incident-dot refresh-error`; - setTimeout(() => { - dot.className = `incident-dot ${baseClass}`; - }, 3000); - } else if (this._refreshingIncidents.has(incidentId)) { - dot.className = `incident-dot refreshing`; - } else { - dot.className = `incident-dot ${baseClass}`; - } - }, - - _updateArchiveButton(status) { - const btn = document.getElementById('archive-incident-btn'); - if (!btn) return; - btn.textContent = status === 'archived' ? 'Wiederherstellen' : 'Archivieren'; - }, - - // === WebSocket Handlers === - - handleStatusUpdate(msg) { - const status = msg.data.status; - if (status === 'retrying') { - // Retry-Status → Fehleranzeige mit Retry-Info - if (msg.incident_id === this.currentIncidentId) { - UI.showProgressError('', true, msg.data.delay || 120); - } - return; - } - if (status !== 'idle') { - this._refreshingIncidents.add(msg.incident_id); - } - this._updateSidebarDot(msg.incident_id); - if (msg.incident_id === this.currentIncidentId) { - UI.showProgress(status, msg.data); - this._updateRefreshButton(status !== 'idle'); - } - }, - - async handleRefreshComplete(msg) { - this._refreshingIncidents.delete(msg.incident_id); - this._updateSidebarDot(msg.incident_id); - - if (msg.incident_id === this.currentIncidentId) { - this._updateRefreshButton(false); - await this.loadIncidentDetail(msg.incident_id); - - // Progress-Bar nicht sofort ausblenden — auf refresh_summary warten - this._pendingComplete = msg.incident_id; - // Fallback: Wenn nach 5s kein refresh_summary kommt → direkt ausblenden - if (this._pendingCompleteTimer) clearTimeout(this._pendingCompleteTimer); - this._pendingCompleteTimer = setTimeout(() => { - if (this._pendingComplete === msg.incident_id) { - this._pendingComplete = null; - UI.hideProgress(); - } - }, 5000); - } - - await this.loadIncidents(); - }, - - - - handleRefreshSummary(msg) { - const d = msg.data; - const title = d.incident_title || 'Lage'; - - // Abschluss-Animation auslösen wenn pending - if (this._pendingComplete === msg.incident_id) { - if (this._pendingCompleteTimer) { - clearTimeout(this._pendingCompleteTimer); - this._pendingCompleteTimer = null; - } - this._pendingComplete = null; - UI.showProgressComplete(d); - setTimeout(() => UI.hideProgress(), 4000); - } - - // Toast-Text zusammenbauen - const parts = []; - if (d.new_articles > 0) { - parts.push(`${d.new_articles} neue Meldung${d.new_articles !== 1 ? 'en' : ''}`); - } - if (d.confirmed_count > 0) { - parts.push(`${d.confirmed_count} bestätigt`); - } - if (d.contradicted_count > 0) { - parts.push(`${d.contradicted_count} widersprochen`); - } - if (d.status_changes && d.status_changes.length > 0) { - parts.push(`${d.status_changes.length} Statusänderung${d.status_changes.length !== 1 ? 'en' : ''}`); - } - - const summaryText = parts.length > 0 - ? parts.join(', ') - : 'Keine neuen Entwicklungen'; - - // 1 Toast statt 5-10 - UI.showToast(`Recherche abgeschlossen: ${summaryText}`, 'success', 6000); - - // Ins NotificationCenter eintragen - NotificationCenter.add({ - incident_id: msg.incident_id, - title: title, - text: `Recherche: ${summaryText}`, - icon: d.contradicted_count > 0 ? 'warning' : 'success', - }); - - // Status-Änderungen als separate Einträge - if (d.status_changes) { - d.status_changes.forEach(sc => { - const oldLabel = this._translateStatus(sc.old_status); - const newLabel = this._translateStatus(sc.new_status); - NotificationCenter.add({ - incident_id: msg.incident_id, - title: title, - text: `${sc.claim}: ${oldLabel} \u2192 ${newLabel}`, - icon: sc.new_status === 'contradicted' || sc.new_status === 'disputed' ? 'error' : 'success', - }); - }); - } - - // Sidebar-Dot blinken - const dot = document.getElementById(`dot-${msg.incident_id}`); - if (dot) { - dot.classList.add('has-notification'); - setTimeout(() => dot.classList.remove('has-notification'), 10000); - } - }, - - _translateStatus(status) { - const map = { - confirmed: 'Bestätigt', - established: 'Gesichert', - unconfirmed: 'Unbestätigt', - contradicted: 'Widersprochen', - disputed: 'Umstritten', - developing: 'In Entwicklung', - unverified: 'Ungeprüft', - }; - return map[status] || status; - }, - - handleRefreshError(msg) { - this._refreshingIncidents.delete(msg.incident_id); - this._updateSidebarDot(msg.incident_id, 'error'); - if (msg.incident_id === this.currentIncidentId) { - this._updateRefreshButton(false); - // Pending-Complete aufräumen - if (this._pendingCompleteTimer) { - clearTimeout(this._pendingCompleteTimer); - this._pendingCompleteTimer = null; - } - this._pendingComplete = null; - UI.showProgressError(msg.data.error, false); - } - UI.showToast(`Recherche-Fehler: ${msg.data.error}`, 'error'); - }, - - handleRefreshCancelled(msg) { - this._refreshingIncidents.delete(msg.incident_id); - this._updateSidebarDot(msg.incident_id); - if (msg.incident_id === this.currentIncidentId) { - this._updateRefreshButton(false); - if (this._pendingCompleteTimer) { - clearTimeout(this._pendingCompleteTimer); - this._pendingCompleteTimer = null; - } - this._pendingComplete = null; - UI.hideProgress(); - } - UI.showToast('Recherche abgebrochen.', 'info'); - }, - - async cancelRefresh() { - if (!this.currentIncidentId) return; - const ok = await confirmDialog('Laufende Recherche abbrechen?'); - if (!ok) return; - - const btn = document.getElementById('progress-cancel-btn'); - if (btn) { - btn.textContent = 'Wird abgebrochen...'; - btn.disabled = true; - } - - try { - await API.cancelRefresh(this.currentIncidentId); - } catch (err) { - UI.showToast('Abbrechen fehlgeschlagen: ' + err.message, 'error'); - if (btn) { - btn.textContent = 'Abbrechen'; - btn.disabled = false; - } - } - }, - - // === Export === - - toggleExportDropdown(event) { - event.stopPropagation(); - const menu = document.getElementById('export-dropdown-menu'); - if (!menu) return; - const isOpen = menu.classList.toggle('show'); - const btn = menu.previousElementSibling; - if (btn) btn.setAttribute('aria-expanded', String(isOpen)); - }, - - _closeExportDropdown() { - const menu = document.getElementById('export-dropdown-menu'); - if (menu) { - menu.classList.remove('show'); - const btn = menu.previousElementSibling; - if (btn) btn.setAttribute('aria-expanded', 'false'); - } - }, - - async exportIncident(format, scope) { - this._closeExportDropdown(); - if (!this.currentIncidentId) return; - try { - const response = await API.exportIncident(this.currentIncidentId, format, scope); - if (!response.ok) { - const err = await response.json().catch(() => ({})); - throw new Error(err.detail || 'Fehler ' + response.status); - } - const blob = await response.blob(); - const disposition = response.headers.get('Content-Disposition') || ''; - let filename = 'export.' + format; - const match = disposition.match(/filename="?([^"]+)"?/); - if (match) filename = match[1]; - const url = URL.createObjectURL(blob); - const a = document.createElement('a'); - a.href = url; - a.download = filename; - document.body.appendChild(a); - a.click(); - document.body.removeChild(a); - URL.revokeObjectURL(url); - UI.showToast('Export heruntergeladen', 'success'); - } catch (err) { - UI.showToast('Export fehlgeschlagen: ' + err.message, 'error'); - } - }, - - printIncident() { - this._closeExportDropdown(); - window.print(); - }, - - // === Sidebar-Stats === - - async updateSidebarStats() { - try { - const stats = await API.getSourceStats(); - const srcCount = document.getElementById('stat-sources-count'); - const artCount = document.getElementById('stat-articles-count'); - if (srcCount) srcCount.textContent = `${stats.total_sources} Quellen`; - if (artCount) artCount.textContent = `${stats.total_articles} Artikel`; - } catch { - // Fallback: aus Lagen berechnen - const totalArticles = this.incidents.reduce((sum, i) => sum + i.article_count, 0); - const totalSources = this.incidents.reduce((sum, i) => sum + i.source_count, 0); - const srcCount = document.getElementById('stat-sources-count'); - const artCount = document.getElementById('stat-articles-count'); - if (srcCount) srcCount.textContent = `${totalSources} Quellen`; - if (artCount) artCount.textContent = `${totalArticles} Artikel`; - } - }, - - // === Soft-Refresh (F5) === - - async softRefresh() { - try { - await this.loadIncidents(); - if (this.currentIncidentId) { - await this.selectIncident(this.currentIncidentId); - } - UI.showToast('Daten aktualisiert.', 'success', 2000); - } catch (err) { - UI.showToast('Aktualisierung fehlgeschlagen: ' + err.message, 'error'); - } - }, - - // === Feedback === - - openFeedback() { - const form = document.getElementById('feedback-form'); - if (form) form.reset(); - const counter = document.getElementById('fb-char-count'); - if (counter) counter.textContent = '0'; - openModal('modal-feedback'); - }, - - async submitFeedback(e) { - e.preventDefault(); - const form = document.getElementById('feedback-form'); - this._clearFormErrors(form); - - const btn = document.getElementById('fb-submit-btn'); - const category = document.getElementById('fb-category').value; - const msgField = document.getElementById('fb-message'); - const message = msgField.value.trim(); - - if (message.length < 10) { - this._showFieldError(msgField, 'Bitte mindestens 10 Zeichen eingeben.'); - msgField.focus(); - return; - } - - // Dateien pruefen - const fileInput = document.getElementById('fb-files'); - const files = fileInput ? Array.from(fileInput.files) : []; - if (files.length > 3) { - UI.showToast('Maximal 3 Bilder erlaubt.', 'error'); - return; - } - for (const f of files) { - if (f.size > 5 * 1024 * 1024) { - UI.showToast('Datei "' + f.name + '" ist groesser als 5 MB.', 'error'); - return; - } - } - - btn.disabled = true; - btn.textContent = 'Wird gesendet...'; - try { - const formData = new FormData(); - formData.append('category', category); - formData.append('message', message); - for (const f of files) { - formData.append('files', f); - } - await API.sendFeedbackForm(formData); - closeModal('modal-feedback'); - UI.showToast('Feedback gesendet. Vielen Dank!', 'success'); - } catch (err) { - UI.showToast('Fehler: ' + err.message, 'error'); - } finally { - btn.disabled = false; - btn.textContent = 'Absenden'; - } - }, - - // === Sidebar Sektionen ein-/ausklappen === - - toggleSidebarSection(sectionId) { - const list = document.getElementById(sectionId); - if (!list) return; - const chevron = document.getElementById('chevron-' + sectionId); - const isHidden = list.style.display === 'none'; - list.style.display = isHidden ? '' : 'none'; - if (chevron) { - chevron.classList.toggle('open', isHidden); - } - // aria-expanded auf dem Section-Title synchronisieren - const title = chevron ? chevron.closest('.sidebar-section-title') : null; - if (title) title.setAttribute('aria-expanded', String(isHidden)); - }, - - // === Quellenverwaltung === - - async openSourceManagement() { - openModal('modal-sources'); - await this.loadSources(); - }, - - async loadSources() { - try { - const [sources, stats, myExclusions] = await Promise.all([ - API.listSources(), - API.getSourceStats(), - API.getMyExclusions(), - ]); - this._allSources = sources; - this._sourcesOnly = sources.filter(s => s.source_type !== 'excluded'); - this._myExclusions = myExclusions || []; - - this.renderSourceStats(stats); - this.renderSourceList(); - } catch (err) { - UI.showToast('Fehler beim Laden der Quellen: ' + err.message, 'error'); - } - }, - - renderSourceStats(stats) { - const bar = document.getElementById('sources-stats-bar'); - if (!bar) return; - - const rss = stats.by_type.rss_feed || { count: 0, articles: 0 }; - const web = stats.by_type.web_source || { count: 0, articles: 0 }; - const excluded = this._myExclusions.length; - - bar.innerHTML = ` - ${rss.count} RSS-Feeds - ${web.count} Web-Quellen - ${excluded} Ausgeschlossen - ${stats.total_articles} Artikel gesamt - `; - }, - - /** - * Quellen nach Domain gruppiert rendern. - */ - renderSourceList() { - const list = document.getElementById('sources-list'); - if (!list) return; - - // Filter anwenden - const typeFilter = document.getElementById('sources-filter-type')?.value || ''; - const catFilter = document.getElementById('sources-filter-category')?.value || ''; - const search = (document.getElementById('sources-search')?.value || '').toLowerCase(); - - // Alle Quellen nach Domain gruppieren - const groups = new Map(); - const excludedDomains = new Set(); - const excludedNotes = {}; - - // User-Ausschlüsse sammeln - this._myExclusions.forEach(e => { - const domain = (e.domain || '').toLowerCase(); - if (domain) { - excludedDomains.add(domain); - excludedNotes[domain] = e.notes || ''; - } - }); - - // Feeds nach Domain gruppieren - this._sourcesOnly.forEach(s => { - const domain = (s.domain || '').toLowerCase() || `_single_${s.id}`; - if (!groups.has(domain)) groups.set(domain, []); - groups.get(domain).push(s); - }); - - // Ausgeschlossene Domains die keine Feeds haben auch als Gruppe - this._myExclusions.forEach(e => { - const domain = (e.domain || '').toLowerCase(); - if (domain && !groups.has(domain)) { - groups.set(domain, []); - } - }); - - // Filter auf Gruppen anwenden - let filteredGroups = []; - for (const [domain, feeds] of groups) { - const isExcluded = excludedDomains.has(domain); - const isGlobal = feeds.some(f => f.is_global); - - // Typ-Filter - if (typeFilter === 'excluded' && !isExcluded) continue; - if (typeFilter && typeFilter !== 'excluded') { - const hasMatchingType = feeds.some(f => f.source_type === typeFilter); - if (!hasMatchingType) continue; - } - - // Kategorie-Filter - if (catFilter) { - const hasMatchingCat = feeds.some(f => f.category === catFilter); - if (!hasMatchingCat) continue; - } - - // Suche - if (search) { - const groupText = feeds.map(f => - `${f.name} ${f.domain || ''} ${f.url || ''} ${f.notes || ''}` - ).join(' ').toLowerCase() + ' ' + domain; - if (!groupText.includes(search)) continue; - } - - filteredGroups.push({ domain, feeds, isExcluded, isGlobal }); - } - - if (filteredGroups.length === 0) { - list.innerHTML = '
Keine Quellen gefunden
'; - return; - } - - // Sortierung: Aktive zuerst (alphabetisch), dann ausgeschlossene - filteredGroups.sort((a, b) => { - if (a.isExcluded !== b.isExcluded) return a.isExcluded ? 1 : -1; - return a.domain.localeCompare(b.domain); - }); - - list.innerHTML = filteredGroups.map(g => - UI.renderSourceGroup(g.domain, g.feeds, g.isExcluded, excludedNotes[g.domain] || '', g.isGlobal) - ).join(''); - - // Erweiterte Gruppen wiederherstellen - this._expandedGroups.forEach(domain => { - const feedsEl = list.querySelector(`.source-group-feeds[data-domain="${CSS.escape(domain)}"]`); - if (feedsEl) { - feedsEl.classList.add('expanded'); - const header = feedsEl.previousElementSibling; - if (header) header.classList.add('expanded'); - } - }); - }, - - filterSources() { - this.renderSourceList(); - }, - - /** - * Domain-Gruppe auf-/zuklappen. - */ - toggleSourceOverview() { - const content = document.getElementById('source-overview-content'); - const chevron = document.getElementById('source-overview-chevron'); - if (!content) return; - const isHidden = content.style.display === 'none'; - content.style.display = isHidden ? '' : 'none'; - if (chevron) { - chevron.classList.toggle('open', isHidden); - chevron.title = isHidden ? 'Einklappen' : 'Aufklappen'; - } - // aria-expanded auf dem Header-Toggle synchronisieren - const header = chevron ? chevron.closest('[role="button"]') : null; - if (header) header.setAttribute('aria-expanded', String(isHidden)); - // gridstack-Kachel an Inhalt anpassen (doppelter rAF für vollständiges Layout) - if (typeof LayoutManager !== 'undefined' && LayoutManager._grid) { - if (isHidden) { - // Aufgeklappt → Inhalt muss erst layouten - requestAnimationFrame(() => requestAnimationFrame(() => { - LayoutManager.resizeTileToContent('quellen'); - })); - } else { - // Zugeklappt → auf Default-Höhe zurück - const defaults = LayoutManager.DEFAULT_LAYOUT.find(d => d.id === 'quellen'); - if (defaults) { - const node = LayoutManager._grid.engine.nodes.find( - n => n.el && n.el.getAttribute('gs-id') === 'quellen' - ); - if (node) { - LayoutManager._grid.update(node.el, { h: defaults.h }); - LayoutManager._debouncedSave(); - } - } - } - } - }, - - toggleGroup(domain) { - const list = document.getElementById('sources-list'); - if (!list) return; - const feedsEl = list.querySelector(`.source-group-feeds[data-domain="${CSS.escape(domain)}"]`); - if (!feedsEl) return; - - const isExpanded = feedsEl.classList.toggle('expanded'); - const header = feedsEl.previousElementSibling; - if (header) { - header.classList.toggle('expanded', isExpanded); - header.setAttribute('aria-expanded', String(isExpanded)); - } - - if (isExpanded) { - this._expandedGroups.add(domain); - } else { - this._expandedGroups.delete(domain); - } - }, - - /** - * Domain ausschließen (aus dem Inline-Formular). - */ - async blockDomain() { - const input = document.getElementById('block-domain-input'); - const domain = (input?.value || '').trim(); - if (!domain) { - UI.showToast('Domain ist erforderlich.', 'warning'); - return; - } - - const notes = (document.getElementById('block-domain-notes')?.value || '').trim() || null; - - try { - await API.blockDomain(domain, notes); - UI.showToast(`${domain} ausgeschlossen.`, 'success'); - this.showBlockDomainDialog(false); - await this.loadSources(); - this.updateSidebarStats(); - } catch (err) { - UI.showToast('Fehler: ' + err.message, 'error'); - } - }, - - /** - * Faktencheck-Filter umschalten. - */ - toggleFactCheckFilter(status) { - const checkbox = document.querySelector(`.fc-dropdown-item[data-status="${status}"] input`); - if (!checkbox) return; - const isActive = checkbox.checked; - - document.querySelectorAll(`.factcheck-item[data-fc-status="${status}"]`).forEach(el => { - el.style.display = isActive ? '' : 'none'; - }); - }, - - toggleFcDropdown(e) { - e.stopPropagation(); - const btn = e.target.closest('.fc-dropdown-toggle'); - const menu = btn ? btn.nextElementSibling : document.getElementById('fc-dropdown-menu'); - if (!menu) return; - const isOpen = menu.classList.toggle('open'); - if (btn) btn.setAttribute('aria-expanded', String(isOpen)); - if (isOpen) { - const close = (ev) => { - if (!menu.contains(ev.target)) { - menu.classList.remove('open'); - document.removeEventListener('click', close); - } - }; - setTimeout(() => document.addEventListener('click', close), 0); - } - }, - - filterModalTimeline(searchTerm) { - const filterBtn = document.querySelector('.ht-modal-filter-btn.active'); - const filterType = filterBtn ? filterBtn.dataset.filter : 'all'; - const body = document.getElementById('content-viewer-body'); - if (!body) return; - body.innerHTML = this._buildFullVerticalTimeline(filterType, (searchTerm || '').toLowerCase()); - }, - - filterModalTimelineType(filterType, btn) { - document.querySelectorAll('.ht-modal-filter-btn').forEach(b => b.classList.remove('active')); - if (btn) btn.classList.add('active'); - const searchInput = document.querySelector('#content-viewer-header-extra .timeline-filter-input'); - const searchTerm = searchInput ? searchInput.value.toLowerCase() : ''; - const body = document.getElementById('content-viewer-body'); - if (!body) return; - body.innerHTML = this._buildFullVerticalTimeline(filterType, searchTerm); - }, - - /** - * Domain direkt ausschließen (aus der Gruppenliste). - */ - async blockDomainDirect(domain) { - if (!await confirmDialog(`"${domain}" wirklich ausschließen? Artikel dieser Domain werden bei allen deinen Recherchen ignoriert. Dies betrifft nicht andere Nutzer deiner Organisation.`)) return; - - try { - await API.blockDomain(domain); - UI.showToast(`${domain} ausgeschlossen.`, 'success'); - await this.loadSources(); - this.updateSidebarStats(); - } catch (err) { - UI.showToast('Fehler: ' + err.message, 'error'); - } - }, - - /** - * Domain-Ausschluss aufheben. - */ - async unblockDomain(domain) { - try { - await API.unblockDomain(domain); - UI.showToast(`${domain} Ausschluss aufgehoben.`, 'success'); - await this.loadSources(); - this.updateSidebarStats(); - } catch (err) { - UI.showToast('Fehler: ' + err.message, 'error'); - } - }, - - /** - * Alle Quellen einer Domain löschen. - */ - async deleteDomain(domain) { - if (!await confirmDialog(`Alle Quellen von "${domain}" wirklich löschen?`)) return; - - try { - await API.deleteDomain(domain); - UI.showToast(`${domain} gelöscht.`, 'success'); - await this.loadSources(); - this.updateSidebarStats(); - } catch (err) { - UI.showToast('Fehler: ' + err.message, 'error'); - } - }, - - /** - * Einzelnen Feed löschen. - */ - async deleteSingleFeed(sourceId) { - try { - await API.deleteSource(sourceId); - this._allSources = this._allSources.filter(s => s.id !== sourceId); - this._sourcesOnly = this._sourcesOnly.filter(s => s.id !== sourceId); - this.renderSourceList(); - this.updateSidebarStats(); - UI.showToast('Feed gelöscht.', 'success'); - } catch (err) { - UI.showToast('Fehler: ' + err.message, 'error'); - } - }, - - /** - * "Domain ausschließen" Dialog ein-/ausblenden. - */ - showBlockDomainDialog(show) { - const form = document.getElementById('sources-block-form'); - if (!form) return; - - if (show === undefined || show === true) { - form.style.display = 'block'; - document.getElementById('block-domain-input').value = ''; - document.getElementById('block-domain-notes').value = ''; - // Add-Form ausblenden - const addForm = document.getElementById('sources-add-form'); - if (addForm) addForm.style.display = 'none'; - } else { - form.style.display = 'none'; - } - }, - - _discoveredData: null, - - toggleSourceForm(show) { - const form = document.getElementById('sources-add-form'); - if (!form) return; - - if (show === undefined) { - show = form.style.display === 'none'; - } - - form.style.display = show ? 'block' : 'none'; - - if (show) { - this._editingSourceId = null; - this._discoveredData = null; - document.getElementById('src-discover-url').value = ''; - document.getElementById('src-discovery-result').style.display = 'none'; - document.getElementById('src-discover-btn').disabled = false; - document.getElementById('src-discover-btn').textContent = 'Erkennen'; - // Save-Button Text zurücksetzen - const saveBtn = document.querySelector('#src-discovery-result .sources-discovery-actions .btn-primary'); - if (saveBtn) saveBtn.textContent = 'Speichern'; - // Block-Form ausblenden - const blockForm = document.getElementById('sources-block-form'); - if (blockForm) blockForm.style.display = 'none'; - } else { - // Beim Schließen: Bearbeitungsmodus zurücksetzen - this._editingSourceId = null; - const saveBtn = document.querySelector('#src-discovery-result .sources-discovery-actions .btn-primary'); - if (saveBtn) saveBtn.textContent = 'Speichern'; - } - }, - - async discoverSource() { - const urlInput = document.getElementById('src-discover-url'); - const url = urlInput.value.trim(); - if (!url) { - UI.showToast('Bitte URL oder Domain eingeben.', 'warning'); - return; - } - - // Prüfen ob Domain ausgeschlossen ist - const inputDomain = url.replace(/^https?:\/\//, '').replace(/^www\./, '').split('/')[0].toLowerCase(); - const isBlocked = inputDomain && this._myExclusions.some(e => (e.domain || '').toLowerCase() === inputDomain); - - if (isBlocked) { - if (!await confirmDialog(`"${inputDomain}" ist ausgeschlossen. Trotzdem hinzufügen? Der Ausschluss wird dabei aufgehoben.`)) return; - await API.unblockDomain(inputDomain); - } - - const btn = document.getElementById('src-discover-btn'); - btn.disabled = true; - btn.textContent = 'Suche Feeds...'; - - try { - const result = await API.discoverMulti(url); - - if (result.fallback_single) { - this._discoveredData = { - name: result.domain, - domain: result.domain, - category: result.category, - source_type: result.total_found > 0 ? 'rss_feed' : 'web_source', - rss_url: result.sources.length > 0 ? result.sources[0].url : null, - }; - if (result.sources.length > 0) { - this._discoveredData.name = result.sources[0].name; - } - - document.getElementById('src-name').value = this._discoveredData.name || ''; - document.getElementById('src-category').value = this._discoveredData.category || 'sonstige'; - document.getElementById('src-domain').value = this._discoveredData.domain || ''; - document.getElementById('src-notes').value = ''; - - const typeLabel = this._discoveredData.source_type === 'rss_feed' ? 'RSS-Feed' : 'Web-Quelle'; - document.getElementById('src-type-display').value = typeLabel; - - const rssGroup = document.getElementById('src-rss-url-group'); - const rssInput = document.getElementById('src-rss-url'); - if (this._discoveredData.rss_url) { - rssInput.value = this._discoveredData.rss_url; - rssGroup.style.display = 'block'; - } else { - rssInput.value = ''; - rssGroup.style.display = 'none'; - } - - document.getElementById('src-discovery-result').style.display = 'block'; - - if (result.added_count > 0) { - UI.showToast(`${result.domain}: Feed wurde automatisch hinzugefügt.`, 'success'); - this.toggleSourceForm(false); - await this.loadSources(); - } else if (result.total_found === 0) { - UI.showToast('Kein RSS-Feed gefunden. Als Web-Quelle speichern?', 'info'); - } else { - UI.showToast('Feed bereits vorhanden.', 'info'); - } - } else { - document.getElementById('src-discovery-result').style.display = 'none'; - - if (result.added_count > 0) { - UI.showToast(`${result.domain}: ${result.added_count} Feeds hinzugefügt` + - (result.skipped_count > 0 ? ` (${result.skipped_count} bereits vorhanden)` : ''), - 'success'); - } else if (result.skipped_count > 0) { - UI.showToast(`${result.domain}: Alle ${result.skipped_count} Feeds bereits vorhanden.`, 'info'); - } else { - UI.showToast(`${result.domain}: Keine relevanten Feeds gefunden.`, 'info'); - } - - this.toggleSourceForm(false); - await this.loadSources(); - } - } catch (err) { - UI.showToast('Erkennung fehlgeschlagen: ' + err.message, 'error'); - } finally { - btn.disabled = false; - btn.textContent = 'Erkennen'; - } - }, - - editSource(id) { - const source = this._sourcesOnly.find(s => s.id === id); - if (!source) { - UI.showToast('Quelle nicht gefunden.', 'error'); - return; - } - - this._editingSourceId = id; - - // Formular öffnen falls geschlossen (direkt, ohne toggleSourceForm das _editingSourceId zurücksetzt) - const form = document.getElementById('sources-add-form'); - if (form) { - form.style.display = 'block'; - const blockForm = document.getElementById('sources-block-form'); - if (blockForm) blockForm.style.display = 'none'; - } - - // Discovery-URL mit vorhandener URL/Domain befüllen - const discoverUrlInput = document.getElementById('src-discover-url'); - if (discoverUrlInput) { - discoverUrlInput.value = source.url || source.domain || ''; - } - - // Discovery-Ergebnis anzeigen und Felder befüllen - document.getElementById('src-discovery-result').style.display = 'block'; - document.getElementById('src-name').value = source.name || ''; - document.getElementById('src-category').value = source.category || 'sonstige'; - document.getElementById('src-notes').value = source.notes || ''; - document.getElementById('src-domain').value = source.domain || ''; - - const typeLabel = source.source_type === 'rss_feed' ? 'RSS-Feed' : 'Web-Quelle'; - document.getElementById('src-type-display').value = typeLabel; - - const rssGroup = document.getElementById('src-rss-url-group'); - const rssInput = document.getElementById('src-rss-url'); - if (source.url) { - rssInput.value = source.url; - rssGroup.style.display = 'block'; - } else { - rssInput.value = ''; - rssGroup.style.display = 'none'; - } - - // _discoveredData setzen damit saveSource() die richtigen Werte nutzt - this._discoveredData = { - name: source.name, - domain: source.domain, - category: source.category, - source_type: source.source_type, - rss_url: source.url, - }; - - // Submit-Button-Text ändern - const saveBtn = document.querySelector('#src-discovery-result .sources-discovery-actions .btn-primary'); - if (saveBtn) saveBtn.textContent = 'Quelle speichern'; - - // Zum Formular scrollen - if (form) form.scrollIntoView({ behavior: 'smooth', block: 'start' }); - }, - - async saveSource() { - const name = document.getElementById('src-name').value.trim(); - if (!name) { - UI.showToast('Name ist erforderlich. Bitte erst "Erkennen" klicken.', 'warning'); - return; - } - - const discovered = this._discoveredData || {}; - const data = { - name, - source_type: discovered.source_type || 'web_source', - category: document.getElementById('src-category').value, - url: discovered.rss_url || null, - domain: document.getElementById('src-domain').value.trim() || discovered.domain || null, - notes: document.getElementById('src-notes').value.trim() || null, - }; - - if (!data.domain && discovered.domain) { - data.domain = discovered.domain; - } - - try { - if (this._editingSourceId) { - await API.updateSource(this._editingSourceId, data); - UI.showToast('Quelle aktualisiert.', 'success'); - } else { - await API.createSource(data); - UI.showToast('Quelle hinzugefügt.', 'success'); - } - - this.toggleSourceForm(false); - await this.loadSources(); - this.updateSidebarStats(); - } catch (err) { - UI.showToast('Fehler: ' + err.message, 'error'); - } - }, - - logout() { - localStorage.removeItem('osint_token'); - localStorage.removeItem('osint_username'); - this._sessionWarningShown = false; - WS.disconnect(); - window.location.href = '/'; - }, -}; - -// === Barrierefreier Bestätigungsdialog === - -function confirmDialog(message) { - return new Promise((resolve) => { - // Overlay erstellen - const overlay = document.createElement('div'); - overlay.className = 'modal-overlay active'; - overlay.setAttribute('role', 'alertdialog'); - overlay.setAttribute('aria-modal', 'true'); - overlay.setAttribute('aria-labelledby', 'confirm-dialog-msg'); - - const modal = document.createElement('div'); - modal.className = 'modal'; - modal.style.maxWidth = '420px'; - modal.innerHTML = ` -
-
Bestätigung
-
-
-

${message.replace(//g, '>')}

-
-
- - -
- `; - overlay.appendChild(modal); - document.body.appendChild(overlay); - - const previousFocus = document.activeElement; - - const cleanup = (result) => { - releaseFocus(overlay); - overlay.remove(); - if (previousFocus) previousFocus.focus(); - resolve(result); - }; - - modal.querySelector('#confirm-cancel').addEventListener('click', () => cleanup(false)); - modal.querySelector('#confirm-ok').addEventListener('click', () => cleanup(true)); - overlay.addEventListener('click', (e) => { - if (e.target === overlay) cleanup(false); - }); - overlay.addEventListener('keydown', (e) => { - if (e.key === 'Escape') cleanup(false); - }); - - trapFocus(overlay); - }); -} - -// === Globale Hilfsfunktionen === - -// --- Focus-Trap für Modals (WCAG 2.4.3) --- -const FOCUSABLE_SELECTOR = 'a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])'; - -function trapFocus(modalEl) { - const handler = (e) => { - if (e.key !== 'Tab') return; - const focusable = Array.from(modalEl.querySelectorAll(FOCUSABLE_SELECTOR)).filter(el => el.offsetParent !== null); - if (focusable.length === 0) return; - const first = focusable[0]; - const last = focusable[focusable.length - 1]; - if (e.shiftKey && document.activeElement === first) { - e.preventDefault(); - last.focus(); - } else if (!e.shiftKey && document.activeElement === last) { - e.preventDefault(); - first.focus(); - } - }; - modalEl._focusTrapHandler = handler; - modalEl.addEventListener('keydown', handler); - // Fokus auf erstes Element setzen - requestAnimationFrame(() => { - const focusable = Array.from(modalEl.querySelectorAll(FOCUSABLE_SELECTOR)).filter(el => el.offsetParent !== null); - if (focusable.length > 0) focusable[0].focus(); - }); -} - -function releaseFocus(modalEl) { - if (modalEl._focusTrapHandler) { - modalEl.removeEventListener('keydown', modalEl._focusTrapHandler); - delete modalEl._focusTrapHandler; - } -} - -function openModal(id) { - if (id === 'modal-new' && !App._editingIncidentId) { - // Create-Modus: Formular zurücksetzen - document.getElementById('new-incident-form').reset(); - document.getElementById('modal-new-title').textContent = 'Neue Lage anlegen'; - document.getElementById('modal-new-submit').textContent = 'Lage anlegen'; - // E-Mail-Checkboxen zuruecksetzen - document.getElementById('inc-notify-summary').checked = false; - document.getElementById('inc-notify-new-articles').checked = false; - document.getElementById('inc-notify-status-change').checked = false; - toggleTypeDefaults(); - toggleRefreshInterval(); - } - const modal = document.getElementById(id); - modal._previousFocus = document.activeElement; - modal.classList.add('active'); - trapFocus(modal); -} - -function closeModal(id) { - const modal = document.getElementById(id); - releaseFocus(modal); - modal.classList.remove('active'); - if (modal._previousFocus) { - modal._previousFocus.focus(); - delete modal._previousFocus; - } - if (id === 'modal-new') { - App._editingIncidentId = null; - document.getElementById('modal-new-title').textContent = 'Neue Lage anlegen'; - document.getElementById('modal-new-submit').textContent = 'Lage anlegen'; - } -} - -function openContentModal(title, sourceElementId) { - const source = document.getElementById(sourceElementId); - if (!source) return; - - document.getElementById('content-viewer-title').textContent = title; - const body = document.getElementById('content-viewer-body'); - const headerExtra = document.getElementById('content-viewer-header-extra'); - headerExtra.innerHTML = ''; - - if (sourceElementId === 'factcheck-list') { - // Faktencheck: Filter in den Modal-Header, Liste in den Body - const filters = document.getElementById('fc-filters'); - if (filters && filters.innerHTML.trim()) { - headerExtra.innerHTML = `
${filters.innerHTML}
`; - } - body.innerHTML = source.innerHTML; - // Filter im Modal auf Modal-Items umleiten - headerExtra.querySelectorAll('.fc-dropdown-item input[type="checkbox"]').forEach(cb => { - cb.onchange = function() { - const status = this.closest('.fc-dropdown-item').dataset.status; - body.querySelectorAll(`.factcheck-item[data-fc-status="${status}"]`).forEach(el => { - el.style.display = cb.checked ? '' : 'none'; - }); - }; - }); - } else if (sourceElementId === 'source-overview-content') { - // Quellenübersicht: Detailansicht mit Suchleiste - headerExtra.innerHTML = ''; - body.innerHTML = buildDetailedSourceOverview(); - } else if (sourceElementId === 'timeline') { - // Timeline: Vollständige vertikale Timeline im Modal mit Filter + Suche - headerExtra.innerHTML = `
-
- - - -
- -
`; - body.innerHTML = App._buildFullVerticalTimeline('all', ''); - } else { - body.innerHTML = source.innerHTML; - } - - openModal('modal-content-viewer'); -} - -App.filterModalSources = function(query) { - const q = query.toLowerCase().trim(); - const details = document.querySelectorAll('#content-viewer-body details'); - details.forEach(d => { - if (!q) { - d.style.display = ''; - d.removeAttribute('open'); - return; - } - const name = d.querySelector('summary').textContent.toLowerCase(); - // Quellenname oder Artikel-Headlines durchsuchen - const articles = d.querySelectorAll('div > div'); - let articleMatch = false; - articles.forEach(a => { - const text = a.textContent.toLowerCase(); - const hit = text.includes(q); - a.style.display = hit ? '' : 'none'; - if (hit) articleMatch = true; - }); - const match = name.includes(q) || articleMatch; - d.style.display = match ? '' : 'none'; - // Bei Artikeltreffer aufklappen, bei Namens-Match alle Artikel zeigen - if (match && articleMatch && !name.includes(q)) { - d.setAttribute('open', ''); - } else if (name.includes(q)) { - articles.forEach(a => a.style.display = ''); - } - }); -}; - -function buildDetailedSourceOverview() { - const articles = App._currentArticles || []; - if (!articles.length) return '
Keine Artikel vorhanden
'; - - // Nach Quelle gruppieren - const sourceMap = {}; - articles.forEach(a => { - const name = a.source || 'Unbekannt'; - if (!sourceMap[name]) sourceMap[name] = { articles: [], languages: new Set() }; - sourceMap[name].articles.push(a); - sourceMap[name].languages.add((a.language || 'de').toUpperCase()); - }); - - const sources = Object.entries(sourceMap).sort((a, b) => b[1].articles.length - a[1].articles.length); - - // Sprach-Statistik Header - const langCount = {}; - articles.forEach(a => { - const lang = (a.language || 'de').toUpperCase(); - langCount[lang] = (langCount[lang] || 0) + 1; - }); - const langChips = Object.entries(langCount) - .sort((a, b) => b[1] - a[1]) - .map(([lang, count]) => `${lang} ${count}`) - .join(''); - - let html = `
- ${articles.length} Artikel aus ${sources.length} Quellen -
${langChips}
-
`; - - sources.forEach(([name, data]) => { - const langs = [...data.languages].join('/'); - const escapedName = UI.escape(name); - html += `
- - ▸ - ${escapedName} - ${langs} - ${data.articles.length} - -
`; - data.articles.forEach(a => { - const headline = UI.escape(a.headline_de || a.headline || 'Ohne Titel'); - const time = a.collected_at - ? (parseUTC(a.collected_at) || new Date(a.collected_at)).toLocaleString('de-DE', { day: '2-digit', month: '2-digit', hour: '2-digit', minute: '2-digit', timeZone: TIMEZONE }) - : ''; - const langBadge = a.language && a.language !== 'de' - ? `${a.language.toUpperCase()}` : ''; - const link = a.source_url - ? `↗` : ''; - html += `
- ${time} - ${headline} - ${langBadge} - ${link} -
`; - }); - html += `
`; - }); - - return html; -} - -function toggleRefreshInterval() { - const mode = document.getElementById('inc-refresh-mode').value; - const field = document.getElementById('refresh-interval-field'); - field.classList.toggle('visible', mode === 'auto'); -} - -function updateIntervalMin() { - const unit = parseInt(document.getElementById('inc-refresh-unit').value); - const input = document.getElementById('inc-refresh-value'); - if (unit === 1) { - // Minuten: Minimum 10 - input.min = 10; - if (parseInt(input.value) < 10) input.value = 10; - } else { - // Stunden/Tage/Wochen: Minimum 1 - input.min = 1; - if (parseInt(input.value) < 1) input.value = 1; - } -} - -function updateVisibilityHint() { - const isPublic = document.getElementById('inc-visibility').checked; - const text = document.getElementById('visibility-text'); - if (text) { - text.textContent = isPublic - ? 'Öffentlich — für alle Nutzer sichtbar' - : 'Privat — nur für dich sichtbar'; - } -} - -function updateSourcesHint() { - const intl = document.getElementById('inc-international').checked; - const hint = document.getElementById('sources-hint'); - if (hint) { - hint.textContent = intl - ? 'DE + internationale Feeds (Reuters, BBC, Al Jazeera etc.)' - : 'Nur deutschsprachige Quellen (DE, AT, CH)'; - } -} - -function toggleTypeDefaults() { - const type = document.getElementById('inc-type').value; - const hint = document.getElementById('type-hint'); - const refreshMode = document.getElementById('inc-refresh-mode'); - - if (type === 'research') { - hint.textContent = 'Nur WebSearch (Deep Research), manuelle Aktualisierung empfohlen'; - refreshMode.value = 'manual'; - toggleRefreshInterval(); - } else { - hint.textContent = 'RSS-Feeds + WebSearch, automatische Aktualisierung empfohlen'; - } -} - -// Tab-Fokus: Nur Tab-Badge (Titel-Counter) zurücksetzen, nicht alle Notifications -window.addEventListener('focus', () => { - document.title = App._originalTitle; -}); - -// ESC schließt Modals -// F5: Daten aktualisieren statt Seite neu laden -document.addEventListener('keydown', (e) => { - if (e.key === 'F5') { - e.preventDefault(); - App.softRefresh(); - } -}); - -document.addEventListener('keydown', (e) => { - if (e.key === 'Escape') { - // Schließ-Reihenfolge: A11y-Panel > Notification-Panel > Export-Dropdown > FC-Dropdown > Modals - if (A11yManager._isOpen) { - A11yManager._closePanel(); - return; - } - if (NotificationCenter._isOpen) { - NotificationCenter.close(); - return; - } - const exportMenu = document.getElementById('export-dropdown-menu'); - if (exportMenu && exportMenu.classList.contains('show')) { - App._closeExportDropdown(); - return; - } - const fcMenu = document.querySelector('.fc-dropdown-menu.open'); - if (fcMenu) { - fcMenu.classList.remove('open'); - const fcBtn = fcMenu.previousElementSibling; - if (fcBtn) fcBtn.setAttribute('aria-expanded', 'false'); - return; - } - document.querySelectorAll('.modal-overlay.active').forEach(m => { - closeModal(m.id); - }); - } -}); - -// Keyboard-Handler: Enter/Space auf [role="button"] löst click aus (WCAG 2.1.1) -document.addEventListener('keydown', (e) => { - if ((e.key === 'Enter' || e.key === ' ') && e.target.matches('[role="button"]')) { - e.preventDefault(); - e.target.click(); - } -}); - -// Session-Ablauf prüfen (alle 60 Sekunden) -setInterval(() => { - const token = localStorage.getItem('osint_token'); - if (!token) return; - try { - const payload = JSON.parse(atob(token.split('.')[1])); - const expiresAt = payload.exp * 1000; - const remaining = expiresAt - Date.now(); - const fiveMinutes = 5 * 60 * 1000; - if (remaining <= 0) { - App.logout(); - } else if (remaining <= fiveMinutes && !App._sessionWarningShown) { - App._sessionWarningShown = true; - const mins = Math.ceil(remaining / 60000); - UI.showToast(`Session läuft in ${mins} Minute${mins !== 1 ? 'n' : ''} ab. Bitte erneut anmelden.`, 'warning', 15000); - } - } catch (e) { /* Token nicht parsbar */ } -}, 60000); - -// Modal-Overlays: Klick auf Backdrop schließt NICHT mehr (nur X-Button) -document.addEventListener('click', (e) => { - if (e.target.classList.contains('modal-overlay') && e.target.classList.contains('active')) { - // closeModal deaktiviert - Modal nur ueber X-Button schliessbar - } -}); - -// App starten -document.addEventListener('click', (e) => { - if (!e.target.closest('.export-dropdown')) { - App._closeExportDropdown(); - } -}); -document.addEventListener('DOMContentLoaded', () => App.init());