jQuery Plugin ist hausgemacht.

Es ist mittlerweile schon über ein Jahr her, dass wir uns zu Viert aufmachten, russische Züge und tibetische Höhenpässe zu erkunden. Trotzdem hab ich mich nochmal daran gemacht, die Website komplett zu überarbeiten. Brotlose Kunst in Reinform.

Im Endeffekt störte mich an der alten Version die Geschwindigkeit und der fehlende Zusammenhang zwischen einzelnen Bildern.

Um die Geschwindigkeit zu verbessern, verabschiedete ich mich zunächst von meinem guten Bekannten WordPress und setzte voll und ganz auf CodeIgniter. Nicht nur weil ich dieses Framework während meiner Diplomarbeit schon verwendet hatte, sondern auch um die geplanten Änderungsmaßnahmen wesentlich einfacher durchführen zu können. Auf der anderen Seite hieß das aber auch, dass die Seitenstruktur komplett neu erarbeitet werden musste. Ergo ging viel Zeit flöten.

Der Zusammenhang der Bilder sollte über Farbwerte und Stichworte hergestellt werden.

Farben

Das mit den Farben war schwieriger als zunächst angedacht. Allein die RGB-Farbwerte auszulesen war mich nicht genug, sondern es musste der HSV-Farbraum werden. Nein, nichts mit Fussball. H = Farbton ( 0° – 360°), S=Farbsättigung und V=Hell/Dunkel (grobgesagt). Mit diesen Werten war es für mich einfacher einzelne Bilder zu vergleichen. Außerdem war der Farbregler besser zu gestalten. Für das Auslesen der Farbwerte war der Eintrag von Mikko (Color Analysis) sehr hilfreich.

Im Endeffekt kam in die Datenbank ein Red, Green, Blue, Hue, Saturation, Value und Websafe Wert. Zu jedem Bild 10 Werte auslesen lassen, bis der Rechner qualmte. Machte am Schluss 24,221 Farben (bei 2,551 Bildern … ja genau, doppelte Werte sind rausgeflogen).
Für die Farbauswahl musste natürlich ein selbst gebastelter Farbwähler her.
Beispiele:

R(100)G(50)B(250)R(23)G(10)B(100)R(227)G(57)B(4)R(98)G(179)B(89)

Stichworte

Das Filtern der Bilder sollte außerdem mit Hilfe von Stichworten erleichtert werden. Anders als bei den Farbwerten war das Setzen der Stichworte hier ein nicht zu unterschätzender Arbeitsschritt . 😉 Allerdings war diese Aufgabe mit Hilfe von Adobe Bridge relativ einfach durchzuführen.

Danach konnten die zugewiesenen Stichworte, die als Metadaten an die Bilder angehängt wurden, ausgelesen werden (Sprich PHP liest EXIF). Ich häts mir sicher auch einfacher machen können, aber naja … Die Außwahl an sich, sollte dem Benutzer außerdem den Zusammenhang zwischen den Stichworten darstellen. Am besten anschauen, dann wirds deutlicher:

Beispiele:

• Mongolei
• Mongolei + Stefan
• Stefan + Tibet
• Stefan + Tibet + Yardrog Yutsho
• Tibet + Yardrog Yutsho + Evelyn
• usw.

Von der Funktionalität her, sind das die zwei wesentlichen Neuerungen, die die Website aufzuweisen hat. Neben dem vermehrten Einsatz von AJAX (siehe das Tagebuch oder eine Einzelbildseite), graphischen Überarbeitungen, Auslesen der Geokoordinaten der Bilder, Darstellung der Reiseroute, Firlefanz wie Ausblenden einzelner Seitenblöcke …

Nachdem die Seite online zu begutachten ist, werden hier keine weiteren Screenshots folgen.

»Quer durch Asien

Eingesetzte Technik (u.a.):

• CodeIgniter (1.7.2)
• jQuery (1.4.2)