Jochen: Grafiken in einem Ordner mit PHP auslesen und anzeigen

Hi,

ich bin gerade daran meine HP zu programmieren und mache da (obwohl ich bisher mit CSS nichts programmiert habe) auch gute Fortschritte. Jetzt gibt es noch ein Problem, daß ich noch nicht gelöst habe: Wie lasse ich meine Fotoalben am bequemsten anzeigen?

Es gibt im Netz zwar viele Fotoalben-PHP-Scripte, aber die sind alle nicht das was ich suche. Ich will einfach nur ganz simpel auf meiner Seite die Thumbnails anzeigen lassen und bei Mausklick öffnet sich ein neues Fenster mit dem großen Bild. Von Hand ist das auch kein Problem, nur wenn man einen Ordner mit 100 Bildern hat, muß man 100 Einträge erstellen, jeweils die Datei-Endungen von Thumbnail und dem eigentlichen Foto angeben. Und wenn man mehrere Alben hat, muß man diese Prozedur für die anderen Alben auch immer machen.

Ich würde das ganze also am liebsten dynamisch machen:

Die Seite, auf der das Album angezeigt werden soll, müßte also erstmal den angegebenen Ordner durchsuchen, wieviele Bilder (=x) vorhanden sind, danach eine Schleife von i=0 bis x durchlaufen werden, in der bei jedem Durchlauf das Bild "fotoalbum/i_kl.jpg" angezeigt wird, bei Mausklick dann in einem neuen Fenster das "fotoalbum/i.jpg".

Problem bei der Sache: ich habe von PHP keine Ahnung. Ich wüßte, wie ich das mit Basic oder C programmieren könnte, aber nicht in PHP.

Gibt es vielleicht schon solche PHP-Vorlagen? Wenn ich im Netz nach "Bilder anzeigen PHP" suche, finde ich nur Scripte für komplexe Fotoalben, mit Bewertungen und Scrollbalken etc. - aber so kompliziert will ich es ja nicht.

Wäre super, wenn ihr mir da helfen könntet.
Danke.

