/**
* AegisSight Lagebild Page - Dark Theme Design Refresh
* Count-Up, Timeline, Scroll-Reveal, Particles, Live-Feed, Pulse-Markers
*/
/** Feste Zeitzone fuer alle Anzeigen - NIEMALS aendern. */
var TIMEZONE = 'Europe/Berlin';
var Lagebild = {
data: null,
allSnapshots: {},
currentView: null,
map: null,
timelineGroups: null,
/* ===== Inline SVG Icons ===== */
icons: {
clock: '',
fileText: '',
globe: '',
shieldCheck: '',
externalLink: ''
},
async init() {
if (typeof initTranslations === 'function') {
try { initTranslations(); } catch(e) {}
}
this.initScrollProgress();
this.initParticles();
try {
var resp = await fetch('data/current.json?t=' + Date.now());
if (!resp.ok) throw new Error('HTTP ' + resp.status);
this.data = await resp.json();
this.currentView = {
summary: this.data.current_lagebild.summary_markdown,
sources_json: this.data.current_lagebild.sources_json,
updated_at: this.data.current_lagebild.updated_at || this.data.generated_at,
articles: this.data.articles,
fact_checks: this.data.fact_checks
};
this.render();
this.initTabs();
this.initLangToggle();
this.initScrollReveal();
this.initFloatingCta();
this.initLiveFeed();
} catch (e) {
console.error('Lagebild laden fehlgeschlagen:', e);
this.showError();
}
},
render: function() {
this.renderHero();
this.renderTimeline();
this.renderTabBadges();
this.renderCurrentView();
},
/* ===== SCROLL PROGRESS BAR ===== */
initScrollProgress: function() {
var bar = document.getElementById('scroll-progress');
if (!bar) return;
window.addEventListener('scroll', function() {
var scrollTop = window.scrollY;
var docHeight = document.documentElement.scrollHeight - window.innerHeight;
if (docHeight <= 0) return;
bar.style.width = ((scrollTop / docHeight) * 100) + '%';
});
},
/* ===== HERO PARTICLES ===== */
initParticles: function() {
var canvas = document.getElementById('hero-particles');
if (!canvas) return;
var ctx = canvas.getContext('2d');
var particles = [];
var count = 35;
var connectDist = 120;
function resize() {
var hero = canvas.parentElement;
canvas.width = hero.offsetWidth;
canvas.height = hero.offsetHeight;
}
resize();
window.addEventListener('resize', resize);
for (var i = 0; i < count; i++) {
particles.push({
x: Math.random() * canvas.width,
y: Math.random() * canvas.height,
vx: (Math.random() - 0.5) * 0.4,
vy: (Math.random() - 0.5) * 0.4,
r: Math.random() * 1.5 + 0.5
});
}
function draw() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
// Draw connections
for (var i = 0; i < particles.length; i++) {
for (var j = i + 1; j < particles.length; j++) {
var dx = particles[i].x - particles[j].x;
var dy = particles[i].y - particles[j].y;
var dist = Math.sqrt(dx * dx + dy * dy);
if (dist < connectDist) {
var alpha = (1 - dist / connectDist) * 0.15;
ctx.beginPath();
ctx.strokeStyle = 'rgba(200, 168, 81, ' + alpha + ')';
ctx.lineWidth = 0.5;
ctx.moveTo(particles[i].x, particles[i].y);
ctx.lineTo(particles[j].x, particles[j].y);
ctx.stroke();
}
}
}
// Draw & move particles
for (var k = 0; k < particles.length; k++) {
var p = particles[k];
ctx.beginPath();
ctx.arc(p.x, p.y, p.r, 0, Math.PI * 2);
ctx.fillStyle = 'rgba(200, 168, 81, 0.4)';
ctx.fill();
p.x += p.vx;
p.y += p.vy;
if (p.x < 0 || p.x > canvas.width) p.vx *= -1;
if (p.y < 0 || p.y > canvas.height) p.vy *= -1;
}
requestAnimationFrame(draw);
}
draw();
},
/* ===== LIVE FEED TICKER ===== */
initLiveFeed: function() {
var container = document.getElementById('live-feed');
if (!container) return;
var d = this.data;
var genDate = new Date(this.toUTC(d.generated_at));
var diffMin = Math.max(1, Math.round((Date.now() - genDate.getTime()) / 60000));
var diffText = diffMin < 60 ? ('vor ' + diffMin + ' Min') : ('vor ' + Math.round(diffMin / 60) + ' Std');
var messages = [
'Letzte Aktualisierung: ' + diffText,
d.incident.source_count + ' Quellen aktiv \u00fcberwacht',
d.incident.article_count + ' Artikel analysiert \u2013 ' + d.incident.factcheck_count + ' Faktenchecks durchgef\u00fchrt',
];
var h = '';
for (var i = 0; i < messages.length; i++) {
h += '
';
h += '';
h += '' + messages[i] + '';
h += '
';
}
container.innerHTML = h;
var current = 0;
var items = container.querySelectorAll('.live-feed-item');
setInterval(function() {
items[current].classList.remove('active');
current = (current + 1) % items.length;
items[current].classList.add('active');
}, 4000);
},
/* ===== HERO ===== */
renderHero: function() {
var d = this.data;
document.getElementById('incident-title').innerHTML =
this.esc(this.fixUmlauts(d.incident.title)) +
' \u2013 Stand: ' + this.fmtDateOnly(d.generated_at) + ', ' + this.fmtTimeOnly(d.generated_at) + ' Uhr';
// Stat Cards (3: Artikel, Quellen, Faktenchecks)
var statsHtml = '';
statsHtml += this.statCard(this.icons.fileText, '0', 'Artikel');
statsHtml += this.statCard(this.icons.globe, '0', 'Quellen');
statsHtml += this.statCard(this.icons.shieldCheck, '0', 'Faktenchecks');
document.getElementById('hero-stats').innerHTML = statsHtml;
// Start count-up animations
var self = this;
requestAnimationFrame(function() {
var els = document.querySelectorAll('.count-up');
for (var i = 0; i < els.length; i++) {
self.animateCount(els[i], parseInt(els[i].getAttribute('data-target')), 800);
}
});
},
statCard: function(icon, value, label) {
return '
' +
'
' + icon + '
' +
'
' +
'' + value + '' +
'' + label + '' +
'
';
},
/* ===== COUNT-UP ANIMATION ===== */
animateCount: function(element, target, duration) {
var start = performance.now();
function update(now) {
var elapsed = now - start;
var progress = Math.min(elapsed / duration, 1);
var eased = 1 - Math.pow(1 - progress, 3); // easeOutCubic
var current = Math.round(target * eased);
element.textContent = current.toLocaleString('de-DE');
if (progress < 1) {
requestAnimationFrame(update);
}
}
requestAnimationFrame(update);
},
/* ===== TIMELINE STRIP ===== */
renderTimeline: function() {
var snaps = this.data.available_snapshots || [];
var current = {
id: 'current',
article_count: this.data.incident.article_count,
fact_check_count: this.data.incident.factcheck_count,
created_at: this.data.generated_at
};
var all = [current].concat(snaps);
// Group by date
var groups = {};
for (var i = 0; i < all.length; i++) {
var s = all[i];
var dateKey = this.toDateKey(s.created_at);
if (!groups[dateKey]) groups[dateKey] = [];
groups[dateKey].push(s);
}
// Sort each group descending (newest first)
for (var dk in groups) {
groups[dk].sort(function(a, b) {
return new Date(Lagebild.toUTC(b.created_at)) - new Date(Lagebild.toUTC(a.created_at));
});
}
this.timelineGroups = groups;
var dates = Object.keys(groups).sort();
var strip = document.getElementById('timeline-strip');
var h = '';
for (var j = 0; j < dates.length; j++) {
var date = dates[j];
var daySnaps = groups[date];
var latest = daySnaps[0];
var isActive = (j === dates.length - 1);
var d = new Date(date + 'T12:00:00Z');
h += '';
}
strip.innerHTML = h;
// Scroll to active day
var active = strip.querySelector('.timeline-day.active');
if (active) {
setTimeout(function() {
active.scrollIntoView({ behavior: 'smooth', inline: 'center', block: 'nearest' });
}, 150);
}
// Click handler for day buttons
var self = this;
strip.addEventListener('click', function(e) {
var btn = e.target.closest('.timeline-day');
if (!btn) return;
var allDays = strip.querySelectorAll('.timeline-day');
for (var k = 0; k < allDays.length; k++) allDays[k].classList.remove('active');
btn.classList.add('active');
var dateKey = btn.getAttribute('data-date');
var snapId = btn.getAttribute('data-snapshot-id');
self.showTimelineDropdown(dateKey, snapId);
if (snapId === 'current') {
self.currentView = {
summary: self.data.current_lagebild.summary_markdown,
sources_json: self.data.current_lagebild.sources_json,
updated_at: self.data.current_lagebild.updated_at || self.data.generated_at,
articles: self.data.articles,
fact_checks: self.data.fact_checks
};
self.renderCurrentView();
} else {
self.loadSnapshot(parseInt(snapId));
}
});
// Click handler for dropdown snapshot items (delegated, set up once)
var dropdown = document.getElementById('timeline-dropdown');
dropdown.addEventListener('click', function(e) {
var item = e.target.closest('.timeline-snap-item');
if (!item) return;
var items = dropdown.querySelectorAll('.timeline-snap-item');
for (var k = 0; k < items.length; k++) items[k].classList.remove('active');
item.classList.add('active');
var snapId = item.getAttribute('data-snapshot-id');
if (snapId === 'current') {
self.currentView = {
summary: self.data.current_lagebild.summary_markdown,
sources_json: self.data.current_lagebild.sources_json,
updated_at: self.data.current_lagebild.updated_at || self.data.generated_at,
articles: self.data.articles,
fact_checks: self.data.fact_checks
};
self.renderCurrentView();
} else {
self.loadSnapshot(parseInt(snapId));
}
});
// Show dropdown for newest day by default
var newestDate = dates[dates.length - 1];
if (newestDate && groups[newestDate].length > 1) {
this.showTimelineDropdown(newestDate, groups[newestDate][0].id);
}
},
showTimelineDropdown: function(dateKey, activeSnapId) {
var dropdown = document.getElementById('timeline-dropdown');
var snaps = this.timelineGroups[dateKey];
if (!snaps || snaps.length <= 1) {
dropdown.classList.remove('open');
dropdown.innerHTML = '';
return;
}
var d = new Date(dateKey + 'T12:00:00Z');
var dateLabel = d.toLocaleDateString('de-DE', { day: 'numeric', month: 'long', year: 'numeric', timeZone: 'UTC' });
var h = '
';
checks = checks.slice().sort(function(a, b) {
var aH = (a.status_history || []).length;
var bH = (b.status_history || []).length;
if (bH !== aH) return bH - aH;
return (b.sources_count || 0) - (a.sources_count || 0);
});
for (var i = 0; i < checks.length; i++) {
var fc = checks[i];
var status = fc.status || 'developing';
var hasProg = fc.status_history && fc.status_history.length > 1;
h += '
';
h += '
';
h += '' + this.stLabel(status) + '';
h += '' + (fc.sources_count || 0) + ' unabh\u00e4ngige Quellen';
h += '
';
h += '
' + this.esc(this.fixUmlauts(fc.claim || '')) + '
';
if (fc.evidence) {
var ev = this.fixUmlauts(fc.evidence);
ev = this.esc(ev).replace(/(https?:\/\/[^\s,)]+)/g, '$1');
h += '
Evidenz: ' + ev + '
';
}
if (hasProg) {
h += '
';
h += 'Verlauf:';
for (var j = 0; j < fc.status_history.length; j++) {
var step = fc.status_history[j];
if (j > 0) h += '→';
h += '';
h += '' + this.stLabel(step.status) + '';
if (step.at) h += '' + this.fmtShort(step.at) + '';
h += '';
}
h += '
';
}
h += '
';
}
document.getElementById('factchecks-content').innerHTML = h;
},
/* ===== TABS ===== */
initTabs: function() {
var btns = document.querySelectorAll('.tab-btn');
var self = this;
for (var i = 0; i < btns.length; i++) {
btns[i].addEventListener('click', function() {
var tab = this.getAttribute('data-tab');
for (var j = 0; j < btns.length; j++) btns[j].classList.remove('active');
this.classList.add('active');
var panels = document.querySelectorAll('.tab-panel');
for (var j = 0; j < panels.length; j++) panels[j].classList.remove('active');
var activePanel = document.getElementById('panel-' + tab);
activePanel.classList.add('active');
// Trigger reveal for cards in newly active panel
var revealCards = activePanel.querySelectorAll('.reveal:not(.revealed)');
for (var k = 0; k < revealCards.length; k++) {
revealCards[k].classList.add('revealed');
}
if (tab === 'karte') self.renderMap();
});
}
},
initLangToggle: function() {
var btn = document.querySelector('.lang-toggle');
if (!btn) return;
btn.addEventListener('click', function(e) {
e.preventDefault();
if (typeof switchLanguage === 'function') {
var cur = (typeof getCurrentLanguage === 'function') ? getCurrentLanguage() : 'de';
switchLanguage(cur === 'de' ? 'en' : 'de');
}
});
},
/* ===== FLOATING CTA ===== */
initFloatingCta: function() {
var cta = document.createElement('div');
cta.className = 'floating-cta';
cta.innerHTML = 'AegisSight Monitor f\u00fcr Ihre Organisation'
+ 'Kontakt aufnehmen \u2192'
+ '';
document.body.appendChild(cta);
// Show after scrolling past hero
var shown = false;
window.addEventListener('scroll', function() {
if (shown) return;
if (window.scrollY > 400) {
cta.classList.add('visible');
shown = true;
}
});
// Close button
cta.querySelector('.floating-cta-close').addEventListener('click', function(e) {
e.preventDefault();
cta.classList.add('dismissed');
setTimeout(function() { cta.classList.remove('dismissed'); }, 60000);
});
},
/* ===== SCROLL REVEAL ===== */
initScrollReveal: function() {
var cards = document.querySelectorAll('.content-card, .lagebild-cta');
if (!('IntersectionObserver' in window)) {
for (var i = 0; i < cards.length; i++) cards[i].classList.add('revealed');
return;
}
var observer = new IntersectionObserver(function(entries) {
entries.forEach(function(entry) {
if (entry.isIntersecting) {
entry.target.classList.add('revealed');
observer.unobserve(entry.target);
}
});
}, { threshold: 0.1 });
for (var i = 0; i < cards.length; i++) {
cards[i].classList.add('reveal');
// Immediately reveal cards in the active (visible) tab panel
var panel = cards[i].closest('.tab-panel');
if (!panel || panel.classList.contains('active')) {
cards[i].classList.add('revealed');
} else {
observer.observe(cards[i]);
}
}
},
/* ===== HILFSFUNKTIONEN ===== */
extractDomain: function(url) {
if (!url) return null;
try { return new URL(url).hostname; } catch(e) { return null; }
},
fixUmlauts: function(text) {
if (!text) return text;
var skip = ['Israel','Israelis','Jazeera','Euronews','Reuters','Februar',
'Juffair','abgefeuert','Feindseligkeiten','Gegenschlag','neuesten',
'auszuweiten','befeuert','feuerte','Feuer','feuer','neue','neuen',
'neuer','neues','Neue','Aero','aero','Manoeuvre','Dauerfeuer'];
var ph = []; var c = 0;
for (var i = 0; i < skip.length; i++) {
var re = new RegExp('\\b' + skip[i] + '\\b', 'g');
text = text.replace(re, function(m) { ph.push(m); return '##S' + (c++) + '##'; });
}
text = text.replace(/ae/g, '\u00e4').replace(/Ae/g, '\u00c4');
text = text.replace(/oe/g, '\u00f6').replace(/Oe/g, '\u00d6');
text = text.replace(/ue/g, '\u00fc').replace(/Ue/g, '\u00dc');
text = text.replace(/##S(\d+)##/g, function(m, idx) { return ph[parseInt(idx)]; });
return text;
},
stLabel: function(s) {
return { confirmed: 'Best\u00e4tigt', unconfirmed: 'Unbest\u00e4tigt', established: 'Gesichert',
unverified: 'Nicht verifiziert', contradicted: 'Widerlegt', disputed: 'Umstritten',
developing: 'In Entwicklung', 'false': 'Falsch' }[s] || s;
},
mdToHtml: function(md) {
if (!md) return '';
var lines = md.split('\n'), html = '', inList = false;
for (var i = 0; i < lines.length; i++) {
var l = lines[i];
if (/^### (.+)$/.test(l)) { if (inList) { html += ''; inList = false; } html += '
' + l.replace(/^### /, '') + '
'; continue; }
if (/^## (.+)$/.test(l)) { if (inList) { html += ''; inList = false; } html += '
' + l.replace(/^## /, '') + '
'; continue; }
if (/^[-*] (.+)$/.test(l)) { if (!inList) { html += '
'; inList = true; } html += '
' + l.replace(/^[-*] /, '') + '
'; continue; }
if (inList) { html += '
'; inList = false; }
if (l.trim() === '') continue;
html += '
' + l + '
';
}
if (inList) html += '';
html = html.replace(/\*\*(.+?)\*\*/g, '$1');
html = html.replace(/\*(.+?)\*/g, '$1');
return html;
},
esc: function(s) { if (!s) return ''; var d = document.createElement('div'); d.textContent = s; return d.innerHTML; },
toUTC: function(s) {
if (!s) return s;
s = String(s).trim();
if (/[Zz]$/.test(s) || /[+-]\d{2}:?\d{2}$/.test(s)) return s;
return s.replace(' ', 'T') + 'Z';
},
fmtDT: function(iso) {
if (!iso) return '';
try {
var d = new Date(this.toUTC(iso));
if (isNaN(d.getTime())) return iso;
var opts = { timeZone: TIMEZONE, weekday: 'long', day: 'numeric', month: 'long', year: 'numeric', hour: '2-digit', minute: '2-digit', hour12: false };
var parts = new Intl.DateTimeFormat('de-DE', opts).formatToParts(d);
var p = {};
parts.forEach(function(x) { p[x.type] = x.value; });
return p.weekday + ', ' + p.day + '. ' + p.month + ' ' + p.year
+ ' um ' + p.hour + ':' + p.minute + ' Uhr';
} catch(e) { return iso; }
},
fmtDateOnly: function(iso) {
if (!iso) return '';
try {
var d = new Date(this.toUTC(iso));
if (isNaN(d.getTime())) return iso;
return d.toLocaleDateString('de-DE', { day: 'numeric', month: 'short', year: 'numeric', timeZone: TIMEZONE });
} catch(e) { return iso; }
},
fmtTimeOnly: function(iso) {
if (!iso) return '';
try {
var d = new Date(this.toUTC(iso));
if (isNaN(d.getTime())) return iso;
return d.toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit', timeZone: TIMEZONE });
} catch(e) { return iso; }
},
fmtShort: function(iso) {
if (!iso) return '';
try { return new Date(this.toUTC(iso)).toLocaleDateString('de-DE', { day: 'numeric', month: 'short', hour: '2-digit', minute: '2-digit', timeZone: TIMEZONE }); }
catch(e) { return iso; }
},
showError: function() {
document.getElementById('summary-content').innerHTML =
'
Das Lagebild konnte nicht geladen werden. Bitte versuchen Sie es sp\u00e4ter erneut.
 + '&sz=16)
';
ah += this.esc(a.source || '') + '';
if (a.language) ah += '' + a.language.toUpperCase() + '';
if (dObj && !isNaN(dObj.getTime())) {
ah += '' + dObj.toLocaleDateString('de-DE', { day: '2-digit', month: '2-digit', year: 'numeric', timeZone: TIMEZONE }) + ', ' + dObj.toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit', timeZone: TIMEZONE }) + ' Uhr';
}
if (a.source_url) ah += 'Artikel lesen ' + this.icons.externalLink + '';
ah += '