| Server IP : 217.160.0.244 / Your IP : 216.73.217.11 Web Server : Apache System : Linux infong-eu155 4.4.400-icpu-108 #2 SMP Wed Feb 11 11:51:01 UTC 2026 x86_64 User : u100174116 ( 6746176) PHP Version : 8.5.10 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : OFF | Sudo : OFF | Pkexec : OFF Directory : /homepages/13/d818981593/htdocs/GutTrechowNeu/hofladen/admin/ |
Upload File : |
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Admin – Gut Trechow</title>
<link rel="icon" href="../assets/uploads/2020/03/gt_favicon.jpg">
<script src="../assets/js/api.js"></script>
<style>
@font-face{font-family:"CardoGT";src:url("../assets/fonts/cardo-regular-webfont.woff2") format("woff2");font-display:swap;}
@font-face{font-family:"CardoGTBold";src:url("../assets/fonts/cardo-bold-webfont.woff2") format("woff2");font-display:swap;}
@font-face{font-family:"LatoGT";src:url("../assets/fonts/lato-regular-webfont.woff2") format("woff2");font-display:swap;}
:root{
--bg:#13100a;--paper:rgba(248,244,236,.97);
--gold:#c8a452;--gold2:#dfc070;--gold3:#7a5c22;
--text:#3a3020;--text2:#5c5040;
--bd:rgba(160,138,95,.28);--bd2:rgba(160,138,95,.15);
--red:#c0392b;--green:#4a8a32;--ease:cubic-bezier(.22,.61,.36,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{font-size:62.5%;}
body{font-family:"LatoGT",Arial,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;}
body::before{content:"";position:fixed;inset:0;background:url("../assets/uploads/2020/11/gt_mauer_pattern_HG.jpg") center/cover;opacity:.11;pointer-events:none;z-index:0;}
/* Login */
#ls{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:2rem;}
.lcard{position:relative;width:min(400px,100%);background:var(--paper);border:1px solid rgba(180,155,95,.40);box-shadow:0 32px 80px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.6);padding:4rem 3.6rem 3.6rem;text-align:center;animation:cIn .5s var(--ease) both;}
@keyframes cIn{from{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:none}}
.lcard img{width:140px;margin:0 auto 2.4rem;display:block;}
.lcard h1{font-family:"CardoGTBold",serif;font-size:3rem;color:var(--text);margin-bottom:.4rem;}
.lcard .sub{font-family:"CardoGT",serif;font-size:1.6rem;color:var(--text2);margin-bottom:2.8rem;}
.lf{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1.4rem;text-align:left;}
.lf label{font-family:"CardoGTBold",serif;font-size:1.38rem;color:var(--text2);letter-spacing:.06em;text-transform:uppercase;}
.lf input{width:100%;padding:1.1rem 1.2rem;border:1px solid var(--bd);background:rgba(255,255,255,.84);font:1.7rem/1.3 "CardoGT",serif;color:var(--text);border-radius:3px;transition:border-color .18s,box-shadow .18s;}
.lf input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(180,140,60,.14);}
.lbtn{width:100%;padding:1.2rem;margin-top:.5rem;cursor:pointer;border:1px solid rgba(110,86,42,.60);border-radius:3px 8px 4px 9px/6px 3px 8px 4px;background:linear-gradient(168deg,rgba(185,148,68,.97) 0%,rgba(148,114,46,.98) 50%,rgba(112,84,28,1) 100%);color:#f8f1e2;font:1.9rem/1.2 "CardoGTBold",serif;box-shadow:inset 0 2px 1px rgba(255,255,255,.18),inset 0 -3px 5px rgba(50,32,10,.28),0 4px 0 rgba(55,38,16,.58),0 6px 20px rgba(0,0,0,.26);transition:transform .18s,filter .18s;position:relative;overflow:hidden;}
.lbtn::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.12) 0%,transparent 52%);pointer-events:none;}
.lbtn:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.08);}
.lbtn:active:not(:disabled){transform:translateY(1px);}
.lbtn:disabled{opacity:.6;cursor:default;}
.lerr{margin-top:1.2rem;padding:.9rem 1.2rem;background:rgba(139,46,26,.09);border:1px solid rgba(139,46,26,.28);border-radius:3px;font-family:"CardoGT",serif;font-size:1.6rem;color:var(--red);display:none;}
.lerr.show{display:block;}
/* Shell */
#sh{display:none;position:relative;z-index:1;min-height:100vh;}
#sh.v{display:block;}
.topbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 2.4rem;background:rgba(16,11,6,.97);backdrop-filter:blur(16px);border-bottom:1px solid rgba(180,148,70,.18);box-shadow:0 4px 20px rgba(0,0,0,.40);}
.tbrand{display:flex;align-items:center;gap:1.3rem;}
.tlogo{height:30px;filter:brightness(100) saturate(0);opacity:.78;}
.ttitle{font-family:"CardoGTBold",serif;font-size:1.9rem;color:#e8ddc8;}
.ttitle span{font-family:"CardoGT",serif;font-size:1.35rem;color:rgba(218,195,142,.40);margin-left:.6rem;}
.tright{display:flex;align-items:center;gap:1rem;}
.tback{color:rgba(180,148,70,.68);text-decoration:none;font-size:1.4rem;transition:color .18s;}
.tback:hover{color:var(--gold2);}
.tbtn{padding:.65rem 1.4rem;border:1px solid rgba(180,148,70,.28);border-radius:3px;background:rgba(255,255,255,.05);color:rgba(218,195,142,.72);font:1.4rem/1.2 "LatoGT",Arial,sans-serif;cursor:pointer;transition:background .18s,color .18s;}
.tbtn:hover{background:rgba(255,255,255,.10);color:#e8ddc8;}
.api-mode{font-size:1.3rem;padding:.3rem .8rem;border-radius:999px;font-family:"LatoGT",sans-serif;}
.api-mode.live{background:rgba(74,138,50,.15);border:1px solid rgba(74,138,50,.30);color:#4a8a32;}
.api-mode.local{background:rgba(180,140,60,.15);border:1px solid rgba(180,140,60,.30);color:#8a6c22;}
/* Layout */
.admin-layout{display:grid;grid-template-columns:210px 1fr;min-height:calc(100vh - 52px);}
.admin-nav{background:rgba(18,13,8,.94);border-right:1px solid rgba(130,108,65,.18);padding:1.8rem 0;}
.admin-nav a{display:flex;align-items:center;gap:.9rem;padding:.95rem 1.8rem;font:1.5rem/1.2 "CardoGTBold",serif;color:rgba(210,190,148,.62);text-decoration:none;transition:background .18s,color .18s;border-left:3px solid transparent;}
.admin-nav a:hover{background:rgba(255,255,255,.04);color:rgba(235,215,165,.88);}
.admin-nav a.act{color:var(--gold2);background:rgba(200,164,82,.08);border-left-color:var(--gold);}
.ni{font-size:1.7rem;flex-shrink:0;}
.admin-main{padding:2.6rem 2.8rem;overflow-x:hidden;}
.admin-page{display:none;}.admin-page.act{display:block;}
/* Section */
.sec{background:var(--paper);border:1px solid rgba(178,152,90,.24);border-radius:4px;box-shadow:0 8px 28px rgba(0,0,0,.18);margin-bottom:2.4rem;overflow:hidden;animation:sIn .4s var(--ease) both;}
@keyframes sIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.sh2{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.5rem 2rem;background:linear-gradient(to right,rgba(225,215,190,.50),rgba(235,225,202,.35));border-bottom:1px solid rgba(178,152,90,.18);}
.shl{display:flex;align-items:center;gap:1rem;}
.sico{font-size:2.1rem;line-height:1;}
.sh2 h2{font-family:"CardoGTBold",serif;font-size:2.3rem;color:var(--text);}
.sh2 p{font-family:"CardoGT",serif;font-size:1.42rem;color:var(--text2);margin-top:.2rem;}
.sb{padding:2rem;}
/* Stone Buttons */
.sbtn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:3px 8px 4px 9px/5px 2px 7px 3px;font:1.48rem/1.2 "CardoGTBold",serif;padding:.85rem 1.8rem;cursor:pointer;color:#2a2010;text-shadow:0 1px 0 rgba(255,248,210,.45);transition:transform .16s,filter .16s;position:relative;overflow:hidden;background:linear-gradient(165deg,rgba(208,200,184,.98) 0%,rgba(184,176,160,.98) 46%,rgba(156,148,133,.99) 100%);border:1px solid rgba(115,103,72,.52);box-shadow:inset 0 2px 2px rgba(255,250,225,.48),inset 0 -2px 4px rgba(58,46,18,.22),0 4px 0 rgba(80,66,34,.42),0 5px 12px rgba(22,14,4,.18);}
.sbtn.gold{background:linear-gradient(165deg,rgba(192,154,72,.97) 0%,rgba(158,120,48,.98) 50%,rgba(120,88,28,1) 100%);border-color:rgba(108,84,38,.60);color:#f8f0e0;text-shadow:0 1px 1px rgba(30,18,6,.42);box-shadow:inset 0 2px 1px rgba(255,255,255,.18),inset 0 -2px 4px rgba(50,30,8,.28),0 4px 0 rgba(55,38,16,.55),0 5px 14px rgba(0,0,0,.22);}
.sbtn.green{background:linear-gradient(165deg,rgba(74,138,50,.95) 0%,rgba(48,95,30,.97) 100%);border-color:rgba(28,68,14,.58);color:#e4f5dc;box-shadow:inset 0 2px 1px rgba(255,255,255,.14),inset 0 -2px 4px rgba(14,35,8,.28),0 4px 0 rgba(22,50,10,.52),0 5px 12px rgba(4,20,2,.22);}
.sbtn.red{background:linear-gradient(165deg,rgba(192,57,43,.93) 0%,rgba(140,35,24,.96) 100%);border-color:rgba(100,22,14,.60);color:#fce4e0;box-shadow:inset 0 2px 1px rgba(255,255,255,.12),inset 0 -2px 4px rgba(40,10,6,.28),0 4px 0 rgba(80,18,10,.52),0 5px 12px rgba(30,4,2,.22);}
.sbtn.sm{padding:.55rem 1.1rem;font-size:1.28rem;}
.sbtn:hover{transform:translateY(-2px);filter:brightness(1.08);}
.sbtn:active{transform:translateY(1px);filter:brightness(.96);}
.sbtn:disabled{opacity:.38;pointer-events:none;}
/* Forms */
.fld{display:flex;flex-direction:column;gap:.38rem;margin-bottom:1.3rem;}
.fld label{font-family:"CardoGTBold",serif;font-size:1.35rem;color:var(--text2);letter-spacing:.05em;text-transform:uppercase;}
.fld input,.fld textarea,.fld select{width:100%;padding:.9rem 1rem;border:1px solid var(--bd);background:rgba(255,255,255,.84);font:1.6rem/1.3 "CardoGT",serif;color:var(--text);border-radius:3px;transition:border-color .18s,box-shadow .18s;}
.fld input:focus,.fld textarea:focus,.fld select:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(180,140,60,.12);}
.fld textarea{min-height:10rem;resize:vertical;}
.fg2{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem;}
.fg3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1.1rem;}
/* Toggle */
.badge{display:inline-flex;align-items:center;gap:.45rem;padding:.4rem 1.1rem;border-radius:999px;font-family:"CardoGTBold",serif;font-size:1.28rem;letter-spacing:.06em;text-transform:uppercase;border:1.5px solid;transition:all .28s;flex-shrink:0;}
.badge .dot{width:7px;height:7px;border-radius:50%;background:currentColor;flex-shrink:0;}
.badge.off{background:rgba(46,90,30,.09);border-color:rgba(46,90,30,.22);color:var(--green);}
.badge.on{background:rgba(139,46,26,.11);border-color:rgba(139,46,26,.26);color:var(--red);}
.badge.on .dot{animation:blink 2s infinite;}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}
.tgl{display:flex;flex-direction:column;align-items:center;gap:.7rem;flex-shrink:0;}
.tgl-sw{position:relative;width:66px;height:33px;cursor:pointer;display:block;}
.tgl-sw input{opacity:0;position:absolute;width:0;height:0;}
.tgl-tr{position:absolute;inset:0;border-radius:999px;background:rgba(120,108,80,.22);border:1.5px solid rgba(120,108,80,.30);transition:background .26s,border-color .26s,box-shadow .26s;}
.tgl-sw input:checked~.tgl-tr{background:linear-gradient(135deg,#c0392b 0%,#921f17 100%);border-color:#7a1a10;box-shadow:0 0 0 3px rgba(192,57,43,.15);}
.tgl-th{position:absolute;top:3px;left:3px;width:25px;height:25px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.22);transition:transform .26s var(--ease);pointer-events:none;}
.tgl-sw input:checked~.tgl-th{transform:translateX(33px);}
.tgl-lbl{font-family:"CardoGTBold",serif;font-size:1.35rem;letter-spacing:.07em;text-transform:uppercase;color:var(--text2);}
.tgl.busy{opacity:.5;pointer-events:none;}.tgl.is-on .tgl-lbl{color:var(--red);}
.mrow{display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap;}
.minfo h3{font-family:"CardoGTBold",serif;font-size:1.9rem;margin-bottom:.5rem;}
.minfo p{font-family:"CardoGT",serif;font-size:1.6rem;color:var(--text2);max-width:480px;line-height:1.56;}
/* Tabs */
.tabs{display:flex;gap:.4rem;margin-bottom:1.6rem;flex-wrap:wrap;}
.tab{padding:.6rem 1.5rem;border:1px solid var(--bd);border-radius:3px;background:rgba(255,255,255,.46);font:1.48rem/1.2 "CardoGTBold",serif;color:var(--text2);cursor:pointer;transition:all .18s;}
.tab .n{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 .3rem;border-radius:999px;background:var(--gold);color:#fff;font-size:1.08rem;margin-left:.4rem;vertical-align:middle;}
.tab.act{background:rgba(255,255,255,.88);border-color:rgba(160,128,60,.36);color:var(--text);box-shadow:0 2px 8px rgba(0,0,0,.08);}
.tp{display:none;}.tp.act{display:block;}
/* Entries / Cards */
.empty{font-family:"CardoGT",serif;font-size:1.7rem;color:var(--text2);text-align:center;padding:2.4rem 2rem;opacity:.6;}
.ldg{font-family:"CardoGT",serif;font-size:1.55rem;color:var(--text2);padding:1.2rem 0;opacity:.5;}
.ent{display:grid;grid-template-columns:1fr auto;gap:1rem;align-items:start;padding:1.4rem 1.5rem;background:rgba(255,255,255,.52);border:1px solid var(--bd2);border-radius:3px;margin-bottom:.8rem;transition:background .18s;}
.ent:hover{background:rgba(255,255,255,.78);}
.emeta{display:flex;align-items:baseline;gap:.8rem;margin-bottom:.5rem;flex-wrap:wrap;}
.ename{font-family:"CardoGTBold",serif;font-size:1.85rem;color:var(--text);}
.ectx{font-family:"CardoGT",serif;font-size:1.48rem;color:var(--text2);}
.edate{font-size:1.25rem;color:rgba(90,78,56,.48);margin-left:auto;}
.emsg{font-family:"CardoGT",serif;font-size:1.62rem;line-height:1.52;color:var(--text);}
.eacts{display:flex;flex-direction:column;gap:.45rem;flex-shrink:0;}
/* Stats */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:1rem;margin-bottom:1.8rem;}
.sc{padding:1.3rem;background:rgba(255,255,255,.50);border:1px solid var(--bd2);border-radius:3px;text-align:center;}
.sn{font-family:"CardoGTBold",serif;font-size:3.4rem;color:var(--text);line-height:1;}
.sl{font-family:"CardoGT",serif;font-size:1.35rem;color:var(--text2);margin-top:.4rem;}
/* Events */
.ev-card{display:grid;grid-template-columns:1fr auto;gap:1rem;align-items:start;padding:1.3rem 1.5rem;background:rgba(255,255,255,.52);border:1px solid var(--bd2);border-radius:3px;margin-bottom:.8rem;transition:background .18s;}
.ev-card:hover{background:rgba(255,255,255,.78);}
.ev-date-lbl{font-family:"CardoGTBold",serif;font-size:1.38rem;color:var(--gold3);margin-bottom:.2rem;}
.ev-title-lbl{font-family:"CardoGTBold",serif;font-size:1.78rem;color:var(--text);}
.ev-loc-lbl{font-family:"CardoGT",serif;font-size:1.4rem;color:var(--text2);}
.ev-acts{display:flex;gap:.45rem;flex-shrink:0;}
/* ══ WEBSITE BUILDER ══ */
.builder-layout{display:grid;grid-template-columns:300px 1fr;gap:0;min-height:600px;border:1px solid var(--bd);border-radius:4px;overflow:hidden;}
.builder-pages{background:rgba(245,240,228,.95);border-right:1px solid var(--bd);overflow-y:auto;max-height:700px;}
.builder-pages h3{font-family:"CardoGTBold",serif;font-size:1.5rem;color:var(--text2);padding:1.2rem 1.4rem .8rem;border-bottom:1px solid var(--bd2);letter-spacing:.04em;text-transform:uppercase;}
.builder-page-item{display:flex;align-items:center;gap:.6rem;padding:.9rem 1.4rem;cursor:pointer;border-bottom:1px solid rgba(160,138,95,.12);transition:background .15s;font-family:"CardoGT",serif;font-size:1.52rem;color:var(--text);}
.builder-page-item:hover{background:rgba(200,164,82,.10);}
.builder-page-item.act{background:rgba(200,164,82,.18);font-family:"CardoGTBold",serif;border-left:3px solid var(--gold);}
.builder-page-item .page-icon{font-size:1.4rem;flex-shrink:0;}
.builder-page-item .page-has-edit{font-size:1.1rem;color:var(--green);margin-left:auto;flex-shrink:0;}
.builder-editor{display:flex;flex-direction:column;background:rgba(255,255,255,.92);}
.builder-editor-top{padding:1.4rem 1.8rem;border-bottom:1px solid var(--bd2);display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;}
.builder-editor-top h3{font-family:"CardoGTBold",serif;font-size:2rem;color:var(--text);}
.builder-editor-actions{display:flex;gap:.6rem;flex-wrap:wrap;}
.builder-tabs{display:flex;border-bottom:1px solid var(--bd2);}
.btab{padding:.8rem 1.6rem;font:1.4rem/1.2 "CardoGTBold",serif;color:var(--text2);cursor:pointer;border-bottom:2px solid transparent;transition:color .16s,border-color .16s;background:none;border-top:none;border-left:none;border-right:none;}
.btab.act{color:var(--gold3);border-bottom-color:var(--gold);}
.btab:hover{color:var(--text);}
.btab-panel{display:none;padding:1.8rem;flex:1;overflow-y:auto;}.btab-panel.act{display:block;}
/* Visual blocks */
.block-list{display:flex;flex-direction:column;gap:1rem;}
.block{border:2px solid transparent;border-radius:4px;padding:1.2rem;background:rgba(248,244,236,.8);transition:border-color .16s;}
.block:hover{border-color:rgba(200,164,82,.35);}
.block-header{display:flex;align-items:center;gap:.8rem;margin-bottom:.8rem;}
.block-type{font-family:"CardoGTBold",serif;font-size:1.25rem;color:var(--text2);letter-spacing:.06em;text-transform:uppercase;background:rgba(200,164,82,.15);padding:.25rem .7rem;border-radius:999px;}
.block-actions{display:flex;gap:.35rem;margin-left:auto;}
.bact{padding:.3rem .6rem;border:1px solid var(--bd);border-radius:2px;background:rgba(255,255,255,.7);font:1.2rem/1.2 "LatoGT",sans-serif;color:var(--text2);cursor:pointer;transition:background .14s;}
.bact:hover{background:rgba(200,164,82,.15);color:var(--text);}
.bact.del:hover{background:rgba(192,57,43,.12);color:var(--red);border-color:rgba(192,57,43,.3);}
/* Block field styles */
.bf{margin-bottom:.8rem;}
.bf label{display:block;font-family:"CardoGTBold",serif;font-size:1.25rem;color:var(--text2);letter-spacing:.04em;text-transform:uppercase;margin-bottom:.3rem;}
.bf input,.bf textarea,.bf select{width:100%;padding:.7rem .9rem;border:1px solid var(--bd);background:rgba(255,255,255,.9);font:1.5rem/1.3 "CardoGT",serif;color:var(--text);border-radius:3px;transition:border-color .16s;}
.bf input:focus,.bf textarea:focus,.bf select:focus{outline:none;border-color:var(--gold);}
.bf textarea{min-height:8rem;resize:vertical;}
.bf-img-wrap{display:flex;gap:.6rem;align-items:flex-end;}
.bf-img-wrap input{flex:1;}
.img-preview{width:60px;height:45px;object-fit:cover;border-radius:2px;border:1px solid var(--bd);display:block;}
/* Add block buttons */
.add-block-bar{display:flex;gap:.5rem;flex-wrap:wrap;padding:1.2rem 1.8rem;border-top:1px solid var(--bd2);background:rgba(245,240,228,.6);}
.add-block-btn{padding:.55rem 1.1rem;border:1px solid var(--bd);border-radius:3px;background:rgba(255,255,255,.7);font:1.32rem/1.2 "CardoGTBold",serif;color:var(--text2);cursor:pointer;transition:background .14s,border-color .14s;}
.add-block-btn:hover{background:rgba(200,164,82,.15);border-color:rgba(200,164,82,.45);color:var(--text);}
/* Live preview iframe */
.preview-frame{width:100%;height:500px;border:none;border-radius:4px;background:#fff;}
/* Media */
.upload-drop{border:2px dashed rgba(160,138,95,.32);border-radius:4px;padding:2.4rem 2rem;text-align:center;cursor:pointer;transition:border-color .22s,background .22s;margin-bottom:1.4rem;}
.upload-drop:hover,.upload-drop.drag{border-color:var(--gold);background:rgba(200,164,82,.04);}
.upload-drop p{font-family:"CardoGT",serif;font-size:1.6rem;color:var(--text2);}
.upload-drop input{display:none;}
.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:1rem;}
.mi{border:1px solid var(--bd2);border-radius:3px;overflow:hidden;background:rgba(255,255,255,.52);position:relative;}
.mi img{width:100%;height:100px;object-fit:cover;display:block;}
.mi .mn{font-size:1.1rem;font-family:"LatoGT",sans-serif;padding:.4rem .5rem;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mi-del{position:absolute;top:.3rem;right:.3rem;width:22px;height:22px;border-radius:50%;background:rgba(192,57,43,.82);border:none;color:#fff;font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .16s;}
.mi:hover .mi-del{opacity:1;}
.mi-cp{position:absolute;top:.3rem;left:.3rem;padding:.2rem .4rem;background:rgba(20,14,6,.70);border:none;color:#e8ddc8;font-size:1.1rem;cursor:pointer;border-radius:2px;opacity:0;transition:opacity .16s;}
.mi:hover .mi-cp{opacity:1;}
/* PW */
.pw-row{display:grid;grid-template-columns:1fr 1fr auto;gap:1rem;align-items:end;}
/* Toast */
#toast{position:fixed;bottom:2.2rem;right:2.2rem;z-index:9999;padding:1.1rem 1.8rem;background:rgba(28,20,10,.97);color:#e8ddc8;border:1px solid rgba(180,148,70,.28);border-radius:3px;font-family:"CardoGT",serif;font-size:1.6rem;box-shadow:0 8px 26px rgba(0,0,0,.40);max-width:300px;transform:translateY(calc(100% + 2.8rem));opacity:0;transition:transform .28s var(--ease),opacity .28s;pointer-events:none;}
#toast.show{transform:translateY(0);opacity:1;}
#toast.ok::before{content:"✓ ";}
#toast.err::before{content:"✕ ";color:#e07060;}
@media(max-width:900px){.admin-layout{grid-template-columns:1fr;}.admin-nav{display:flex;overflow-x:auto;padding:0;border-right:none;border-bottom:1px solid rgba(130,108,65,.18);}.admin-nav a{flex-shrink:0;padding:.9rem 1.3rem;border-left:none;border-bottom:3px solid transparent;}.admin-nav a.act{border-bottom-color:var(--gold);border-left:none;}.admin-main{padding:1.6rem 1.4rem;}.pw-row,.fg2,.fg3,.builder-layout{grid-template-columns:1fr;}}
</style>
</head>
<body>
<!-- Login -->
<div id="ls">
<div class="lcard">
<img src="../assets/images/logo-gut-trechow.png" alt="Gut Trechow">
<h1>Administration</h1>
<p class="sub">Gut Trechow · Interner Bereich</p>
<div class="lf"><label for="lu">Benutzername</label><input type="text" id="lu" autocomplete="username" spellcheck="false" autocorrect="off" autocapitalize="off"></div>
<div class="lf"><label for="lp">Passwort</label><input type="password" id="lp" autocomplete="current-password"></div>
<button class="lbtn" id="lbtn">Anmelden</button>
<div class="lerr" id="lerr">Benutzername oder Passwort falsch.</div>
</div>
</div>
<!-- Admin -->
<div id="sh">
<div class="topbar">
<div class="tbrand"><img class="tlogo" src="../assets/images/logo-gut-trechow.png" alt=""><div><div class="ttitle">Admin <span>Gut Trechow</span></div></div></div>
<div class="tright">
<span class="api-mode local" id="apiMode">⬤ Lokal</span>
<a class="tback" href="../index.html">← Zur Website</a>
<button class="tbtn" id="lout">Abmelden</button>
</div>
</div>
<div class="admin-layout">
<nav class="admin-nav">
<a href="#" data-page="dash" class="act"><span class="ni">🏠</span>Übersicht</a>
<a href="#" data-page="builder"><span class="ni">🏗</span>Website-Builder</a>
<a href="#" data-page="maint"><span class="ni">🔧</span>Wartungsmodus</a>
<a href="#" data-page="gb"><span class="ni">📖</span>Gästebuch</a>
<a href="#" data-page="ev"><span class="ni">📅</span>Veranstaltungen</a>
<a href="#" data-page="media"><span class="ni">🖼</span>Medien</a>
<a href="#" data-page="settings"><span class="ni">⚙️</span>Einstellungen</a>
</nav>
<main class="admin-main">
<!-- Dashboard -->
<div class="admin-page act" id="page-dash">
<div class="sec"><div class="sh2"><div class="shl"><span class="sico">🏠</span><div><h2>Übersicht</h2></div></div></div>
<div class="sb"><div class="stats">
<div class="sc"><div class="sn" id="d-pend">–</div><div class="sl">Ausstehend</div></div>
<div class="sc"><div class="sn" id="d-appr">–</div><div class="sl">Freigegeben</div></div>
<div class="sc"><div class="sn" id="d-ev">–</div><div class="sl">Veranstaltungen</div></div>
<div class="sc"><div class="sn" id="d-maint" style="font-size:2.2rem">–</div><div class="sl">Wartungsmodus</div></div>
</div>
<p style="font-family:'CardoGT',serif;font-size:1.55rem;color:var(--text2);margin-top:1rem;" id="dash-api-info"></p>
</div></div>
</div>
<!-- Website-Builder -->
<div class="admin-page" id="page-builder">
<div class="sec">
<div class="sh2"><div class="shl"><span class="sico">🏗</span><div><h2>Website-Builder</h2><p>Alle Seiteninhalte, Bilder und Texte visuell bearbeiten</p></div></div>
<div style="display:flex;gap:.6rem;">
<button class="sbtn sm" id="builder-preview-btn">👁 Vorschau</button>
<button class="sbtn gold" id="builder-save-btn">💾 Speichern</button>
</div>
</div>
<div class="builder-layout">
<!-- Page list -->
<div class="builder-pages">
<h3>Seiten</h3>
<div id="builder-page-list"></div>
</div>
<!-- Editor area -->
<div class="builder-editor" id="builder-editor-area">
<div class="builder-editor-top">
<h3 id="builder-page-title">Seite wählen →</h3>
<div class="builder-editor-actions" id="builder-actions" style="display:none">
<a id="builder-open-link" href="#" target="_blank" class="sbtn sm">🔗 Seite öffnen</a>
</div>
</div>
<div class="builder-tabs" id="builder-tabs" style="display:none">
<button class="btab act" data-btab="blocks">📝 Inhalt</button>
<button class="btab" data-btab="hero">🖼 Hero-Bild</button>
<button class="btab" data-btab="meta">⚙ Meta</button>
</div>
<!-- Blocks tab -->
<div class="btab-panel act" id="btab-blocks">
<div class="block-list" id="block-list"></div>
<div class="add-block-bar">
<span style="font-family:'CardoGTBold',serif;font-size:1.35rem;color:var(--text2);margin-right:.3rem;">+ Block:</span>
<button class="add-block-btn" data-btype="text">📝 Text</button>
<button class="add-block-btn" data-btype="heading">🔤 Überschrift</button>
<button class="add-block-btn" data-btype="image">🖼 Bild</button>
<button class="add-block-btn" data-btype="gallery">📷 Galerie</button>
<button class="add-block-btn" data-btype="divider">— Trennlinie</button>
</div>
</div>
<!-- Hero tab -->
<div class="btab-panel" id="btab-hero">
<div style="padding:1.8rem;">
<div class="bf"><label>Hero-Bild URL</label>
<div class="bf-img-wrap">
<input type="text" id="hero-img" placeholder="assets/uploads/2020/03/gt_menu_burgensemble.jpg">
<img class="img-preview" id="hero-preview" src="" alt="" style="display:none">
</div>
<p style="margin-top:.4rem;font-family:'CardoGT',serif;font-size:1.35rem;color:var(--text2);">Bild aus der Medienbibliothek wählen oder URL eingeben.</p>
</div>
<div class="bf"><label>Kicker-Text (klein über dem Titel)</label><input type="text" id="hero-kicker" placeholder="z.B. Gut Trechow"></div>
<div class="bf"><label>Hero-Titel</label><input type="text" id="hero-heading" placeholder="z.B. Landwirtschaft"></div>
<button class="sbtn" id="media-picker-btn" style="margin-top:.5rem;">📁 Bild aus Medienbibliothek</button>
</div>
</div>
<!-- Meta tab -->
<div class="btab-panel" id="btab-meta">
<div style="padding:1.8rem;">
<div class="bf"><label>Seitentitel (Browser-Tab)</label><input type="text" id="meta-title" placeholder="Seitentitel – Gut Trechow"></div>
<div class="bf"><label>Beschreibung (SEO)</label><textarea id="meta-desc" style="min-height:6rem;" placeholder="Kurze Beschreibung …"></textarea></div>
</div>
</div>
<div id="builder-empty" style="display:flex;align-items:center;justify-content:center;height:200px;font-family:'CardoGT',serif;font-size:1.7rem;color:rgba(90,78,56,.45);">
← Seite auswählen
</div>
</div>
</div>
</div>
</div>
<!-- Wartungsmodus -->
<div class="admin-page" id="page-maint">
<div class="sec">
<div class="sh2"><div class="shl"><span class="sico">🔧</span><div><h2>Wartungsmodus</h2><p>Website für alle Besucher sperren</p></div></div><div class="badge off" id="mbadge"><span class="dot"></span><span id="mbadgetxt">Normal</span></div></div>
<div class="sb"><div class="mrow">
<div class="minfo"><h3>Wartungsseite aktivieren</h3><p>Wenn eingeschaltet, sehen alle Besucher eine Wartungsmeldung. Der Status wird gespeichert und gilt global.</p></div>
<div class="tgl" id="tgl"><label class="tgl-sw" id="tgl-sw"><input type="checkbox" id="mtog"><span class="tgl-tr"></span><span class="tgl-th"></span></label><span class="tgl-lbl" id="tlbl">AUS</span></div>
</div></div>
</div>
</div>
<!-- Gästebuch -->
<div class="admin-page" id="page-gb">
<div class="sec">
<div class="sh2"><div class="shl"><span class="sico">📖</span><div><h2>Gästebuch</h2><p>Einträge freigeben oder löschen</p></div></div><button class="sbtn sm" id="gb-refresh">↻ Aktualisieren</button></div>
<div class="sb">
<div class="stats"><div class="sc"><div class="sn" id="gp">–</div><div class="sl">Ausstehend</div></div><div class="sc"><div class="sn" id="ga">–</div><div class="sl">Freigegeben</div></div></div>
<div class="tabs"><button class="tab act" data-t="p">Ausstehend <span class="n" id="bp">0</span></button><button class="tab" data-t="a">Freigegeben <span class="n" id="ba">0</span></button></div>
<div class="tp act" id="tp-p"><div class="ldg">Wird geladen …</div></div>
<div class="tp" id="tp-a"><div class="ldg">Wird geladen …</div></div>
</div>
</div>
</div>
<!-- Veranstaltungen -->
<div class="admin-page" id="page-ev">
<div class="sec">
<div class="sh2"><div class="shl"><span class="sico">📅</span><div><h2>Veranstaltungen</h2><p>Termine verwalten</p></div></div><button class="sbtn gold" id="ev-new">+ Neuer Termin</button></div>
<div class="sb" id="ev-form-wrap" style="display:none;border-bottom:1px solid var(--bd2);padding-bottom:1.8rem;margin-bottom:1.8rem;">
<input type="hidden" id="ev-id">
<div class="fg2"><div class="fld"><label>Titel *</label><input id="ev-title" type="text" placeholder="z.B. Burgführung"></div><div class="fld"><label>Datum *</label><input id="ev-date" type="date"></div></div>
<div class="fg3"><div class="fld"><label>Uhrzeit</label><input id="ev-time" type="time"></div><div class="fld" style="grid-column:span 2"><label>Ort</label><input id="ev-loc" type="text" placeholder="z.B. Burgensemble …"></div></div>
<div class="fld"><label>Beschreibung</label><textarea id="ev-desc" style="min-height:7rem;" placeholder="Weitere Infos …"></textarea></div>
<div style="display:flex;gap:.8rem;"><button class="sbtn gold" id="ev-save">Speichern</button><button class="sbtn" id="ev-cancel">Abbrechen</button></div>
</div>
<div class="sb" id="ev-list"><div class="ldg">Wird geladen …</div></div>
</div>
</div>
<!-- Medien -->
<div class="admin-page" id="page-media">
<div class="sec">
<div class="sh2"><div class="shl"><span class="sico">🖼</span><div><h2>Medienbibliothek</h2><p>Bilder hochladen und verwalten</p></div></div></div>
<div class="sb">
<label class="upload-drop" id="drop-zone"><p>📁 Bilder hier ablegen oder klicken<br><span style="font-size:1.32rem;opacity:.6">JPG · PNG · GIF · WebP · PDF · max 10 MB</span></p><input type="file" id="file-input" accept="image/*,application/pdf" multiple></label>
<div id="up-status" style="display:none;font-family:'CardoGT',serif;font-size:1.5rem;color:var(--text2);margin-bottom:1rem;"></div>
<div class="media-grid" id="mgrid"><div class="ldg">Wird geladen …</div></div>
</div>
</div>
</div>
<!-- Einstellungen -->
<div class="admin-page" id="page-settings">
<div class="sec"><div class="sh2"><div class="shl"><span class="sico">🔑</span><div><h2>Passwort ändern</h2></div></div></div>
<div class="sb"><div class="pw-row">
<div class="fld" style="margin:0"><label>Neues Passwort</label><input type="password" id="np1" placeholder="Mind. 6 Zeichen"></div>
<div class="fld" style="margin:0"><label>Wiederholen</label><input type="password" id="np2" placeholder="Bestätigung"></div>
<button class="sbtn gold" id="pw-save">Speichern</button>
</div></div>
</div>
</div>
</main>
</div>
</div>
<div id="toast"></div>
<!-- Media picker modal -->
<div id="media-modal" style="display:none;position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.7);align-items:center;justify-content:center;padding:2rem;">
<div style="background:var(--paper);border-radius:6px;max-width:800px;width:100%;max-height:80vh;overflow:hidden;display:flex;flex-direction:column;">
<div style="padding:1.4rem 1.8rem;border-bottom:1px solid var(--bd);display:flex;justify-content:space-between;align-items:center;">
<span style="font-family:'CardoGTBold',serif;font-size:2rem;color:var(--text);">Bild wählen</span>
<button class="sbtn sm red" id="modal-close">✕</button>
</div>
<div class="media-grid" id="modal-grid" style="padding:1.4rem;overflow-y:auto;flex:1;"></div>
</div>
</div>
<script>
(function(){
'use strict';
/* ── Helpers ── */
var _tt=null;
function toast(m,t){var el=document.getElementById('toast');el.textContent=m;el.className='show '+(t||'');clearTimeout(_tt);_tt=setTimeout(function(){el.className='';},3600);}
function fmt(iso){var d=new Date(iso);return isNaN(d)?'':d.toLocaleDateString('de-DE',{day:'2-digit',month:'2-digit',year:'numeric',hour:'2-digit',minute:'2-digit'});}
function fmtDate(iso){var d=new Date(iso);if(isNaN(d))return iso||'';return d.toLocaleDateString('de-DE',{day:'2-digit',month:'long',year:'numeric'});}
function esc(s){return String(s||'').replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>').replace(/"/g,'"');}
/* ── Nav ── */
document.querySelectorAll('.admin-nav a[data-page]').forEach(function(a){
a.addEventListener('click',function(e){
e.preventDefault();
document.querySelectorAll('.admin-nav a').forEach(function(x){x.classList.remove('act');});
document.querySelectorAll('.admin-page').forEach(function(x){x.classList.remove('act');});
a.classList.add('act');
var pg=document.getElementById('page-'+a.dataset.page);
if(pg)pg.classList.add('act');
if(a.dataset.page==='gb')loadGB();
if(a.dataset.page==='ev')loadEvents();
if(a.dataset.page==='media')loadMedia();
if(a.dataset.page==='maint')loadMaint();
if(a.dataset.page==='builder')initBuilder();
});
});
/* ── Auth ── */
function showAdmin(){
document.getElementById('ls').style.display='none';
document.getElementById('sh').classList.add('v');
// Check if PHP api available
fetch(window.GT_API_URL||(document.querySelector('script[src*="api.js"]').getAttribute('src').replace('assets/js/api.js','api.php')+'?action=check'))
.then(function(r){return r.json();})
.then(function(){
document.getElementById('apiMode').textContent='⬤ Server';
document.getElementById('apiMode').className='api-mode live';
document.getElementById('dash-api-info').textContent='✓ PHP-Backend verbunden – alle Daten werden auf dem Server gespeichert.';
})
.catch(function(){
document.getElementById('dash-api-info').textContent='⚠ Lokal-Modus: Daten werden im Browser gespeichert (localStorage). Auf dem Server läuft alles automatisch via api.php.';
});
loadDash();
}
function doLogin(){
var u=document.getElementById('lu').value.trim();
var p=document.getElementById('lp').value;
var btn=document.getElementById('lbtn');
var err=document.getElementById('lerr');
if(!u||!p){err.textContent='Bitte beide Felder ausfüllen.';err.className='lerr show';return;}
btn.disabled=true;btn.textContent='Anmelden …';err.className='lerr';
window.GT.login(u,p).then(function(d){
btn.disabled=false;btn.textContent='Anmelden';showAdmin();
}).catch(function(e){
btn.disabled=false;btn.textContent='Anmelden';
document.getElementById('lp').value='';
err.textContent='Benutzername oder Passwort falsch.';
err.className='lerr show';
document.getElementById('lp').focus();
});
}
document.getElementById('lbtn').addEventListener('click',doLogin);
document.getElementById('lp').addEventListener('keydown',function(e){if(e.key==='Enter')doLogin();});
document.getElementById('lu').addEventListener('keydown',function(e){if(e.key==='Enter')document.getElementById('lp').focus();});
document.getElementById('lout').addEventListener('click',function(){window.GT.logout().finally(function(){location.reload();});});
window.GT.checkAuth().then(function(d){if(d&&d.ok)showAdmin();});
/* ── Dashboard ── */
function loadDash(){
Promise.all([window.GT.getMaintenance(),window.GT.getAllEntries(),window.GT.getEvents()]).then(function(r){
var on=r[0],gb=r[1],evs=r[2]||[];
document.getElementById('d-pend').textContent=gb.pending.length;
document.getElementById('d-appr').textContent=gb.approved.length;
document.getElementById('d-ev').textContent=evs.length;
var dm=document.getElementById('d-maint');
dm.textContent=on?'AN':'AUS';dm.style.color=on?'var(--red)':'var(--green)';
}).catch(function(){});
}
/* ── Wartungsmodus ── */
var _ms=false;
function syncMaint(on){_ms=on;document.getElementById('mbadge').className='badge '+(on?'on':'off');document.getElementById('mbadgetxt').textContent=on?'WARTUNG AKTIV':'Normal';document.getElementById('tlbl').textContent=on?'EIN':'AUS';document.getElementById('tgl').classList.toggle('is-on',on);document.getElementById('mtog').checked=on;}
function loadMaint(){var tgl=document.getElementById('tgl');tgl.classList.add('busy');window.GT.getMaintenance().then(function(on){syncMaint(on);tgl.classList.remove('busy');}).catch(function(){tgl.classList.remove('busy');});}
document.getElementById('tgl-sw').addEventListener('click',function(e){
var tgl=document.getElementById('tgl');if(tgl.classList.contains('busy')){e.preventDefault();return;}
var want=!_ms;syncMaint(want);tgl.classList.add('busy');
window.GT.setMaintenance(want).then(function(a){syncMaint(a);tgl.classList.remove('busy');toast(a?'Wartungsmodus aktiviert.':'Deaktiviert.',a?'err':'ok');})
.catch(function(){syncMaint(_ms);tgl.classList.remove('busy');toast('Fehler.','err');});
});
/* ── Gästebuch ── */
function makeEnt(e,acts){
var d=document.createElement('div');d.className='ent';
var body=document.createElement('div');
var meta=document.createElement('div');meta.className='emeta';
var nm=document.createElement('span');nm.className='ename';nm.textContent=e.name;meta.appendChild(nm);
if(e.context){var cx=document.createElement('span');cx.className='ectx';cx.textContent='– '+e.context;meta.appendChild(cx);}
var dt=document.createElement('span');dt.className='edate';dt.textContent=fmt(e.date);meta.appendChild(dt);
body.appendChild(meta);
var msg=document.createElement('p');msg.className='emsg';msg.textContent=e.message;body.appendChild(msg);
d.appendChild(body);
if(acts&&acts.length){var aa=document.createElement('div');aa.className='eacts';acts.forEach(function(a){var btn=document.createElement('button');btn.className='sbtn sm '+a.cls;btn.textContent=a.label;btn.addEventListener('click',function(){a.fn(e,d,btn);});aa.appendChild(btn);});d.appendChild(aa);}
return d;
}
function loadGB(){
document.getElementById('tp-p').innerHTML='<div class="ldg">Wird geladen …</div>';
document.getElementById('tp-a').innerHTML='<div class="ldg">Wird geladen …</div>';
window.GT.getAllEntries().then(function(data){
var pnd=data.pending,apr=data.approved;
document.getElementById('gp').textContent=pnd.length;document.getElementById('ga').textContent=apr.length;
document.getElementById('bp').textContent=pnd.length;document.getElementById('ba').textContent=apr.length;
var pEl=document.getElementById('tp-p');pEl.innerHTML='';
if(!pnd.length)pEl.innerHTML='<div class="empty">Keine ausstehenden Einträge.</div>';
else pnd.forEach(function(e){pEl.appendChild(makeEnt(e,[
{cls:'green',label:'✓ Freigeben',fn:function(e,el,btn){btn.disabled=true;window.GT.approveEntry(e.id).then(function(){el.style.cssText='opacity:0;transition:.24s';setTimeout(loadGB,260);toast('Freigegeben.','ok');}).catch(function(){btn.disabled=false;toast('Fehler.','err');});}},
{cls:'red',label:'✕ Löschen',fn:function(e,el,btn){if(!confirm('Löschen?'))return;btn.disabled=true;window.GT.deleteEntry(e.id).then(function(){el.style.cssText='opacity:0;transition:.22s';setTimeout(loadGB,240);toast('Gelöscht.');}).catch(function(){btn.disabled=false;toast('Fehler.','err');});}}
]));});
var aEl=document.getElementById('tp-a');aEl.innerHTML='';
if(!apr.length)aEl.innerHTML='<div class="empty">Keine freigegebenen Einträge.</div>';
else apr.forEach(function(e){aEl.appendChild(makeEnt(e,[{cls:'red',label:'✕ Entfernen',fn:function(e,el,btn){if(!confirm('Entfernen?'))return;btn.disabled=true;window.GT.deleteEntry(e.id).then(function(){el.style.cssText='opacity:0;transition:.22s';setTimeout(loadGB,240);toast('Entfernt.');}).catch(function(){btn.disabled=false;toast('Fehler.','err');});}}]));});
}).catch(function(e){toast('Fehler: '+(e&&e.message),'err');});
}
document.getElementById('gb-refresh').addEventListener('click',loadGB);
document.querySelectorAll('#page-gb .tab').forEach(function(t){t.addEventListener('click',function(){document.querySelectorAll('#page-gb .tab').forEach(function(x){x.classList.remove('act');});document.querySelectorAll('#page-gb .tp').forEach(function(x){x.classList.remove('act');});t.classList.add('act');document.getElementById('tp-'+t.dataset.t).classList.add('act');});});
/* ── Veranstaltungen ── */
function loadEvents(){
var el=document.getElementById('ev-list');el.innerHTML='<div class="ldg">Wird geladen …</div>';
window.GT.getEvents().then(function(evs){
if(!evs||!evs.length){el.innerHTML='<div class="empty">Keine Veranstaltungen. Oben "+ Neuer Termin" klicken.</div>';return;}
el.innerHTML='';
evs.forEach(function(ev){
var card=document.createElement('div');card.className='ev-card';
var info=document.createElement('div');
info.innerHTML='<div class="ev-date-lbl">'+fmtDate(ev.date)+(ev.time?' · '+ev.time:'')+'</div>'+'<div class="ev-title-lbl">'+esc(ev.title)+'</div>'+(ev.location?'<div class="ev-loc-lbl">📍 '+esc(ev.location)+'</div>':'')+(ev.description?'<div class="ev-loc-lbl" style="margin-top:.3rem">'+esc(ev.description)+'</div>':'');
var acts=document.createElement('div');acts.className='ev-acts';
var eb=document.createElement('button');eb.className='sbtn sm';eb.textContent='✏ Bearbeiten';eb.addEventListener('click',function(){editEvent(ev);});
var db=document.createElement('button');db.className='sbtn sm red';db.textContent='✕';
db.addEventListener('click',function(){if(!confirm('Löschen?'))return;db.disabled=true;window.GT.deleteEvent(ev.id).then(function(){toast('Gelöscht.');loadEvents();}).catch(function(){db.disabled=false;toast('Fehler.','err');});});
acts.appendChild(eb);acts.appendChild(db);card.appendChild(info);card.appendChild(acts);el.appendChild(card);
});
}).catch(function(e){el.innerHTML='<div class="empty">Fehler: '+(e&&e.message||'')+'</div>';});
}
function editEvent(ev){
document.getElementById('ev-id').value=ev?ev.id:'';
document.getElementById('ev-title').value=ev?ev.title:'';
document.getElementById('ev-date').value=ev?ev.date:'';
document.getElementById('ev-time').value=ev?ev.time:'';
document.getElementById('ev-loc').value=ev?ev.location:'';
document.getElementById('ev-desc').value=ev?ev.description:'';
document.getElementById('ev-form-wrap').style.display='block';
document.getElementById('ev-title').focus();
}
document.getElementById('ev-new').addEventListener('click',function(){editEvent(null);});
document.getElementById('ev-cancel').addEventListener('click',function(){document.getElementById('ev-form-wrap').style.display='none';});
document.getElementById('ev-save').addEventListener('click',function(){
var btn=this;
var ev={id:document.getElementById('ev-id').value,title:document.getElementById('ev-title').value.trim(),date:document.getElementById('ev-date').value,time:document.getElementById('ev-time').value,location:document.getElementById('ev-loc').value.trim(),description:document.getElementById('ev-desc').value.trim()};
if(!ev.title||!ev.date){toast('Titel und Datum sind Pflicht.','err');return;}
btn.disabled=true;
window.GT.saveEvent(ev).then(function(){btn.disabled=false;document.getElementById('ev-form-wrap').style.display='none';toast('Gespeichert.','ok');loadEvents();}).catch(function(){btn.disabled=false;toast('Fehler.','err');});
});
/* ══════════════════════════════════════════════
WEBSITE BUILDER
══════════════════════════════════════════════ */
var PAGES=[
{slug:'index',label:'Startseite',icon:'🏠',path:'../index.html'},
{slug:'burgensemble',label:'Burgensemble',icon:'🏰',path:'../burgensemble/index.html'},
{slug:'burgensemble/burg',label:'Burg',icon:'🗼',path:'../burgensemble/burg/index.html'},
{slug:'burgensemble/burg/angebote-unterkuenfte',label:'Burg · Angebote',icon:'🛏',path:'../burgensemble/burg/angebote-unterkuenfte/index.html'},
{slug:'burgensemble/burg/fotogalerie',label:'Burg · Fotogalerie',icon:'📸',path:'../burgensemble/burg/fotogalerie/index.html'},
{slug:'burgensemble/burg/historie',label:'Burg · Historie',icon:'📜',path:'../burgensemble/burg/historie/index.html'},
{slug:'burgensemble/gaestebuch',label:'Gästebuch',icon:'📖',path:'../burgensemble/gaestebuch/index.html'},
{slug:'burgensemble/gaestebuch/eintraege',label:'Gästebuch · Einträge',icon:'📝',path:'../burgensemble/gaestebuch/eintraege/index.html'},
{slug:'burgensemble/gaestebuch/selbst-eintragen',label:'Gästebuch · Formular',icon:'✍️',path:'../burgensemble/gaestebuch/selbst-eintragen/index.html'},
{slug:'burgensemble/kornspeicher',label:'Kornspeicher',icon:'🌾',path:'../burgensemble/kornspeicher/index.html'},
{slug:'burgensemble/kornspeicher/angebote-unterkuenfte',label:'Kornspeicher · Angebote',icon:'🛏',path:'../burgensemble/kornspeicher/angebote-unterkuenfte/index.html'},
{slug:'burgensemble/kornspeicher/fotogalerie',label:'Kornspeicher · Fotogalerie',icon:'📸',path:'../burgensemble/kornspeicher/fotogalerie/index.html'},
{slug:'burgensemble/kornspeicher/historie',label:'Kornspeicher · Historie',icon:'📜',path:'../burgensemble/kornspeicher/historie/index.html'},
{slug:'burgensemble/marstall',label:'Marstall',icon:'🐴',path:'../burgensemble/marstall/index.html'},
{slug:'burgensemble/marstall/angebote',label:'Marstall · Angebote',icon:'🛏',path:'../burgensemble/marstall/angebote/index.html'},
{slug:'burgensemble/marstall/fotogalerie',label:'Marstall · Fotogalerie',icon:'📸',path:'../burgensemble/marstall/fotogalerie/index.html'},
{slug:'burgensemble/marstall/historie',label:'Marstall · Historie',icon:'📜',path:'../burgensemble/marstall/historie/index.html'},
{slug:'burgensemble/presse',label:'Presse',icon:'📰',path:'../burgensemble/presse/index.html'},
{slug:'burgensemble/presse/aktuelles',label:'Presse · Aktuelles',icon:'🗞',path:'../burgensemble/presse/aktuelles/index.html'},
{slug:'burgensemble/presse/archiv',label:'Presse · Archiv',icon:'🗃',path:'../burgensemble/presse/archiv/index.html'},
{slug:'burgensemble/projekte',label:'Projekte',icon:'🔨',path:'../burgensemble/projekte/index.html'},
{slug:'burgensemble/projekte/bauvorhaben',label:'Projekte · Bauvorhaben',icon:'🏗',path:'../burgensemble/projekte/bauvorhaben/index.html'},
{slug:'burgensemble/projekte/fotogalerie',label:'Projekte · Fotogalerie',icon:'📸',path:'../burgensemble/projekte/fotogalerie/index.html'},
{slug:'landwirtschaft',label:'Landwirtschaft',icon:'🌱',path:'../landwirtschaft/index.html'},
{slug:'landwirtschaft/bewirtschaftung',label:'Landwirtschaft · Bewirtschaftung',icon:'🚜',path:'../landwirtschaft/bewirtschaftung/index.html'},
{slug:'landwirtschaft/fotogalerie',label:'Landwirtschaft · Fotogalerie',icon:'📸',path:'../landwirtschaft/fotogalerie/index.html'},
{slug:'landwirtschaft/historie',label:'Landwirtschaft · Historie',icon:'📜',path:'../landwirtschaft/historie/index.html'},
{slug:'landwirtschaft/produkte-angebote',label:'Landwirtschaft · Produkte',icon:'🛒',path:'../landwirtschaft/produkte-angebote/index.html'},
{slug:'wald',label:'Wald',icon:'🌲',path:'../wald/index.html'},
{slug:'wald/bewirtschaftung',label:'Wald · Bewirtschaftung',icon:'🪵',path:'../wald/bewirtschaftung/index.html'},
{slug:'wald/fotogalerie',label:'Wald · Fotogalerie',icon:'📸',path:'../wald/fotogalerie/index.html'},
{slug:'wald/historie',label:'Wald · Historie',icon:'📜',path:'../wald/historie/index.html'},
{slug:'wald/produkte-angebote',label:'Wald · Angebote',icon:'🧺',path:'../wald/produkte-angebote/index.html'},
{slug:'see',label:'See',icon:'💧',path:'../see/index.html'},
{slug:'see/bewirtschaftung',label:'See · Bewirtschaftung',icon:'🎣',path:'../see/bewirtschaftung/index.html'},
{slug:'see/fotogalerie',label:'See · Fotogalerie',icon:'📸',path:'../see/fotogalerie/index.html'},
{slug:'see/historie',label:'See · Historie',icon:'📜',path:'../see/historie/index.html'},
{slug:'see/produkte-angebote',label:'See · Angebote',icon:'🏖',path:'../see/produkte-angebote/index.html'},
{slug:'kapelle',label:'Kapelle',icon:'⛪',path:'../kapelle/index.html'},
{slug:'kapelle/historie',label:'Kapelle · Historie',icon:'📜',path:'../kapelle/historie/index.html'},
{slug:'kapelle/termine-angebote',label:'Kapelle · Termine',icon:'🎼',path:'../kapelle/termine-angebote/index.html'},
{slug:'hofladen',label:'Hofladen',icon:'🏪',path:'../hofladen/index.html'},
{slug:'hofladen/oeffnungszeiten-angebote',label:'Hofladen · Öffnungszeiten',icon:'🕒',path:'../hofladen/oeffnungszeiten-angebote/index.html'},
{slug:'veranstaltungen',label:'Veranstaltungen',icon:'📅',path:'../veranstaltungen/index.html'},
{slug:'foerderkreis',label:'Förderkreis',icon:'🤝',path:'../foerderkreis/index.html'},
{slug:'foerderkreis/fotogalerie',label:'Förderkreis · Fotogalerie',icon:'📸',path:'../foerderkreis/fotogalerie/index.html'},
{slug:'foerderkreis/historie',label:'Förderkreis · Historie',icon:'📜',path:'../foerderkreis/historie/index.html'},
{slug:'foerderkreis/konzepte-philosophie',label:'Förderkreis · Philosophie',icon:'💡',path:'../foerderkreis/konzepte-philosophie/index.html'},
{slug:'foerderkreis/spendenkonto',label:'Förderkreis · Spendenkonto',icon:'💶',path:'../foerderkreis/spendenkonto/index.html'},
{slug:'foerderkreis/taetigkeiten',label:'Förderkreis · Tätigkeiten',icon:'🧰',path:'../foerderkreis/taetigkeiten/index.html'},
{slug:'museum-der-evolution',label:'Museum der Evolution',icon:'🦕',path:'../museum-der-evolution/index.html'},
{slug:'museum-der-evolution/fotogalerie',label:'Museum · Fotogalerie',icon:'📸',path:'../museum-der-evolution/fotogalerie/index.html'},
{slug:'museum-der-evolution/oeffnungszeiten-angebote',label:'Museum · Öffnungszeiten',icon:'🕒',path:'../museum-der-evolution/oeffnungszeiten-angebote/index.html'},
{slug:'museum-der-evolution/philosophie',label:'Museum · Philosophie',icon:'🧠',path:'../museum-der-evolution/philosophie/index.html'},
{slug:'kontakt',label:'Kontakt',icon:'📬',path:'../kontakt/index.html'},
{slug:'impressum',label:'Impressum',icon:'📄',path:'../impressum/index.html'},
{slug:'datenschutzerklaerung',label:'Datenschutzerklärung',icon:'🔒',path:'../datenschutzerklaerung/index.html'}
];
var _currentPage=null; // {slug, label, path}
var _blocks=[]; // [{type, data}]
var _savedPages={}; // slug -> {blocks, hero, meta}
var _builderInited=false;
function pageDepth(slug){ return !slug||slug==='index' ? 0 : slug.split('/').length; }
function builderAssetPath(input){
var v=String(input||'').trim();
if(!v||/^(https?:)?\/\/|^data:|^#/.test(v)) return v;
v=v.replace(/^(\.\/)+/,'').replace(/^(\.\.\/)+/,'').replace(/^\//,'');
return v;
}
function pageAssetPath(input, slug){
var v=builderAssetPath(input);
if(!v||/^(https?:)?\/\/|^data:|^#/.test(v)) return v;
return '../'.repeat(pageDepth(slug)) + v;
}
function normalizeStoredPage(page, data){
data=data||{};
var out={title:data.title||page.label,content:data.content||'',updated:data.updated||''};
out.meta={title:(data.meta&&data.meta.title)||data.title||page.label,desc:(data.meta&&data.meta.desc)||''};
out.hero={img:builderAssetPath(data.hero&&data.hero.img||''),kicker:(data.hero&&data.hero.kicker)||'Gut Trechow',heading:(data.hero&&data.hero.heading)||data.title||page.label};
if(Array.isArray(data.blocks)&&data.blocks.length){
out.blocks=data.blocks.map(function(b){
if(!b||!b.type)return null;
var c={type:b.type,data:Object.assign({},b.data||{})};
if(c.type==='image') c.data.src=builderAssetPath(c.data.src||'');
if(c.type==='gallery') c.data.images=(c.data.images||[]).map(builderAssetPath);
return c;
}).filter(Boolean);
} else if(data.content) out.blocks=htmlToBlocks(data.content);
else out.blocks=[];
return out;
}
function initBuilder(){
if(_builderInited)return;
_builderInited=true;
var list=document.getElementById('builder-page-list');
list.innerHTML='';
PAGES.forEach(function(p){
var item=document.createElement('div');
item.className='builder-page-item';
item.dataset.slug=p.slug;
item.innerHTML='<span class="page-icon">'+p.icon+'</span><span>'+p.label+'</span><span class="page-has-edit" style="display:none">✓</span>';
item.addEventListener('click',function(){
document.querySelectorAll('.builder-page-item').forEach(function(x){x.classList.remove('act');});
item.classList.add('act');
openBuilderPage(p);
});
list.appendChild(item);
});
// Load saved data
window.GT.getAllPages().then(function(pages){
_savedPages=pages||{};
// Update checkmarks
Object.keys(_savedPages).forEach(function(slug){
var el=list.querySelector('[data-slug="'+slug+'"] .page-has-edit');
if(el)el.style.display='';
});
}).catch(function(){});
}
function openBuilderPage(page){
_currentPage=page;
document.getElementById('builder-page-title').textContent=page.label;
document.getElementById('builder-actions').style.display='flex';
document.getElementById('builder-open-link').href=page.path;
document.getElementById('builder-tabs').style.display='flex';
document.getElementById('builder-empty').style.display='none';
// Activate first tab
document.querySelectorAll('.btab').forEach(function(t){t.classList.toggle('act',t.dataset.btab==='blocks');});
document.querySelectorAll('.btab-panel').forEach(function(p){p.classList.toggle('act',p.id==='btab-blocks');});
window.GT.getPage(page.slug).then(function(data){
var normalized=normalizeStoredPage(page, data || _savedPages[page.slug] || {});
_savedPages[page.slug]=normalized;
_blocks=normalized.blocks||[];
document.getElementById('hero-img').value=normalized.hero.img||'';
document.getElementById('hero-kicker').value=normalized.hero.kicker||'Gut Trechow';
document.getElementById('hero-heading').value=normalized.hero.heading||page.label;
document.getElementById('meta-title').value=normalized.meta.title||page.label;
document.getElementById('meta-desc').value=normalized.meta.desc||'';
updateHeroPreview();
renderBlocks();
}).catch(function(){
_blocks=[];
document.getElementById('hero-img').value='';
document.getElementById('hero-kicker').value='Gut Trechow';
document.getElementById('hero-heading').value=page.label;
document.getElementById('meta-title').value=page.label;
document.getElementById('meta-desc').value='';
updateHeroPreview();
renderBlocks();
});
}
function htmlToBlocks(html){
var blocks=[];
// Simple parser: split by block-level tags
var div=document.createElement('div');
div.innerHTML=html;
Array.from(div.children).forEach(function(el){
var tag=el.tagName.toLowerCase();
if(tag==='h2'||tag==='h3'){
blocks.push({type:'heading',data:{text:el.textContent,level:tag==='h2'?2:3}});
} else if(tag==='p'){
var imgs=el.querySelectorAll('img');
if(imgs.length>0){
imgs.forEach(function(img){blocks.push({type:'image',data:{src:builderAssetPath(img.getAttribute('src')||''),alt:img.getAttribute('alt')||''}});});
} else if(el.textContent.trim()){
blocks.push({type:'text',data:{html:el.innerHTML}});
}
} else if(tag==='ul'||tag==='ol'){
blocks.push({type:'text',data:{html:el.outerHTML}});
} else if(tag==='hr'){
blocks.push({type:'divider',data:{}});
} else if(el.textContent.trim()||el.querySelector('img')){
blocks.push({type:'text',data:{html:el.innerHTML}});
}
});
return blocks;
}
function blocksToHtml(){
return _blocks.map(function(b){
if(b.type==='text'){var h=String(b.data.html||'').trim();return /^<(ul|ol|div|section|figure|blockquote|table|p|h2|h3|hr)/i.test(h)?h:'<p>'+h+'</p>';}
if(b.type==='heading')return '<h'+(b.data.level||2)+'>'+esc(b.data.text)+'</h'+(b.data.level||2)+'>';
if(b.type==='image')return '<p><img src="'+esc(pageAssetPath(b.data.src,_currentPage&&_currentPage.slug||'index'))+'" alt="'+esc(b.data.alt||'')+'" style="max-width:100%;height:auto;"></p>';
if(b.type==='gallery'){
var imgs=(b.data.images||[]).map(function(u){return '<img src="'+esc(pageAssetPath(u,_currentPage&&_currentPage.slug||'index'))+'" alt="" style="max-width:100%;">';}).join('');
return '<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;">'+imgs+'</div>';
}
if(b.type==='divider')return '<hr>';
return '';
}).join('\n');
}
function renderBlocks(){
var list=document.getElementById('block-list');
list.innerHTML='';
if(!_blocks.length){
list.innerHTML='<div class="empty" style="border:2px dashed rgba(160,138,95,.22);border-radius:4px;">Noch keine Inhaltsblöcke. Unten einen Block hinzufügen.</div>';
return;
}
_blocks.forEach(function(block,i){renderBlock(block,i,list);});
}
function renderBlock(block,idx,list){
var d=document.createElement('div');d.className='block';d.dataset.idx=idx;
// Header
var hdr=document.createElement('div');hdr.className='block-header';
var typeLbl=document.createElement('span');typeLbl.className='block-type';
typeLbl.textContent={text:'📝 Text',heading:'🔤 Überschrift',image:'🖼 Bild',gallery:'📷 Galerie',divider:'— Trennlinie'}[block.type]||block.type;
hdr.appendChild(typeLbl);
var acts=document.createElement('div');acts.className='block-actions';
if(idx>0){var upBtn=document.createElement('button');upBtn.className='bact';upBtn.textContent='↑';upBtn.addEventListener('click',function(){var tmp=_blocks[idx];_blocks[idx]=_blocks[idx-1];_blocks[idx-1]=tmp;renderBlocks();});acts.appendChild(upBtn);}
if(idx<_blocks.length-1){var dnBtn=document.createElement('button');dnBtn.className='bact';dnBtn.textContent='↓';dnBtn.addEventListener('click',function(){var tmp=_blocks[idx];_blocks[idx]=_blocks[idx+1];_blocks[idx+1]=tmp;renderBlocks();});acts.appendChild(dnBtn);}
var delBtn=document.createElement('button');delBtn.className='bact del';delBtn.textContent='✕ Löschen';
delBtn.addEventListener('click',function(){if(!confirm('Block löschen?'))return;_blocks.splice(idx,1);renderBlocks();});
acts.appendChild(delBtn);
hdr.appendChild(acts);d.appendChild(hdr);
// Fields
if(block.type==='text'){
var bf=document.createElement('div');bf.className='bf';
var lbl=document.createElement('label');lbl.textContent='Text (HTML erlaubt)';bf.appendChild(lbl);
var ta=document.createElement('textarea');ta.value=block.data.html||'';ta.style.minHeight='8rem';
ta.addEventListener('input',function(){_blocks[idx].data.html=ta.value;});
bf.appendChild(ta);d.appendChild(bf);
} else if(block.type==='heading'){
var bf=document.createElement('div');bf.className='bf';
var lbl=document.createElement('label');lbl.textContent='Überschrift';bf.appendChild(lbl);
var inp=document.createElement('input');inp.type='text';inp.value=block.data.text||'';
inp.addEventListener('input',function(){_blocks[idx].data.text=inp.value;});
bf.appendChild(inp);
var bf2=document.createElement('div');bf2.className='bf';
var lbl2=document.createElement('label');lbl2.textContent='Größe';bf2.appendChild(lbl2);
var sel=document.createElement('select');
['H2 (groß)','H3 (mittel)'].forEach(function(opt,oi){var o=document.createElement('option');o.value=oi+2;o.textContent=opt;o.selected=(block.data.level||2)===(oi+2);sel.appendChild(o);});
sel.addEventListener('change',function(){_blocks[idx].data.level=parseInt(sel.value);});
bf2.appendChild(sel);d.appendChild(bf);d.appendChild(bf2);
} else if(block.type==='image'){
var bf=document.createElement('div');bf.className='bf';
var lbl=document.createElement('label');lbl.textContent='Bild-URL';bf.appendChild(lbl);
var wrap=document.createElement('div');wrap.className='bf-img-wrap';
var inp=document.createElement('input');inp.type='text';inp.value=block.data.src||'';inp.placeholder='assets/uploads/…';
inp.addEventListener('input',function(){_blocks[idx].data.src=inp.value;preview.src=inp.value||'';});
var preview=document.createElement('img');preview.className='img-preview';preview.src=block.data.src||'';
if(!block.data.src)preview.style.display='none';
inp.addEventListener('input',function(){preview.style.display=inp.value?'':'none';});
var pickBtn=document.createElement('button');pickBtn.className='sbtn sm';pickBtn.textContent='📁';
pickBtn.addEventListener('click',function(){openMediaPicker(function(url){var normalized=builderAssetPath(url);inp.value=normalized;_blocks[idx].data.src=normalized;preview.src='../'+normalized;preview.style.display='';});});
wrap.appendChild(inp);wrap.appendChild(preview);wrap.appendChild(pickBtn);bf.appendChild(wrap);
var bf2=document.createElement('div');bf2.className='bf';
var lbl2=document.createElement('label');lbl2.textContent='Alt-Text';bf2.appendChild(lbl2);
var alt=document.createElement('input');alt.type='text';alt.value=block.data.alt||'';alt.placeholder='Bildbeschreibung';
alt.addEventListener('input',function(){_blocks[idx].data.alt=alt.value;});
bf2.appendChild(alt);d.appendChild(bf);d.appendChild(bf2);
} else if(block.type==='gallery'){
var bf=document.createElement('div');bf.className='bf';
var lbl=document.createElement('label');lbl.textContent='Bilder (eine URL pro Zeile)';bf.appendChild(lbl);
var ta=document.createElement('textarea');ta.value=(block.data.images||[]).join('\n');ta.style.minHeight='8rem';
ta.addEventListener('input',function(){_blocks[idx].data.images=ta.value.split('\n').map(function(s){return s.trim();}).filter(Boolean);});
bf.appendChild(ta);
var pickBtn=document.createElement('button');pickBtn.className='sbtn sm';pickBtn.style.marginTop='.5rem';pickBtn.textContent='📁 Bild hinzufügen';
pickBtn.addEventListener('click',function(){openMediaPicker(function(url){var normalized=builderAssetPath(url);ta.value=(ta.value?ta.value+'\n':'')+normalized;_blocks[idx].data.images=ta.value.split('\n').map(function(s){return s.trim();}).filter(Boolean);});});
d.appendChild(bf);d.appendChild(pickBtn);
} else if(block.type==='divider'){
var p=document.createElement('p');p.style.cssText='font-family:CardoGT,serif;font-size:1.5rem;color:rgba(90,78,56,.5);text-align:center;';p.textContent='— Trennlinie —';d.appendChild(p);
}
list.appendChild(d);
}
// Add block buttons
document.querySelectorAll('.add-block-btn').forEach(function(btn){
btn.addEventListener('click',function(){
if(!_currentPage){toast('Bitte erst eine Seite auswählen.','err');return;}
var type=btn.dataset.btype;
var block={type:type,data:{}};
if(type==='text')block.data={html:'Hier Text eintragen …'};
if(type==='heading')block.data={text:'Neue Überschrift',level:2};
if(type==='image')block.data={src:'',alt:''};
if(type==='gallery')block.data={images:[]};
_blocks.push(block);
renderBlocks();
// Scroll to new block
var list=document.getElementById('block-list');
list.lastElementChild&&list.lastElementChild.scrollIntoView({behavior:'smooth',block:'nearest'});
});
});
// Save builder
document.getElementById('builder-save-btn').addEventListener('click',function(){
if(!_currentPage){toast('Bitte erst eine Seite auswählen.','err');return;}
var btn=this;btn.disabled=true;
var heroData={img:document.getElementById('hero-img').value,kicker:document.getElementById('hero-kicker').value,heading:document.getElementById('hero-heading').value};
var metaData={title:document.getElementById('meta-title').value,desc:document.getElementById('meta-desc').value};
var content=blocksToHtml();
var title=metaData.title||_currentPage.label;
// Save blocks to our structure
var payload={blocks:_blocks.slice(),hero:{img:builderAssetPath(heroData.img),kicker:heroData.kicker,heading:heroData.heading},meta:metaData,title:title,content:content};
_savedPages[_currentPage.slug]=payload;
window.GT.savePage(_currentPage.slug,title,content,payload.meta,payload.hero,payload.blocks).then(function(){
btn.disabled=false;
toast('Seite "'+_currentPage.label+'" gespeichert!','ok');
// Update checkmark
var el=document.querySelector('[data-slug="'+_currentPage.slug+'"] .page-has-edit');
if(el)el.style.display='';
}).catch(function(){btn.disabled=false;toast('Fehler beim Speichern.','err');});
});
// Preview
document.getElementById('builder-preview-btn').addEventListener('click',function(){
if(!_currentPage){toast('Bitte erst eine Seite auswählen.','err');return;}
window.open(_currentPage.path,'_blank');
});
// Hero image preview
document.getElementById('hero-img').addEventListener('input',updateHeroPreview);
function updateHeroPreview(){
var src=document.getElementById('hero-img').value;
var prev=document.getElementById('hero-preview');
if(src){prev.src='../'+builderAssetPath(src);prev.style.display='';}else prev.style.display='none';
}
// Hero media picker
document.getElementById('media-picker-btn').addEventListener('click',function(){
openMediaPicker(function(url){
document.getElementById('hero-img').value=builderAssetPath(url);updateHeroPreview();
});
});
// Builder tabs
document.querySelectorAll('.btab').forEach(function(t){
t.addEventListener('click',function(){
document.querySelectorAll('.btab').forEach(function(x){x.classList.remove('act');});
document.querySelectorAll('.btab-panel').forEach(function(x){x.classList.remove('act');});
t.classList.add('act');
document.getElementById('btab-'+t.dataset.btab).classList.add('act');
});
});
/* ── Media picker modal ── */
var _pickerCallback=null;
function openMediaPicker(cb){
_pickerCallback=cb;
var modal=document.getElementById('media-modal');
modal.style.display='flex';
var grid=document.getElementById('modal-grid');
grid.innerHTML='<div class="ldg">Wird geladen …</div>';
window.GT.listUploads().then(function(files){
grid.innerHTML='';
if(!files||!files.length){grid.innerHTML='<div class="empty">Keine Dateien. Bitte erst in der Medienbibliothek hochladen.</div>';return;}
files.forEach(function(f){
if(!/\.(jpg|jpeg|png|gif|webp)$/i.test(f.name))return;
var d=document.createElement('div');d.className='mi';d.style.cursor='pointer';
var img=document.createElement('img');img.src='../'+f.url;img.alt='';img.loading='lazy';d.appendChild(img);
var nm=document.createElement('div');nm.className='mn';nm.textContent=f.name;d.appendChild(nm);
d.addEventListener('click',function(){
if(_pickerCallback)_pickerCallback(f.url);
modal.style.display='none';_pickerCallback=null;
});
grid.appendChild(d);
});
}).catch(function(){grid.innerHTML='<div class="empty">Fehler beim Laden.</div>';});
}
document.getElementById('modal-close').addEventListener('click',function(){document.getElementById('media-modal').style.display='none';_pickerCallback=null;});
document.getElementById('media-modal').addEventListener('click',function(e){if(e.target===this){this.style.display='none';_pickerCallback=null;}});
/* ── Medien ── */
function loadMedia(){
var grid=document.getElementById('mgrid');grid.innerHTML='<div class="ldg">Wird geladen …</div>';
window.GT.listUploads().then(function(files){
if(!files||!files.length){grid.innerHTML='<div class="empty">Noch keine Uploads.</div>';return;}
grid.innerHTML='';files.forEach(function(f){addMediaItem(f,grid);});
}).catch(function(){grid.innerHTML='<div class="empty">Fehler beim Laden.</div>';});
}
function addMediaItem(f,grid){
var d=document.createElement('div');d.className='mi';
var isImg=/\.(jpg|jpeg|png|gif|webp)$/i.test(f.name);
if(isImg){var img=document.createElement('img');img.src='../'+f.url;img.alt='';img.loading='lazy';d.appendChild(img);}
else{var ico=document.createElement('div');ico.style.cssText='height:100px;display:flex;align-items:center;justify-content:center;font-size:2.8rem;background:rgba(0,0,0,.04);';ico.textContent='📄';d.appendChild(ico);}
var nm=document.createElement('div');nm.className='mn';nm.title=f.name;nm.textContent=f.name;d.appendChild(nm);
var cp=document.createElement('button');cp.className='mi-cp';cp.textContent='📋';
cp.addEventListener('click',function(e){e.stopPropagation();navigator.clipboard&&navigator.clipboard.writeText('../'+f.url);toast('URL kopiert.','ok');});
d.appendChild(cp);
var del=document.createElement('button');del.className='mi-del';del.textContent='✕';
del.addEventListener('click',function(e){e.stopPropagation();if(!confirm('Löschen?'))return;del.disabled=true;window.GT.deleteUpload(f.name).then(function(){d.remove();toast('Gelöscht.');}).catch(function(){del.disabled=false;toast('Fehler.','err');});});
d.appendChild(del);
if(grid.querySelector('.ldg')||grid.querySelector('.empty'))grid.innerHTML='';
grid.appendChild(d);
}
var dz=document.getElementById('drop-zone'),fi=document.getElementById('file-input');
dz.addEventListener('dragover',function(e){e.preventDefault();dz.classList.add('drag');});
dz.addEventListener('dragleave',function(){dz.classList.remove('drag');});
dz.addEventListener('drop',function(e){e.preventDefault();dz.classList.remove('drag');doUpload(e.dataTransfer.files);});
fi.addEventListener('change',function(){doUpload(this.files);this.value='';});
function doUpload(files){
var st=document.getElementById('up-status'),grid=document.getElementById('mgrid');
if(!files||!files.length)return;
st.style.display='block';
var arr=Array.from(files),done=0;
arr.forEach(function(file){
st.textContent='Lade hoch: '+file.name+' …';
window.GT.uploadFile(file).then(function(res){
done++;if(done===arr.length){st.style.display='none';toast(arr.length+' Datei(en) hochgeladen.','ok');}
addMediaItem({name:res.url.split('/').pop(),url:res.url},grid);
}).catch(function(e){done++;if(done===arr.length){st.style.display='none';}toast('Upload fehlgeschlagen: '+file.name,'err');});
});
}
/* ── Passwort ── */
document.getElementById('pw-save').addEventListener('click',function(){
var p1=document.getElementById('np1').value,p2=document.getElementById('np2').value,btn=this;
if(p1.length<6){toast('Mindestens 6 Zeichen.','err');return;}
if(p1!==p2){toast('Passwörter stimmen nicht überein.','err');return;}
btn.disabled=true;
window.GT.changePassword(p1).then(function(){btn.disabled=false;document.getElementById('np1').value='';document.getElementById('np2').value='';toast('Passwort gespeichert.','ok');}).catch(function(){btn.disabled=false;toast('Fehler.','err');});
});
})();
</script>
</body>
</html>