Gruß
Jochen

  1. Hallo,

    Die Seite, auf der das Album angezeigt werden soll, müßte also erstmal den angegebenen Ordner durchsuchen, wieviele Bilder (=x) vorhanden sind, danach eine Schleife von i=0 bis x durchlaufen werden, in der bei jedem Durchlauf das Bild "fotoalbum/i_kl.jpg" angezeigt wird, bei Mausklick dann in einem neuen Fenster das "fotoalbum/i.jpg".

    Du kannst dir ja mal diese Lösung anschauen:
    http://www.kristof-lipfert.de/fotografie/

    Zusätzlich zur dynamischen Erzeugung ist aber eine Caching-Strategie sinnvoll,
    denn die immer wieder neue Erzeugung der Bilder und Vorschaubilder würde
    zu große Wartezeiten ergeben.

    Problem bei der Sache: ich habe von PHP keine Ahnung. Ich wüßte, wie ich das mit Basic oder C programmieren könnte, aber nicht in PHP.

    PHP ist doch ziemlich einfach, und die nötigen Schritte hast du wohl auch
    schon beschrieben.
    Verzeichnisinhalt auswerten bzw. nach *.jpg suchen, jeweils ein Vorschaubild
    erzeugen und entspr. HTML-Code ausgeben.

    Wenn ich im Netz nach "Bilder anzeigen PHP" suche, finde ich nur Scripte für komplexe Fotoalben, mit Bewertungen und Scrollbalken etc. - aber so kompliziert will ich es ja nicht.

    Falls nicht noch jemand genau "dein" Script findet: Vielleicht kannst du
    dir, wenn die komlepexen Beispiele freie Scripte sind, die wesentlichen
    Funktionen abgucken?

    Ansonsten nach Infos für PHP-Anfänger googeln (vielleicht ist
    http://www.schattenbaum.net/php/ interessant, allerdings weiß ich
    nicht, ob es modern genug ist und php 5 berücksichtigt) und dazu noch
    http://www.php.net/manual/de/ bemühen.

    Grüsse

    Cyx23

  2. Hallo Jochen!

    mit CSS nichts programmiert

    Ach ja... (erste drei Sätze...[1])

    Von Hand ist das auch kein Problem, nur wenn man einen Ordner mit 100 Bildern hat, muß man 100 Einträge erstellen, jeweils die Datei-Endungen von Thumbnail und dem eigentlichen Foto angeben. Und wenn man mehrere Alben hat, muß man diese Prozedur für die anderen Alben auch immer machen.

    Ich würde das ganze also am liebsten dynamisch machen:

    Die Seite, auf der das Album angezeigt werden soll, müßte also erstmal den angegebenen Ordner durchsuchen, wieviele Bilder (=x) vorhanden sind, danach eine Schleife von i=0 bis x durchlaufen werden, in der bei jedem Durchlauf das Bild "fotoalbum/i_kl.jpg" angezeigt wird, bei Mausklick dann in einem neuen Fenster das "fotoalbum/i.jpg".

    Vielleicht interessiert Dich dieser Thread und die von Engin und Tom erarbeitete Lösung.

    [1] Falls Du den Hinweis nicht verstehst: in HTML und CSS wird nicht programmiert :)

    Viele Grüße aus Frankfurt/Main,
    Patrick

    --

    _ - jenseits vom delirium - _
    [link:hatehtehpehdoppelpunktslashslashwehwehwehpunktatomicminuseggspunktcomslash]
    Nichts ist unmöglich? Doch!
    Heute schon gegökt?
  3. Hello Jochen,

    das gleiche Problem hatte Engin gerade auf seiner Webseite.
    Wir haben zusammen angefangen, Funktionen für genau den von Dir gewünschten Fall zu entwickeln.

    Die ganze Sammlung soll nachher so aufgebaut sein, dass sich jeder seinen persönlichen "Fotobaukasten" daraus erstellen kann.

    Sieh Dir mal den Thread https://forum.selfhtml.org/?t=163004&m=1061131 an.

    Der wird auch noch nicht zuende sein.
    Außerdem hat Engin ein sehr praktisches JavaScript-Add-On für den Baukasten ausfundig gemacht, das er auf seiner Seite auch verwendet. Damit kann man das Ganze dann mit zwei drei Zeilen Code noch enorm aufpeppen, man muss aber nicht ;-))

    Ich sitze gerade noch an der Erzeugung der Thumbs und en einem Konzept, das ich dann gerne gleich (wird wohl Abend werden) hier posten will zur Diskussion.

    Im Moment kann das Thumb-Modul aus den Grafiktypen aus getimagesize()

    x              1 => 'GIF',
      x              2 => 'JPG',
      x              3 => 'PNG',
                     4 => 'SWF',
                     5 => 'PSD',
      x              6 => 'BMP(uncompressed 1,8,16,24,32 Bit),
                     7 => 'TIFF(intel byte order)',
                     8 => 'TIFF(motorola byte order)',
                     9 => 'JPC',
                     10 => 'JP2',
                     11 => 'JPX',
                     12 => 'JB2',
                     13 => 'SWC',
                     14 => 'IFF',
      x              15 => 'WBMP',
      x              16 => 'XBM');

    und  xpm, wenn ich wüsste, welcher FileType das in getimagesize() wäre...

    lesen und in Thumbs verwandeln.
    TIFF(uncompressed) ist noch in der Mache.

    Ich habe mir überlegt, dass die Thumbs nur in JPG erstellt werden, obwohl natürlich auch GIF und die anderen Formate möglich wären.

    Es gibt unterschiedliche Verzeichnisse:

    • Original-Bilder (unverändert)
    • Gekennzeichnete Bilder in guter Betrachtungsgröße,
        bereits gedreht, falls notwendig
        Mit Copyright-Vermerk versehen
    • Thumb-Verzeichnis mit allen Thumbnails
    • Thumb-Texte
    • Bildtexte (Beschreibungen)
    • Rechteverzeichnis
        -- wann wird welches Thumb sichtbar,
        -- wer darf es sehen und das große Bild anschauen
        -- wer darf das Original herunterladen
    • Billing-System

    Werkzeuge werden sein:

    • Galerie-Tool (Betrachter)

    • Galerie-Verwaltung

    • Multiupload per HTTP

    • zipped upload per HTTP

    • FTP-Upload per HTTP

    • Bildauswahl (über Thumbs)
        -- mit der Möglichkeit zu drehen
        -- Thumb-Text (für Title oder Tooltipp) einzugeben
        -- Beschreibungstext einzugeben (für Title, Tooltipp oder Viewpage)
        -- Rechte festzulegen

    • User- und Rechteverwaltung

    • Abrechnung

    Angefangen haben wir mit dem Betrachter
    Nun kommt die automatissche Thumb-Erzeugung
    Dann kommt das Copyright-Tool

    usw...

    Wenn Du Spaß daran hast, daran mitzueirken, nur zu!

    Harzliche Grüße vom Berg
    http://bergpost.annerschbarrich.de

    Tom

    --
    Fortschritt entsteht nur durch die Auseinandersetzung der Kreativen
    Nur selber lernen macht schlau
    Ein Jammer ist auch, dass die Dummen so selbstsicher und die Klugen voller Zweifel sind. Das sollte uns häufiger zweifeln lassen :-)

  4. Hallo!

    Durch eure Tipps habe ich mich etwas in die Materie eingearbeitet und eine Lösung für mein Problem gefunden:

    <?php

    $bilderverzeichnis = opendir("fotoalben/test");

    while($dateiname = readdir($bilderverzeichnis)){
        if(eregi(".(jpg|gif|png)$",$dateiname)){
                echo "<div id="bilderrahmen">\n";
                echo "<div id="bild">\n";
                echo "<a href="javascript:open_picture('fotoalben/test/$dateiname','black')" title="Grosse Darstellung">";
                echo "<img src="fotoalben/test/kl/$dateiname" border=0 alt="">";
                echo "</a>\n";
                echo "</div>\n";
                echo "</div>\n\n";
                }
    }
     closedir($bilderverzeichnis);
    ?>

    Es funktioniert.
    Die Bilder selber in im TEST-Ordner, die Thumbnails - mit gleichem Namen wie die jeweiligen großen Bilder - im gleichen Verzeichnis in einem Ordner "kl".

    Das Javascript öffnet das "große" Bild lediglich in einem neuen Fenster, das nach allen Seiten hin 10 Pixel größer als das anzuzeigende Bild ist und einen schwarzen Hintergrund hat.

    So sieht das ganze dann im Quelltext der jeweiligen Seite aus:

    <div id="bilderrahmen">
    <div id="bild">
    <a href="javascript:open_picture('fotoalben/test/2007_06_20_0014.JPG','black')" title="Grosse Darstellung"><img src="fotoalben/test/kl/2007_06_20_0014.JPG" border=0 alt=""></a>
    </div>
    </div>

    Das ganze ist natürlich kein Vergleich mit einem richtigen Fotoalbum, aber das will ich ja auch gar nicht auf meiner Seite haben. Ich wollte mir nur die Arbeit sparen, von Hand die ganzen Einträge zu schreiben und von Hand die Bildernummern hochzuzählen.
    Jetzt machts alles automatisch.
    :-)

    Danke!