Chosen

Chosen ist ein PlugIn für jQuery und Prototype mit dem man Select-Boxen "aufpeppen" kann

Z.B. kann ein Suchfeld eingeblendet werden (was man auf dem Screenshot sieht) über das man die Einträge die man sieht filtern kann um schnell zu einem bestimmten Eintrag zu kommen. Ausserdem unterstützt Chosen auch Multi-Select (man wählt dann die einzelnen Einträge nacheinander aus und sie werden ähnlich einer Tagliste angezeigt – schaut Euch einfach mal die Demo an), <optgroup> wird ebenfalls unterstützt, genauso wie vorselektierte und deaktivierte Einträge.

Ein Fork von Chosen für MooTools gibt es ebenfalls (ist auf der Seite verlinkt).

Horinaja

Horinajay ist ein ImageSlider-PlugIn welches sowohl mit jQuery als auch Prototype/Scriptaculous genutzt werden kann.

Die Nutzung ist dabei sehr einfach. Man legt ein DIV mit der Klasse “horinaja” an und packt dort hinein eine Liste wobei jedes <li>-Element für eine Seite steht. Dann initialisiert man das Ganze nur noch über JavaScript (wobei man noch angeben kann wie schnell die Seiten wechseln sollen) und das war es auch schon.

Das Besondere an horinaja ist, dass auch das Mausrad unterstützt wird. Befindet sich der Mauszeiger über dem Horinaja-Div kann man mit dem Mausrad zwischen den einzelnen Seiten umschalten. Befindet sich der Mauszeiger ausserhalb funktioniert das Mausrad wie gewohnt und scrollt die Seite.

Das Script steht unter der WTFPL

Grafico

Vor einiger Zeit habe ich hier ja schonmal Raphaël vorgestellt, eine JavaScript-Bibliothek zum Handling von Vektorgrafiken.

Grafico ist nun eine auf Raphaël und Prototype basierende Bibliothek zur Erzeugung von Diagrammen.

Sie unterstützt dabei z.B. Linien-, Flächen- oder Balkendiagramme (und noch einige mehr) und kann sehr einfach genutzt werden.

Ein sehr einfaches Beispiel könnte dabei z.B. so aussehen:

var linegraph = new Grafico.LineGraph($('linegraph'),{ workload: [8, 10, 6, 12, 7, 6, 9] });

Das würde dann ein einfaches Liniendigramm erzeugen.

Die Bibliothek steht unter der MIT-Lizenz und setzt Prototype 1.6+ und Raphaël 1.0+ voraus. Die Digramme sollten auf allen gängigen Browsern funktionieren.

Sehr praktisch ist z.B. die Art und Weise wie man den Status eines Benutzers feststellen kann. Hat ein User in Skype die Einstellung aktiviert, dass sein Status im Web veröffentlicht werden darf (Skype -> Privatsphäre -> “Mein Status darf im Netz veröffentlicht werden”), kann man seinen Status sehr einfach abfragen. Alles was man dazu wissen muss ist die folgende URL: http://mystatus.skype.com/

Angenommen ein Skype-User hat den Namen “TagDocsRockt”, dann kann man z.B. über

http://mystatus.skype.com/TagDocsRockt

ein Bild ausgeben lassen welches den Status anzeigt. Viel interessanter ist aber, den Status so zu bekommen, dass man ihn selber weiterverarbeiten kann (was bei einem Bild nicht wirklich der Fall ist). In dem Fall nutzt man eine der folgenden URLs:

http://mystatus.skype.com/TagDocsRockt.txt

http://mystatus.skype.com/TagDocsRockt.num

http://mystatus.skype.com/TagDocsRockt.xml

Durch die verschiedenen Erweiterungen kann man das Ausgabeformat beeinflussen. “txt” liefert den Status als normalen Text zurück (z.B. “Abwesend”) den man sogar durch anhängen einer weiteren Erweiterung übersetzen kann (“.txt.en” würde den Text auf englisch liefern, “txt.fr” auf französisch, etc.). “.num” liefert entsprechend den Status als numerischen Wert zurück und “.xml” als XML-Datei die den Status in 12 Sprachen und numerisch enthält.

Wie man sieht kann man so auf sehr einfache Weise den Status eines Skype-Nutzers abfragen (wenn er dies auch zulässt!).

Alle Infos zu der Schnittstelle finden sich in diesem PDF.

Programmierbeispiele in PHP, Perl, etc. habe ich mir mal gespart – sie laufen je nach Programmiersprache und Server-Konfiguration auf 1-3 Zeilen Code hinaus die eigentlich jeder selbst schreiben kann (file_get_contents(‘http://mystatus.skype.com/TagDocsRockt.txt’) – wäre so ein PHP Einzeiler).

Vielleicht kann die Info ja jemand gebrauchen

CoolTips

Zum Jahresabschluss gibt es heute nochmal etwas für Prototype

CoolTips ist ein Prototype PlugIn mit dem man auf einfache Weise Tooltips erzeugen kann.

Das PlugIn ist dabei primär als Ersatz für die Tooltip-Funktion der Browser gedacht und benutzt daher entsprechend den Inhalt des title-Attributs um den Tooltip zu füllen. Der positive Nebeneffekt dabei ist, dass bei deaktiviertem JavaScript immernoch der Browser selbst einen Tooltip anzeigen kann dessen Inhalt identisch ist.

Per JavaScript kann man die Farben und Grösse des Tooltips festlegen und wie er sich verhält (ob er dem Mauszeiger folgt, wie lange es dauern soll bis er erscheint, etc.).

CoolTips funktioniert mit allen gängigen Browsern (IE6+, FF2+, Opera, usw.) und steht unter der MIT-Lizenz.