i18n: Complete DE/EN language switcher integration
- Add LangManager with 270+ translation keys, anti-flicker lang detection - Replace all hardcoded German strings in app.js, components.js, dashboard.html, index.html - Dynamic getter properties for fact-check labels, category badges - Language-aware map tiles (DE/EN OSM servers), CSP updated for tile.openstreetmap.org - Lang switcher in header bar and login page - Locale-aware date formatting, translateApiError for backend messages Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Dieser Commit ist enthalten in:
claude-dev
@@ -235,7 +235,7 @@ class SecurityHeadersMiddleware(BaseHTTPMiddleware):
|
||||
"script-src 'self' 'unsafe-inline' https://cdn.jsdelivr.net; "
|
||||
"style-src 'self' 'unsafe-inline' https://fonts.googleapis.com https://cdn.jsdelivr.net; "
|
||||
"font-src 'self' https://fonts.gstatic.com; "
|
||||
"img-src 'self' data: https://tile.openstreetmap.de; "
|
||||
"img-src 'self' data: https://tile.openstreetmap.de https://tile.openstreetmap.org; "
|
||||
"connect-src 'self' wss: ws:; "
|
||||
"frame-ancestors 'none'"
|
||||
)
|
||||
|
||||
@@ -3584,6 +3584,35 @@ a:hover {
|
||||
transition: background 0.2s, border-color 0.2s;
|
||||
}
|
||||
|
||||
/* === Language Switcher === */
|
||||
.lang-switcher {
|
||||
display: flex;
|
||||
gap: 2px;
|
||||
background: var(--bg-secondary);
|
||||
border-radius: var(--radius);
|
||||
padding: 2px;
|
||||
}
|
||||
.lang-btn {
|
||||
padding: 4px 8px;
|
||||
border-radius: var(--radius);
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.5px;
|
||||
cursor: pointer;
|
||||
background: transparent;
|
||||
color: var(--text-secondary);
|
||||
border: none;
|
||||
transition: background 0.15s, color 0.15s;
|
||||
}
|
||||
.lang-btn:hover {
|
||||
color: var(--text-primary);
|
||||
background: var(--bg-hover);
|
||||
}
|
||||
.lang-btn.active {
|
||||
background: var(--accent);
|
||||
color: var(--bg-primary);
|
||||
}
|
||||
|
||||
/* === Light Theme Sonderregeln === */
|
||||
[data-theme="light"] .sidebar {
|
||||
border-right: 1px solid var(--border);
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<script>(function(){var t=localStorage.getItem('osint_theme');if(t)document.documentElement.setAttribute('data-theme',t);try{var a=JSON.parse(localStorage.getItem('osint_a11y')||'{}');Object.keys(a).forEach(function(k){if(a[k])document.documentElement.setAttribute('data-a11y-'+k,'true');});}catch(e){}})()</script>
|
||||
<script>(function(){var t=localStorage.getItem('osint_theme');if(t)document.documentElement.setAttribute('data-theme',t);try{var a=JSON.parse(localStorage.getItem('osint_a11y')||'{}');Object.keys(a).forEach(function(k){if(a[k])document.documentElement.setAttribute('data-a11y-'+k,'true');});}catch(e){}var l=localStorage.getItem('osint_lang')||'de';document.documentElement.lang=l;})()</script>
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/static/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/static/favicon-16x16.png">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/static/apple-touch-icon.png">
|
||||
@@ -19,7 +19,7 @@
|
||||
<link rel="stylesheet" href="/static/css/style.css?v=20260304h">
|
||||
</head>
|
||||
<body>
|
||||
<a href="#main-content" class="skip-link">Zum Hauptinhalt springen</a>
|
||||
<a href="#main-content" class="skip-link" data-i18n="header.skip_link">Zum Hauptinhalt springen</a>
|
||||
<div class="dashboard">
|
||||
<!-- Header -->
|
||||
<header class="header">
|
||||
@@ -28,7 +28,11 @@
|
||||
<h1 class="sr-only">AegisSight Monitor Dashboard</h1>
|
||||
</div>
|
||||
<div class="header-right">
|
||||
<button class="btn btn-secondary btn-small theme-toggle-btn" id="theme-toggle" onclick="ThemeManager.toggle()" title="Theme wechseln" aria-label="Theme wechseln">☼</button>
|
||||
<div class="lang-switcher" id="lang-switcher">
|
||||
<button class="lang-btn" data-lang="de" onclick="LangManager.setLang('de')" title="Deutsch">DE</button>
|
||||
<button class="lang-btn" data-lang="en" onclick="LangManager.setLang('en')" title="English">EN</button>
|
||||
</div>
|
||||
<button class="btn btn-secondary btn-small theme-toggle-btn" id="theme-toggle" onclick="ThemeManager.toggle()" data-i18n-title="header.theme_toggle" title="Theme wechseln" aria-label="Theme wechseln">☼</button>
|
||||
<div class="header-user-info">
|
||||
<div class="header-user-top">
|
||||
<span class="header-user" id="header-user"></span>
|
||||
@@ -37,25 +41,25 @@
|
||||
<span class="header-org-name" id="header-org-name"></span>
|
||||
</div>
|
||||
<div class="header-license-warning" id="header-license-warning"></div>
|
||||
<button class="btn btn-secondary btn-small" id="logout-btn">Abmelden</button>
|
||||
<button class="btn btn-secondary btn-small" id="logout-btn" data-i18n="header.logout">Abmelden</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- Sidebar -->
|
||||
<nav class="sidebar" aria-label="Seitenleiste">
|
||||
<div class="sidebar-section">
|
||||
<button class="btn btn-primary btn-full btn-small" id="new-incident-btn">+ Neue Lage / Recherche</button>
|
||||
<button class="btn btn-primary btn-full btn-small" id="new-incident-btn" data-i18n="nav.new_incident">+ Neue Lage / Recherche</button>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-filter">
|
||||
<button class="sidebar-filter-btn active" data-filter="all" onclick="App.setSidebarFilter('all')" aria-pressed="true">Alle</button>
|
||||
<button class="sidebar-filter-btn" data-filter="mine" onclick="App.setSidebarFilter('mine')" aria-pressed="false">Eigene</button>
|
||||
<button class="sidebar-filter-btn active" data-filter="all" onclick="App.setSidebarFilter('all')" aria-pressed="true" data-i18n="nav.filter_all">Alle</button>
|
||||
<button class="sidebar-filter-btn" data-filter="mine" onclick="App.setSidebarFilter('mine')" aria-pressed="false" data-i18n="nav.filter_mine">Eigene</button>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-section">
|
||||
<h2 class="sidebar-section-title collapsible" onclick="App.toggleSidebarSection('active-incidents')" role="button" tabindex="0" aria-expanded="true">
|
||||
<span class="sidebar-chevron" id="chevron-active-incidents" aria-hidden="true">▾</span>
|
||||
Aktive Lagen
|
||||
<span data-i18n="nav.active_incidents">Aktive Lagen</span>
|
||||
<span class="sidebar-section-count" id="count-active-incidents"></span>
|
||||
</h2>
|
||||
<div id="active-incidents" aria-live="polite"></div>
|
||||
@@ -64,7 +68,7 @@
|
||||
<div class="sidebar-section">
|
||||
<h2 class="sidebar-section-title collapsible" onclick="App.toggleSidebarSection('active-research')" role="button" tabindex="0" aria-expanded="true">
|
||||
<span class="sidebar-chevron" id="chevron-active-research" aria-hidden="true">▾</span>
|
||||
Aktive Recherchen
|
||||
<span data-i18n="nav.active_research">Aktive Recherchen</span>
|
||||
<span class="sidebar-section-count" id="count-active-research"></span>
|
||||
</h2>
|
||||
<div id="active-research" aria-live="polite"></div>
|
||||
@@ -73,14 +77,14 @@
|
||||
<div class="sidebar-section">
|
||||
<h2 class="sidebar-section-title collapsible" onclick="App.toggleSidebarSection('archived-incidents')" role="button" tabindex="0" aria-expanded="false">
|
||||
<span class="sidebar-chevron" id="chevron-archived-incidents" aria-hidden="true">▾</span>
|
||||
Archiv
|
||||
<span data-i18n="nav.archive">Archiv</span>
|
||||
<span class="sidebar-section-count" id="count-archived-incidents"></span>
|
||||
</h2>
|
||||
<div id="archived-incidents" aria-live="polite" style="display:none;"></div>
|
||||
</div>
|
||||
<div class="sidebar-sources-link">
|
||||
<button class="btn btn-secondary btn-full btn-small" onclick="App.openSourceManagement()">Quellen verwalten</button>
|
||||
<button class="btn btn-secondary btn-full btn-small sidebar-feedback-btn" onclick="App.openFeedback()">Feedback senden</button>
|
||||
<button class="btn btn-secondary btn-full btn-small" onclick="App.openSourceManagement()" data-i18n="nav.manage_sources">Quellen verwalten</button>
|
||||
<button class="btn btn-secondary btn-full btn-small sidebar-feedback-btn" onclick="App.openFeedback()" data-i18n="nav.send_feedback">Feedback senden</button>
|
||||
<div class="sidebar-stats-mini">
|
||||
<span id="stat-sources-count">0 Quellen</span> · <span id="stat-articles-count">0 Artikel</span>
|
||||
</div>
|
||||
@@ -91,8 +95,8 @@
|
||||
<main class="main-content" id="main-content">
|
||||
<div class="empty-state" id="empty-state">
|
||||
<div class="empty-state-icon">☉</div>
|
||||
<div class="empty-state-title">Kein Vorfall ausgewählt</div>
|
||||
<div class="empty-state-text">Erstelle eine neue Lage oder wähle einen bestehenden Vorfall aus der Seitenleiste.</div>
|
||||
<div class="empty-state-title" data-i18n="empty.no_incident">Kein Vorfall ausgewählt</div>
|
||||
<div class="empty-state-text" data-i18n="empty.no_incident_text">Erstelle eine neue Lage oder wähle einen bestehenden Vorfall aus der Seitenleiste.</div>
|
||||
</div>
|
||||
|
||||
<!-- Lagebild (hidden by default) -->
|
||||
@@ -108,22 +112,22 @@
|
||||
<h2 class="incident-header-title" id="incident-title"></h2>
|
||||
</div>
|
||||
<div class="incident-header-actions">
|
||||
<button class="btn btn-primary btn-small" id="refresh-btn">Aktualisieren</button>
|
||||
<button class="btn btn-secondary btn-small" id="edit-incident-btn">Bearbeiten</button>
|
||||
<button class="btn btn-primary btn-small" id="refresh-btn" data-i18n="btn.refresh">Aktualisieren</button>
|
||||
<button class="btn btn-secondary btn-small" id="edit-incident-btn" data-i18n="btn.edit">Bearbeiten</button>
|
||||
<div class="export-dropdown" id="export-dropdown">
|
||||
<button class="btn btn-secondary btn-small" onclick="App.toggleExportDropdown(event)" aria-expanded="false" aria-haspopup="true">Exportieren ▾</button>
|
||||
<button class="btn btn-secondary btn-small" onclick="App.toggleExportDropdown(event)" aria-expanded="false" aria-haspopup="true" data-i18n="btn.export">Exportieren ▾</button>
|
||||
<div class="export-dropdown-menu" id="export-dropdown-menu" role="menu">
|
||||
<button class="export-dropdown-item" role="menuitem" onclick="App.exportIncident('md','report')">Lagebericht (Markdown)</button>
|
||||
<button class="export-dropdown-item" role="menuitem" onclick="App.exportIncident('json','report')">Lagebericht (JSON)</button>
|
||||
<button class="export-dropdown-item" role="menuitem" onclick="App.exportIncident('md','report')" data-i18n="export.report_md">Lagebericht (Markdown)</button>
|
||||
<button class="export-dropdown-item" role="menuitem" onclick="App.exportIncident('json','report')" data-i18n="export.report_json">Lagebericht (JSON)</button>
|
||||
<hr class="export-dropdown-divider" role="separator">
|
||||
<button class="export-dropdown-item" role="menuitem" onclick="App.exportIncident('md','full')">Vollexport (Markdown)</button>
|
||||
<button class="export-dropdown-item" role="menuitem" onclick="App.exportIncident('json','full')">Vollexport (JSON)</button>
|
||||
<button class="export-dropdown-item" role="menuitem" onclick="App.exportIncident('md','full')" data-i18n="export.full_md">Vollexport (Markdown)</button>
|
||||
<button class="export-dropdown-item" role="menuitem" onclick="App.exportIncident('json','full')" data-i18n="export.full_json">Vollexport (JSON)</button>
|
||||
<hr class="export-dropdown-divider" role="separator">
|
||||
<button class="export-dropdown-item" role="menuitem" onclick="App.printIncident()">Drucken / PDF</button>
|
||||
<button class="export-dropdown-item" role="menuitem" onclick="App.printIncident()" data-i18n="export.print">Drucken / PDF</button>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn btn-secondary btn-small" id="archive-incident-btn">Archivieren</button>
|
||||
<button class="btn btn-danger btn-small" id="delete-incident-btn">Löschen</button>
|
||||
<button class="btn btn-secondary btn-small" id="archive-incident-btn" data-i18n="btn.archive">Archivieren</button>
|
||||
<button class="btn btn-danger btn-small" id="delete-incident-btn" data-i18n="btn.delete">Löschen</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="incident-header-row2">
|
||||
@@ -154,37 +158,37 @@
|
||||
<div class="progress-steps">
|
||||
<div class="progress-step" id="step-researching">
|
||||
<div class="progress-step-dot"></div>
|
||||
<span>Recherche</span>
|
||||
<span data-i18n="progress.step_research">Recherche</span>
|
||||
</div>
|
||||
<div class="progress-step" id="step-analyzing">
|
||||
<div class="progress-step-dot"></div>
|
||||
<span>Analyse</span>
|
||||
<span data-i18n="progress.step_analysis">Analyse</span>
|
||||
</div>
|
||||
<div class="progress-step" id="step-factchecking">
|
||||
<div class="progress-step-dot"></div>
|
||||
<span>Faktencheck</span>
|
||||
<span data-i18n="progress.step_factcheck">Faktencheck</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="progress-track">
|
||||
<div class="progress-fill" id="progress-fill"></div>
|
||||
</div>
|
||||
<div class="progress-label-container">
|
||||
<span id="progress-label" class="progress-label">Warte auf Start...</span>
|
||||
<span id="progress-label" class="progress-label" data-i18n="progress.wait">Warte auf Start...</span>
|
||||
<span id="progress-timer" class="progress-timer"></span>
|
||||
</div>
|
||||
<button id="progress-cancel-btn" class="progress-cancel-btn" onclick="App.cancelRefresh()">Abbrechen</button>
|
||||
<button id="progress-cancel-btn" class="progress-cancel-btn" onclick="App.cancelRefresh()" data-i18n="btn.cancel">Abbrechen</button>
|
||||
</div>
|
||||
|
||||
<!-- Layout-Toolbar -->
|
||||
<div class="layout-toolbar" id="layout-toolbar" style="display:none;">
|
||||
<div class="layout-toggles">
|
||||
<button class="layout-toggle-btn active" data-tile="lagebild" onclick="LayoutManager.toggleTile('lagebild')" aria-pressed="true">Lagebild</button>
|
||||
<button class="layout-toggle-btn active" data-tile="faktencheck" onclick="LayoutManager.toggleTile('faktencheck')" aria-pressed="true">Faktencheck</button>
|
||||
<button class="layout-toggle-btn active" data-tile="quellen" onclick="LayoutManager.toggleTile('quellen')" aria-pressed="true">Quellen</button>
|
||||
<button class="layout-toggle-btn active" data-tile="timeline" onclick="LayoutManager.toggleTile('timeline')" aria-pressed="true">Timeline</button>
|
||||
<button class="layout-toggle-btn active" data-tile="karte" onclick="LayoutManager.toggleTile('karte')" aria-pressed="true">Karte</button>
|
||||
<button class="layout-toggle-btn active" data-tile="lagebild" onclick="LayoutManager.toggleTile('lagebild')" aria-pressed="true" data-i18n="tile.lagebild">Lagebild</button>
|
||||
<button class="layout-toggle-btn active" data-tile="faktencheck" onclick="LayoutManager.toggleTile('faktencheck')" aria-pressed="true" data-i18n="tile.faktencheck">Faktencheck</button>
|
||||
<button class="layout-toggle-btn active" data-tile="quellen" onclick="LayoutManager.toggleTile('quellen')" aria-pressed="true" data-i18n="tile.quellen">Quellen</button>
|
||||
<button class="layout-toggle-btn active" data-tile="timeline" onclick="LayoutManager.toggleTile('timeline')" aria-pressed="true" data-i18n="tile.timeline">Timeline</button>
|
||||
<button class="layout-toggle-btn active" data-tile="karte" onclick="LayoutManager.toggleTile('karte')" aria-pressed="true" data-i18n="tile.karte">Karte</button>
|
||||
</div>
|
||||
<button class="btn btn-secondary btn-small" onclick="LayoutManager.reset()">Layout zurücksetzen</button>
|
||||
<button class="btn btn-secondary btn-small" onclick="LayoutManager.reset()" data-i18n="btn.layout_reset">Layout zurücksetzen</button>
|
||||
</div>
|
||||
|
||||
<!-- gridstack Dashboard-Grid -->
|
||||
@@ -193,7 +197,7 @@
|
||||
<div class="grid-stack-item-content">
|
||||
<div class="card incident-analysis-summary">
|
||||
<div class="card-header">
|
||||
<div class="card-title clickable" role="button" tabindex="0" onclick="openContentModal('Lagebild', 'summary-content')">Lagebild</div>
|
||||
<div class="card-title clickable" role="button" tabindex="0" onclick="openContentModal(LangManager.t('card.situation_report'), 'summary-content')" data-i18n="card.situation_report">Lagebild</div>
|
||||
<span class="lagebild-timestamp" id="lagebild-timestamp"></span>
|
||||
</div>
|
||||
<div id="summary-content">
|
||||
@@ -207,12 +211,12 @@
|
||||
<div class="grid-stack-item-content">
|
||||
<div class="card incident-analysis-factcheck" id="factcheck-card">
|
||||
<div class="card-header">
|
||||
<div class="card-title clickable" role="button" tabindex="0" onclick="openContentModal('Faktencheck', 'factcheck-list')">Faktencheck</div>
|
||||
<div class="card-title clickable" role="button" tabindex="0" onclick="openContentModal(LangManager.t('card.factcheck'), 'factcheck-list')" data-i18n="card.factcheck">Faktencheck</div>
|
||||
<div class="fc-filter-bar" id="fc-filters"></div>
|
||||
</div>
|
||||
<div class="factcheck-list" id="factcheck-list">
|
||||
<div class="empty-state" style="padding:20px;">
|
||||
<div class="empty-state-text">Noch keine Fakten geprüft</div>
|
||||
<div class="empty-state-text" data-i18n="empty.no_factchecks">Noch keine Fakten geprüft</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -224,8 +228,8 @@
|
||||
<div class="card source-overview-card">
|
||||
<div class="card-header source-overview-header-toggle" onclick="App.toggleSourceOverview()" role="button" tabindex="0" aria-expanded="false">
|
||||
<span class="source-overview-chevron" id="source-overview-chevron" title="Aufklappen" aria-hidden="true">▸</span>
|
||||
<div class="card-title clickable">Quellenübersicht</div>
|
||||
<button class="btn btn-secondary btn-small source-detail-btn" onclick="event.stopPropagation(); openContentModal('Quellenübersicht', 'source-overview-content')">Detailansicht</button>
|
||||
<div class="card-title clickable" data-i18n="card.sources_overview">Quellenübersicht</div>
|
||||
<button class="btn btn-secondary btn-small source-detail-btn" onclick="event.stopPropagation(); openContentModal(LangManager.t('card.sources_overview'), 'source-overview-content')" data-i18n="card.detail_view">Detailansicht</button>
|
||||
</div>
|
||||
<div id="source-overview-content" style="display:none;"></div>
|
||||
</div>
|
||||
@@ -236,25 +240,25 @@
|
||||
<div class="grid-stack-item-content">
|
||||
<div class="card timeline-card">
|
||||
<div class="card-header">
|
||||
<div class="card-title clickable" role="button" tabindex="0" onclick="openContentModal('Ereignis-Timeline', 'timeline')">Ereignis-Timeline</div>
|
||||
<div class="card-title clickable" role="button" tabindex="0" onclick="openContentModal(LangManager.t('card.timeline'), 'timeline')" data-i18n="card.timeline">Ereignis-Timeline</div>
|
||||
<div class="ht-controls">
|
||||
<div class="ht-filter-group">
|
||||
<button class="ht-filter-btn active" data-filter="all" onclick="App.setTimelineFilter('all')" aria-pressed="true">Alle</button>
|
||||
<button class="ht-filter-btn" data-filter="articles" onclick="App.setTimelineFilter('articles')" aria-pressed="false">Meldungen</button>
|
||||
<button class="ht-filter-btn" data-filter="snapshots" onclick="App.setTimelineFilter('snapshots')" aria-pressed="false">Lageberichte</button>
|
||||
<button class="ht-filter-btn active" data-filter="all" onclick="App.setTimelineFilter('all')" aria-pressed="true" data-i18n="timeline.all">Alle</button>
|
||||
<button class="ht-filter-btn" data-filter="articles" onclick="App.setTimelineFilter('articles')" aria-pressed="false" data-i18n="timeline.articles">Meldungen</button>
|
||||
<button class="ht-filter-btn" data-filter="snapshots" onclick="App.setTimelineFilter('snapshots')" aria-pressed="false" data-i18n="timeline.snapshots">Lageberichte</button>
|
||||
</div>
|
||||
<span class="ht-count" id="article-count"></span>
|
||||
<div class="ht-range-group">
|
||||
<button class="ht-range-btn" data-range="24h" onclick="App.setTimelineRange('24h')" aria-pressed="false">24h</button>
|
||||
<button class="ht-range-btn" data-range="7d" onclick="App.setTimelineRange('7d')" aria-pressed="false">7T</button>
|
||||
<button class="ht-range-btn active" data-range="all" onclick="App.setTimelineRange('all')" aria-pressed="true">Alles</button>
|
||||
<button class="ht-range-btn" data-range="24h" onclick="App.setTimelineRange('24h')" aria-pressed="false" data-i18n="timeline.range_24h">24h</button>
|
||||
<button class="ht-range-btn" data-range="7d" onclick="App.setTimelineRange('7d')" aria-pressed="false" data-i18n="timeline.range_7d">7T</button>
|
||||
<button class="ht-range-btn active" data-range="all" onclick="App.setTimelineRange('all')" aria-pressed="true" data-i18n="timeline.range_all">Alles</button>
|
||||
</div>
|
||||
<label for="timeline-search" class="sr-only">Timeline durchsuchen</label>
|
||||
<input type="text" id="timeline-search" class="timeline-filter-input" placeholder="Suche..." oninput="App.debouncedRerenderTimeline()">
|
||||
<input type="text" id="timeline-search" class="timeline-filter-input" placeholder="Suche..." data-i18n-placeholder="timeline.search_placeholder" oninput="App.debouncedRerenderTimeline()">
|
||||
</div>
|
||||
</div>
|
||||
<div id="timeline" class="ht-timeline-container">
|
||||
<div class="ht-empty">Noch keine Meldungen</div>
|
||||
<div class="ht-empty" data-i18n="empty.no_articles">Noch keine Meldungen</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -264,12 +268,12 @@
|
||||
<div class="grid-stack-item-content">
|
||||
<div class="card map-card">
|
||||
<div class="card-header">
|
||||
<div class="card-title">Geografische Verteilung</div>
|
||||
<div class="card-title" data-i18n="card.map">Geografische Verteilung</div>
|
||||
<span class="map-stats" id="map-stats"></span>
|
||||
<button class="btn btn-secondary btn-small" id="geoparse-btn" onclick="App.triggerGeoparse()" title="Orte aus Artikeln erkennen">Orte erkennen</button>
|
||||
<button class="btn btn-secondary btn-small" id="geoparse-btn" onclick="App.triggerGeoparse()" title="Orte aus Artikeln erkennen" data-i18n="btn.detect_locations">Orte erkennen</button>
|
||||
</div>
|
||||
<div class="map-container" id="map-container">
|
||||
<div class="map-empty" id="map-empty">Keine Orte erkannt</div>
|
||||
<div class="map-empty" id="map-empty" data-i18n="empty.no_locations">Keine Orte erkannt</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -286,103 +290,103 @@
|
||||
<div class="modal-overlay" id="modal-new" role="dialog" aria-modal="true" aria-labelledby="modal-new-title">
|
||||
<div class="modal">
|
||||
<div class="modal-header">
|
||||
<div class="modal-title" id="modal-new-title">Neue Lage anlegen</div>
|
||||
<div class="modal-title" id="modal-new-title" data-i18n="modal.new_incident">Neue Lage anlegen</div>
|
||||
<button class="modal-close" onclick="closeModal('modal-new')" aria-label="Schließen">×</button>
|
||||
</div>
|
||||
<form id="new-incident-form">
|
||||
<div class="modal-body">
|
||||
<div class="form-group">
|
||||
<label for="inc-title">Titel des Vorfalls</label>
|
||||
<input type="text" id="inc-title" required aria-required="true" placeholder="z.B. Explosion in Madrid">
|
||||
<label for="inc-title" data-i18n="form.incident_title">Titel des Vorfalls</label>
|
||||
<input type="text" id="inc-title" required aria-required="true" placeholder="z.B. Explosion in Madrid" data-i18n-placeholder="form.incident_title_placeholder">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="inc-description">Beschreibung / Kontext</label>
|
||||
<textarea id="inc-description" placeholder="Weitere Details zum Vorfall (optional)"></textarea>
|
||||
<label for="inc-description" data-i18n="form.description">Beschreibung / Kontext</label>
|
||||
<textarea id="inc-description" placeholder="Weitere Details zum Vorfall (optional)" data-i18n-placeholder="form.description_placeholder"></textarea>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="inc-type">Art der Lage</label>
|
||||
<label for="inc-type" data-i18n="form.incident_type">Art der Lage</label>
|
||||
<select id="inc-type" onchange="toggleTypeDefaults()">
|
||||
<option value="adhoc">Ad-hoc Lage (Breaking News)</option>
|
||||
<option value="research">Recherche (Hintergrund)</option>
|
||||
<option value="adhoc" data-i18n="form.type_adhoc">Ad-hoc Lage (Breaking News)</option>
|
||||
<option value="research" data-i18n="form.type_research">Recherche (Hintergrund)</option>
|
||||
</select>
|
||||
<div class="form-hint" id="type-hint">
|
||||
<div class="form-hint" id="type-hint" data-i18n="form.type_hint_adhoc">
|
||||
RSS-Feeds + WebSearch, automatische Aktualisierung empfohlen
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Quellen</label>
|
||||
<label data-i18n="form.sources">Quellen</label>
|
||||
<div class="toggle-group">
|
||||
<label class="toggle-label">
|
||||
<input type="checkbox" id="inc-international" checked>
|
||||
<span class="toggle-switch"></span>
|
||||
<span class="toggle-text">Internationale Quellen einbeziehen</span>
|
||||
<span class="toggle-text" data-i18n="form.international_sources">Internationale Quellen einbeziehen</span>
|
||||
</label>
|
||||
<div class="form-hint" id="sources-hint">DE + internationale Feeds (Reuters, BBC, Al Jazeera etc.)</div>
|
||||
<div class="form-hint" id="sources-hint" data-i18n="form.sources_hint_intl">DE + internationale Feeds (Reuters, BBC, Al Jazeera etc.)</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Sichtbarkeit</label>
|
||||
<label data-i18n="form.visibility">Sichtbarkeit</label>
|
||||
<div class="toggle-group">
|
||||
<label class="toggle-label">
|
||||
<input type="checkbox" id="inc-visibility" checked>
|
||||
<span class="toggle-switch"></span>
|
||||
<span class="toggle-text" id="visibility-text">Öffentlich — für alle Nutzer sichtbar</span>
|
||||
<span class="toggle-text" id="visibility-text" data-i18n="form.visibility_public">Öffentlich — für alle Nutzer sichtbar</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="inc-refresh-mode">Aktualisierung</label>
|
||||
<label for="inc-refresh-mode" data-i18n="form.refresh_mode">Aktualisierung</label>
|
||||
<select id="inc-refresh-mode" onchange="toggleRefreshInterval()">
|
||||
<option value="manual">Manuell</option>
|
||||
<option value="auto">Automatisch</option>
|
||||
<option value="manual" data-i18n="form.refresh_manual">Manuell</option>
|
||||
<option value="auto" data-i18n="form.refresh_auto">Automatisch</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group conditional-field" id="refresh-interval-field">
|
||||
<label for="inc-refresh-value">Intervall</label>
|
||||
<label for="inc-refresh-value" data-i18n="form.interval">Intervall</label>
|
||||
<div class="interval-input-group">
|
||||
<input type="number" id="inc-refresh-value" min="10" value="15">
|
||||
<select id="inc-refresh-unit" onchange="updateIntervalMin()">
|
||||
<option value="1" selected>Minuten</option>
|
||||
<option value="60">Stunden</option>
|
||||
<option value="1440">Tage</option>
|
||||
<option value="10080">Wochen</option>
|
||||
<option value="1" selected data-i18n="form.unit_minutes">Minuten</option>
|
||||
<option value="60" data-i18n="form.unit_hours">Stunden</option>
|
||||
<option value="1440" data-i18n="form.unit_days">Tage</option>
|
||||
<option value="10080" data-i18n="form.unit_weeks">Wochen</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="inc-retention">Aufbewahrung (Tage)</label>
|
||||
<label for="inc-retention" data-i18n="form.retention">Aufbewahrung (Tage)</label>
|
||||
<input type="number" id="inc-retention" min="0" max="999" value="30" placeholder="0 = Unbegrenzt">
|
||||
<div class="form-hint">0 = Unbegrenzt, max. 999 Tage</div>
|
||||
<div class="form-hint" data-i18n="form.retention_hint">0 = Unbegrenzt, max. 999 Tage</div>
|
||||
</div>
|
||||
<div class="form-group" style="margin-top: 8px;">
|
||||
<label>E-Mail-Benachrichtigungen</label>
|
||||
<div class="form-hint" style="margin-bottom: 8px;">Per E-Mail benachrichtigen bei:</div>
|
||||
<label data-i18n="form.email_notifications">E-Mail-Benachrichtigungen</label>
|
||||
<div class="form-hint" style="margin-bottom: 8px;" data-i18n="form.email_notify_hint">Per E-Mail benachrichtigen bei:</div>
|
||||
<div class="toggle-group">
|
||||
<label class="toggle-label">
|
||||
<input type="checkbox" id="inc-notify-summary">
|
||||
<span class="toggle-switch"></span>
|
||||
<span class="toggle-text">Neues Lagebild</span>
|
||||
<span class="toggle-text" data-i18n="form.notify_summary">Neues Lagebild</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="toggle-group" style="margin-top: 8px;">
|
||||
<label class="toggle-label">
|
||||
<input type="checkbox" id="inc-notify-new-articles">
|
||||
<span class="toggle-switch"></span>
|
||||
<span class="toggle-text">Neue Artikel</span>
|
||||
<span class="toggle-text" data-i18n="form.notify_articles">Neue Artikel</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="toggle-group" style="margin-top: 8px;">
|
||||
<label class="toggle-label">
|
||||
<input type="checkbox" id="inc-notify-status-change">
|
||||
<span class="toggle-switch"></span>
|
||||
<span class="toggle-text">Statusänderung Faktencheck</span>
|
||||
<span class="toggle-text" data-i18n="form.notify_status">Statusänderung Faktencheck</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" onclick="closeModal('modal-new')">Abbrechen</button>
|
||||
<button type="submit" class="btn btn-primary" id="modal-new-submit">Lage anlegen</button>
|
||||
<button type="button" class="btn btn-secondary" onclick="closeModal('modal-new')" data-i18n="btn.cancel">Abbrechen</button>
|
||||
<button type="submit" class="btn btn-primary" id="modal-new-submit" data-i18n="modal.create_incident">Lage anlegen</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
@@ -392,7 +396,7 @@
|
||||
<div class="modal-overlay" id="modal-sources" role="dialog" aria-modal="true" aria-labelledby="modal-sources-title">
|
||||
<div class="modal modal-wide">
|
||||
<div class="modal-header">
|
||||
<div class="modal-title" id="modal-sources-title">Quellenverwaltung</div>
|
||||
<div class="modal-title" id="modal-sources-title" data-i18n="modal.source_management">Quellenverwaltung</div>
|
||||
<button class="modal-close" onclick="closeModal('modal-sources')" aria-label="Schließen">×</button>
|
||||
</div>
|
||||
<div class="modal-body sources-modal-body">
|
||||
@@ -528,29 +532,29 @@
|
||||
<div class="modal-overlay" id="modal-feedback" role="dialog" aria-modal="true" aria-labelledby="modal-feedback-title">
|
||||
<div class="modal">
|
||||
<div class="modal-header">
|
||||
<div class="modal-title" id="modal-feedback-title">Feedback senden</div>
|
||||
<div class="modal-title" id="modal-feedback-title" data-i18n="modal.feedback">Feedback senden</div>
|
||||
<button class="modal-close" onclick="closeModal('modal-feedback')" aria-label="Schließen">×</button>
|
||||
</div>
|
||||
<form id="feedback-form">
|
||||
<div class="modal-body">
|
||||
<div class="form-group">
|
||||
<label for="fb-category">Kategorie</label>
|
||||
<label for="fb-category" data-i18n="form.feedback_category">Kategorie</label>
|
||||
<select id="fb-category">
|
||||
<option value="bug">Fehlerbericht</option>
|
||||
<option value="feature">Feature-Wunsch</option>
|
||||
<option value="question">Frage</option>
|
||||
<option value="other">Sonstiges</option>
|
||||
<option value="bug" data-i18n="form.fb_bug">Fehlerbericht</option>
|
||||
<option value="feature" data-i18n="form.fb_feature">Feature-Wunsch</option>
|
||||
<option value="question" data-i18n="form.fb_question">Frage</option>
|
||||
<option value="other" data-i18n="form.fb_other">Sonstiges</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="fb-message">Nachricht</label>
|
||||
<textarea id="fb-message" required aria-required="true" minlength="10" maxlength="5000" rows="6" placeholder="Beschreibe dein Anliegen (mind. 10 Zeichen)..."></textarea>
|
||||
<label for="fb-message" data-i18n="form.fb_message">Nachricht</label>
|
||||
<textarea id="fb-message" required aria-required="true" minlength="10" maxlength="5000" rows="6" placeholder="Beschreibe dein Anliegen (mind. 10 Zeichen)..." data-i18n-placeholder="form.fb_placeholder"></textarea>
|
||||
<div class="form-hint"><span id="fb-char-count">0</span> / 5.000 Zeichen</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" onclick="closeModal('modal-feedback')">Abbrechen</button>
|
||||
<button type="submit" class="btn btn-primary" id="fb-submit-btn">Absenden</button>
|
||||
<button type="button" class="btn btn-secondary" onclick="closeModal('modal-feedback')" data-i18n="btn.cancel">Abbrechen</button>
|
||||
<button type="submit" class="btn btn-primary" id="fb-submit-btn" data-i18n="btn.submit_feedback">Absenden</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
@@ -562,6 +566,7 @@
|
||||
<script src="https://cdn.jsdelivr.net/npm/gridstack@12/dist/gridstack-all.js"></script>
|
||||
<script src="/static/vendor/leaflet.js"></script>
|
||||
<script src="/static/vendor/leaflet.markercluster.js"></script>
|
||||
<script src="/static/js/lang.js?v=20260305a"></script>
|
||||
<script src="/static/js/api.js?v=20260304h"></script>
|
||||
<script src="/static/js/ws.js?v=20260304h"></script>
|
||||
<script src="/static/js/components.js?v=20260304h"></script>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<script>(function(){var t=localStorage.getItem('osint_theme');if(t)document.documentElement.setAttribute('data-theme',t);try{var a=JSON.parse(localStorage.getItem('osint_a11y')||'{}');Object.keys(a).forEach(function(k){if(a[k])document.documentElement.setAttribute('data-a11y-'+k,'true');});}catch(e){}})()</script>
|
||||
<script>(function(){var t=localStorage.getItem('osint_theme');if(t)document.documentElement.setAttribute('data-theme',t);try{var a=JSON.parse(localStorage.getItem('osint_a11y')||'{}');Object.keys(a).forEach(function(k){if(a[k])document.documentElement.setAttribute('data-a11y-'+k,'true');});}catch(e){}var l=localStorage.getItem('osint_lang')||'de';document.documentElement.lang=l;})()</script>
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/static/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/static/favicon-16x16.png">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/static/apple-touch-icon.png">
|
||||
@@ -12,15 +12,16 @@
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="/static/css/style.css?v=20260304a">
|
||||
<link rel="stylesheet" href="/static/css/style.css?v=20260305a">
|
||||
<script src="/static/js/lang.js?v=20260305a"></script>
|
||||
</head>
|
||||
<body>
|
||||
<a href="#login-form" class="skip-link">Zum Anmeldeformular springen</a>
|
||||
<a href="#login-form" class="skip-link" data-i18n="login.skip_link">Zum Anmeldeformular springen</a>
|
||||
<main class="login-container">
|
||||
<div class="login-box">
|
||||
<div class="login-logo">
|
||||
<h1>Aegis<span style="color: var(--accent)">Sight</span></h1>
|
||||
<div class="subtitle">Lagemonitor</div>
|
||||
<div class="subtitle" data-i18n="login.subtitle">Lagemonitor</div>
|
||||
</div>
|
||||
|
||||
<div id="login-error" class="login-error" role="alert" aria-live="assertive"></div>
|
||||
@@ -29,29 +30,34 @@
|
||||
<!-- Schritt 1: E-Mail eingeben -->
|
||||
<form id="email-form">
|
||||
<div class="form-group">
|
||||
<label for="email">E-Mail-Adresse</label>
|
||||
<input type="email" id="email" name="email" autocomplete="email" required aria-required="true" placeholder="name@organisation.de">
|
||||
<label for="email" data-i18n="login.email_label">E-Mail-Adresse</label>
|
||||
<input type="email" id="email" name="email" autocomplete="email" required aria-required="true" placeholder="name@organisation.de" data-i18n-placeholder="login.email_placeholder">
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary btn-full" id="email-btn">Anmelden</button>
|
||||
<button type="submit" class="btn btn-primary btn-full" id="email-btn" data-i18n="login.submit">Anmelden</button>
|
||||
</form>
|
||||
|
||||
<!-- Schritt 2: Code eingeben -->
|
||||
<form id="code-form" style="display:none;">
|
||||
<p style="color: var(--text-secondary); margin: 0 0 16px 0; font-size: 14px;">
|
||||
<p id="code-sent-text" style="color: var(--text-secondary); margin: 0 0 16px 0; font-size: 14px;">
|
||||
Ein 6-stelliger Code wurde an <strong id="sent-email"></strong> gesendet.
|
||||
</p>
|
||||
<div class="form-group">
|
||||
<label for="code">Code eingeben</label>
|
||||
<label for="code" data-i18n="login.code_label">Code eingeben</label>
|
||||
<input type="text" id="code" name="code" autocomplete="one-time-code" required aria-required="true"
|
||||
placeholder="000000" maxlength="6" pattern="[0-9]{6}"
|
||||
style="text-align:center; font-size:24px; letter-spacing:8px; font-family:monospace;">
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary btn-full" id="code-btn">Verifizieren</button>
|
||||
<button type="button" class="btn btn-secondary btn-full" id="back-btn" style="margin-top:8px;">Zurück</button>
|
||||
<button type="submit" class="btn btn-primary btn-full" id="code-btn" data-i18n="login.verify">Verifizieren</button>
|
||||
<button type="button" class="btn btn-secondary btn-full" id="back-btn" style="margin-top:8px;" data-i18n="login.back">Zurück</button>
|
||||
</form>
|
||||
|
||||
<div style="text-align:center;margin-top:16px;">
|
||||
<button class="btn btn-secondary btn-small theme-toggle-btn" id="theme-toggle" onclick="ThemeManager.toggle()" title="Theme wechseln" aria-label="Theme wechseln">☼</button>
|
||||
<div class="lang-switcher" id="lang-switcher" style="display:inline-flex;margin-bottom:8px;">
|
||||
<button class="lang-btn" data-lang="de" onclick="LangManager.setLang('de')" title="Deutsch">DE</button>
|
||||
<button class="lang-btn" data-lang="en" onclick="LangManager.setLang('en')" title="English">EN</button>
|
||||
</div>
|
||||
<br>
|
||||
<button class="btn btn-secondary btn-small theme-toggle-btn" id="theme-toggle" onclick="ThemeManager.toggle()" data-i18n-title="header.theme_toggle" title="Theme wechseln" aria-label="Theme wechseln">☼</button>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
@@ -132,7 +138,7 @@
|
||||
errorEl.style.display = 'none';
|
||||
successEl.style.display = 'none';
|
||||
btn.disabled = true;
|
||||
btn.textContent = 'Wird gesendet...';
|
||||
btn.textContent = LangManager.t('login.sending');
|
||||
|
||||
currentEmail = document.getElementById('email').value.trim();
|
||||
|
||||
@@ -159,7 +165,7 @@
|
||||
errorEl.style.display = 'block';
|
||||
} finally {
|
||||
btn.disabled = false;
|
||||
btn.textContent = 'Anmelden';
|
||||
btn.textContent = LangManager.t('login.submit');
|
||||
}
|
||||
});
|
||||
|
||||
@@ -170,7 +176,7 @@
|
||||
const btn = document.getElementById('code-btn');
|
||||
errorEl.style.display = 'none';
|
||||
btn.disabled = true;
|
||||
btn.textContent = 'Wird geprüft...';
|
||||
btn.textContent = LangManager.t('login.verifying');
|
||||
|
||||
try {
|
||||
const response = await fetch('/api/auth/verify-code', {
|
||||
@@ -196,7 +202,7 @@
|
||||
errorEl.style.display = 'block';
|
||||
} finally {
|
||||
btn.disabled = false;
|
||||
btn.textContent = 'Verifizieren';
|
||||
btn.textContent = LangManager.t('login.verify');
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
Datei-Diff unterdrückt, da er zu groß ist
Diff laden
@@ -29,9 +29,9 @@ const UI = {
|
||||
<span class="incident-dot ${dotClass}" id="dot-${incident.id}" aria-hidden="true"></span>
|
||||
<div style="flex:1;min-width:0;">
|
||||
<div class="incident-name">${this.escape(incident.title)}</div>
|
||||
<div class="incident-meta">${incident.article_count} Artikel · ${this.escape(creator)}</div>
|
||||
<div class="incident-meta">${LangManager.t('sidebar.articles', { n: incident.article_count })} · ${this.escape(creator)}</div>
|
||||
</div>
|
||||
${incident.visibility === 'private' ? '<span class="badge badge-private" style="font-size:9px;" aria-label="Private Lage">PRIVAT</span>' : ''}
|
||||
${incident.visibility === 'private' ? `<span class="badge badge-private" style="font-size:9px;" aria-label="Private Lage">${LangManager.t('status.private')}</span>` : ''}
|
||||
${incident.refresh_mode === 'auto' ? '<span class="badge badge-auto" role="img" aria-label="Auto-Refresh aktiv">↻</span>' : ''}
|
||||
</div>
|
||||
`;
|
||||
@@ -40,34 +40,15 @@ const UI = {
|
||||
/**
|
||||
* Faktencheck-Eintrag rendern.
|
||||
*/
|
||||
factCheckLabels: {
|
||||
confirmed: 'Bestätigt durch mehrere Quellen',
|
||||
unconfirmed: 'Nicht unabhängig bestätigt',
|
||||
contradicted: 'Widerlegt',
|
||||
developing: 'Faktenlage noch im Fluss',
|
||||
established: 'Gesicherter Fakt (3+ Quellen)',
|
||||
disputed: 'Umstrittener Sachverhalt',
|
||||
unverified: 'Nicht unabhängig verifizierbar',
|
||||
_fcStatuses: ['confirmed','unconfirmed','contradicted','developing','established','disputed','unverified'],
|
||||
get factCheckLabels() {
|
||||
const o = {}; this._fcStatuses.forEach(s => o[s] = LangManager.t('fc.' + s)); return o;
|
||||
},
|
||||
|
||||
factCheckTooltips: {
|
||||
confirmed: 'Bestätigt: Mindestens zwei unabhängige, seriöse Quellen stützen diese Aussage übereinstimmend.',
|
||||
established: 'Gesichert: Drei oder mehr unabhängige Quellen bestätigen den Sachverhalt. Hohe Verlässlichkeit.',
|
||||
developing: 'Unklar: Die Faktenlage ist noch im Fluss. Neue Informationen können das Bild verändern.',
|
||||
unconfirmed: 'Unbestätigt: Bisher nur aus einer Quelle bekannt. Eine unabhängige Bestätigung steht aus.',
|
||||
unverified: 'Ungeprüft: Die Aussage konnte bisher nicht anhand verfügbarer Quellen überprüft werden.',
|
||||
disputed: 'Umstritten: Quellen widersprechen sich. Es gibt sowohl stützende als auch widersprechende Belege.',
|
||||
contradicted: 'Widerlegt: Zuverlässige Quellen widersprechen dieser Aussage. Wahrscheinlich falsch.',
|
||||
get factCheckTooltips() {
|
||||
const o = {}; this._fcStatuses.forEach(s => o[s] = LangManager.t('fc_tooltip.' + s)); return o;
|
||||
},
|
||||
|
||||
factCheckChipLabels: {
|
||||
confirmed: 'Bestätigt',
|
||||
unconfirmed: 'Unbestätigt',
|
||||
contradicted: 'Widerlegt',
|
||||
developing: 'Unklar',
|
||||
established: 'Gesichert',
|
||||
disputed: 'Umstritten',
|
||||
unverified: 'Ungeprüft',
|
||||
get factCheckChipLabels() {
|
||||
const o = {}; this._fcStatuses.forEach(s => o[s] = LangManager.t('fc_chip.' + s)); return o;
|
||||
},
|
||||
|
||||
factCheckIcons: {
|
||||
@@ -106,7 +87,7 @@ const UI = {
|
||||
</label>`;
|
||||
}).join('');
|
||||
|
||||
return `<button class="fc-dropdown-toggle" onclick="App.toggleFcDropdown(event)" aria-haspopup="true" aria-expanded="false">Filter</button>
|
||||
return `<button class="fc-dropdown-toggle" onclick="App.toggleFcDropdown(event)" aria-haspopup="true" aria-expanded="false">${LangManager.t('evidence.filter')}</button>
|
||||
<div class="fc-dropdown-menu" id="fc-dropdown-menu">${items}</div>`;
|
||||
},
|
||||
|
||||
@@ -120,7 +101,7 @@ const UI = {
|
||||
<div style="flex:1;">
|
||||
<div class="factcheck-claim">${this.escape(fc.claim)}</div>
|
||||
<div style="display:flex;align-items:center;gap:6px;margin-top:2px;">
|
||||
<span class="factcheck-sources">${count} Quelle${count !== 1 ? 'n' : ''}</span>
|
||||
<span class="factcheck-sources">${count !== 1 ? LangManager.t('evidence.sources', { n: count }) : LangManager.t('evidence.source', { n: count })}</span>
|
||||
</div>
|
||||
<div class="evidence-block">${this.renderEvidence(fc.evidence || '')}</div>
|
||||
</div>
|
||||
@@ -132,7 +113,7 @@ const UI = {
|
||||
* Evidence mit erklärenden Text UND Quellen-Chips rendern.
|
||||
*/
|
||||
renderEvidence(text) {
|
||||
if (!text) return '<span class="evidence-empty">Keine Belege</span>';
|
||||
if (!text) return `<span class="evidence-empty">${LangManager.t('evidence.empty')}</span>`;
|
||||
|
||||
const urls = text.match(/https?:\/\/[^\s,)]+/g) || [];
|
||||
if (urls.length === 0) {
|
||||
@@ -223,12 +204,12 @@ const UI = {
|
||||
bar.classList.remove('progress-bar--complete', 'progress-bar--error');
|
||||
|
||||
const steps = {
|
||||
queued: { active: 0, label: 'In Warteschlange...' },
|
||||
researching: { active: 1, label: 'Recherchiert Quellen...' },
|
||||
deep_researching: { active: 1, label: 'Tiefenrecherche läuft...' },
|
||||
analyzing: { active: 2, label: 'Analysiert Meldungen...' },
|
||||
factchecking: { active: 3, label: 'Faktencheck läuft...' },
|
||||
cancelling: { active: 0, label: 'Wird abgebrochen...' },
|
||||
queued: { active: 0, label: LangManager.t('progress.queued') },
|
||||
researching: { active: 1, label: LangManager.t('progress.researching') },
|
||||
deep_researching: { active: 1, label: LangManager.t('progress.deep_researching') },
|
||||
analyzing: { active: 2, label: LangManager.t('progress.analyzing') },
|
||||
factchecking: { active: 3, label: LangManager.t('progress.factchecking') },
|
||||
cancelling: { active: 0, label: LangManager.t('progress.cancelling') },
|
||||
};
|
||||
|
||||
const step = steps[status] || steps.queued;
|
||||
@@ -236,7 +217,7 @@ const UI = {
|
||||
// Queue-Position anzeigen
|
||||
let labelText = step.label;
|
||||
if (status === 'queued' && extra.queue_position > 1) {
|
||||
labelText = `In Warteschlange (Position ${extra.queue_position})...`;
|
||||
labelText = LangManager.t('progress.queued_position', { position: extra.queue_position });
|
||||
} else if (extra.detail) {
|
||||
labelText = extra.detail;
|
||||
}
|
||||
@@ -325,24 +306,24 @@ const UI = {
|
||||
// Label mit Summary
|
||||
const parts = [];
|
||||
if (data.new_articles > 0) {
|
||||
parts.push(`${data.new_articles} neue Artikel`);
|
||||
parts.push(LangManager.t('progress.new_articles', { n: data.new_articles }));
|
||||
}
|
||||
if (data.confirmed_count > 0) {
|
||||
parts.push(`${data.confirmed_count} Fakten bestätigt`);
|
||||
parts.push(LangManager.t('progress.facts_confirmed', { n: data.confirmed_count }));
|
||||
}
|
||||
if (data.contradicted_count > 0) {
|
||||
parts.push(`${data.contradicted_count} widerlegt`);
|
||||
parts.push(LangManager.t('progress.contradicted', { n: data.contradicted_count }));
|
||||
}
|
||||
const summaryText = parts.length > 0 ? parts.join(', ') : 'Keine neuen Entwicklungen';
|
||||
const summaryText = parts.length > 0 ? parts.join(', ') : LangManager.t('progress.no_developments');
|
||||
const label = document.getElementById('progress-label');
|
||||
if (label) label.textContent = `Abgeschlossen: ${summaryText}`;
|
||||
if (label) label.textContent = LangManager.t('progress.complete_detail', { summary: summaryText });
|
||||
|
||||
// Cancel-Button ausblenden
|
||||
const cancelBtn = document.getElementById('progress-cancel-btn');
|
||||
if (cancelBtn) cancelBtn.style.display = 'none';
|
||||
|
||||
bar.setAttribute('aria-valuenow', '100');
|
||||
bar.setAttribute('aria-valuetext', 'Abgeschlossen');
|
||||
bar.setAttribute('aria-valuetext', LangManager.t('progress.complete'));
|
||||
},
|
||||
|
||||
/**
|
||||
@@ -363,8 +344,8 @@ const UI = {
|
||||
const label = document.getElementById('progress-label');
|
||||
if (label) {
|
||||
label.textContent = willRetry
|
||||
? `Fehlgeschlagen \u2014 erneuter Versuch in ${delay}s...`
|
||||
: `Fehlgeschlagen: ${errorMsg}`;
|
||||
? LangManager.t('progress.failed_retry', { delay })
|
||||
: LangManager.t('progress.failed', { error: errorMsg });
|
||||
}
|
||||
|
||||
// Cancel-Button ausblenden
|
||||
@@ -406,7 +387,7 @@ const UI = {
|
||||
* Zusammenfassung mit Inline-Zitaten und Quellenverzeichnis rendern.
|
||||
*/
|
||||
renderSummary(summary, sourcesJson, incidentType) {
|
||||
if (!summary) return '<span style="color:var(--text-tertiary);">Noch keine Zusammenfassung.</span>';
|
||||
if (!summary) return `<span style="color:var(--text-tertiary);">${LangManager.t('empty.no_summary')}</span>`;
|
||||
|
||||
let sources = [];
|
||||
try { sources = JSON.parse(sourcesJson || '[]'); } catch(e) {}
|
||||
@@ -451,7 +432,7 @@ const UI = {
|
||||
// Nach Quelle aggregieren
|
||||
const sourceMap = {};
|
||||
articles.forEach(a => {
|
||||
const name = a.source || 'Unbekannt';
|
||||
const name = a.source || LangManager.t('time.unknown');
|
||||
if (!sourceMap[name]) {
|
||||
sourceMap[name] = { count: 0, languages: new Set(), urls: [] };
|
||||
}
|
||||
@@ -476,7 +457,7 @@ const UI = {
|
||||
.join('');
|
||||
|
||||
let html = `<div class="source-overview-header">`;
|
||||
html += `<span class="source-overview-stat">${articles.length} Artikel aus ${sources.length} Quellen</span>`;
|
||||
html += `<span class="source-overview-stat">${LangManager.t('sources.articles_from_sources', { articles: articles.length, sources: sources.length })}</span>`;
|
||||
html += `<div class="source-lang-chips">${langChips}</div>`;
|
||||
html += `</div>`;
|
||||
|
||||
@@ -497,17 +478,15 @@ const UI = {
|
||||
/**
|
||||
* Kategorie-Labels.
|
||||
*/
|
||||
_categoryLabels: {
|
||||
'nachrichtenagentur': 'Agentur',
|
||||
'oeffentlich-rechtlich': 'ÖR',
|
||||
'qualitaetszeitung': 'Qualität',
|
||||
'behoerde': 'Behörde',
|
||||
'fachmedien': 'Fach',
|
||||
'think-tank': 'Think Tank',
|
||||
'international': 'Intl.',
|
||||
'regional': 'Regional',
|
||||
'boulevard': 'Boulevard',
|
||||
'sonstige': 'Sonstige',
|
||||
_catKeys: ['nachrichtenagentur','oeffentlich_rechtlich','qualitaetszeitung','behoerde','fachmedien','think_tank','international','regional','boulevard','sonstige'],
|
||||
_catDomainMap: {'oeffentlich-rechtlich':'oeffentlich_rechtlich','think-tank':'think_tank'},
|
||||
get _categoryLabels() {
|
||||
const o = {};
|
||||
this._catKeys.forEach(k => {
|
||||
const domainKey = k.replace(/_/g, '-');
|
||||
o[domainKey] = LangManager.t('sources.cat_short_' + k);
|
||||
});
|
||||
return o;
|
||||
},
|
||||
|
||||
/**
|
||||
@@ -517,7 +496,7 @@ const UI = {
|
||||
const catLabel = this._categoryLabels[feeds[0]?.category] || feeds[0]?.category || '';
|
||||
const feedCount = feeds.filter(f => f.source_type !== 'excluded').length;
|
||||
const hasMultiple = feedCount > 1;
|
||||
const displayName = domain || feeds[0]?.name || 'Unbekannt';
|
||||
const displayName = domain || feeds[0]?.name || LangManager.t('time.unknown');
|
||||
const escapedDomain = this.escape(domain);
|
||||
|
||||
if (isExcluded) {
|
||||
@@ -528,10 +507,10 @@ const UI = {
|
||||
<div class="source-group-info">
|
||||
<span class="source-group-name">${this.escape(displayName)}</span>${notesHtml}
|
||||
</div>
|
||||
<span class="source-excluded-badge">Gesperrt</span>
|
||||
<span class="source-excluded-badge">${LangManager.t('sources.excluded')}</span>
|
||||
<div class="source-group-actions">
|
||||
<button class="btn btn-small btn-secondary" onclick="App.unblockDomain('${escapedDomain}')">Entsperren</button>
|
||||
<button class="source-delete-btn" onclick="App.deleteDomain('${escapedDomain}')" title="Löschen" aria-label="Löschen">×</button>
|
||||
<button class="btn btn-small btn-secondary" onclick="App.unblockDomain('${escapedDomain}')">${LangManager.t('btn.unblock')}</button>
|
||||
<button class="source-delete-btn" onclick="App.deleteDomain('${escapedDomain}')" title="${LangManager.t('btn.delete')}" aria-label="${LangManager.t('btn.delete')}">×</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>`;
|
||||
@@ -548,22 +527,22 @@ const UI = {
|
||||
realFeeds.forEach((feed, i) => {
|
||||
const isLast = i === realFeeds.length - 1;
|
||||
const connector = isLast ? '\u2514\u2500' : '\u251C\u2500';
|
||||
const typeLabel = feed.source_type === 'rss_feed' ? 'RSS' : 'Web';
|
||||
const typeLabel = feed.source_type === 'rss_feed' ? 'RSS' : 'Web'; // RSS/Web are brand names, no translation needed
|
||||
const urlDisplay = feed.url ? this._shortenUrl(feed.url) : '';
|
||||
feedRows += `<div class="source-feed-row">
|
||||
<span class="source-feed-connector">${connector}</span>
|
||||
<span class="source-feed-name">${this.escape(feed.name)}</span>
|
||||
<span class="source-type-badge type-${feed.source_type}">${typeLabel}</span>
|
||||
<span class="source-feed-url" title="${this.escape(feed.url || '')}">${this.escape(urlDisplay)}</span>
|
||||
<button class="source-edit-btn" onclick="App.editSource(${feed.id})" title="Bearbeiten" aria-label="Bearbeiten">✎</button>
|
||||
<button class="source-delete-btn" onclick="App.deleteSingleFeed(${feed.id})" title="Löschen" aria-label="Löschen">×</button>
|
||||
<button class="source-edit-btn" onclick="App.editSource(${feed.id})" title="${LangManager.t('btn.edit')}" aria-label="${LangManager.t('btn.edit')}">✎</button>
|
||||
<button class="source-delete-btn" onclick="App.deleteSingleFeed(${feed.id})" title="${LangManager.t('btn.delete')}" aria-label="${LangManager.t('btn.delete')}">×</button>
|
||||
</div>`;
|
||||
});
|
||||
feedRows += '</div>';
|
||||
}
|
||||
|
||||
const feedCountBadge = feedCount > 0
|
||||
? `<span class="source-feed-count">${feedCount} Feed${feedCount !== 1 ? 's' : ''}</span>`
|
||||
? `<span class="source-feed-count">${feedCount !== 1 ? LangManager.t('sources.feeds_count', {n: feedCount}) : LangManager.t('sources.feed_count', {n: feedCount})}</span>`
|
||||
: '';
|
||||
|
||||
return `<div class="source-group">
|
||||
@@ -575,9 +554,9 @@ const UI = {
|
||||
<span class="source-category-badge cat-${feeds[0]?.category || 'sonstige'}">${catLabel}</span>
|
||||
${feedCountBadge}
|
||||
<div class="source-group-actions" onclick="event.stopPropagation()">
|
||||
${!hasMultiple && feeds[0]?.id ? `<button class="source-edit-btn" onclick="App.editSource(${feeds[0].id})" title="Bearbeiten" aria-label="Bearbeiten">✎</button>` : ''}
|
||||
<button class="btn btn-small btn-secondary" onclick="App.blockDomainDirect('${escapedDomain}')">Sperren</button>
|
||||
<button class="source-delete-btn" onclick="App.deleteDomain('${escapedDomain}')" title="Löschen" aria-label="Löschen">×</button>
|
||||
${!hasMultiple && feeds[0]?.id ? `<button class="source-edit-btn" onclick="App.editSource(${feeds[0].id})" title="${LangManager.t('btn.edit')}" aria-label="${LangManager.t('btn.edit')}">✎</button>` : ''}
|
||||
<button class="btn btn-small btn-secondary" onclick="App.blockDomainDirect('${escapedDomain}')">${LangManager.t('btn.block')}</button>
|
||||
<button class="source-delete-btn" onclick="App.deleteDomain('${escapedDomain}')" title="${LangManager.t('btn.delete')}" aria-label="${LangManager.t('btn.delete')}">×</button>
|
||||
</div>
|
||||
</div>
|
||||
${feedRows}
|
||||
@@ -617,7 +596,7 @@ const UI = {
|
||||
// Statistik trotzdem anzeigen
|
||||
if (locations && locations.length > 0) {
|
||||
const totalArticles = locations.reduce((s, l) => s + l.article_count, 0);
|
||||
if (statsEl) statsEl.textContent = `${locations.length} Orte / ${totalArticles} Artikel`;
|
||||
if (statsEl) statsEl.textContent = LangManager.t('map.stats', {places: locations.length, articles: totalArticles});
|
||||
if (emptyEl) emptyEl.style.display = 'none';
|
||||
}
|
||||
return;
|
||||
@@ -638,7 +617,7 @@ const UI = {
|
||||
|
||||
// Statistik
|
||||
const totalArticles = locations.reduce((s, l) => s + l.article_count, 0);
|
||||
if (statsEl) statsEl.textContent = `${locations.length} Orte / ${totalArticles} Artikel`;
|
||||
if (statsEl) statsEl.textContent = LangManager.t('map.stats', {places: locations.length, articles: totalArticles});
|
||||
|
||||
// Container-Hoehe sicherstellen (Leaflet braucht px-Hoehe)
|
||||
if (container.offsetHeight < 50) {
|
||||
@@ -691,11 +670,11 @@ const UI = {
|
||||
popupHtml += `<div class="map-popup-title">${this.escape(loc.location_name)}`;
|
||||
if (loc.country_code) popupHtml += ` <span class="map-popup-cc">${this.escape(loc.country_code)}</span>`;
|
||||
popupHtml += `</div>`;
|
||||
popupHtml += `<div class="map-popup-count">${loc.article_count} Artikel</div>`;
|
||||
popupHtml += `<div class="map-popup-count">${LangManager.t('map.articles', {n: loc.article_count})}</div>`;
|
||||
popupHtml += `<div class="map-popup-articles">`;
|
||||
const maxShow = 5;
|
||||
loc.articles.slice(0, maxShow).forEach(art => {
|
||||
const headline = this.escape(art.headline || 'Ohne Titel');
|
||||
const headline = this.escape(art.headline || LangManager.t('map.no_title'));
|
||||
const source = this.escape(art.source || '');
|
||||
if (art.source_url) {
|
||||
popupHtml += `<a href="${this.escape(art.source_url)}" target="_blank" rel="noopener" class="map-popup-article">${headline} <span class="map-popup-source">${source}</span></a>`;
|
||||
@@ -704,7 +683,7 @@ const UI = {
|
||||
}
|
||||
});
|
||||
if (loc.articles.length > maxShow) {
|
||||
popupHtml += `<div class="map-popup-more">+${loc.articles.length - maxShow} weitere</div>`;
|
||||
popupHtml += `<div class="map-popup-more">${LangManager.t('map.more', {n: loc.articles.length - maxShow})}</div>`;
|
||||
}
|
||||
popupHtml += `</div></div>`;
|
||||
|
||||
@@ -744,8 +723,8 @@ const UI = {
|
||||
if (layer instanceof L.TileLayer) this._map.removeLayer(layer);
|
||||
});
|
||||
|
||||
// Deutsche OSM-Kacheln: deutsche Ortsnamen, einheitlich fuer beide Themes
|
||||
const tileUrl = 'https://tile.openstreetmap.de/{z}/{x}/{y}.png';
|
||||
// OSM-Kacheln je nach Sprache (DE: deutsche Ortsnamen, EN: internationale)
|
||||
const tileUrl = LangManager.mapTileUrl();
|
||||
const attribution = '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>';
|
||||
|
||||
L.tileLayer(tileUrl, { attribution, maxZoom: 18 }).addTo(this._map);
|
||||
|
||||
@@ -335,6 +335,16 @@ const TRANSLATIONS = {
|
||||
'sources.feeds_count': { de: '{n} Feeds', en: '{n} Feeds' },
|
||||
'sources.feed_count': { de: '{n} Feed', en: '{n} Feed' },
|
||||
'sources.articles_from_sources': { de: '{articles} Artikel aus {sources} Quellen', en: '{articles} articles from {sources} sources' },
|
||||
'sources.cat_short_nachrichtenagentur': { de: 'Agentur', en: 'Agency' },
|
||||
'sources.cat_short_oeffentlich_rechtlich': { de: 'ÖR', en: 'Public' },
|
||||
'sources.cat_short_qualitaetszeitung': { de: 'Qualität', en: 'Quality' },
|
||||
'sources.cat_short_behoerde': { de: 'Behörde', en: 'Gov' },
|
||||
'sources.cat_short_fachmedien': { de: 'Fach', en: 'Trade' },
|
||||
'sources.cat_short_think_tank': { de: 'Think Tank', en: 'Think Tank' },
|
||||
'sources.cat_short_international': { de: 'Intl.', en: 'Intl.' },
|
||||
'sources.cat_short_regional': { de: 'Regional', en: 'Regional' },
|
||||
'sources.cat_short_boulevard': { de: 'Boulevard', en: 'Tabloid' },
|
||||
'sources.cat_short_sonstige': { de: 'Sonstige', en: 'Other' },
|
||||
|
||||
// ── Sidebar labels ─────────────────────────────────────
|
||||
'sidebar.no_adhoc': { de: 'Keine Ad-hoc-Lagen', en: 'No ad-hoc incidents' },
|
||||
@@ -494,6 +504,11 @@ const LangManager = (() => {
|
||||
const key = el.getAttribute('data-i18n-title');
|
||||
if (key) el.setAttribute('title', t(key));
|
||||
});
|
||||
|
||||
// lang-switcher active state
|
||||
document.querySelectorAll('.lang-btn').forEach(btn => {
|
||||
btn.classList.toggle('active', btn.getAttribute('data-lang') === _lang);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
In neuem Issue referenzieren
Einen Benutzer sperren