AegisSight/AegisSight-Monitor
3
0
Fork 0
Code Issues Pull-Requests Actions Pakete Projekte Releases Wiki Aktivität

Fix Tutorial-Hinweis im Chat: sessionStorage statt localStorage, Close-Button

Quellcode durchsuchen 
- Hinweis erscheint beim ersten Chat-Oeffnen jeder Browser-Session
- X-Button zum Wegklicken (setzt sessionStorage, nicht localStorage)
- Klick auf Hinweis-Text startet Tutorial und schliesst Chat
- Naechste Session zeigt den Hinweis erneut an

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Dieser Commit ist enthalten in:
Claude Dev
2026-03-16 14:36:17 +01:00
Ursprung d5022f0d6f
Commit c031fec27e
3 geänderte Dateien mit 47 neuen und 6 gelöschten Zeilen
Patch-Datei herunterladen Vergleichs-Datei herunterladen Alle Dateien ausklappen Alle Dateien einklappen

25
src/static/css/style.css
Datei anzeigen

@@ -5203,3 +5203,28 @@ a.map-popup-article:hover {
0%, 100% { outline-color: var(--accent); } 0%, 100% { outline-color: var(--accent); }
50% { outline-color: rgba(150, 121, 26, 0.4); } 50% { outline-color: rgba(150, 121, 26, 0.4); }
} }
/* Chat Tutorial-Hint Layout */
.chat-tutorial-hint {
display: flex;
align-items: flex-start;
gap: var(--sp-md);
}
.chat-tutorial-hint-text {
flex: 1;
cursor: pointer;
}
.chat-tutorial-hint-close {
flex-shrink: 0;
background: none;
border: none;
color: var(--text-secondary);
font-size: 18px;
cursor: pointer;
padding: 0 2px;
line-height: 1;
transition: color 0.15s;
}
.chat-tutorial-hint-close:hover {
color: var(--text-primary);
}

4
src/static/dashboard.html
Datei anzeigen

@@ -17,7 +17,7 @@
<link rel="stylesheet" href="/static/vendor/MarkerCluster.css"> <link rel="stylesheet" href="/static/vendor/MarkerCluster.css">
<link rel="stylesheet" href="/static/vendor/MarkerCluster.Default.css"> <link rel="stylesheet" href="/static/vendor/MarkerCluster.Default.css">
<link rel="stylesheet" href="/static/css/network.css?v=20260316a"> <link rel="stylesheet" href="/static/css/network.css?v=20260316a">
<link rel="stylesheet" href="/static/css/style.css?v=20260316d"> <link rel="stylesheet" href="/static/css/style.css?v=20260316e">
</head> </head>
<body> <body>
<a href="#main-content" class="skip-link">Zum Hauptinhalt springen</a> <a href="#main-content" class="skip-link">Zum Hauptinhalt springen</a>
@@ -765,7 +765,7 @@
<script src="/static/js/network-graph.js?v=20260316a"></script> <script src="/static/js/network-graph.js?v=20260316a"></script>
<script src="/static/js/app_network.js?v=20260316a"></script> <script src="/static/js/app_network.js?v=20260316a"></script>
<script src="/static/js/tutorial.js?v=20260316b"></script> <script src="/static/js/tutorial.js?v=20260316b"></script>
<script src="/static/js/chat.js?v=20260316c"></script> <script src="/static/js/chat.js?v=20260316d"></script>
<script>document.addEventListener("DOMContentLoaded",function(){Chat.init();Tutorial.init()});</script> <script>document.addEventListener("DOMContentLoaded",function(){Chat.init();Tutorial.init()});</script>
<!-- Map Fullscreen Overlay --> <!-- Map Fullscreen Overlay -->

24
src/static/js/chat.js
Datei anzeigen

@@ -64,8 +64,8 @@ const Chat = {
if (!this._hasGreeted) { if (!this._hasGreeted) {
this._hasGreeted = true; this._hasGreeted = true;
this.addMessage('assistant', 'Hallo! Ich bin der AegisSight Assistent und helfe dir bei der Bedienung des Monitors.\n\nFrag mich zum Beispiel:\n\n"Wie erstelle ich eine neue Lage?"\n"Was bedeuten die Faktencheck-Status?"\n"Wie funktioniert der automatische Refresh?"\n"Wie nutze ich die Kartenansicht?"\n"Wie exportiere ich einen Lagebericht?"\n\nFür alle weiteren Anliegen erreichst du den Support unter support@aegis-sight.de.'); this.addMessage('assistant', 'Hallo! Ich bin der AegisSight Assistent und helfe dir bei der Bedienung des Monitors.\n\nFrag mich zum Beispiel:\n\n"Wie erstelle ich eine neue Lage?"\n"Was bedeuten die Faktencheck-Status?"\n"Wie funktioniert der automatische Refresh?"\n"Wie nutze ich die Kartenansicht?"\n"Wie exportiere ich einen Lagebericht?"\n\nFür alle weiteren Anliegen erreichst du den Support unter support@aegis-sight.de.');
// Tutorial-Hinweis beim ersten Oeffnen // Tutorial-Hinweis beim ersten Chat-Oeffnen der Session
if (typeof Tutorial !== "undefined" && !Tutorial._hasSeen()) { if (typeof Tutorial !== 'undefined' && !sessionStorage.getItem('osint_tutorial_hint_dismissed')) {
this._showTutorialHint(); this._showTutorialHint();
} }
} }
@@ -293,11 +293,27 @@ const Chat = {
if (!container) return; if (!container) return;
var hint = document.createElement('div'); var hint = document.createElement('div');
hint.className = 'chat-tutorial-hint'; hint.className = 'chat-tutorial-hint';
hint.innerHTML = '<strong>Tipp:</strong> Kennen Sie schon den interaktiven Rundgang? Er zeigt Ihnen Schritt für Schritt alle Funktionen des Monitors. Klicken Sie hier, um den Rundgang zu starten.'; hint.id = 'chat-tutorial-hint';
hint.addEventListener('click', function() { var textDiv = document.createElement('div');
textDiv.className = 'chat-tutorial-hint-text';
textDiv.innerHTML = '<strong>Tipp:</strong> Kennen Sie schon den interaktiven Rundgang? Er zeigt Ihnen Schritt f\u00fcr Schritt alle Funktionen des Monitors. Klicken Sie hier, um ihn zu starten.';
textDiv.style.cursor = 'pointer';
textDiv.addEventListener('click', function() {
Chat.close(); Chat.close();
sessionStorage.setItem('osint_tutorial_hint_dismissed', '1');
if (typeof Tutorial !== 'undefined') Tutorial.start(); if (typeof Tutorial !== 'undefined') Tutorial.start();
}); });
var closeBtn = document.createElement('button');
closeBtn.className = 'chat-tutorial-hint-close';
closeBtn.title = 'Schlie\u00dfen';
closeBtn.innerHTML = '&times;';
closeBtn.addEventListener('click', function(e) {
e.stopPropagation();
hint.remove();
sessionStorage.setItem('osint_tutorial_hint_dismissed', '1');
});
hint.appendChild(textDiv);
hint.appendChild(closeBtn);
container.appendChild(hint); container.appendChild(hint);
}, },