Bildergalerie

Eine Bildergalerie gehört als Modul bereits zur TemplateOne Lösung.
Kleine Änderung gefällig?
Ein solches Modul lässt sich bei OpenSource natürlich durch direkte Änderung im Quellcode und anschließendes Übersetzen anpassen, dann kann das veränderte Modul auch in die eigene OpenCMS Installation integriert werden. Diese Vorgehensweise hat jedoch den Nachteil, dass diese Arbeit bei jedem Update der eigenen OpenCMS Installation zu wiederholen ist. Relativ hoher Aufwand.

Völlige Änderungsfreiheit und zum Teil Performancevorteile zur nachfolgend vorgestellten Lösung sind jedoch die Vorteile.

Für mich trägt die folgende Lösung, deren Hintergrund ich zuerst einmal erläutere:

Bilder bereite ich auf meinem (Linux-)Rechner folgendermaßen vor:

convert -resize 800x600 -auto-orient -quality 85 *.jpg
exiftool '-filename<${CreateDate}' -d %Y-%m-%d-%H%M%S.jpg '-DateTimeOriginalFileModifyDate' .

Damit liegen die Bilder im Format 800x600 Pixel, ggf. gedreht und in 85% Qualität als JPEG vor.
Mit dem zweiten Befehl wird der Dateiname auf das Aufnahmedatum des Fotos gesetzt. Zum Beispiel 2009-04-02-152746.jpg für ein Bild welches am 02.04.2009 um 15:27 Uhr und 46 Sekunden aufgenommen wurde.
Dies ist möglich, da digitale Fotokameras Metadaten zu jedem aufgenommenen Foto (im JPEG-Format) abspeichern.

Tooltipp und Bildunterschrift

Bei der Darstellung der Bildergalerie wird als Tooltipp der Titel des Bildes angezeigt. Der Titel wiederum wird als default mit dem Filenamen gefüllt. Dieser Titel kann auch konfigurativ als Bildüber- oder Bildunterschrift angezeigt werden.
Nun war es mir zu mühsam die Anzeige des obigen Dateinamens jeweils manuell in das Tagesdatum im deutschen Format, also z.B. 02.04.2009 zu ändern. Die Bilder direkt mit diesem Dateititel zu benennen kommt nicht in Frage, da es durchaus vorkommt, an einem Tag mehrere Fotos zu machen.

Aber die Lösung ist einfach.

Für die Ausgabe der HTML-Seiten aus dem Bildergalerie-Modul ist folgende Datei zuständig:
/system/modules/org.opencms.frontend.photoalbum/pages/album.html
Vor der Änderung sah der Quelltext folgendermaßen aus:

<%@ page import="org.opencms.frontend.photoalbum.*" buffer="none" session="false" %><%

CmsPhotoAlbumBean cms = new CmsPhotoAlbumBean(pageContext, request, response);

// set the CSS style class names
CmsPhotoAlbumStyle style = new CmsPhotoAlbumStyle();
style.setClassThumbTable("pgThumbTable");
style.setClassThumbImageTitle("pgThumbImageTitle");
style.setClassThumbText("pgThumbText");
style.setClassNavigation("pgNavigation");
style.setClassDetailImageDescription("pgDetailImageDescription");
style.setClassDetailImageTitle("pgDetailImageTitle");

cms.setStyle(style);

String template = cms.property("template", "search", "/system/modules/org.opencms.frontend.templateone/templates/main");

cms.include(template, "head");

%><style type="text/css">
<%= cms.getContent("../resources/photoalbum.css") %>
</style><div class="element"><%= cms.displayAlbum() %></div><%

cms.include(template, "foot");

%>

 
Nun soll die Ausgabe nicht direkt in den div-Container geschrieben werden (siehe oben), sondern in einen String (albumHTML), auf diesen String wird "Suchen und Ersetzen" mit regulären Ausdrücken angewendet, die die Bildüber- oder Bildunterschriften und die Tooltipps ändert, nicht jedoch die Dateinamen der Bilder. (Die ersten drei Zeilen des unten stehenden Codes).
Der so manipulierte String wird dann im div-Container ausgegeben. (Im vergleich zum original Code geänderte Zeile).

String albumHTML = cms.displayAlbum();
String albumHTMLtmp = albumHTML.replaceAll("(....)-(..)-(..)-(......)\"","$3.$2.$1\"");
String albumHTMLout = albumHTMLtmp.replaceAll("(....)-(..)-(..)-(......)<","$3.$2.$1<");
...
%><div class="element"><%= albumHTMLout %></div><%