// Aktivitäts-Auswahl: lädt Aktivitäten aus appsettings.json, Kartenauswahl + Weiter-Button (function () { const activityGrid = document.getElementById("activityGrid"); const dateSummary = document.getElementById("dateSummary"); const timeNotice = document.getElementById("timeNotice"); const continueBtn = document.getElementById("continueBtn"); const customActivitySection = document.getElementById("customActivitySection"); const customActivityInput = document.getElementById("customActivityInput"); const selectedDate = localStorage.getItem("selectedDate"); const selectedDateType = localStorage.getItem("selectedDateType") || "long"; if (!selectedDate) { window.location.href = "datetime.html"; return; } const dateObj = new Date(`${selectedDate}T00:00:00`); const formattedDate = dateObj.toLocaleDateString("de-DE", { weekday: "long", day: "numeric", month: "long", year: "numeric", }); dateSummary.textContent = `Für unser Date am ${formattedDate}.`; let availableActivities = []; let selectedList = []; function isCustomActivity(act) { return act && (act.name === "Etwas eigenes" || act.name === "Sonstiges" || act.type === "custom"); } fetch("/api/settings", { cache: "no-store" }) .then((response) => response.json()) .then((settings) => { const allActivities = settings.activities || []; const customAct = allActivities.find((a) => a.name === "Etwas eigenes" || a.name === "Sonstiges") || { name: "Etwas eigenes", icon: "✏️", type: "custom", }; let otherActivities = allActivities.filter((a) => a.name !== "Etwas eigenes" && a.name !== "Sonstiges"); if (selectedDateType === "short") { otherActivities = otherActivities.filter((a) => a.type === "short"); } // "Etwas eigenes" erscheint IMMER an letzter Stelle availableActivities = [...otherActivities, customAct]; // Vorherige Auswahl wiederherstellen, falls vorhanden try { const stored = JSON.parse(localStorage.getItem("selectedActivities") || "[]"); if (stored && stored.length > 0) { const isStoredCustom = stored.some( (a) => a.type === "custom" || (a.name && (a.name.startsWith("Etwas eigenes") || a.name.startsWith("Sonstiges"))) ); if (isStoredCustom) { const storedCustom = stored.find( (a) => a.type === "custom" || (a.name && (a.name.startsWith("Etwas eigenes") || a.name.startsWith("Sonstiges"))) ); selectedList = [customAct]; if (storedCustom) { const desc = storedCustom.customDescription || (storedCustom.name.includes(":") ? storedCustom.name.split(":").slice(1).join(":").trim() : ""); if (customActivityInput) { customActivityInput.value = desc; } } } else { selectedList = stored.filter((s) => availableActivities.some((a) => a.name === s.name) ); } } } catch (e) {} renderActivities(); }) .catch(() => { activityGrid.textContent = "Aktivitäten konnten nicht geladen werden."; }); function renderActivities() { activityGrid.innerHTML = ""; const hasCustomSelected = selectedList.some(isCustomActivity); const hasShortSelected = selectedList.some((a) => a.type === "short"); if (hasCustomSelected) { if (customActivitySection) { customActivitySection.classList.remove("hidden"); } } else { if (customActivitySection) { customActivitySection.classList.add("hidden"); } } availableActivities.forEach((activity) => { const card = document.createElement("button"); card.type = "button"; card.className = "activity-card"; card.dataset.activity = activity.name; const isCustom = isCustomActivity(activity); const isSelected = isCustom ? hasCustomSelected : selectedList.some((a) => a.name === activity.name); if (isSelected) { card.classList.add("selected"); } const isLongDisabled = !isCustom && hasShortSelected && activity.type === "long"; if (isLongDisabled) { card.classList.add("is-disabled"); card.disabled = true; } const icon = document.createElement("span"); icon.className = "icon"; icon.setAttribute("aria-hidden", "true"); icon.textContent = activity.icon; const label = document.createElement("span"); label.className = "label"; label.textContent = activity.name; card.append(icon, label); card.addEventListener("click", () => { handleCardClick(activity); }); activityGrid.appendChild(card); }); updateNoticeAndContinue(); } function handleCardClick(activity) { const isCustom = isCustomActivity(activity); const hasCustomSelected = selectedList.some(isCustomActivity); if (isCustom) { if (hasCustomSelected) { selectedList = []; } else { // Custom-Aktivität darf mit keiner anderen Aktivität kombiniert werden! selectedList = [activity]; setTimeout(() => { if (customActivityInput) { customActivityInput.focus(); } }, 50); } } else { if (hasCustomSelected) { selectedList = []; } const isAlreadySelected = selectedList.some((a) => a.name === activity.name); if (activity.type === "long") { if (isAlreadySelected) { selectedList = []; } else { selectedList = [activity]; } } else { if (isAlreadySelected) { selectedList = selectedList.filter((a) => a.name !== activity.name); } else if (selectedDateType === "short") { selectedList = [activity]; } else { if (selectedList.some((a) => a.type === "long")) { selectedList = [activity]; } else if (selectedList.length >= 2) { selectedList = [selectedList[0], activity]; } else { selectedList.push(activity); } } } } renderActivities(); } if (customActivityInput) { customActivityInput.addEventListener("input", () => { updateNoticeAndContinue(); }); } function updateNoticeAndContinue() { const hasCustomSelected = selectedList.some(isCustomActivity); const shortCount = selectedList.filter((a) => a.type === "short").length; const hasLong = selectedList.some((a) => a.type === "long"); if (hasCustomSelected) { timeNotice.classList.add("hidden"); const desc = customActivityInput ? customActivityInput.value.trim() : ""; continueBtn.disabled = desc.length === 0; } else { if (selectedDateType === "long" && shortCount === 1 && !hasLong) { timeNotice.textContent = "💡 An diesem Tag haben wir reichlich Zeit! Wenn du möchtest, kannst du noch eine zweite kurze Aktivität auswählen."; timeNotice.classList.remove("hidden"); } else if (selectedDateType === "long" && shortCount === 2) { timeNotice.textContent = "🎉 Perfekt! Du hast 2 kurze Aktivitäten für unseren Tag ausgewählt."; timeNotice.classList.remove("hidden"); } else { timeNotice.classList.add("hidden"); } continueBtn.disabled = selectedList.length === 0; } } continueBtn.addEventListener("click", () => { if (selectedList.length === 0) { return; } const hasCustomSelected = selectedList.some(isCustomActivity); if (hasCustomSelected) { const customDesc = customActivityInput ? customActivityInput.value.trim() : ""; if (!customDesc) { return; } const customAct = selectedList.find(isCustomActivity); const savedCustomAct = { name: customDesc, icon: customAct.icon || "✏️", type: "custom", customDescription: customDesc, }; localStorage.setItem("selectedActivities", JSON.stringify([savedCustomAct])); localStorage.setItem("selectedActivity", customDesc); } else { localStorage.setItem("selectedActivities", JSON.stringify(selectedList)); localStorage.setItem("selectedActivity", selectedList.map((a) => a.name).join(" + ")); } window.location.href = "name.html"; }); })();