📤 Kochbuch Export
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<title>Kochbuch Export</title>
<style>
body{
font-family:Arial;
padding:20px;
}
button{
padding:8px 12px;
margin:5px;
cursor:pointer;
border-radius:6px;
border:1px solid #ccc;
background:#f5f5f5;
}
textarea{
width:100%;
height:250px;
margin-top:15px;
}
/* Overlay */
.overlay{
position:fixed;
top:0;left:0;width:100%;height:100%;
background:rgba(0,0,0,0.7);
display:none;
align-items:flex-start;
justify-content:center;
padding-top:40px;
z-index:9999;
}
.overlayBox{
background:white;
padding:20px;
border-radius:10px;
width:500px;
max-height:80vh;
overflow:auto;
position:relative;
}
.overlayClose{
position:absolute;
right:10px;
top:10px;
cursor:pointer;
font-size:20px;
}
</style>
</head>
<body>
<h1>📤 Kochbuch Export</h1>
<button id="openBtn">📂 Kategorie wählen</button>
<button id="copyBtn">📋 Kopieren</button>
<textarea id="output" placeholder="Export erscheint hier..."></textarea>
<!-- Overlay -->
<div id="overlay" class="overlay">
<div class="overlayBox">
<div class="overlayClose" id="closeBtn">✖</div>
<h3>Kategorie wählen</h3>
<div id="catList"></div>
</div>
</div>
<script>
/* =========================
📦 Daten laden
========================= */
function getDB(){
return JSON.parse(localStorage.getItem("kochbuchDB") || "{}");
}
/* =========================
🔥 STANDARD KATEGORIEN
========================= */
const STANDARD_KATS = [
"🥗 Salate","🧴 Dressings","🫙 Dips","🧀 Canapés","🍤 Warme Vorspeisen",
"🥣 Kalte Suppen","🍲 Warme Suppen","🍜 Suppeneinlagen",
"🍖 Fleischgerichte","🍝 Pasta","🐟 Fisch","🥕 Vegetarisch","🌱 Vegan",
"🔥 Ofengerichte","🍳 Pfannengerichte","🍽 Sonstige Gerichte",
"🥦 Gemüsebeilagen","🍚 Sättigungsbeilagen","🥫 Soßen",
"🌶 Gewürzmischungen","🍮 Desserts","👑 Jan Originale","🍟 Airfryer",
"🍰 Kuchen","🎂 Torte","🍪 Plätzchen","🧁 Muffins",
"🥐 Brötchen","🥖 Baguette","🍞 Brot",
"🥂 Aperitifs","🍹 Cocktails","🧃 Alkoholfreie Drinks","🍿 Snacks","admin"
];
/* =========================
📂 Kategorien in richtiger Reihenfolge
========================= */
function getKategorien(){
const db = getDB();
const vorhandene = new Set(
Object.values(db)
.map(r => r.kat)
.filter(Boolean)
);
/* richtige Reihenfolge */
return [
...STANDARD_KATS.filter(cat => vorhandene.has(cat)),
...[...vorhandene].filter(cat => !STANDARD_KATS.includes(cat))
];
}
/* =========================
📂 Overlay öffnen
========================= */
const overlay = document.getElementById("overlay");
const catList = document.getElementById("catList");
document.getElementById("openBtn").onclick = () => {
overlay.style.display = "flex";
catList.innerHTML = "";
const kategorien = getKategorien();
if(kategorien.length === 0){
catList.innerHTML = "❌ Keine Kategorien gefunden";
return;
}
kategorien.forEach(cat => {
let b = document.createElement("button");
b.innerText = cat;
b.onclick = () => {
createExport(cat);
overlay.style.display = "none";
};
catList.appendChild(b);
});
};
/* =========================
❌ Overlay schließen
========================= */
document.getElementById("closeBtn").onclick = () => {
overlay.style.display = "none";
};
/* =========================
📤 Export erstellen
========================= */
function createExport(cat){
const db = getDB();
let rows = [];
/* sammeln */
for(let slug in db){
let e = db[slug];
if(e.kat === cat){
rows.push({
name: slug,
line: [
slug,
cat,
"/" + slug,
e.img || "",
e.time || "",
e.feedback || "",
e.difficulty || "",
e.views || ""
].join(";")
});
}
}
/* 🔥 SORTIERUNG (A-Z) */
rows.sort((a,b)=>
a.name.localeCompare(b.name,'de',{sensitivity:'base'})
);
/* zurück zu Text */
document.getElementById("output").value =
rows.map(r=>r.line).join("\n");
}
/* =========================
📋 Copy
========================= */
document.getElementById("copyBtn").onclick = () => {
const text = document.getElementById("output").value;
if(!text){
alert("❌ Kein Export vorhanden");
return;
}
navigator.clipboard.writeText(text);
alert("✅ Kopiert");
};
</script>
</body>
</html>