1<!DOCTYPE html> 2<html lang="de"> 3 <head> 4 <title>TV-Programm | DOKsite Filmportal</title> 5 <meta charset="utf-8"> 6 <meta name="server" content="4xp"> 7 <meta name="viewport" content="width=device-width, initial-scale=1"> 8 <meta name="description" content=""> 9 <meta name="author" content="Andreas Kasper <[email protected]>"> 10 <link rel="icon" href="/skins/default/images/favicon.png"> 11 <link rel="shortcut icon" href="/skins/default/images/favicon.png" /> 12 <link rel="apple-touch-icon" href="https://doksite.de/skins/default/images/apple-touch-icon.png"/> 13 14 <!-- Bootstrap 5.3 --> 15 <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous"> 16 <!-- FontAwesome 7 --> 17 <link rel="stylesheet" href="https://library.goo1.de/fontawesome/7/css/all.min.css"/> 18 <!-- Material Design Colors --> 19 <link rel="stylesheet" href="https://danceapp.net/skins/grey/css/md-bs.css"/> 20 <!-- Google Fonts --> 21 <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&family=Kanit:wght@400;600&display=swap"> 22 <!-- Custom CSS --> 23 <link rel="stylesheet" href="/skins/default/css/main.css?v=20260318a"/> 24 25 <!-- Bootstrap 5 Bundle (inkl. Popper) --> 26
26<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
26 27 <!-- Vue 3 --> 28
28<script src="https://unpkg.com/vue@3/dist/vue.global.prod.js"></script>
28 29 <!-- jQuery (Ãbergang für Legacy-Plugins) --> 30
30<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js" crossorigin="anonymous"></script>
30 31 <!-- Lazy Loading & Main JS --> 32
32<script src="/skins/default/js/jquery.lazy.min.js"></script>
32 33
33<script src="/skins/default/js/main.js?v=20260306d" defer></script>
33 34 35 <style> 36 body { background: #f0f0f0; font-family: 'Roboto', Calibri, Arial, sans-serif; } 37 header > .alert { margin-bottom: 0px; } 38 body > main { background: #fff; } 39 40 @media (max-width: 576px) { 41 body { padding-top: 75px; } 42 } 43 44 @media (min-width: 576px) { 45 header > nav { position: fixed !important; left: 0px; top: 0px; width: 100%; z-index: 1030; } 46 header { padding-top: 76px; } 47 } 48 49 footer .footer-links { color: #aaa; } 50 footer .footer-links a { color: #aaa; } 51 52 .btn-primary { background-color: #e85511; border-color: #e85511; } 53 .btn-primary:hover { background-color: #CC4810; border-color: #CC4810; } 54 .text-primary { color: #e85511 !important; } 55 a { color: #444; } 56 57 body > main { padding-top: 15px; padding-bottom: 15px; } 58 </style> 59
59<script> 60 document.addEventListener('scroll', function() { 61 var header = document.querySelector('header'); 62 var btn = document.getElementById('ButtonGotoTOP'); 63 if (window.scrollY > 10) { 64 header.classList.add('dok-sticky'); 65 if (btn) btn.style.display = 'block'; 66 } else { 67 header.classList.remove('dok-sticky'); 68 if (btn) btn.style.display = 'none'; 69 } 70 }); 71 </script>
71 72 </head> 73<body class=""> 74<header> 75 76 <nav class="navbar navbar-expand-md navbar-dark dok-nav"> 77 <div class="container-fluid"> 78 <a class="navbar-brand" href="/?ref=logo"></a> 79 <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation"> 80 <span class="navbar-toggler-icon"></span> 81 </button> 82 83 <div class="collapse navbar-collapse" id="navbarsExampleDefault"> 84 <ul class="navbar-nav me-auto"> 85 <!-- Dokuthek Mega Menu --> 86 <li class="nav-item dok-mega-trigger d-none d-md-block"> 87 <a class="nav-link" href="#" aria-haspopup="true">Dokuthek <i class="fa-solid fa-chevron-down" style="font-size:0.6rem; opacity:0.5;"></i></a> 88 <div class="dok-mega-menu"> 89 <div class="container"> 90 <div class="row"> 91 <div class="col-md-4"> 92 <a class="dok-mega-item" href="/de/tv/"> 93 <i class="fa-solid fa-tv"></i> 94 <div><div class="mega-title">TV-Programm</div><div class="mega-desc">Dokumentarfilme im Fernsehen</div></div> 95 </a> 96 <a class="dok-mega-item" href="/de/kino/"> 97 <i class="fa-solid fa-film"></i> 98 <div><div class="mega-title">Kinoprogramm</div><div class="mega-desc">Dokus auf der groÃen Leinwand</div></div> 99 </a> 100 </div> 101 <div class="col-md-4"> 102 <a class="dok-mega-item" href="/de/kino/kalender"> 103 <i class="fa-solid fa-calendar-days"></i> 104 <div><div class="mega-title">Kinokalender</div><div class="mega-desc">Kommende Kinostarts</div></div> 105 </a> 106 <a class="dok-mega-item" href="/de/doku/mediathekenumschau"> 107 <i class="fa-solid fa-circle-play"></i> 108 <div><div class="mega-title">Mediathekenumschau</div><div class="mega-desc">Online in den Mediatheken</div></div> 109 </a> 110 </div> 111 <div class="col-md-4"> 112 <a class="dok-mega-item" href="/de/doku/festivals/"> 113 <i class="fa-solid fa-ticket"></i> 114 <div><div class="mega-title">Filmfestivals</div><div class="mega-desc">Festivals weltweit</div></div> 115 </a> 116 <a class="dok-mega-item" href="/de/doku/eigen"> 117 <i class="fa-solid fa-video"></i> 118 <div><div class="mega-title">Hausgemachtes</div><div class="mega-desc">Eigenproduktionen des HDF</div></div> 119 </a> 120 </div> 121 </div> 122 </div> 123 </div> 124 </li> 125 <!-- Infothek Mega Menu --> 126 <li class="nav-item dok-mega-trigger d-none d-md-block"> 127 <a class="nav-link" href="#" aria-haspopup="true">Infothek <i class="fa-solid fa-chevron-down" style="font-size:0.6rem; opacity:0.5;"></i></a> 128 <div class="dok-mega-menu"> 129 <div class="container"> 130 <div class="row"> 131 <div class="col-md-4"> 132 <a class="dok-mega-item" href="/de/doku/charts/"> 133 <i class="fa-solid fa-list-ol"></i> 134 <div><div class="mega-title">Ranglisten</div><div class="mega-desc">Top-bewertete Dokumentarfilme</div></div> 135 </a> 136 </div> 137 <div class="col-md-4"> 138 <a class="dok-mega-item" href="/de/doku/preise/"> 139 <i class="fa-solid fa-medal"></i> 140 <div><div class="mega-title">Filmpreise</div><div class="mega-desc">Auszeichnungen & Nominierungen</div></div> 141 </a> 142 </div> 143 <div class="col-md-4"> 144 <a class="dok-mega-item" href="/de/adressen/"> 145 <i class="fa-solid fa-address-book"></i> 146 <div><div class="mega-title">Adressbuch</div><div class="mega-desc">Branchenverzeichnis</div></div> 147 </a> 148 </div> 149 </div> 150 </div> 151 </div> 152 </li> 153 <!-- Mobile Fallback: Standard Dropdowns --> 154 <li class="nav-item dropdown d-md-none"> 155 <a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dokuthek</a> 156 <div class="dropdown-menu"> 157 <a class="dropdown-item" href="/de/tv/"><i class="fa-solid fa-tv"></i> TV-Programm</a> 158 <a class="dropdown-item" href="/de/kino/"><i class="fa-solid fa-film"></i> Kinoprogramm</a> 159 <a class="dropdown-item" href="/de/kino/kalender"><i class="fa-solid fa-calendar-days"></i> Kinokalender</a> 160 <a class="dropdown-item" href="/de/doku/mediathekenumschau"><i class="fa-solid fa-circle-play"></i> Mediathekenumschau</a> 161 <a class="dropdown-item" href="/de/doku/festivals/"><i class="fa-solid fa-ticket"></i> Filmfestivals</a> 162 <a class="dropdown-item" href="/de/doku/eigen"><i class="fa-solid fa-video"></i> Hausgemachtes</a> 163 </div> 164 </li> 165 <li class="nav-item dropdown d-md-none"> 166 <a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Infothek</a> 167 <div class="dropdown-menu">
168 <a class="dropdown-item" href="/de/doku/charts/"><i class="fa-solid fa-list-ol"></i> Ranglisten</a> 169 <a class="dropdown-item" href="/de/doku/preise/"><i class="fa-solid fa-medal"></i> Filmpreise</a> 170 <a class="dropdown-item" href="/de/adressen/"><i class="fa-solid fa-address-book"></i> Adressbuch</a> 171 </div> 172 </li> 173 <li class="nav-item"> 174 <a class="nav-link" href="https://hdf.de" target="_blank">HDF</a> 175 </li> 176 </ul> 177 <!-- Mobile: Inline search form --> 178 <form action="/de/search" method="get" class="d-flex my-2 my-lg-0 d-md-none"> 179 <input class="form-control me-2" type="search" placeholder="Suche..." aria-label="Search" name="q" autocomplete="off" value=""> 180 <button class="btn btn-outline-light my-2 my-sm-0" type="submit">Suchen</button> 181 </form> 182 <ul class="navbar-nav"> 183 <!-- Desktop: Search Icon (opens overlay) --> 184 <li class="nav-item d-none d-md-block"> 185 <a class="nav-link" href="#" id="dok-search-trigger" title="Suche"><i class="fa-solid fa-magnifying-glass"></i></a> 186 </li> 187 </ul> 188 </div> 189 </div> 190 </nav> 191 192</header> 193 194<!-- Search Overlay --> 195<div class="dok-search-overlay" id="dok-search-overlay"> 196 <button class="dok-search-close" id="dok-search-close"><i class="fa-solid fa-xmark"></i></button> 197 <div class="dok-search-inner"> 198 <form action="/de/search" method="get" id="dok-search-form"> 199 <input class="dok-search-input" type="search" name="q" id="dok-search-input" placeholder="Film, Person, Ort suchen..." autocomplete="off" value=""> 200 </form> 201 <div class="dok-search-results" id="dok-search-results"></div> 202 <div class="dok-search-hint">ESC zum SchlieÃen · Enter zum Suchen</div> 203 </div> 204</div> 205 206 207<style> 208/* TV Page Styles */ 209.dok-tv-filter { 210 background: #f8f9fa; 211 border-top: 1px solid #e9ecef; 212 border-bottom: 1px solid #e9ecef; 213 padding: 0.75rem 1rem; 214} 215.dok-tv-filter .btn-hdf { 216 border-radius: 0.375rem; 217} 218.dok-tv-date-display { 219 width: auto; 220 flex: none; 221 font-weight: 500; 222} 223.dok-tv-header-row { 224 background: var(--dok-orange); 225 font-size: 1.15rem; 226 border-radius: 0.5rem; 227 color: #fff; 228} 229.dok-tv-card { 230 background: #fff; 231 border: 1px solid #eee; 232 border-radius: 0.5rem; 233 padding: 1rem; 234 display: grid; 235 grid-template-columns: 80px auto 1fr auto; 236 gap: 1rem; 237 align-items: center; 238 transition: box-shadow 0.2s ease, transform 0.15s ease; 239} 240.dok-tv-card.no-thumb { 241 grid-template-columns: 80px 1fr auto; 242} 243.dok-tv-card:hover { 244 box-shadow: 0 4px 16px rgba(0,0,0,0.08); 245 transform: translateY(-1px); 246} 247.dok-tv-card-title { 248 font-size: 1.05rem; 249 font-weight: 600; 250 color: #222; 251 text-decoration: none; 252} 253.dok-tv-card-title:hover { 254 color: var(--dok-orange); 255} 256.dok-tv-sender-img { 257 width: 100%; 258 max-width: 64px; 259} 260.dok-tv-time-badge { 261 display: inline-block; 262 background: rgba(232,85,17,0.1); 263 color: var(--dok-orange); 264 font-weight: 600; 265 font-size: 0.9rem; 266 padding: 0.2rem 0.6rem; 267 border-radius: 1rem; 268} 269.dok-tv-date-badge { 270 display: inline-block; 271 font-size: 0.75rem; 272 color: #888; 273 margin-top: 0.15rem; 274} 275.dok-tv-thumb { 276 background: no-repeat center center; 277 background-size: cover; 278 border-radius: 0.375rem; 279 width: 120px; 280 height: 68px; 281} 282.dok-tv-badges { 283 display: flex; 284 flex-direction: column; 285 align-items: center; 286 gap: 0.4rem; 287 min-width: 50px; 288} 289.dok-tv-repeat-icon { 290 display: inline-flex; 291 align-items: center; 292 justify-content: center; 293 position: relative; 294} 295.dok-tv-repeat-count { 296 position: absolute; 297 top: 50%; 298 left: 50%; 299 transform: translate(-50%, -50%); 300 font-weight: 700; 301 font-size: 0.7rem; 302 color: #333; 303} 304.dok-tv-tipp-badge { 305 width: 2.5rem; 306 max-width: 90%; 307} 308.dok-tv-profi-form .form-control, 309.dok-tv-profi-form .form-select { 310 border-radius: 0.375rem; 311} 312.dok-tv-profi-form .form-range { 313 accent-color: var(--dok-orange); 314} 315.dok-tv-quick-actions .btn { 316 border-radius: 2rem; 317 font-size: 0.85rem; 318 padding: 0.35rem 0.9rem; 319} 320.dok-tv-empty { 321 padding: 4rem 0; 322} 323.dok-tv-empty i { 324 color: #ccc; 325 margin-bottom: 1rem; 326} 327@media (max-width: 576px) { 328 .dok-tv-card { 329 grid-template-columns: 60px 1fr auto; 330 gap: 0.6rem; 331 padding: 0.75rem; 332 } 333 .dok-tv-card .dok-tv-thumb-col { display: none; } 334 .dok-tv-card-title { font-size: 0.95rem; } 335 .dok-tv-sender-img { max-width: 48px; } 336 .dok-tv-thumb { width: 100px; height: 56px; } 337} 338</style> 339 340<!-- Hero --> 341<section class="dok-about-hero" style="padding:3rem 0 2rem;"> 342 <div class="container"> 343 <h1><i class="fa-solid fa-tv me-2" style="color:var(--dok-orange);"></i>TV-<span style="color:var(--dok-orange);">Programm</span></h1> 344 <p class="lead">Dokumentarisches im Fernsehen – täglich aktuell</p> 345 </div> 346</section> 347 348<main class="container py-4"> 349 350<!-- Filter Bar --> 351<div class="dok-tv-filter d-flex flex-wrap align-items-center gap-2 mb-4 rounded"> 352 <!-- Date Navigation --> 353 <div class="input-group me-2" style="width:auto;"> 354 <a href="?ds=2026-09-22&de=2026-09-22" class="btn btn-hdf"><i class="fa-solid fa-chevron-left"></i></a> 355 <span class="form-control dok-tv-date-display">Mittwoch, 23.09.2026</span> 356 <input type="date" id="BtnGotoDate" class="btn btn-hdf" value="2026-09-23" style="width:auto;" onchange="location.href='?ds='+this.value+'&de='+this.value"> 357 <a href="?ds=2026-09-24&de=2026-09-24" class="btn btn-hdf"><i class="fa-solid fa-chevron-right"></i></a> 358 </div> 359 360 <!-- Quick Actions --> 361 <div class="dok-tv-quick-actions d-flex flex-wrap gap-2 align-items-center"> 362 <a href="?ds=2026-09-23&de=2026-10-23&tipp=1" class="btn btn-hdf"><i class="fa-regular fa-star me-1"></i>TV Empfehlungen</a> <a href="?jetzt=1" class="btn btn-hdf"><i class="fa-regular fa-clock"></i></a> 363 <button class="btn btn-hdf" data-bs-toggle="collapse" data-bs-target="#collapseProfisuche" type="button"> 364 <i class="fa-solid fa-filter"></i> Profisuche 365 </button> 366 </div> 367</div> 368 369<!-- Profisuche Collapse --> 370<div id="collapseProfisuche" class="collapse"> 371 <div class="card card-body mb-4 border-0 shadow-sm"> 372 <form METHOD="GET" id="FormProfisuche" class="dok-tv-profi-form"> 373 <div class="row g-3"> 374 <div class="col-12"> 375 <div class="row mb-2"> 376 <label class="col-sm-2 col-form-label fw-semibold">Suchanfrage:</label> 377 <div class="col-sm-10"> 378 <input type="text" class="form-control" name="q" placeholder="Suche..." value="">
379 </div> 380 </div> 381 382 <div class="row mb-2"> 383 <label class="col-sm-2 col-form-label fw-semibold">Sender:</label> 384 <div class="col-sm-10"> 385 <div id="vueapp-senderfilter"><select name="sender[]" class="form-select" multiple style="height:100px;"> 386 <option>Sender werden geladen...</option> 387 </select></div> 388 </div> 389 </div> 390 391 <div class="row mb-2"> 392 <label class="col-sm-2 col-form-label fw-semibold">Datum:</label> 393 <div class="col-sm-5"> 394 <input type="date" class="form-control" name="ds" value="2026-09-23"> 395 </div> 396 <div class="col-sm-5"> 397 <input type="date" class="form-control" name="de" value="2026-09-23"> 398 </div> 399 </div> 400 401 <div class="row mb-2"> 402 <label class="col-sm-2 col-form-label fw-semibold">Länge:</label> 403 <div class="col-sm-10"> 404 <div class="d-flex align-items-center gap-2"> 405 <span id="txt_du_min" class="text-muted small">0min</span> 406 <input type="range" class="form-range" id="du_min" min="0" max="180" value="0" oninput="updateDuration()"> 407 <input type="range" class="form-range" id="du_max" min="0" max="180" value="180" oninput="updateDuration()"> 408 <span id="txt_du_max" class="text-muted small">180min</span> 409 <input type="hidden" name="du" id="du_val" value="0,180"> 410 </div> 411 </div> 412 </div> 413 414 <div class="row mb-2"> 415 <label class="col-sm-2 col-form-label fw-semibold">Tipps:</label> 416 <div class="col-sm-10"> 417 <div class="form-check"> 418 <input class="form-check-input" type="checkbox" name="tipp" id="frm_tipp" value="1"> 419 <label class="form-check-label" for="frm_tipp">Empfehlungen/Tipps</label> 420 </div> 421 </div> 422 </div> 423 424 <div class="row"> 425 <div class="col-sm-2"></div> 426 <div class="col-sm-10 d-flex flex-wrap gap-2"> 427 <button class="btn btn-primary" type="submit"><i class="fa-solid fa-filter me-1"></i> filtern</button> 428 <a href="?" class="btn btn-outline-secondary"><i class="fa-solid fa-xmark me-1"></i> zurücksetzen</a> 429 </div> 430 </div> 431 </div> 432 </div> 433 </form> 434 </div> 435</div> 436
437<script> 438function updateDuration() { 439 var mn = document.getElementById('du_min').value; 440 var mx = document.getElementById('du_max').value; 441 document.getElementById('txt_du_min').textContent = mn + 'min'; 442 document.getElementById('txt_du_max').textContent = mx + 'min'; 443 document.getElementById('du_val').value = mn + ',' + mx; 444} 445 446// Sender-Filter per Vue laden 447(function() { 448 var app = Vue.createApp({ 449 data: function() { return { senders: [], loading: true }; }, 450 mounted: function() { 451 var self = this; 452 fetch('?act=senders').then(function(r) { return r.json(); }).then(function(data) { 453 self.senders = data; 454 self.loading = false; 455 }); 456 }, 457 template: '\ 458 <select name="sender[]" class="form-select" multiple style="height:100px;">\ 459 <option v-if="loading" disabled>Sender werden geladen...</option>\ 460 <option v-for="s in senders" :key="s" :value="s">{{ s }}</option>\ 461 </select>' 462 }); 463 app.mount("#vueapp-senderfilter"); 464})(); 465</script>
465 466 467<!-- TV-Programmliste per Vue --> 468<div id="vueapp-tvlist"> 469 <div class="text-center py-5 text-muted"><i class="fa-solid fa-spin fa-spinner fa-2x"></i><br/>Programm wird geladen...</div> 470</div> 471
472<script> 473(function() { 474 var params = new URLSearchParams(window.location.search); 475 params.set('act', 'list'); 476 477 var app = Vue.createApp({ 478 data: function() { return { items: [], total: 0, loading: true }; }, 479 mounted: function() { 480 var self = this; 481 fetch('?' + params.toString()).then(function(r) { return r.json(); }).then(function(data) { 482 self.items = data.items; 483 self.total = data.total; 484 self.loading = false; 485 }); 486 }, 487 methods: { 488 scrollToNow: function() { 489 var now = Date.now() / 1000 - 1800; 490 var rows = document.querySelectorAll('.dok-tv-card'); 491 var last = 0; 492 rows.forEach(function(el) { 493 var ts = parseInt(el.dataset.ts); 494 if (ts < now) last = el.offsetTop; 495 }); 496 if (last) window.scrollTo({ top: last, behavior: 'smooth' }); 497 } 498 }, 499 template: '\ 500 <div v-if="loading" class="text-center py-5 text-muted"><i class="fa-solid fa-spin fa-spinner fa-2x"></i><br/>Programm wird geladen...</div>\ 501 <div v-else>\ 502 <div class="d-flex flex-wrap align-items-center justify-content-between mb-3">\ 503 <span class="text-muted"><i class="fa-solid fa-list me-1"></i> {{ total }} Sendungen gefunden</span>\ 504 </div>\ 505 <div class="d-flex flex-column gap-3">\ 506 <div v-for="item in items" :key="item.id">\ 507 <div class="dok-tv-card" :class="{\'no-thumb\': !item.has_image}" :data-ts="item.dt_start">\ 508 <!-- Sender + Time -->\ 509 <div class="d-flex flex-column align-items-center text-center">\ 510 <img :src="item.sender_img" class="dok-tv-sender-img mb-1" :title="item.sender" loading="lazy"/>\ 511 <span class="dok-tv-time-badge">{{ item.time }}</span>\ 512 <span v-if="item.date" class="dok-tv-date-badge">{{ item.date }}</span>\ 513 </div>\ 514 <!-- Thumbnail -->\ 515 <div v-if="item.has_image" class="dok-tv-thumb-col">\ 516 <div class="dok-tv-thumb" :style="{backgroundImage: \'url(\'+item.img+\')\'}"></div>\ 517 </div>\ 518 <!-- Content -->\ 519 <div style="min-width:0;">\ 520 <a :href="item.href" class="dok-tv-card-title">{{ item.title }}</a>\ 521 <div v-if="item.subtitle" class="text-muted small mt-1">{{ item.subtitle }}</div>\ 522 <p v-if="item.desc" class="small text-muted mt-1 mb-0" v-html="item.desc"></p>\ 523 </div>\ 524 <!-- Badges -->\ 525 <div class="dok-tv-badges">\ 526 <span class="dok-tv-repeat-icon" :style="{color: item.num_playtimes === 1 ? \'var(--dok-orange)\' : \'#ccc\'}">\ 527 <i class="fa-solid fa-rotate-right fa-2x"></i>\ 528 <span class="dok-tv-repeat-count">{{ item.num_playtimes }}</span>\ 529 </span>\ 530 <img v-if="item.is_tipp" src="/skins/default/images/icons/tv_tipp.svg" class="dok-tv-tipp-badge"/>\ 531 <img v-if="item.is_dokuspiel" src="/skins/default/images/icons/tv_dokuspiel_grey2.png" class="dok-tv-tipp-badge"/>\ 532 </div>\ 533 </div>\ 534 </div>\ 535 </div>\ 536 <div v-if="!items.length" class="dok-tv-empty text-center text-muted">\ 537 <i class="fa-solid fa-tv fa-3x"></i>\ 538 <div class="mt-2">Keine Sendungen für diesen Zeitraum gefunden.</div>\ 539 </div>\ 540 </div>' 541 }); 542 app.mount("#vueapp-tvlist"); 543})(); 544</script>
544 545 546</main> 547 548 549<div id="ButtonGotoTOP"><i class="fa-solid fa-chevron-up"></i></div> 550 551<!-- SVG Wave Separator --> 552<svg class="dok-footer-wave" viewBox="0 0 1440 60" preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg"> 553 <path d="M0,40 C360,0 720,60 1080,20 C1260,5 1380,30 1440,25 L1440,60 L0,60 Z" fill="#1a1a1a"/> 554</svg> 555 556<footer> 557 <div class="dok-footer-main"> 558 <div class="container"> 559 <div class="row g-4"> 560 <!-- Brand + Social + Newsletter --> 561 <div class="col-12 col-md-4 col-lg-4"> 562 <img src="/skins/default/images/layout/logo_128.png" style="max-width: 160px; margin-bottom: 0.75rem;" alt="DOKsite Logo"/> 563 <p style="font-size: 0.85rem; color: rgba(255,255,255,0.45); line-height: 1.6;"> 564 Das Dokumentarfilmportal des<br/>Hauses des Dokumentarfilms, Stuttgart. 565 </p> 566 <section><p><span style="font-size: 1rem;">Das Portal rund um den dokumentarischen Film - egal ob Kino, TV oder Web.</span></p></section> <!-- Social Icons --> 567 <div class="dok-social-icons"> 568 <a href="https://www.facebook.com/hausdesdokumentarfilms/" target="_blank" rel="nofollow" class="dok-social-icon fb" title="Facebook"><i class="fa-brands fa-facebook-f"></i></a> 569 <a href="https://twitter.com/search?q=%23dokville%20OR%20%23doksite&src=typd" target="_blank" rel="nofollow" class="dok-social-icon tw" title="X / Twitter"><i class="fa-brands fa-x-twitter"></i></a> 570 <a href="https://youtube.com/channel/UCt5Hg01O71kQy8T8I5KuQvw?sub_confirmation=1" target="_blank" rel="nofollow" class="dok-social-icon yt" title="YouTube"><i class="fa-brands fa-youtube"></i></a> 571 <a href="https://www.instagram.com/hausdesdokumentarfilms/" target="_blank" rel="nofollow" class="dok-social-icon ig" title="Instagram"><i class="fa-brands fa-instagram"></i></a> 572 </div> 573 <!-- Newsletter --> 574 <div class="dok-newsletter"> 575 <div style="font-size: 0.8rem; color: rgba(255,255,255,0.5); margin-bottom: 0.4rem;">Dokumentarfilm-News erhalten:</div> 576 <form class="input-group" action="/de/newsletter" method="post"> 577 <input type="email" class="form-control" name="email" placeholder="E-Mail-Adresse" required> 578 <button class="btn" type="submit"><i class="fa-solid fa-paper-plane"></i></button> 579 </form> 580 </div> 581 </div> 582 583 <!-- Wichtig --> 584 <div class="col-6 col-md-2 col-lg-2"> 585 <h5>Entdecken</h5> 586 <a href="/de/tv/">TV-Programm</a> 587 <a href="/de/kino/">Kinoprogramm</a> 588 <a href="/de/doku/mediathekenumschau">Mediatheken</a> 589 <a href="/de/doku/festivals/">Festivals</a> 590 <a href="/de/doku/charts/">Ranglisten</a> 591 <a href="/de/doku/preise/">Filmpreise</a> 592 </div> 593 594 <!-- Ãber uns --> 595 <div class="col-6 col-md-2 col-lg-2"> 596 <h5>DOKsite</h5> 597 <a href="/de/about-us">Ãber uns</a> 598 <a href="/de/mitglieder">Mitglieder</a> 599 <a href="/de/abspann">Abspann</a> 600 <a href="/de/adressen/">Adressbuch</a> 601 <a href="mailto:[email protected]">Kontakt</a> 602 </div> 603 604 <!-- DOKportal + Apps --> 605 <div class="col-12 col-md-4 col-lg-4"> 606 <h5>DOKportal</h5> 607 <div class="row"> 608 <div class="col-6"> 609 <a href="http://hdf.de" target="_blank" rel="nofollow">hdf.de</a> 610 <a href="http://Dokumentarfilm.info" target="_blank" rel="nofollow">Dokumentarfilm.info</a> 611 <a href="http://Dokville.de" target="_blank" rel="nofollow">Dokville.de</a> 612 <a href="http://www.dokumentarfilmforschung.de/" target="_blank" rel="nofollow">Dokumentarfilmforschung</a> 613 <a href="http://Filmreise.info" target="_blank">Filmreise.info</a> 614 <a href="http://www.landesfilmsammlung-bw.de/" target="_blank" rel="nofollow">Landesfilmsammlung BW</a> 615 </div> 616 <div class="col-6"> 617 <!-- DOKapp: wird derzeit überarbeitet --> 618 </div> 619 </div> 620 </div> 621 </div> 622 623 <!-- Partner Logos --> 624 <div class="dok-partners"> 625 <span style="font-size: 0.75rem; color: rgba(255,255,255,0.3);">Ein Projekt von</span> 626 <a href="https://hdf.de" target="_blank" rel="nofollow"><img src="/skins/default/images/layout/logo_128.png" alt="HDF" style="height: 24px;"/></a> 627 </div> 628 </div> 629 </div> 630 631 <!-- Copyright Bar --> 632 <div class="dok-footer-copyright"> 633 <div class="container d-flex flex-wrap justify-content-between align-items-center"> 634 <div>
635 <a href="/de/agb">AGBs</a> 636 <a href="/de/impressum">Impressum</a> 637 <a href="/de/datenschutz">Datenschutz</a> 638 <a href="/de/abuse">Missbrauch/DMCA</a> 639 <a href="mailto:[email protected]?subject=DOKsite">Feedback</a> 640 </div> 641 <div style="opacity: 0.6;"> 642 ©2012-2026 DOKsite.de, Haus des Dokumentarfilms 643 <span class="d-none d-sm-inline">· 04:47</span> 644 </div> 645 </div> 646 </div> 647</footer> 648
649<script src="/skins/default/js/lazysizes.min.js" async=""></script>
649 650<!-- Global site tag (gtag.js) - Google Analytics -->
vendor: 64 bytes, lines 650-651
650 651<script async src="https://www.googletagmanager.com/gtag/js?id=
651UA-486839-20
vendor: 12 bytes, line 651
651"></script>
652<script> 653
vendor: 133 bytes, lines 653-656
653window.dataLayer = window.dataLayer || []; 654 function gtag(){dataLayer.push(arguments);} 655 gtag('js', new Date()); 656 gtag('config', '
656UA-486839-20
vendor: 4 bytes, line 656
656');
657</script>
657 658
659<script>(function(){function c(){var b=a.contentDocument||(a.contentWindow&&a.contentWindow.document);if(b){var d=b.createElement('script');d.innerHTML="window.__CF$cv$params={r:'a4080addebda61b8',t:'MTc5MDMxODQ3OQ=='};var a=document.createElement('script');a.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js';document.getElementsByTagName('head')[0].appendChild(a);";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();</script>
659<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"cee3ac8a7a484613a22da85fa72d8ff1","r":1,"spa":2}' crossorigin="anonymous"></script>
659 660</body> 661</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.