# Fotoarchiv mit automatischem Web-Upload ## Einrichtung auf Ihrem Server Benötigt werden PHP 8.1 oder neuer mit GD (JPEG/PNG/WebP), Fileinfo, Sessions und optional EXIF zur Ausrichtung von JPEG-Fotos. Die Galerie über HTTPS betreiben. Es ist keine Datenbank nötig. 1. `server/config.php` öffnen. 2. Ihr Upload-Passwort direkt zwischen die leeren einfachen Anführungszeichen hinter `?:` eintragen. Alternativ die Umgebungsvariable `FOTO_UPLOAD_PASSWORD` setzen. Ein Hash ist nicht nötig. Solange kein Passwort eingetragen ist, bleibt der Upload deaktiviert. Das Passwort steht im Klartext in dieser PHP-Konfiguration; sie sollte nur für berechtigte Serveradministratoren zugänglich sein. Apostrophe und Backslashes im Passwort mit einem Backslash maskieren. 3. `index.html`, `assets/`, `server/`, `daten/` und `bilder/` gemeinsam in Ihren Serverordner hochladen. 4. Dem PHP-Prozess Schreibrechte auf `daten/` und die drei Unterordner von `bilder/` geben. Keine pauschalen 777-Rechte verwenden; beim Hoster passende Eigentümer/Gruppenrechte einstellen. 5. PHP-Limits passend einstellen: `upload_max_filesize = 20M`, `post_max_size = 24M`, `memory_limit = 256M` oder höher. Die Anwendung begrenzt jedes Bild auf 20 MB und 24 Megapixel; höhere Limits beim Hoster allein erhöhen diese Grenze nicht. 6. Webseite über ihre HTTPS-Adresse öffnen, „Bilder hochladen“ wählen und anmelden. ## Automatische Verarbeitung Mehrere JPEG-, PNG- oder WebP-Dateien auswählen. Jede Datei wird einzeln übertragen und geprüft. Der Server speichert das Original unter einer zufälligen Dateikennung, erzeugt ein Thumbnail mit maximal 720 Pixeln und ein Webbild mit maximal 2400 Pixeln längster Seite, ergänzt den Katalog und aktualisiert die sichtbare Galerie. Kleine Fotos werden nicht hochskaliert. Dateinamen dienen als anfängliche Titel. Upload-Zeitpunkt dient zur Sortierung. Fehler werden pro Datei angezeigt; erfolgreiche Dateien bleiben erhalten. Erneut hochgeladene Bilder werden als neue Bilder angelegt. Transparenz wird in JPEG-Derivaten auf Weiß gesetzt. EXIF-Orientierung wird, sofern die Erweiterung vorhanden ist, berücksichtigt. Originale bleiben unverändert und können Metadaten enthalten. HEIC bitte zuvor in JPEG umwandeln. Der Upload ist passwortgeschützt, die Galerie und Originalbilder sind öffentlich erreichbar. Für eine vollständig private Sammlung den gesamten Ordner zusätzlich über den Zugriffsschutz des Hosters schützen. Der Upload prüft echte Bildtypen, nutzt Sitzungen und einen CSRF-Token und aktualisiert den Katalog unter einer Dateisperre. Ein direkt im Browser geöffnetes `file:///…/index.html` kann keinen Web-Upload ausführen. Zur lokalen Vorschau mit Upload PHP verwenden: ```sh php -S localhost:8080 -t foto-galerie ``` Anschließend `http://localhost:8080` öffnen. Der lokale PHP-Testserver ist nur für die Vorschau gedacht. ## Alternative: Vorbereitung ohne Web-Upload Die bisherigen Python-Werkzeuge bleiben für eine neue, rein statische Sammlung verfügbar. Bei einer bereits per Web-Upload gepflegten Galerie das Python-Skript nicht zusätzlich ausführen: Es baut den Katalog neu auf und ersetzt dabei die Upload-Einträge und deren Metadaten. Für normale Ergänzungen ausschließlich den Web-Upload nutzen. # Anhang: statischer Betrieb Eigenständige statische Webseite, ohne externe Dienste, Tracking oder Laufzeitbibliotheken. Kein PHP, keine Datenbank und kein Node.js auf dem Webserver erforderlich. Noch keine Fotos enthalten. ## 1. Bilder ablegen Originale nach `bilder/originale/` kopieren. Unterordner sind möglich. Unterstützt: JPG/JPEG, PNG, WebP, TIFF, BMP. HEIC bitte vorher in JPEG umwandeln. Animierte Dateien werden als Einzelbild verarbeitet. Für eine originalbasierte Großansicht ohne Webbilder browserfähige Formate verwenden. ## 2. Einmalig Vorbereitung einrichten Auf dem eigenen Rechner Python 3 installieren, ein Terminal in diesem Galerieordner öffnen und ausführen: ```sh python3 -m venv .venv source .venv/bin/activate python3 -m pip install -r werkzeuge/requirements.txt ``` Unter Windows statt `source ...` den Befehl `.venv\Scripts\activate` verwenden; gegebenenfalls `python` statt `python3`. ## 3. Thumbnails und Katalog erzeugen ```sh python3 werkzeuge/bildkatalog.py ``` Erzeugt Thumbnails mit maximal 720 Pixeln und Webbilder mit maximal 2400 Pixeln auf der längsten Seite. Kleine Bilder werden nicht hochskaliert. Bildorientierung wird berücksichtigt. Originale werden nicht geändert. Transparenz wird bei JPEG-Derivaten auf Weiß gesetzt; EXIF-Daten werden nicht in Derivate übernommen. Originale können weiterhin Metadaten enthalten. Nur Thumbnails und Katalog erzeugen, in der Großansicht Originale verwenden: ```sh python3 werkzeuge/bildkatalog.py --ohne-webbilder ``` Bei neuen, geänderten oder entfernten Bildern erneut ausführen. Die Webseite kann auf rein statischem Hosting keine Serverordner selbst auflisten: bloßes Hochladen neuer Originale aktualisiert den Katalog nicht. Das Skript kann alternativ auf einem Server mit Python/Pillow ausgeführt werden. Nicht mehr verwendete Derivate werden nicht automatisch gelöscht. ## 4. Hochladen `index.html` und die Ordner `assets/`, `daten/`, `bilder/` zusammen in einen Serverordner laden, etwa `/fotos/`. Danach `https://Ihre-Domain.de/fotos/` öffnen. Alle Bildpfade sind relativ, deshalb funktioniert auch ein Unterordner. `.venv/` und `werkzeuge/` müssen nicht hochgeladen werden. Originaldateien sind über die Webseite erreichbar. Für private Fotos den gesamten Galerieordner mit dem Zugriffsschutz Ihres Hosters schützen. ## Bedienung Raster klein/mittel/groß, Masonry oder Liste wählen. Suche und Sortierung gelten auch für die Diashow. Bild anklicken für die Großansicht, Pfeiltasten für Vor/Zurück, Escape zum Schließen. Start/Pause und Intervall in der Großansicht einstellen. Nach dem letzten Bild beginnt die Diashow wieder vorne; bei einem Bild bleibt sie stehen. Beim Wechsel in einen anderen Browser-Tab pausiert die Diashow. ## Beschriftungen und Erweiterungen Optional `daten/metadaten.json` bearbeiten, Schlüssel ist der Dateipfad relativ zu `bilder/originale/`: ```json { "Veranstaltung/beispiel.jpg": { "titel": "Sommerfest", "alt": "Beschreibung des sichtbaren Bildinhalts", "beschreibung": "Eine selbst verfasste Bildunterschrift.", "kategorien": ["Veranstaltungen"], "datum": "2026-07-15" } } ``` Danach Katalog neu erzeugen. „Neueste zuerst“ nutzt dieses optionale Datum (ISO-Format), nicht das Dateisystemdatum; Bilder ohne Datum folgen hinten. Kategorien werden bereits durchsucht. Die getrennten Dateien für Layout, Darstellung und Katalog erleichtern spätere Kategorie-Filter, Favoriten, Downloads oder weitere Metadaten. Favoriten und Upload-Verwaltung sind derzeit nicht implementiert. Das Katalogformat hat eine Versionsnummer und stabile, aus dem relativen Dateipfad erzeugte Bild-IDs. ## Vorschau `index.html` kann direkt geöffnet werden. Für eine Vorschau wie auf einem Server: ```sh python3 -m http.server 8080 ``` Im Browser `http://localhost:8080` öffnen. # Besucherauswahl und Bearbeitungshinweise Besucher wählen bei einem Foto „Markieren & Hinweis“ (auch in der Großansicht). Unter „Meine Auswahl“ können sie je Bild einen Bearbeitungshinweis erfassen, Markierungen entfernen und optional ihren Namen eintragen. Erst „Auswahl senden“ übermittelt die Auswahl dauerhaft an den Server. Bis dahin bleibt sie nur in der geöffneten Seite; ein Neuladen verwirft den Entwurf. Pro Auswahl sind bis zu 100 Bilder möglich. Weitere Sendungen werden als separate Auswahlen gespeichert, bestehende Sendungen werden nicht überschrieben. Als Betreiber über „Bilder hochladen“ mit dem vorhandenen Passwort anmelden. Danach „Hinweise abrufen“ wählen. Dort stehen alle Sendungen mit Dateinamen und Hinweisen sowie CSV- und JSON-Download bereit. Gespeichert werden Bild-ID, ursprünglicher Dateiname, Originalpfad, Hinweis, optionale Besucherkennung und Zeitpunkt. Der CSV-Export enthält eine Zeile je markiertem Bild und ist für Tabellenprogramme geeignet. Die Daten werden in `daten/auswahlen.php` gespeichert. Der Ordner `daten/` muss für PHP beschreibbar sein. Die Datei ist durch PHP gegen direkten Abruf geschützt, die Übersicht ist nur nach Betreiberanmeldung zugänglich. Diese Datei in die Serversicherung aufnehmen. Es werden keine E-Mails versendet. ## Bestehende Galerie aktualisieren Nur `index.html`, die Dateien in `assets/` und `server/api.php` ersetzen. `server/config.php`, `daten/` und `bilder/` auf dem Server behalten, damit Passwort, Bilder und bereits gespeicherte Daten erhalten bleiben.