diff --git a/.gamification.json b/.gamification.json index f58c49b..8d4287b 100644 --- a/.gamification.json +++ b/.gamification.json @@ -10,5 +10,5 @@ "streak_tage": 1, "letzter_aktiver_tag": "2026-08-29", "historie": [], - "zuletzt_aktualisiert": "2026-08-29T15:54:00.836247" + "zuletzt_aktualisiert": "2026-08-29T15:58:35.233410" } \ No newline at end of file diff --git a/assets/gamification_data.js b/assets/gamification_data.js index c34b00b..5057ad2 100644 --- a/assets/gamification_data.js +++ b/assets/gamification_data.js @@ -11,7 +11,7 @@ window.GAMIFICATION_DATA = { "streak_tage": 1, "letzter_aktiver_tag": "2026-08-29", "historie": [], - "zuletzt_aktualisiert": "2026-08-29T15:54:00.836247" + "zuletzt_aktualisiert": "2026-08-29T15:58:35.233410" }; window.GAMIFICATION_BADGES_KATALOG = { "rechenkonegin": { diff --git a/assets/sidebar.js b/assets/sidebar.js index fb59b58..80609e5 100644 --- a/assets/sidebar.js +++ b/assets/sidebar.js @@ -1,7 +1,7 @@ /** - * 🧭 NEXT-GEN SIDEBAR NAVIGATION & APP LAYOUT 🧭 - * =============================================== - * Erzeugt eine moderne, responsive Sidebar auf der linken Seite + * 🧭 NEXT-GEN SIDEBAR COMPONENT 🧭 + * ================================= + * Rendert eine saubere, linksbündige Sidebar-Navigation * für das Hauptportal und alle 27 Kapitel-Seiten. */ @@ -9,9 +9,8 @@ const LEHRPFADE = [ { id: "lehrpfad_1", - title: "🌱 Lehrpfad 1: Grundlagen", + title: "🌱 1. Grundlagen", badge: "G01–G10", - color: "#059669", items: [ { id: "01_erste_schritte_taschenrechner", num: "G01", icon: "🧮", title: "Taschenrechner", path: "lehrpfad_1_grundlagen/01_erste_schritte_taschenrechner/index.html" }, { id: "02_variablen_und_datentypen", num: "G02", icon: "📦", title: "Variablen & Typen", path: "lehrpfad_1_grundlagen/02_variablen_und_datentypen/index.html" }, @@ -27,11 +26,10 @@ }, { id: "lehrpfad_2", - title: "🏗️ Lehrpfad 2: OOP Einstieg", + title: "🏗️ 2. OOP Einstieg", badge: "00–06", - color: "#4f46e5", items: [ - { id: "00_fehlersuche_und_grundlagen", num: "00", icon: "🔍", title: "Fehlersuche & Debugging", path: "lehrpfad_2_oop_einstieg/00_fehlersuche_und_grundlagen/index.html" }, + { id: "00_fehlersuche_und_grundlagen", num: "00", icon: "🔍", title: "Fehlersuche & Debug", path: "lehrpfad_2_oop_einstieg/00_fehlersuche_und_grundlagen/index.html" }, { id: "01_einstieg_klassen", num: "01", icon: "🏗️", title: "Einstieg in Klassen", path: "lehrpfad_2_oop_einstieg/01_einstieg_klassen/index.html" }, { id: "02_init_und_self", num: "02", icon: "⚙️", title: "Konstruktor & self", path: "lehrpfad_2_oop_einstieg/02_init_und_self/index.html" }, { id: "03_methoden_und_verhalten", num: "03", icon: "🏎️", title: "Methoden & Verhalten", path: "lehrpfad_2_oop_einstieg/03_methoden_und_verhalten/index.html" }, @@ -44,9 +42,8 @@ }, { id: "lehrpfad_3", - title: "🚀 Lehrpfad 3: Fortgeschritten", + title: "🚀 3. Fortgeschritten", badge: "07–16", - color: "#7c3aed", items: [ { id: "07_referenzen_und_speicher", num: "07", icon: "🧠", title: "Referenzen & Speicher", path: "lehrpfad_3_fortgeschrittenes_oop/07_referenzen_und_speicher/index.html" }, { id: "08_operator_overloading_dunder", num: "08", icon: "➕", title: "Operator Overloading", path: "lehrpfad_3_fortgeschrittenes_oop/08_operator_overloading_dunder/index.html" }, @@ -71,33 +68,43 @@ } function initSidebar() { - if (document.querySelector(".app-sidebar")) return; - const prefix = detectRootPrefix(); const currentPath = window.location.pathname; - const isRoot = prefix === "./"; + + // Wrap existing body content in .app-main if not wrapped yet + if (!document.querySelector(".app-main")) { + const mainWrapper = document.createElement("div"); + mainWrapper.className = "app-main"; + while (document.body.firstChild) { + mainWrapper.appendChild(document.body.firstChild); + } + document.body.appendChild(mainWrapper); + } + + // Check if sidebar already exists + if (document.querySelector(".app-sidebar")) return; // Gamification Data const gData = window.GAMIFICATION_DATA || { xp: 0, level: 1, titel: "Code-Küken 🐣", geloeste_kapitel: [] }; const solvedSet = new Set(gData.geloeste_kapitel || []); - // 1. Erstelle Drawer-Toggle Button für Mobile + // 1. Mobile Drawer Toggle Button const toggleBtn = document.createElement("button"); toggleBtn.type = "button"; toggleBtn.className = "sidebar-mobile-toggle"; toggleBtn.innerHTML = "☰ Menü"; - document.body.prepend(toggleBtn); + document.body.appendChild(toggleBtn); - // 2. Erstelle Overlay für Mobile + // 2. Mobile Overlay const overlay = document.createElement("div"); overlay.className = "sidebar-overlay"; - document.body.prepend(overlay); + document.body.appendChild(overlay); - // 3. Erstelle Sidebar Container + // 3. Sidebar Element const sidebar = document.createElement("aside"); sidebar.className = "app-sidebar"; - let tracksHtml = ""; + let navSectionsHtml = ""; LEHRPFADE.forEach(track => { let itemsHtml = ""; track.items.forEach(item => { @@ -106,21 +113,21 @@ const isSolved = solvedSet.has(item.path.replace("/index.html", "")); itemsHtml += ` - - ${item.icon} - ${item.num}. ${item.title} - ${isSolved ? '✅' : ''} + + ${item.icon} + ${item.num}. ${item.title} + ${isSolved ? '✅' : ''} `; }); - tracksHtml += ` -