Files
dogfather-universe/links.html
T
DogFatherGitandClaude Opus 5 6910112d97 Stimmen: nur noch die zwei Originalfiguren + eigenes Bild hochladen
Nutzer-Wunsch 21.08.2026: "benutz da bitte nur die originalen husky und
hasen. mach nur die zwei. und die auswahl wo die leute selbst ein bild
rein setzen können."

- Auswahl von acht auf zwei reduziert (DogFather-Husky, HasiDog). Die
  übrigen Bilddateien bleiben liegen, falls sie je zurücksollen -- es
  genügt, die Zeile in data-stimmen-avatare.js und die Id in
  ERLAUBTE_AVATARE wieder zu ergänzen.
- Neue Kachel "eigenes Bild" (gestrichelter Rand + Plus), die den
  Dateidialog öffnet, das Bild sofort hochlädt und als Vorschau in der
  Kachel zeigt.

Bereits freigegebene Stimmen mit einer der entfernten Figuren zeigen
wieder den Anfangsbuchstaben statt eines kaputten Bildes -- die
Auflösung unbekannter Ids liefert null, das war schon so vorgesehen.

Sicherheit des öffentlichen Uploads (bisher war Hochladen bewusst nur
der Verwaltung erlaubt):
- Gleiche multer-Härtung wie der Verwaltungs-Upload: nur JPG/PNG/WebP,
  max. 5 MB, zufälliger UUID-Dateiname (kein Originalname).
- Der Server nimmt im Avatar-Feld weiterhin NUR bekannte Ids an oder
  eine Adresse, die exakt auf den eigenen Upload-Ordner zeigt und danach
  nur aus UUID + Bildendung besteht. Gegengetestet: fremde Domains,
  "../"-Ausbruch, .svg/.html, javascript:, angehängte Skripte und http
  statt https werden alle abgelehnt.
- Missbrauchsbremse gegen Vollschreiben der Festplatte: max. 10 Uploads
  pro Stunde und IP.
- Sichtbar wird ein Bild ohnehin erst, wenn die Stimme freigegeben wird.

Mit Playwright end-to-end geprüft (10 Tests) plus 9 Sicherheitsfälle.

Cache-Busting-Version auf 20260821q erhöht.

Co-Authored-By: Claude Opus 5 <[email protected]>
2026-08-21 18:23:17 +02:00

177 lines
9.0 KiB
HTML

