From 3cd5623fa614aabd1bc173f95f1c08ccfcbdc2f4 Mon Sep 17 00:00:00 2001 From: Claude Code Date: Thu, 9 Apr 2026 23:36:29 +0200 Subject: [PATCH] =?UTF-8?q?Vorschau:=20Stats-Bar=20dynamisch=20pro=20Lage,?= =?UTF-8?q?=20Hero-Kontakt-Buttons=20entfernt,=20Deepfakes-Excerpt=20gek?= =?UTF-8?q?=C3=BCrzt?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Stats-Bar (Titel, Artikel, Quellen, Faktenchecks) wechselt beim Carousel-Wechsel - countUp-Animation in äußeren Scope verschoben für Wiederverwendung - lageTitles-Mapping für Anzeigenamen der Lagen - Kontakt-Buttons aus allen Hero-Slides entfernt - Deepfakes-Excerpt auf Stichpunkte beschränkt (Fließtext gefiltert) Co-Authored-By: Claude Opus 4.6 (1M context) --- vorschau/index.html | 5 ---- vorschau/js/app.js | 62 ++++++++++++++++++++++++++++++++------------- 2 files changed, 44 insertions(+), 23 deletions(-) diff --git a/vorschau/index.html b/vorschau/index.html index 2f777fb..623b506 100644 --- a/vorschau/index.html +++ b/vorschau/index.html @@ -96,7 +96,6 @@

Live-Beispiel: Der Iran-Konflikt wird mit über 14.900 Artikeln aus 375 Quellen kontinuierlich überwacht.

Live-Beispiel ansehen -
@@ -111,7 +110,6 @@

Jede Behauptung geprüft. Automatisch.

Kernaussagen werden automatisch gegen unabhängige Quellen verifiziert und mit einem Verifikationsstatus versehen: bestätigt, widersprüchlich oder unbelegt. Widersprechen sich Quellen, wird das transparent dargestellt. Wenn neue Belege auftauchen, aktualisiert sich die Bewertung automatisch. Keine blinden Flecken, keine manuelle Nachrecherche, systematische Verifikation über alle Lagebilder hinweg.

-
@@ -128,7 +126,6 @@

Beispiel: Ein Dossier zur rechtlichen Lage von Deepfakes in Deutschland, 121 Artikel aus 90 Quellen, automatisch erstellt.

Recherche-Beispiel ansehen -
@@ -145,7 +142,6 @@

Im Iran-Konflikt werden Primärquellen in Farsi, Arabisch und Hebräisch direkt ausgewertet.

Live-Beispiel ansehen -
@@ -162,7 +158,6 @@

Beispiel: Cyberangriffe auf deutsche Infrastruktur, 93 Artikel aus 41 Quellen, automatisch überwacht.

Live-Beispiel ansehen -
diff --git a/vorschau/js/app.js b/vorschau/js/app.js index f8b2356..f2cba37 100644 --- a/vorschau/js/app.js +++ b/vorschau/js/app.js @@ -129,6 +129,12 @@ var lageData = {}; var dataLoaded = false; + var lageTitles = { + 'iran-konflikt': 'Gro\u00dflage - Irankonflikt', + 'cyberangriffe': 'Cyberangriffe auf deutsche Infrastruktur', + 'deepfakes': 'Rechtliche Lage von Deepfakes in Deutschland' + }; + /* ==================== 3D CAROUSEL ==================== */ var cards = document.querySelectorAll('.carousel-card'); var dots = document.querySelectorAll('.carousel-dot'); @@ -153,6 +159,12 @@ if (lage && lageData[lage]) { mapSection.classList.remove('map-hidden'); showMarkers(lageData[lage].locations, lageData[lage].category_labels); + // Stats-Bar aktualisieren + var titleEl = document.querySelector('.live-stats-title'); + if (titleEl) titleEl.textContent = lageTitles[lage] || lage; + countUp(document.getElementById('stat-articles'), lageData[lage].article_count); + countUp(document.getElementById('stat-sources'), lageData[lage].source_count); + countUp(document.getElementById('stat-factchecks'), lageData[lage].factcheck_count); } else { if (mapSection) mapSection.classList.add('map-hidden'); clearMarkers(); @@ -212,6 +224,23 @@ function mdToHtml(md) { if (inList) html += ''; return html; } + + /* ==================== COUNT-UP ANIMATION ==================== */ + function countUp(el, target) { + if (!el) return; + if (!target) { el.textContent = '0'; return; } + var duration = 1200; + var startTime = null; + function step(ts) { + if (!startTime) startTime = ts; + var progress = Math.min((ts - startTime) / duration, 1); + var ease = 1 - Math.pow(1 - progress, 3); + el.textContent = Math.floor(ease * target).toLocaleString('de-DE'); + if (progress < 1) requestAnimationFrame(step); + } + requestAnimationFrame(step); + } + /* ==================== LIVE DATA ==================== */ function timeAgo(dateStr) { var diffMin = Math.floor((Date.now() - new Date(dateStr).getTime()) / 60000); @@ -233,20 +262,6 @@ function mdToHtml(md) { var ea = document.getElementById('stat-articles'); var es = document.getElementById('stat-sources'); var ef = document.getElementById('stat-factchecks'); - function countUp(el, target) { - if (!el || !target) return; - var start = 0; - var duration = 1200; - var startTime = null; - function step(ts) { - if (!startTime) startTime = ts; - var progress = Math.min((ts - startTime) / duration, 1); - var ease = 1 - Math.pow(1 - progress, 3); - el.textContent = Math.floor(ease * target).toLocaleString('de-DE'); - if (progress < 1) requestAnimationFrame(step); - } - requestAnimationFrame(step); - } countUp(ea, inc.article_count); countUp(es, inc.source_count); countUp(ef, inc.factcheck_count); @@ -260,7 +275,10 @@ function mdToHtml(md) { // Store data and init map lageData['iran-konflikt'] = { locations: data.locations || [], - category_labels: data.category_labels || {} + category_labels: data.category_labels || {}, + article_count: inc.article_count || 0, + source_count: inc.source_count || 0, + factcheck_count: inc.factcheck_count || 0 }; dataLoaded = true; createMap(); @@ -442,13 +460,18 @@ function mdToHtml(md) { .then(function (data) { var excerptEl = document.getElementById('excerpt-text-deepfakes'); if (excerptEl && data.zusammenfassung) { - excerptEl.innerHTML = mdToHtml(data.zusammenfassung); + var lines = data.zusammenfassung.split("\n"); + var filtered = lines.filter(function(l) { var t = l.trim(); return !t || t.indexOf("## ") === 0 || t.indexOf("- ") === 0; }); + excerptEl.innerHTML = mdToHtml(filtered.join("\n")); } // Store data for map lageData['deepfakes'] = { locations: data.locations || [], - category_labels: data.category_labels || {} + category_labels: data.category_labels || {}, + article_count: (data.incident || {}).article_count || 0, + source_count: (data.incident || {}).source_count || 0, + factcheck_count: (data.incident || {}).factcheck_count || 0 }; }) .catch(function () { @@ -468,7 +491,10 @@ function mdToHtml(md) { } lageData['cyberangriffe'] = { locations: data.locations || [], - category_labels: data.category_labels || {} + category_labels: data.category_labels || {}, + article_count: (data.incident || {}).article_count || 0, + source_count: (data.incident || {}).source_count || 0, + factcheck_count: (data.incident || {}).factcheck_count || 0 }; }) .catch(function () {