Bildergalerie, wie anfangen?

[Auge]

Hallo

$PicCODE= 1;

Du kannst ruhig mit 0 beginnen. :-)

while ($find = readdir($open_pfad)) // Ordnerinhalt auslesen
{
    if (preg_match("/.(jpg|gif)$/i", $find))

Der Ausdruck prüft, ob die Endung .jpg oder .gif ist, oder?
Ein erseits kann es sein, dass beim Upload ausversehen ein Bild, dass nicht in die Galerie gehört dort hineingelangt (mir schon mit anderen Dateien passiert).
Deshalb habe ich mir ein Namensschema gemacht, damit solche Dateien weitestgehend herausgefiltert werden können.

Die Dateien sind so aufgebaut: abcdefgh_00.jpg und werden gegen diesen Ausdruck geprüft:

preg_match("/^[1]{1,}\_[0-9]{1,2}.(jpg|png|gif)$/",$bdatei)

Der Name beginnt mit mindestens einem Buchstaben ([a-zA-Z]{1,}), gefolgt von einem Backslash (\_) und einer ein- oder zweistelligen Zahlenkombi ([0-9]{1,2}) und kann die angegebenen Endungen haben.

So werden aber nur die Datei_namen_ geprüft, aber nicht der Typ der Datei!
Dies kann man dann schon beim Upload per getimagesize tun. Das zurückgegebene Arrayelement 2 gibt ein Flag für den Dateityp an. Mit den Element 3 gibt den HTML-Code für die width- und height-Attribute an, der in deinem Beispiel noch fehlt.

$max= $piccount;

Wo kommt $piccount her? count($bild) liefert dir ebenfalls die Anzahl der Bilder.

$gallery_size = sizeof($bild);

sizeof ist ein Alias für count, in $max steht also schon das Gleiche drin.

echo "<a href="$datei?s=$zurück" style="visibility:hidden; display:;none">";

Entweder visibility:hidden; oder display:none;. Ersteres hält den Platz für das Element frei, es wird nur versteckt, Letzteres nimmt es vollständig aus dem Textfluss heraus.

echo "&nbsp;<img class="foto" src="$bild[$s]" alt="Bild $s von $max" title="Bild $s von $max">&nbsp;"; //Ausgabe des Bildes

Wie oben schon erwähnt, fehlt hier die Angabe von width und height. Das ist zwar keine Pflicht, verhindert aber, dass nicht gleich der Platz für das Bild freigehalten wird und beim Laden des selben das layout "springt", weil das Bild mehr Platz braucht, als für das Icon, das zuerst angezeigt wird, freigehalten wird.

Jetzt bräuchte ich noch die Thumbnailvorschauen dazu und die Kommentare.

Die Thumbnails sollen ja wohl kleiner sein, als die Originale. Um die Seitenverhältnisse zu erhalten, liest du zuerst mit getimagesize die Längenangaben aus und teilst sie durch die Angabe für die längste Seite des Thumbnails. Beispiel (längste Seite soll 90px sein):

$aus = getimagesize($bild[0]);
$aa = $aus[0] / 90;
$ab = $aus[1] / 90;

Damit hast du einen Dividenden um die originalen Seitenlängen zu teilen. Danach ermittelst du, welche Seite länger ist (if ($aa<$ab) vice versa) und teilst die originalen Seitenlängen des Bildes.

Wenn die Bilder nicht allzugroß sind, kannst du die ermittelten Werte in die width- und height-Attribute der Bilder einfügen. Das hat den Vorteil, dass die Bilder gleich vollständig geladen werden und bei der Navigation zwischen den Bildern keine weiteren Wartezeiten auftreten, da die bilder im Original schon im Cache des Benutzers liegen.

Dies ist aber auch gleichzeitig der gravierende Nachteil. Wenn es nämlich sehr große und/oder sehr viele Bilder sind, dauert schon der Aufbau der ersten Seite ewig lange, da ja alle Bilder in ihrer originalen Dateigröße geladen werden.

In diesem Fall kannst du mit imagecopyresized das Bild verkleinern (Bitte auch die User Contributed Notes lesen.).

Aber bei den Kommentaren hab ich eine Idee.

Die Infos zu den Bildern kannst du in Textdateien oder einer Datenbank hinterlegen.

Tschö, Auge

---

1. a-zA-Z ↩︎