<!DOCTYPE html>
<html lang="de" data-theme="dogfather">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Alle Links — DOGFATHER UNIVERSE</title>
<meta name="description" content="Alle Social-Media- und Musik-Links von DogFather an einem Ort — plus QR-Codes." />
<link rel="icon" type="image/png" href="assets/img/favicon.png" />
<link rel="manifest" href="/manifest.json" />
<meta name="theme-color" content="#0b0d10" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="DOGFATHER UNIVERSE" />
<meta property="og:title" content="Alle Links — DOGFATHER UNIVERSE" />
<meta property="og:description" content="Alle Social-Media- und Musik-Links von DogFather an einem Ort — plus QR-Codes." />
<meta property="og:image" content="https://dogfather-universe.com/assets/img/og-cover.jpg" />
<meta property="og:url" content="https://dogfather-universe.com/links.html" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Alle Links — DOGFATHER UNIVERSE" />
<meta name="twitter:description" content="Alle Social-Media- und Musik-Links von DogFather an einem Ort — plus QR-Codes." />
<meta name="twitter:image" content="https://dogfather-universe.com/assets/img/og-cover.jpg" />
<link rel="stylesheet" href="assets/css/main.css?v=20260821q" />
<link rel="stylesheet" href="assets/css/theme-dogfather.css?v=20260821q" />
<link rel="stylesheet" href="assets/css/theme-hasidog.css?v=20260821q" />
<link rel="stylesheet" href="assets/css/theme-spicymedia.css?v=20260821q" />
<style>
/* Rabattcodes: an das Supporter-Abo gekoppelt (Nutzer-Feedback
03.08.2026: "verbinde es mit dem Abo... wenn die Leute drauf drücken
wollen es nicht geht"). Eigener Knopf bleibt bestehen (führt weiter
eigenständig zu rabattcodes.html), wird aber nur für Supporter
tatsächlich anklickbar — sonst erscheint ein Hinweis mit Link zum Abo
statt der Navigation. Prüfung ist bewusst rein clientseitig (derselbe
zwischengespeicherte Login-Stand wie beim Nav-Abo-Knopf, siehe
renderAboButton() in main.js) — kein Aufruf-Zwang gegen den Worker bei
jedem Seitenaufruf, und da hier (noch) keine echten Rabattcodes
angezeigt werden, ist eine reine Client-Sperre für den jetzigen Stand
ausreichend statt eines vollen Server-Gates. */
.card-rabatt.gesperrt { cursor: not-allowed; }
.card-rabatt.gesperrt:hover { transform: none; }
.rabatt-gesperrt-hinweis {
display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
max-width: 1040px; margin: 1rem auto 0; padding: 1rem 1.4rem; border-radius: 12px;
border: 1.5px solid rgba(212,175,55,.4); background: rgba(212,175,55,.08); color: #ffe9a8;
}
.rabatt-gesperrt-hinweis[hidden] { display: none; }
.rabatt-gesperrt-hinweis p { color: #ffe9a8; margin: 0; flex: 1 1 260px; font-size: .95rem; }
</style>
</head>
<body class="mit-hintergrund" style="--page-bg:url('/assets/img/bg-links-seite.jpg');--page-bg-mobile:url('/assets/img/bg-links-seite-mobile.jpg');">
<div id="site-header"></div>
<main>
<section class="hero page-bg">
<div class="hero-banner"><img src="/assets/img/bg-links-seite.jpg" alt="" loading="eager" /></div>
<div class="container">
<span class="eyebrow" data-i18n="lk_eyebrow">🩵 Alle Links</span>
<h1 data-i18n="lk_h1">Alles an einem Ort</h1>
<p class="lead worlds" data-i18n="lk_lead">Ersatz für die Wonderlink-Seite — direkt Teil vom DOGFATHER UNIVERSE.</p>
</div>
</section>
<section class="section-tight" style="padding-bottom:0;">
<div class="container">
<div style="max-width:1040px;margin:0 auto;">
<a class="card card-brand card-feature card-feature-wide card-rabatt" href="rabattcodes.html" id="card-rabattcodes">
<span class="card-feature-ring" aria-hidden="true"></span>
<span class="card-feature-badge" id="rabatt-badge" data-i18n="lk_rabatt_badge">🔒 Nur für Supporter</span>
<span class="icon-badge">🏷️</span>
<span class="card-feature-text">
<h3 data-i18n="lk_rabatt_h3">Rabattcodes</h3>
<p class="card-feature-desc" data-i18n="lk_rabatt_desc">Codes von Dogis Partnern — exklusiv für Dogfather-Supporter.</p>
</span>
</a>
<div class="rabatt-gesperrt-hinweis" id="rabatt-gesperrt-hinweis" hidden>
<p data-i18n="lk_rabatt_gesperrt_hinweis">🔒 Rabattcodes sind nur für Dogfather-Supporter zugänglich. Werde jetzt Supporter, um sie freizuschalten.</p>
<a class="btn btn-primary" href="abonnieren.html" data-i18n="lk_rabatt_btn_abo">Jetzt Supporter werden 👑</a>
</div>
</div>
</div>
</section>
<section class="section-tight">
<div class="container">
<div class="grid grid-3" style="max-width:1040px;margin:0 auto;">
<a class="card card-brand card-tiktok text-center" href="https://www.tiktok.com/@dogfather0804" target="_blank" rel="noopener">
<span class="icon-badge">🎥</span>
<h3>TikTok</h3>
<p>@dogfather0804</p>
</a>
<a class="card card-brand card-instagram text-center" href="https://www.instagram.com/sf0118?igsh=MWo2eXFlcXFicXN5OQ==" target="_blank" rel="noopener">
<span class="icon-badge">📸</span>
<h3>Instagram</h3>
<p>@sf0118</p>
</a>
<a class="card card-brand card-snapchat text-center" href="https://www.snapchat.com/add/dogfather0804?share_id=m8mR6ylEtLo&amp;locale=de-DE" target="_blank" rel="noopener">
<span class="icon-badge">👻</span>
<h3>Snapchat</h3>
<p>@dogfather0804</p>
</a>
<a class="card card-brand card-discord text-center" href="kontakt.html">
<span class="icon-badge">💬</span>
<h3>Discord</h3>
<p class="small muted" data-i18n="lk_discord_hint">Nur auf Anfrage</p>
</a>
<a class="card card-brand card-shop text-center" href="#" target="_blank" rel="noopener">
<span class="icon-badge">🛒</span>
<h3 data-i18n="lk_shop_h3">Merchandise / Shop</h3>
<p class="small muted" data-i18n="lk_shop_hint">Folgt in Kürze</p>
</a>
<a class="card card-brand card-bewerben text-center" href="bewerben.html">
<span class="icon-badge">📝</span>
<h3 data-i18n="lk_bewerben_h3">Bewerben</h3>
<p data-i18n="lk_bewerben_p">Modi, Scout, Creator oder Kooperation</p>
</a>
</div>
</div>
</section>
<section>
<div class="container">
<h2 class="text-center" data-i18n="lk_qr_h2">QR-Codes</h2>
<div class="grid grid-3" style="max-width:800px;margin:0 auto;">
<div class="card qr-card">
<img src="assets/qr/qr-instagram.png" alt="QR-Code Instagram @sf0118" style="width:160px;height:160px;object-fit:contain;margin:0 auto 1rem;border-radius:10px;display:block;" />
<p class="small">Instagram</p>
</div>
<div class="card qr-card">
<img src="assets/qr/qr-snapchat.png" alt="QR-Code Snapchat dogfather0804" style="width:160px;height:160px;object-fit:contain;margin:0 auto 1rem;border-radius:10px;display:block;" />
<p class="small">Snapchat</p>
</div>
<div class="card qr-card">
<img src="assets/qr/qr-teilen-baustein.png" alt="QR-Code Dogis persönlicher Teilen-Baustein" style="width:160px;height:160px;object-fit:contain;margin:0 auto 1rem;border-radius:10px;display:block;" />
<p class="small" data-i18n="lk_qr_teilen">Dogis persönlicher Teilen-Baustein</p>
</div>
</div>
<!-- TODO: Shop noch mit echter URL befüllen, sobald vorhanden. Discord ist bewusst "nur auf Anfrage" (kein offener Link) und führt zur Kontaktseite. -->
</div>
</section>
</main>
<div id="site-footer"></div>
<script src="assets/js/i18n-links.js?v=20260821q"></script>
<script src="assets/js/main.js?v=20260821q"></script>
<script>
(function () {
document.addEventListener("DOMContentLoaded", function () {
var karte = document.getElementById("card-rabattcodes");
var badge = document.getElementById("rabatt-badge");
var hinweis = document.getElementById("rabatt-gesperrt-hinweis");
if (!karte) return;
// Gleicher zwischengespeicherter Login-/Abo-Stand wie beim Nav-Abo-
// Knopf (renderAboButton() in main.js) — kein API-Aufruf bei jedem
// Seitenaufruf nötig.
var status = localStorage.getItem("supporterSubStatus");
var hatAbo = ["active", "pending", "suspended", "cancelled"].indexOf(status) !== -1;
if (hatAbo) {
karte.classList.remove("gesperrt");
if (badge && window.dogiUebersetzen) badge.textContent = window.dogiUebersetzen("lk_rabatt_badge_frei");
return;
}
karte.classList.add("gesperrt");
karte.addEventListener("click", function (e) {
e.preventDefault();
if (!hinweis) return;
hinweis.hidden = false;
hinweis.scrollIntoView({ behavior: "smooth", block: "nearest" });
});
});
})();
</script>
</body>
</html>