mstoeck3/forensic-pathways
2
0
Fork 0
Code Issues 17 Pull Requests Projects Releases Activity

iteration 2

Browse Source
This commit is contained in:
overcuriousity
2025-07-27 15:55:26 +02:00
parent 4edb0f0000
commit 4ba29227ab
2 changed files with 208 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

96
src/pages/index.astro
View File

@@ -102,6 +102,61 @@ const tools = data.tools;
</div>
</div>
</section>
<!-- NIST Methodology Section -->
<section id="methodology-section" class="methodology-section">
<div class="methodology-header">
<h3>NIST SP 800-86 Forensische Methodik</h3>
<p class="methodology-subtitle">
Wählen Sie eine Phase aus dem bewährten Vier-Phasen-Modell
</p>
</div>
<div class="nist-workflow">
<div class="phase-card collection" onclick="selectPhase('data-collection')">
<div class="phase-number">1</div>
<div class="phase-title">Datensammlung</div>
<p class="phase-description">
Beweismittel identifizieren, sichern und für die Analyse vorbereiten
</p>
<span class="tool-count">{tools.filter(t => t.phases?.includes('data-collection')).length} Tools</span>
</div>
<div class="phase-card examination" onclick="selectPhase('examination')">
<div class="phase-number">2</div>
<div class="phase-title">Auswertung</div>
<p class="phase-description">
Daten extrahieren, strukturiert aufbereiten und zugänglich machen
</p>
<span class="tool-count">{tools.filter(t => t.phases?.includes('examination')).length} Tools</span>
</div>
<div class="phase-card analysis" onclick="selectPhase('analysis')">
<div class="phase-number">3</div>
<div class="phase-title">Analyse</div>
<p class="phase-description">
Beweise bewerten, Zusammenhänge erkennen und Hypothesen prüfen
</p>
<span class="tool-count">{tools.filter(t => t.phases?.includes('analysis')).length} Tools</span>
</div>
<div class="phase-card reporting" onclick="selectPhase('reporting')">
<div class="phase-number">4</div>
<div class="phase-title">Bericht</div>
<p class="phase-description">
Ergebnisse dokumentieren, visualisieren und präsentieren
</p>
<span class="tool-count">{tools.filter(t => t.phases?.includes('reporting')).length} Tools</span>
</div>
</div>
<div class="methodology-tip">
<p>
<strong>Tipp:</strong> Für komplexe Ermittlungen empfiehlt sich das sequenzielle Durchlaufen aller Phasen.
Jede Phase baut methodisch auf der vorherigen auf.
</p>
</div>
</section>
<section id="filters-section" style="padding: 2rem 0;">
<div style="text-align: center; margin-bottom: 2rem;">
@@ -132,6 +187,7 @@ const tools = data.tools;
<script define:vars={{ toolsData: data.tools }}>
window.toolsData = toolsData;
// Approach selection functionality
window.selectApproach = function(approach) {
console.log(`Selected approach: ${approach}`);
@@ -147,15 +203,11 @@ const tools = data.tools;
document.querySelector(`.approach-card.${approach}`).classList.add('selected');
if (approach === 'methodology') {
// Show NIST methodology section (implemented in Phase 2)
// Show NIST methodology section
const methodologySection = document.getElementById('methodology-section');
if (methodologySection) {
methodologySection.classList.add('active');
methodologySection.scrollIntoView({ behavior: 'smooth', block: 'start' });
} else {
// For now, show a placeholder message
alert('NIST-Methodologie wird in Phase 2 implementiert. Verwenden Sie vorerst die Standard-Werkzeugauswahl unten.');
document.getElementById('filters-section').scrollIntoView({ behavior: 'smooth' });
}
} else if (approach === 'targeted') {
// Show targeted scenarios section (implemented in Phase 3)
@@ -170,6 +222,40 @@ const tools = data.tools;
}
}
};
// Phase selection function (integrates with existing ToolFilters)
window.selectPhase = function(phase) {
console.log(`Selected NIST phase: ${phase}`);
// Remove active class from all phase cards
document.querySelectorAll('.phase-card').forEach(card => {
card.classList.remove('active');
});
// Add active class to selected phase
document.querySelector(`.phase-card.${phase.replace('data-', '')}`).classList.add('active');
// Use existing phase filter functionality
const existingPhaseButton = document.querySelector(`[data-phase="${phase}"]`);
if (existingPhaseButton && !existingPhaseButton.classList.contains('active')) {
existingPhaseButton.click();
}
// Switch to grid view to show results
const gridToggle = document.querySelector('.view-toggle[data-view="grid"]');
if (gridToggle && !gridToggle.classList.contains('active')) {
gridToggle.click();
}
// Scroll to results after a short delay
setTimeout(() => {
const toolsGrid = document.getElementById('tools-grid');
if (toolsGrid) {
toolsGrid.scrollIntoView({ behavior: 'smooth', block: 'start' });
}
}, 300);
};
document.addEventListener('DOMContentLoaded', () => {
const toolsContainer = document.getElementById('tools-container');
const toolsGrid = document.getElementById('tools-grid');