michaelschiemer/src/Domain/Media/README.md

Media Modul

Dieses Modul verwaltet Bilder und erstellt optimierte Varianten für responsive Webseiten.

Hauptfunktionen

• Automatische Erstellung von Bildvarianten in verschiedenen Größen und Formaten (AVIF, WebP, JPEG)
• Hochwertige Bildoptimierung mit ImageMagick (oder GD als Fallback)
• Responsive Bildausgabe mit HTML Picture-Element und Source-Sets

Verwendung

Erzeugen von Bildvarianten

// Direkter Zugriff (automatische Erkennung der besten Implementierung)
$processor = new ImageProcessor();

// Alle Varianten
$variants = $processor->createAllVariants($image);

// Nur bestimmte Typen
$thumbnails = $processor->createVariantsForType($image, ImageVariantType::THUMBNAIL);

// Alternativ via DI Container
$processor = $container->get(ImageProcessorInterface::class);

Spezifische Implementierungen

// ImageMagick direkt verwenden
$imagickProcessor = new ImagickImageProcessor();
$variants = $imagickProcessor->createAllVariants($image);

// Oder GD
$gdProcessor = new GdImageProcessor();
$variants = $gdProcessor->createAllVariants($image);

// Factory für automatische Auswahl
$optimalProcessor = ImageProcessorFactory::create();

HTML für responsive Bilder generieren

$generator = new ImageSourceSetGenerator();

// Einfache Verwendung
$html = $generator->generatePictureElement($image, 'gallery');

// Mit zusätzlichen Attributen
$html = $generator->generatePictureElement($image, 'hero', [
    'alt' => 'Beschreibung des Bildes',
    'class' => 'hero-image',
    'loading' => 'lazy',
]);

Konfiguration

Die Konfiguration der Bildgrößen und -formate erfolgt über Enums:

• ImageVariantType: Definiert die Verwendungszwecke (Thumbnail, Gallery, Hero)
• ImageSize: Definiert die verfügbaren Größen und deren Breakpoints
• ImageFormat: Definiert die unterstützten Formate und deren Qualitätseinstellungen

Architektur

• ImageProcessorInterface: Gemeinsame Schnittstelle für alle Prozessoren
• ImagickImageProcessor: Hochwertige Optimierung mit ImageMagick
• GdImageProcessor: Fallback-Implementierung mit GD
• ImageProcessor: Adapter für einfachen Zugriff und Abwärtskompatibilität
• ImageProcessorFactory: Erstellt optimale Implementierung basierend auf verfügbaren Extensions

Technische Details

• Automatische Auswahl zwischen ImageMagick und GD je nach Verfügbarkeit
• Optimierte Kompression für jedes Format
• Intelligente Schärfung bei Verkleinerung
• Erhaltung von Transparenz bei unterstützten Formaten

Beispiel: Vollständiges HTML-Ausgabe

<picture>
  <source type="image/avif" srcset="image_gallery_small.avif 400w, image_gallery_medium.avif 800w, image_gallery_large.avif 1200w" sizes="(max-width: 768px) 400px, (max-width: 1024px) 800px, 1200px">
  <source type="image/webp" srcset="image_gallery_small.webp 400w, image_gallery_medium.webp 800w, image_gallery_large.webp 1200w" sizes="(max-width: 768px) 400px, (max-width: 1024px) 800px, 1200px">
  <source type="image/jpeg" srcset="image_gallery_small.jpeg 400w, image_gallery_medium.jpeg 800w, image_gallery_large.jpeg 1200w" sizes="(max-width: 768px) 400px, (max-width: 1024px) 800px, 1200px">
  <img src="image_gallery_medium.jpeg" width="800" height="600" alt="Beschreibung" loading="lazy">
</picture>