ee0ce7fcff
- Moved result display outside tabs for unified experience - Fixed dropdown disappearing issue in personas - Implemented mapping-files system in personas.yml - Cleaned up personas.yml structure (removed unused fields) - Updated ausbildung-value codes (AUSBILDUNG/HS/LA) - Enhanced markdown rendering with proper link support - Fixed path resolution for Bundeslaender content - Improved tab persistence and content reset functionality - Added proper marginal sidebar support for both tabs - Streamlined HTML structure and removed duplicate elements
774 lines
25 KiB
JavaScript
774 lines
25 KiB
JavaScript
// personas.js – Logik für den Personas-Tab (Tab 1)
|
||
|
||
let personasData = {}; // Geladene Personas-Daten aus personas.yml
|
||
let currentPersona = 'birgit'; // Aktuell ausgewählte Persona
|
||
|
||
// Lädt Personas-Daten aus YML und speichert sie global
|
||
async function loadPersonasData() {
|
||
try {
|
||
const response = await fetch('Steuerungsdateien/personas.yml');
|
||
const text = await response.text();
|
||
personasData = jsyaml.load(text);
|
||
console.log('[DEBUG] Personas-Daten geladen:', personasData);
|
||
initializePersonas();
|
||
} catch (err) {
|
||
console.error("Fehler beim Laden der personas.yml:", err);
|
||
}
|
||
}
|
||
|
||
// Initialisiert die Personas-Funktionalität
|
||
function initializePersonas() {
|
||
console.log('[DEBUG] Initialisiere Personas mit Daten:', personasData);
|
||
|
||
// Event Listener für Persona-Klicks hinzufügen
|
||
const personaElements = document.querySelectorAll('.persona');
|
||
console.log('[DEBUG] Gefundene Persona-Elemente:', personaElements.length);
|
||
|
||
personaElements.forEach((persona, index) => {
|
||
const personaName = persona.getAttribute('data-name');
|
||
console.log(`[DEBUG] Persona ${index + 1}: ${personaName}`);
|
||
|
||
persona.addEventListener('click', function() {
|
||
console.log('[DEBUG] Persona geklickt:', personaName);
|
||
selectPersona(personaName);
|
||
});
|
||
});
|
||
|
||
// Aktuelle Persona als ausgewählt markieren
|
||
markPersonaAsSelected(currentPersona);
|
||
|
||
// Bundesland-Dropdown für aktuelle Persona
|
||
setupBundeslandDropdown();
|
||
|
||
// Initiale Persona-Daten laden
|
||
if (personasData[currentPersona]) {
|
||
updateMainPortrait(personasData[currentPersona]);
|
||
updateBundeslandDropdown(personasData[currentPersona]);
|
||
// updatePersonaButton entfernt
|
||
|
||
// Lade automatisch die Texte für die initiale Persona
|
||
setTimeout(() => {
|
||
loadPersonaMarkdownContentOnly(currentPersona);
|
||
}, 500);
|
||
}
|
||
}
|
||
|
||
// Wechselt zur ausgewählten Persona
|
||
function selectPersona(personaName) {
|
||
if (!personasData[personaName]) {
|
||
console.error('Persona nicht gefunden:', personaName);
|
||
return;
|
||
}
|
||
|
||
const persona = personasData[personaName];
|
||
const previousPersona = currentPersona;
|
||
currentPersona = personaName;
|
||
|
||
// Hauptportrait aktualisieren
|
||
updateMainPortrait(persona);
|
||
|
||
// Persona-Positionen tauschen
|
||
swapPersonaPositions(previousPersona, personaName);
|
||
|
||
// Persona als ausgewählt markieren
|
||
markPersonaAsSelected(personaName);
|
||
|
||
// Bundesland-Dropdown aktualisieren
|
||
updateBundeslandDropdown(persona);
|
||
|
||
// Button-Text aktualisieren (entfernt)
|
||
|
||
// Lade automatisch die Texte für die ausgewählte Persona
|
||
setTimeout(() => {
|
||
loadPersonaMarkdownContentOnly(currentPersona);
|
||
}, 200);
|
||
|
||
console.log('[DEBUG] Persona gewechselt von', previousPersona, 'zu:', personaName);
|
||
}
|
||
|
||
// Aktualisiert das Hauptportrait mit Persona-Daten
|
||
function updateMainPortrait(persona) {
|
||
// Bild aktualisieren
|
||
const imageElement = document.getElementById('persona-image');
|
||
if (imageElement) {
|
||
imageElement.src = persona.bild;
|
||
imageElement.alt = persona.name;
|
||
}
|
||
|
||
// Name und Alter aktualisieren
|
||
const nameElement = document.getElementById('persona-name');
|
||
if (nameElement) {
|
||
nameElement.innerHTML = `${persona.name} <span class="meta">${persona.alter} Jahre</span>`;
|
||
}
|
||
|
||
// Titel aktualisieren
|
||
const titleElement = document.getElementById('persona-title');
|
||
if (titleElement) {
|
||
titleElement.textContent = persona.titel;
|
||
}
|
||
|
||
// Text aktualisieren (mit Placeholder-Ersetzungen)
|
||
const textElement = document.getElementById('persona-text');
|
||
if (textElement) {
|
||
let text = persona.text;
|
||
|
||
// Bundesland-Placeholder ersetzen
|
||
text = text.replace(/\{\{BUNDESLAND_SELECT\}\}/g, getBundeslandName(persona.bundesland));
|
||
|
||
// Ausbildung-Placeholder ersetzen
|
||
text = text.replace(/\{\{AUSBILDUNG_SELECT\}\}/g, persona.ausbildung);
|
||
|
||
// Informatik-Placeholder ersetzen
|
||
// INFORMATIK_SELECT wird nicht mehr verwendet
|
||
|
||
// Abschluss-Placeholder ersetzen
|
||
text = text.replace(/\{\{ABSCHLUSS_SELECT\}\}/g, getAbschlussName(persona['abschluss-value']));
|
||
|
||
textElement.innerHTML = text;
|
||
}
|
||
}
|
||
|
||
// Tauscht die Positionen von zwei Personas
|
||
function swapPersonaPositions(persona1, persona2) {
|
||
if (persona1 === persona2) return; // Kein Tausch nötig
|
||
|
||
const persona1Element = document.querySelector(`.persona[data-name="${persona1}"]`);
|
||
const persona2Element = document.querySelector(`.persona[data-name="${persona2}"]`);
|
||
|
||
if (!persona1Element || !persona2Element) {
|
||
console.error('Persona-Elemente nicht gefunden für Tausch:', persona1, persona2);
|
||
return;
|
||
}
|
||
|
||
// Temporäre Platzhalter erstellen
|
||
const temp1 = document.createElement('div');
|
||
const temp2 = document.createElement('div');
|
||
|
||
// Elemente tauschen
|
||
persona1Element.parentNode.insertBefore(temp1, persona1Element);
|
||
persona2Element.parentNode.insertBefore(temp2, persona2Element);
|
||
|
||
temp1.parentNode.insertBefore(persona2Element, temp1);
|
||
temp2.parentNode.insertBefore(persona1Element, temp2);
|
||
|
||
// Platzhalter entfernen
|
||
temp1.remove();
|
||
temp2.remove();
|
||
|
||
console.log('[DEBUG] Persona-Positionen getauscht:', persona1, '↔', persona2);
|
||
}
|
||
|
||
// Markiert eine Persona als ausgewählt (visuell)
|
||
function markPersonaAsSelected(personaName) {
|
||
// Alle Personas zurücksetzen
|
||
document.querySelectorAll('.persona').forEach(p => {
|
||
p.classList.remove('selected');
|
||
const img = p.querySelector('img');
|
||
if (img) {
|
||
img.style.filter = 'grayscale(100%)';
|
||
}
|
||
});
|
||
|
||
// Aktuelle Persona markieren
|
||
const selectedPersona = document.querySelector(`.persona[data-name="${personaName}"]`);
|
||
if (selectedPersona) {
|
||
selectedPersona.classList.add('selected');
|
||
const img = selectedPersona.querySelector('img');
|
||
if (img) {
|
||
img.style.filter = 'none';
|
||
}
|
||
}
|
||
}
|
||
|
||
// Bundesland-Code zu Name konvertieren
|
||
function getBundeslandName(code) {
|
||
const bundeslaender = {
|
||
'BW': 'Baden-Württemberg',
|
||
'BY': 'Bayern',
|
||
'BE': 'Berlin',
|
||
'BB': 'Brandenburg',
|
||
'HB': 'Bremen',
|
||
'HH': 'Hamburg',
|
||
'HE': 'Hessen',
|
||
'MV': 'Mecklenburg-Vorpommern',
|
||
'NI': 'Niedersachsen',
|
||
'NW': 'Nordrhein-Westfalen',
|
||
'RP': 'Rheinland-Pfalz',
|
||
'SL': 'Saarland',
|
||
'SN': 'Sachsen',
|
||
'ST': 'Sachsen-Anhalt',
|
||
'SH': 'Schleswig-Holstein',
|
||
'TH': 'Thüringen',
|
||
'NRW': 'Nordrhein-Westfalen'
|
||
};
|
||
return bundeslaender[code] || code;
|
||
}
|
||
|
||
// Abschluss-Code zu Name konvertieren
|
||
function getAbschlussName(code) {
|
||
const abschluesse = {
|
||
'B': 'Bachelor',
|
||
'M': 'Master',
|
||
'D': 'Doktorat',
|
||
'A': 'Ausbildung'
|
||
};
|
||
return abschluesse[code] || code;
|
||
}
|
||
|
||
// Bundesland-Dropdown einrichten
|
||
function setupBundeslandDropdown() {
|
||
const textElement = document.getElementById('persona-text');
|
||
if (!textElement) return;
|
||
|
||
// Event Listener für Bundesland-Änderungen
|
||
textElement.addEventListener('change', function(e) {
|
||
if (e.target.tagName === 'SELECT' && e.target.closest('#persona-text')) {
|
||
const newBundesland = e.target.value;
|
||
const persona = personasData[currentPersona];
|
||
if (persona) {
|
||
persona.bundesland = newBundesland;
|
||
updateMainPortrait(persona);
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|
||
// Dropdown-Menüs für Bundesland und Ausbildung aktualisieren
|
||
function updateBundeslandDropdown(persona) {
|
||
const textElement = document.getElementById('persona-text');
|
||
if (!textElement) return;
|
||
|
||
// Prüfe, ob Dropdowns bereits existieren
|
||
const existingBundeslandSelect = document.getElementById('bundesland-select');
|
||
const existingAusbildungSelect = document.getElementById('ausbildung-select');
|
||
|
||
if (existingBundeslandSelect && existingAusbildungSelect) {
|
||
// Dropdowns existieren bereits - nur Werte aktualisieren
|
||
existingBundeslandSelect.value = persona.bundesland;
|
||
existingAusbildungSelect.value = persona['ausbildung-value'];
|
||
console.log('[DEBUG] Dropdown-Werte aktualisiert:', persona.bundesland, persona['ausbildung-value']);
|
||
return;
|
||
}
|
||
|
||
// Dropdowns existieren nicht - erstelle sie
|
||
console.log('[DEBUG] Erstelle neue Dropdowns für Persona:', persona.name);
|
||
|
||
// Ersetze die Platzhalter im Text mit echten Dropdowns
|
||
let textContent = persona.text;
|
||
|
||
// Bundesland-Dropdown einbauen (orange)
|
||
const bundeslandOptions = getAllBundeslandOptions(persona.bundesland);
|
||
const bundeslandSelect = `<select class="select orange" id="bundesland-select">${bundeslandOptions}</select>`;
|
||
textContent = textContent.replace('{{BUNDESLAND_SELECT}}', bundeslandSelect);
|
||
|
||
// Ausbildung-Dropdown einbauen (blau)
|
||
const ausbildungOptions = getAllAusbildungOptions(persona['ausbildung-value']);
|
||
const ausbildungSelect = `<select class="select blue" id="ausbildung-select">${ausbildungOptions}</select>`;
|
||
textContent = textContent.replace('{{AUSBILDUNG_SELECT}}', ausbildungSelect);
|
||
|
||
// Text aktualisieren
|
||
textElement.innerHTML = textContent;
|
||
|
||
// Event Listener hinzufügen (mit Verzögerung, damit die Elemente im DOM sind)
|
||
setTimeout(() => {
|
||
const bundeslandSelectElement = document.getElementById('bundesland-select');
|
||
if (bundeslandSelectElement) {
|
||
bundeslandSelectElement.removeEventListener('change', handleBundeslandChange);
|
||
bundeslandSelectElement.addEventListener('change', handleBundeslandChange);
|
||
}
|
||
|
||
const ausbildungSelectElement = document.getElementById('ausbildung-select');
|
||
if (ausbildungSelectElement) {
|
||
ausbildungSelectElement.removeEventListener('change', handleAusbildungChange);
|
||
ausbildungSelectElement.addEventListener('change', handleAusbildungChange);
|
||
}
|
||
|
||
// Button Event Listener entfernt, da Button nicht mehr existiert
|
||
}, 100);
|
||
}
|
||
|
||
// Event Handler für Bundesland-Änderung
|
||
function handleBundeslandChange() {
|
||
const persona = personasData[currentPersona];
|
||
if (persona) {
|
||
persona.bundesland = this.value;
|
||
console.log('[DEBUG] Bundesland geändert zu:', this.value);
|
||
// Lade nur die Texte, NICHT die Dropdowns neu erstellen
|
||
setTimeout(() => {
|
||
loadPersonaMarkdownContentOnly(currentPersona);
|
||
}, 100);
|
||
// Stelle sicher, dass der Personas-Tab aktiv bleibt
|
||
ensurePersonasTabActive();
|
||
}
|
||
}
|
||
|
||
// Event Handler für Ausbildung-Änderung
|
||
function handleAusbildungChange() {
|
||
const persona = personasData[currentPersona];
|
||
if (persona) {
|
||
persona['ausbildung-value'] = this.value;
|
||
console.log('[DEBUG] Ausbildung geändert zu:', this.value);
|
||
// Lade nur die Texte, NICHT die Dropdowns neu erstellen
|
||
setTimeout(() => {
|
||
loadPersonaMarkdownContentOnly(currentPersona);
|
||
}, 100);
|
||
// Stelle sicher, dass der Personas-Tab aktiv bleibt
|
||
ensurePersonasTabActive();
|
||
}
|
||
}
|
||
|
||
// Button-Funktion entfernt, da Button nicht mehr existiert
|
||
function updatePersonaButton(persona) {
|
||
// Funktion nicht mehr benötigt
|
||
}
|
||
|
||
// Event Handler für Empfehlung-Button (nicht mehr verwendet, da Button entfernt)
|
||
function handleEmpfehlungButtonClick() {
|
||
console.log('[DEBUG] Empfehlung-Button geklickt für:', currentPersona);
|
||
loadPersonaMarkdownContent(currentPersona);
|
||
// Stelle sicher, dass der Personas-Tab aktiv bleibt
|
||
ensurePersonasTabActive();
|
||
}
|
||
|
||
// Bundesland-Namen aus Code generieren
|
||
function getBundeslandName(code) {
|
||
const bundeslandNames = {
|
||
'BW': 'Baden-Württemberg',
|
||
'BY': 'Bayern',
|
||
'BE': 'Berlin',
|
||
'BB': 'Brandenburg',
|
||
'HB': 'Bremen',
|
||
'HH': 'Hamburg',
|
||
'HE': 'Hessen',
|
||
'MV': 'Mecklenburg-Vorpommern',
|
||
'NI': 'Niedersachsen',
|
||
'NW': 'Nordrhein-Westfalen',
|
||
'NRW': 'Nordrhein-Westfalen',
|
||
'RP': 'Rheinland-Pfalz',
|
||
'SL': 'Saarland',
|
||
'SN': 'Sachsen',
|
||
'ST': 'Sachsen-Anhalt',
|
||
'SH': 'Schleswig-Holstein',
|
||
'TH': 'Thüringen'
|
||
};
|
||
return bundeslandNames[code] || code;
|
||
}
|
||
|
||
// Alle Bundesland-Optionen generieren
|
||
function getAllBundeslandOptions(selectedBundesland) {
|
||
const bundeslandOptions = {
|
||
'BW': 'Baden-Württemberg',
|
||
'BY': 'Bayern',
|
||
'BE': 'Berlin',
|
||
'BB': 'Brandenburg',
|
||
'HB': 'Bremen',
|
||
'HH': 'Hamburg',
|
||
'HE': 'Hessen',
|
||
'MV': 'Mecklenburg-Vorpommern',
|
||
'NI': 'Niedersachsen',
|
||
'NW': 'Nordrhein-Westfalen',
|
||
'NRW': 'Nordrhein-Westfalen',
|
||
'RP': 'Rheinland-Pfalz',
|
||
'SL': 'Saarland',
|
||
'SN': 'Sachsen',
|
||
'ST': 'Sachsen-Anhalt',
|
||
'SH': 'Schleswig-Holstein',
|
||
'TH': 'Thüringen'
|
||
};
|
||
|
||
let options = '';
|
||
Object.entries(bundeslandOptions).forEach(([value, text]) => {
|
||
const selected = selectedBundesland === value ? 'selected' : '';
|
||
options += `<option value="${value}" ${selected}>${text}</option>`;
|
||
});
|
||
|
||
return options;
|
||
}
|
||
|
||
// Alle Ausbildung-Optionen generieren
|
||
function getAllAusbildungOptions(selectedAusbildung) {
|
||
const ausbildungOptions = {
|
||
'AUSBILDUNG': 'Berufserfahrung',
|
||
'HS': 'Hochschulstudium',
|
||
'LA': 'Lehramtsstudium'
|
||
};
|
||
|
||
let options = '';
|
||
Object.entries(ausbildungOptions).forEach(([value, text]) => {
|
||
const selected = selectedAusbildung === value ? 'selected' : '';
|
||
options += `<option value="${value}" ${selected}>${text}</option>`;
|
||
});
|
||
|
||
return options;
|
||
}
|
||
|
||
// CSS für ausgewählte Persona hinzufügen
|
||
function addPersonasStyles() {
|
||
const style = document.createElement('style');
|
||
style.textContent = `
|
||
.meta {
|
||
font-size: 0.8em;
|
||
color: #666;
|
||
font-weight: normal;
|
||
}
|
||
|
||
.persona-content {
|
||
margin-top: 20px;
|
||
}
|
||
|
||
.content-section {
|
||
margin-bottom: 20px;
|
||
padding: 15px;
|
||
background-color: #f9f9f9;
|
||
border-left: 4px solid #e07047;
|
||
border-radius: 0 5px 5px 0;
|
||
}
|
||
|
||
.content-section h1,
|
||
.content-section h2,
|
||
.content-section h3 {
|
||
color: #333;
|
||
margin-top: 0;
|
||
}
|
||
|
||
.content-section p {
|
||
line-height: 1.6;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.content-section strong {
|
||
color: #e07047;
|
||
}
|
||
`;
|
||
document.head.appendChild(style);
|
||
}
|
||
|
||
// Stellt sicher, dass der Personas-Tab aktiv bleibt
|
||
function ensurePersonasTabActive() {
|
||
// Aktiviere Personas-Tab
|
||
document.querySelectorAll('.tab').forEach(t => t.classList.remove('active'));
|
||
document.querySelectorAll('.button-tab').forEach(btn => btn.classList.remove('active'));
|
||
|
||
const personasTab = document.querySelector('.tab1');
|
||
const personasButton = document.querySelector('.button-tab[onclick*="tab1"]');
|
||
|
||
if (personasTab) personasTab.classList.add('active');
|
||
if (personasButton) personasButton.classList.add('active');
|
||
}
|
||
|
||
// Initialisierung beim Laden der Seite
|
||
document.addEventListener('DOMContentLoaded', function() {
|
||
addPersonasStyles();
|
||
loadPersonasData();
|
||
});
|
||
|
||
// Globale Funktion für Tab-Wechsel
|
||
function showPersonasTab() {
|
||
// Lade Personas-Daten falls noch nicht geladen
|
||
if (Object.keys(personasData).length === 0) {
|
||
loadPersonasData();
|
||
}
|
||
|
||
// Verstecke Empfehlungsbereich beim Wechsel zu Personas-Tab (nicht mehr benötigt)
|
||
|
||
// Verstecke Finder-Ergebnisse
|
||
const finderResult = document.getElementById('result');
|
||
if (finderResult) {
|
||
finderResult.style.display = 'none';
|
||
}
|
||
}
|
||
|
||
// Globale Funktion für Finder-Tab-Wechsel (nicht mehr benötigt)
|
||
function showFinderTabWithPersona() {
|
||
// Funktion nicht mehr benötigt
|
||
}
|
||
|
||
// Empfehlungsbereich-Funktionen entfernt, da Button nicht mehr existiert
|
||
|
||
// Lädt nur die Markdown-Inhalte ohne Dropdowns zu ändern
|
||
async function loadPersonaMarkdownContentOnly(personaName) {
|
||
const persona = personasData[personaName];
|
||
if (!persona) {
|
||
console.error('Persona nicht gefunden:', personaName);
|
||
return;
|
||
}
|
||
|
||
try {
|
||
// Erstelle eine Kopie der Persona-Daten mit aktuellen Dropdown-Werten
|
||
const currentPersonaData = { ...persona };
|
||
|
||
// Aktuelle Werte aus den Dropdowns lesen
|
||
const textElement = document.getElementById('persona-text');
|
||
if (textElement) {
|
||
const selectElements = textElement.querySelectorAll('select');
|
||
if (selectElements.length >= 2) {
|
||
currentPersonaData.bundesland = selectElements[0].value;
|
||
currentPersonaData['ausbildung-value'] = selectElements[1].value;
|
||
}
|
||
}
|
||
|
||
console.log('[DEBUG] Lade Markdown für Persona mit Daten:', currentPersonaData);
|
||
|
||
// Bestimme die entsprechende Markdown-Datei basierend auf aktuellen Persona-Daten
|
||
const markdownFile = getMarkdownFileForPersona(currentPersonaData);
|
||
if (!markdownFile) {
|
||
console.log('Keine passende Markdown-Datei für Persona:', personaName);
|
||
return;
|
||
}
|
||
|
||
console.log('[DEBUG] Lade Markdown-Datei:', markdownFile);
|
||
|
||
// Lade die Markdown-Datei
|
||
const response = await fetch(markdownFile);
|
||
const markdownPaths = await response.text();
|
||
|
||
// Lade die verlinkten Inhalte
|
||
await loadLinkedMarkdownContent(markdownPaths);
|
||
|
||
} catch (error) {
|
||
console.error('Fehler beim Laden der Markdown-Inhalte:', error);
|
||
}
|
||
}
|
||
|
||
// Lädt Markdown-Inhalte für eine Persona im Finder-Tab
|
||
async function loadPersonaMarkdownContent(personaName) {
|
||
const persona = personasData[personaName];
|
||
if (!persona) {
|
||
console.error('Persona nicht gefunden:', personaName);
|
||
return;
|
||
}
|
||
|
||
try {
|
||
// Erstelle eine Kopie der Persona-Daten mit aktuellen Dropdown-Werten
|
||
const currentPersonaData = { ...persona };
|
||
|
||
// Aktuelle Werte aus den Dropdowns lesen
|
||
const textElement = document.getElementById('persona-text');
|
||
if (textElement) {
|
||
const selectElements = textElement.querySelectorAll('select');
|
||
if (selectElements.length >= 2) {
|
||
currentPersonaData.bundesland = selectElements[0].value;
|
||
currentPersonaData['ausbildung-value'] = selectElements[1].value;
|
||
}
|
||
}
|
||
|
||
console.log('[DEBUG] Lade Markdown für Persona mit Daten:', currentPersonaData);
|
||
|
||
// Bestimme die entsprechende Markdown-Datei basierend auf aktuellen Persona-Daten
|
||
const markdownFile = getMarkdownFileForPersona(currentPersonaData);
|
||
if (!markdownFile) {
|
||
console.log('Keine passende Markdown-Datei für Persona:', personaName);
|
||
return;
|
||
}
|
||
|
||
console.log('[DEBUG] Lade Markdown-Datei:', markdownFile);
|
||
|
||
// Lade die Markdown-Datei
|
||
const response = await fetch(markdownFile);
|
||
const markdownPaths = await response.text();
|
||
|
||
// Lade die verlinkten Inhalte
|
||
await loadLinkedMarkdownContent(markdownPaths);
|
||
|
||
} catch (error) {
|
||
console.error('Fehler beim Laden der Markdown-Inhalte:', error);
|
||
}
|
||
}
|
||
|
||
// Bestimmt die richtige Markdown-Datei basierend auf Persona-Daten
|
||
function getMarkdownFileForPersona(persona) {
|
||
// Verwende die mapping-files aus der personas.yml, falls vorhanden
|
||
if (persona['mapping-files'] && persona['mapping-files'].length > 0) {
|
||
// Für jetzt verwende die erste Mapping-Datei
|
||
// TODO: Später können wir eine intelligentere Auswahl basierend auf Dropdown-Werten implementieren
|
||
const mappingFile = persona['mapping-files'][0];
|
||
console.log('[DEBUG] Verwende Mapping-Datei aus personas.yml:', mappingFile);
|
||
return mappingFile;
|
||
}
|
||
|
||
// Fallback: Alte Logik für Personas ohne mapping-files
|
||
const bundeslandMapping = {
|
||
'BW': '1_BW',
|
||
'BY': '2_BY',
|
||
'BE': '3_BE',
|
||
'BB': '4_BB',
|
||
'HB': '5_HB',
|
||
'HH': '6_HH',
|
||
'HE': '7_HE',
|
||
'MV': '8_MV',
|
||
'NI': '9_NI',
|
||
'NW': '10_NW',
|
||
'NRW': '10_NW',
|
||
'RP': '11_RP',
|
||
'SL': '12_SL',
|
||
'SN': '13_SN',
|
||
'ST': '14_ST',
|
||
'SH': '15_SH',
|
||
'TH': '16_TH'
|
||
};
|
||
|
||
const bundeslandDir = bundeslandMapping[persona.bundesland];
|
||
if (!bundeslandDir) {
|
||
console.error('Unbekanntes Bundesland:', persona.bundesland);
|
||
return null;
|
||
}
|
||
|
||
// Bestimme den Dateinamen basierend auf Ausbildung und Informatik
|
||
let fileName = '';
|
||
|
||
// Ausbildung-basiert (Code-System)
|
||
if (persona['ausbildung-value'] === 'AUSBILDUNG') {
|
||
// Berufserfahrung
|
||
fileName = 'HS-BA-1F.md'; // Berufserfahrung
|
||
} else if (persona['ausbildung-value'] === 'HS') {
|
||
// Hochschule
|
||
if (persona['abschluss-value'] === 'B') {
|
||
fileName = 'HS-MA-0F.md'; // Bachelor
|
||
} else if (persona['abschluss-value'] === 'M') {
|
||
fileName = 'HS-MA-1F.md'; // Master
|
||
}
|
||
} else if (persona['ausbildung-value'] === 'LA') {
|
||
// Studium/Lehramt
|
||
fileName = 'LA-BA.md';
|
||
}
|
||
|
||
if (!fileName) {
|
||
console.log('Keine passende Datei gefunden für Persona-Daten:', persona);
|
||
return null;
|
||
}
|
||
|
||
console.log(`[DEBUG] Persona ${persona.name}: Bundesland ${persona.bundesland} (${bundeslandDir}), Ausbildung ${persona['ausbildung-value']}, Abschluss ${persona['abschluss-value']} → ${fileName}`);
|
||
|
||
return `Bundeslaender/${bundeslandDir}/${fileName}`;
|
||
}
|
||
|
||
// Lädt die verlinkten Markdown-Inhalte
|
||
async function loadLinkedMarkdownContent(markdownPaths) {
|
||
const paths = markdownPaths.trim().split('\n').filter(path => path.trim());
|
||
|
||
// Erstelle Container für die Inhalte
|
||
let contentHtml = '<div class="persona-content">';
|
||
|
||
for (const path of paths) {
|
||
try {
|
||
// Entferne führenden Slash falls vorhanden
|
||
const cleanPath = path.trim().startsWith('/') ? path.trim().substring(1) : path.trim();
|
||
|
||
// Verwende den Pfad direkt, da er bereits den korrekten Präfix hat
|
||
const fullPath = cleanPath;
|
||
const response = await fetch(fullPath);
|
||
const content = await response.text();
|
||
|
||
// Konvertiere Markdown zu HTML (gleiche Struktur wie Finder)
|
||
const htmlContent = renderMarkdownArticle(content);
|
||
contentHtml += htmlContent;
|
||
|
||
} catch (error) {
|
||
console.error('Fehler beim Laden von:', path, error);
|
||
contentHtml += `<article class="content-article"><div class='main-content'><h2>Fehler</h2><div class='text-content'>Datei nicht gefunden: ${path}</div></div></article>`;
|
||
}
|
||
}
|
||
|
||
contentHtml += '</div>';
|
||
|
||
// Zeige den Inhalt im Empfehlungsbereich an
|
||
displayPersonaContent(contentHtml);
|
||
}
|
||
|
||
// Verwendet die gleiche Markdown-Rendering-Funktion wie Finder
|
||
function renderMarkdownArticle(mdText) {
|
||
// Splitte in Abschnitte nach ##
|
||
const sections = mdText.split(/\n(?=## )/);
|
||
return sections.map(section => {
|
||
let lines = section.trim().split('\n');
|
||
if (!lines[0].startsWith('##')) return '';
|
||
let headline = lines[0].replace(/^## /, '');
|
||
let marginal = '';
|
||
let textStart = 1;
|
||
|
||
// Prüfe zweite Zeile auf Link
|
||
if (lines[1] && lines[1].startsWith('http')) {
|
||
const linkLine = lines[1];
|
||
|
||
// Prüfe ob es ein Markdown-Link mit Text ist: [Text](URL)
|
||
const markdownLinkMatch = linkLine.match(/^\[([^\]]+)\]\(([^)]+)\)$/);
|
||
if (markdownLinkMatch) {
|
||
// Markdown-Link gefunden: [Text](URL)
|
||
const linkText = markdownLinkMatch[1];
|
||
const linkUrl = markdownLinkMatch[2];
|
||
marginal = `<blockquote class='marginal'><a href="${linkUrl}" target="_blank">${linkText}</a></blockquote>`;
|
||
} else {
|
||
// Einfacher Link
|
||
marginal = `<blockquote class='marginal'><a href="${linkLine}" target="_blank">${linkLine}</a></blockquote>`;
|
||
}
|
||
textStart = 2;
|
||
}
|
||
|
||
// Rest als Text verarbeiten
|
||
let textContent = lines.slice(textStart).join('\n');
|
||
|
||
// Markdown-zu-HTML Konvertierung
|
||
textContent = textContent
|
||
.replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>')
|
||
.replace(/\*(.*?)\*/g, '<em>$1</em>')
|
||
// Markdown-Links verarbeiten: [Text](URL)
|
||
.replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a href="$2" target="_blank">$1</a>')
|
||
.replace(/\n\n/g, '</p><p>')
|
||
.replace(/^(?!<[h1-6])/gm, '<p>')
|
||
.replace(/$/gm, '</p>')
|
||
.replace(/<p><\/p>/g, '');
|
||
|
||
return `<article class="content-article">
|
||
<div class="layout">
|
||
<div class="main-content">
|
||
<h2>${headline}</h2>
|
||
<div class="text-content">${textContent}</div>
|
||
</div>
|
||
<div class="sidebar">${marginal}</div>
|
||
</div>
|
||
</article>`;
|
||
}).join('');
|
||
}
|
||
|
||
// Zeigt Persona-Inhalt im Empfehlungsbereich an (gleiche Struktur wie Finder)
|
||
function displayPersonaContent(contentHtml) {
|
||
console.log('[DEBUG] Zeige Persona-Inhalt an:', contentHtml.substring(0, 100));
|
||
|
||
// Verwende die gleiche Struktur wie der Finder
|
||
const resultDiv = document.getElementById('result');
|
||
if (!resultDiv) {
|
||
console.error('Result div nicht gefunden');
|
||
return;
|
||
}
|
||
|
||
// Headline setzen
|
||
const headlineElement = document.getElementById('finder-headline');
|
||
if (headlineElement) {
|
||
const personaName = currentPersona ? personasData[currentPersona].name : 'Persona';
|
||
headlineElement.textContent = 'Empfehlung für ' + personaName;
|
||
console.log('[DEBUG] Headline gesetzt für:', personaName);
|
||
}
|
||
|
||
// Content setzen
|
||
const textContentElement = document.getElementById('finder-text-content');
|
||
if (textContentElement) {
|
||
textContentElement.innerHTML = contentHtml;
|
||
console.log('[DEBUG] Content gesetzt, Länge:', contentHtml.length);
|
||
}
|
||
|
||
// Tags und Marginal leeren
|
||
const tagsElement = document.getElementById('finder-tags');
|
||
if (tagsElement) {
|
||
tagsElement.innerHTML = '';
|
||
}
|
||
|
||
const marginalElement = document.getElementById('finder-marginal');
|
||
if (marginalElement) {
|
||
marginalElement.innerHTML = '';
|
||
}
|
||
|
||
// Ergebnis-Bereich anzeigen
|
||
resultDiv.style.display = 'block';
|
||
console.log('[DEBUG] Result div angezeigt');
|
||
}
|