Tag Archives: jQuery

Wicket + jQuery = wiQuery

Nachdem ich vor ein paar Wochen über wiQuery gestolpert bin, hatte ich letztens endlich mal Zeit, mich genauer mit wiQuery zu beschäftigen. Konkret wollte ich eigentlich ein Bild “resizeable” machen, so wie es in den Beispielen von wiQuery demonstriert wird.

Lediglich drei kleine Anforderungen hatte ich:
1. Die Abhängigkeit von wiQuery sollte durch Maven aufgelöst werden
2. wiQuery sollte in eine bereits bestehende Wicket-Applikation integriert werden
3. Das Bild sollte nicht Bestandteil der Applikation sein, sondern von extern geladen werden

Da die Einführung unter leider nicht mehr auf dem neuesten Stand ist, hat die Einbindung doch ein wenig länger gedauert, als die im QuickStart versprochenen 5 Minuten.

Problem 1 – wiQuery + Maven
Da wiQuery sich noch in keinem offiziellen Maven-Repository befindet, soll laut QuickStart wiQuery manuell ins lokale Repository installiert werden. Schön und gut, nur leider wird auf eine veraltete Download-Seite verlinkt, wo sich lediglich eine Version aus dem April 2009 befindet. Dass sich unter http://code.google.com/p/wiquery/downloads/list eine neuere Version (vom 18.11.2009) befindet, ist mir erst bei meinem zweiten Problem aufgefallen.

Problem 2 – Listener hinzufügen
Da ich wiQuery in eine bestehende Applikation integrieren wollte, deren Application-Klasse nicht direkt von WebApplication sondern von einer eigenen Klasse erbt und ich die Änderungen möglichst minimal halten wollte, entschloss ich mich einfach einen Listener meiner Applikation hinzuzufügen.
Im QuickStart gibt es dazu lediglich einen Verweis auf einen Mailinglisteneintrag, welcher wiederum auf die Sourcen der Klasse WickextWebApplication im Repository verweist, mit dem Hinweis, dass lediglich die init-Methode überschrieben werden muss. Nur passten die Imports nicht zu den Packages, die in der JAR-Datei vorhanden war, auf die verlinkt wurde. Erst auf der Suche nach einer anderen Version fiel mir auf, dass die verlinkte Version im QuickStart ein wenig älter ist. Also erst einmal die aktuellste Version heruntergeladen (URL, siehe Problem 1).

Nachdem ich der init-Methode meiner Application-Klasse folgende Zeilen hinzufügte:

wickextPluginInstantiationListener = new WickextPluginInstantiationListener();
addComponentInstantiationListener(wickextPluginInstantiationListener);
super.init();

blieb das gewünschte Ergebnis immer noch aus. Denn die Klasse WickextPluginInstantiationListener existiert nicht mehr, wurde sie doch in WiQueryInstantiationListener umbenannt. Nach der Verwendung der richtigen Klasse war wiQuery also startklar.

Problem 3 – externe Bilder laden
Okay, zugegeben, kein wiQuery-Problem an sich. Wie man externe Bilder in Wicket lädt, kann unter http://cwiki.apache.org/confluence/display/WICKET/How+to+load+an+external+image nachgelesen werden. Das Beispiel respektive die Sourcen davon sahen auch nicht so aus, als ob man großartig viel falsch machen könnte. So sieht der HTML-Teil aus dem Beispiel aus:

<div wicket:id="imageParentContainer" style="height: 61px; width: 236px">
<img wicket:id="imageContainer" style="height: 100%; width: 100%"/>
</div>

Diesen also in meine Sourcen eingebaut und mit entsprechenden eigenen CSS-Klassen versehen und -zack- leider die Style-Angaben aus dem Beispiel rausgeschmissen. Diese sind zum funktionieren allerdings essentiell, ansonsten hat man zwar ein “resizeable-Behaviour”, nur wird dieses nicht auf das Bild angewandt. Nach Einfügen der Style-Angaben funktionierte alles so wie es sollte.

Fazit
wiQuery ist schon eine schicke Sache. Wäre der QuickStart nicht so irreführend, wäre wiQuery wirklich in 5 Minuten aufgesetzt.