diff --git a/seasonals copy.js b/seasonals copy.js new file mode 100644 index 0000000..3f01cf3 --- /dev/null +++ b/seasonals copy.js @@ -0,0 +1,44 @@ +document.addEventListener('DOMContentLoaded', () => { + // Konfiguration: Hier das aktuelle Theme definieren + const currentTheme = 'snowflakes'; // Beispiele: 'snowflakes', 'autumn', 'summer' + + // Mapping der Themes zu den entsprechenden Dateien + const themes = { + snowflakes: { + css: 'snowflakes.css', + js: 'snowflakes.js', + }, + autumn: { + css: 'autumn.css', + js: 'autumn.js', + }, + summer: { + css: 'summer.css', + js: 'summer.js', + }, + }; + + // Dynamisch Klasse des "seasonals"-Divs ändern + const seasonalDiv = document.querySelector('.seasonals'); + if (seasonalDiv) { + seasonalDiv.className = currentTheme; // Setzt die Klasse auf z. B. "snowflakes" + } else { + console.error('Kein Element mit der Klasse "seasonals" gefunden.'); + } + + // Prüfen, ob das aktuelle Theme verfügbar ist + if (themes[currentTheme]) { + // Dynamisch CSS-Datei laden + const link = document.createElement('link'); + link.rel = 'stylesheet'; + link.href = themes[currentTheme].css; + document.head.appendChild(link); + + // Dynamisch JavaScript-Datei laden + const script = document.createElement('script'); + script.src = themes[currentTheme].js; + document.body.appendChild(script); + } else { + console.error(`Theme "${currentTheme}" nicht gefunden.`); + } +}); diff --git a/seasonals.js b/seasonals.js new file mode 100644 index 0000000..2f13464 --- /dev/null +++ b/seasonals.js @@ -0,0 +1,59 @@ +// seasonals.js +class SeasonalThemes { + constructor() { + this.currentTheme = this.determineCurrentTheme(); + this.loadTheme(); + } + + determineCurrentTheme() { + const date = new Date(); + const month = date.getMonth(); + + // Beispielhafte Theme-Zuordnung + if (month === 11 || month === 0 || month === 1) return 'winter'; // Dezember, Januar, Februar + if (month >= 2 && month <= 4) return 'spring'; + if (month >= 5 && month <= 7) return 'summer'; + if (month >= 8 && month <= 10) return 'autumn'; + + return 'winter'; // Fallback + } + +loadTheme() { + const themeConfigs = { + winter: { + css: 'snowflakes.css', + js: 'snowflakes.js', + containerClass: 'snowflakes' + }, + summer: { + css: 'beach.css', + js: 'beach.js', + containerClass: 'beach' + }, + // ... andere Themes + }; + + const theme = themeConfigs[this.currentTheme]; + + // CSS dynamisch laden + const link = document.createElement('link'); + link.rel = 'stylesheet'; + link.href = theme.css; + document.head.appendChild(link); + + // JavaScript dynamisch laden + const script = document.createElement('script'); + script.src = theme.js; + document.body.appendChild(script); + + // Themen-Container hinzufügen mit dynamischer Klasse + const container = document.createElement('div'); + container.className = `seasonals ${theme.containerClass}`; + document.body.appendChild(container); +} +} + +// Initialisierung beim Laden der Seite +document.addEventListener('DOMContentLoaded', () => { + new SeasonalThemes(); +}); \ No newline at end of file