Der Sky-Beach in Köln ist auf dem obersten Deck des Parkhauses P2 Kaufhof / Hohe Straße angesiedelt und eigentlich eine sehr coole Idee. Nur leider heute Abend um 20:00 Uhr schon so voll, dass man sich nur noch in den Sand hätte setzen können. Und darauf hatte ich heute nun wirklich keine Lust mehr, nachdem man die ganze Zeit im eigenen Saft vor sich hin brutzelte. Nach dem kurzen Fotoshooting (mehr Photos nach Klick auf obiges) ging es also auf den heimischen Balkon – war auch schön :-)
Den ganzen Tag über habe ich bei Pia ja schon nachlesen können, dass die ersten Karten des Fremdpostelns angekommen sind. Und da ich jetzt weiß, dass meine von Pjöni persönlich, mit Hilfe seiner Praktikantin Pia (oder war es anders herum?) entstanden ist, kann ich mir gut vorstellen, wie unruhig die gute Pia den ganzen Tag auf ihrem Bürostuhl hin und her gerutscht ist.
Aber nun ist sie ja angekommen und in den nächsten zehn Jahren werde ich bestimmt noch den Sinn der Nachricht enträtseln… Vielen Dank Pia und Pjöni für die Karte und vielen Dank Pia, für die Idee des Fremdposteln!
Nachtrag: Meine Karte ging übrigens an das Fräulein Anna.
Unter olbertz.de/jquery/googlemap.html habe ich mal ein kleines Beispiel für das Zusammenspiel von jQuery und Google Maps zusammen gestellt.
Die HTML-Datei selbst enthält kein Javascript, die Zuordnung von Aktionen (z.B. Mausklick) zu Java Script-Funktionen findet nur in olbertz.de/jquery/googlemap.js statt.
Dabei muss ich eine Einschränkung zugeben: ich habe es nicht geschafft, den onclick-Event für die Links auf die Locations, die ich in der Funktion processLocations() erzeuge, mittel jQuery zu setzen. Damit hatte ich mich dann aber auch nicht mehr so lange auseinander gesetzt.
Die locations.php gibt, in JSON kodiert, die Daten aus der Datenbank zurück an die Website und nimmt auch neue Locations entgegen. Das ganze wird mit den jQuery AJAX-Methoden $.get() und $.post() realisiert. Nach dem Aufruf erhält die Callback-Funktion den Inhalt der Rückgabe (hier die Locations in JSON kodiert). Da es sich um JSOn handelt, werden die Daten durch ein einfach eval() von JS der Seite bekannt gemacht.
Die Funktionalität des Beispieles ist sehr einfach: Bei Klick auf die Locations in der Liste rechts, wird die Karte in der aktuellen Zoomstufe auf diese Location zentriert. Über New kann eine neue Location angelegt werden. Dazu klickt man einfach an der gewünschten Stelle auf die Map (erst New klicken!) und gibt ihr anschließend einen Namen, bevor man sie mit Save in der Datenbank abspeichert. Es werden immer nur die letzten 10 Locations angezeigt.
Die Quelltexte des Beispiel sind auf der Demo-Seite verlinkt.
Ein klein wenig Statistik: Die Demo besteht aus insgesamt 145 Zeilen Code, die ich schreiben musste. Dabei entfallen 34 Zeilen auf HTML, 86 auf das Java Script und 25 auf PHP.
(Warum die Demo-Seite nicht im Safari läuft, kann ich im Moment leider nicht beantworten. So, jetzt läuft’s auch mit Safari. Man sollte immer daran denken, ein </script> zu setzen, sonst ignoriert Safari die Zeile einfach.)
Oder zumindest die PayPal-Gebühren vom Käufer einfordern werde: <eBay Jargon>eBay ich, PayPal Du<eBay Jargon />
Seit kurzem beschäftige ich mich auch mit jQuery, welches sich selbst so beschreibt: jQuery is a new type of Javascript library. It is not a huge, bloated, framework promising the best in AJAX – nor is just a set of needlessly complex enhancements – jQuery is designed to change the way that you write Javascript.
Das sind große Worte, aber ich muss ihnen zustimmen. jQuery behandelt natürlich auch AJAX, aber wirklich besonders ist, wie jQuery die Struktur eines Projektes verändern kann – selbst wenn es keinen Gebrauch von AJAX macht.
Java Script kann die Benutzerführung einer Webapplikation erheblich vereinfachen, das Schreiben einer solchen Website aber auch erheblich verkomplizieren. Alleine schon, weil man den JS-Code an vielen Stellen in der Website hinterlegen kann und bei mehreren Seiten die Anzahl der Plätze nur noch vielfältiger wird.
Dann stehen an ziemlich vielen Stellen in der Website die eigentlichen JS-Aufrufe drin, der HTML-Code wird um jede Menge DIVs und IDs angereichert um von JavaScript aus auf die Webelemente zugreifen zu können.
Genau an dieser Stelle greift jQuery ein, wie man an folgendem Beispiel sieht:
$("input.buttonCAdd").click(function(){$("div.contentToChange").find("p").not(".alert")
.append(" This text was just appended to this paragraph")});
Das Beispiel stammt von Cody, auf seiner Seite kann man sich anschauen, was sich tatsächlich mit jQuery anstellen lässt.
Der größte Unterschied zur „normalen“ Verwendung von JavaScript ist bei obigem Beispiel, dass die Aktion, die bei Klick auf einen Button passiert, nicht in der Website selbst definiert wird, sondern unabhängig davon passieren kann. Man kann sich jQuery als eine Art CSS für JavaScript vorstellen. Dadurch lässt sich eine MVC-Trennung des Website-Codes bis auf Ebene des JS herunter durchziehen.
Der Website-Code wird außerdem schlanker, da nicht mehr so viele DIVs und IDs benötigt werden. Zusätzlich kann die Usability der Website für Nutzer ohne JS gesteigert werden, weil der eigentliche Website-Code kein JavaScript mehr enthält. Dadurch ist es einfach schwieriger, Websites zu entwerfen, die nur mit JS einwandfrei funktionieren.
Die AJAX-Funktionalitäten von jQuery habe ich mir dabei noch garnicht angeschaut. Aber damit werde ich in den nächsten Tagen genug zu tun haben :-)