The TYPO3 extension Seminars uses Formidable for rendering forms and some Java-Script wigdets. We're using jQuery for all our JS based scripting and jQuery UI for a few User Interface related purposes. To achieve a consistent look for all JS UIs we wanted to change the pretty unusable and unsexy looking default DHTML Calendar of formidable with the jQuery UI one. 

As the default jQuery UI Datepicker does not support time selection I've added the jQuery Timepicker Addon.

 

To change the hardcoded formidable rendering I've implemented an own renderlet based upon the example renderlet extension by Jerome Schneider.

 

I released my resulting extension to the TER as I was asked so in the Mailinglist. Please give feedback or ask a question via email or (better) as a comment down below.

 

 

 

 

Formidable DATE Renderlet with jQuery support

Update: jQuery UI Selectmenu v1.2.0 released

 

Im Sommer letzten Jahrs benötigte ich für ein Projekt einen select (HTML Element Auswahlliste) Ersatz der vernünftig per CSS zu gestalten war. Da wir ohnehin jQuery UI (inklusive dem dazugehörigen CSS Framework) benutzen wollte ich möglichst ein Plugin das mit eben diesem Zusammenarbeitet. Meine Wahl fiel auf das damals nicht mit der aktuellen Version von jQuery zusammenarbeitende Selectemenu Widget der Filament Group das bereits Mitte 2009 in ihrem Blog veröffentlicht wurde.

 

Da ich seit meiner Diplomarbeit mit der UI Widget Factory vertraut bin, das jQuery Team seine API Änderungen gut dokumentiert und einige Kommentare im Blogpost bereits Hinweise lieferten ging die Aktualisierung des Codes schnell von der Hand.

Da immer wieder Kommentatoren nach einer lauffähigen Version fragten entschloss ich mich die letzte offizielle Version des Widgets zu forken und die ursprünglichen und einige weitere Fixes einzuspielen. Das ganze hab ich auf GitHub veröffentlicht: https://github.com/fnagel/jquery-ui/tree/selectmenu

Bereits seit einiger Zeit ist eine neue Extension von mir im TER: Generic Gallery. Entstanden aus dem Wunsch nicht mehr für jede, wenig aber genug vom Standard abweichende, Bildergalerie, Teaser oder Visual Slide Geschichte eine neue Extension zu programmieren. Ziel war es ein einheitliches Formular im Backend und maximale Flexibilität im Forntend zu gewährleisten.

A few month ago I received some requests about adding browser history support and browser title support to my jQuery ARIA widgets. As this would be nice feature for both, usability and accessibility, I allocated some time to get this done.

 

 

I quickly realized I should use a already further developed third party add-on as the needed functionality isn't trivial business. After some research via Google and a few tests with other

 

Die Widgets meiner Diplomarbeit sind jetzt unter MIT Lizenz veröffentlicht. Diese Lizenz wurde vom Massachusetts Institute of Technology herausgegeben, dient der Veröffentlichung von freier Software und gilt als echte OpenSource Lizenz.

 

Dieser Schritt war notwendig um Kompatibilität zu den offiziellen jQuery UI Widgets zu schaffen. Aufgrund des Interesses des jQuery UI Teams an meinen Widgets haben sich Namics und meine Wenigkeit zu diesem Schritt entschloßen, um eine Verwendung durch jQuery zu ermöglichen.

 

Ich hoffe dadurch die Verwendung meiner Widgets voranzutreiben und die Barrierefreiheit von jQuery zu unterstützen.

 

 

Zeit für Post 3 in meiner Reihe über jQuery Accessible Rich Internet Applications im Zuge meiner Diplomarbeit: Accessible Tabs

 

jQuery UI stellt bereits ein sehr mächtiges UI Widget für Tabs zur Verfügung und so war für mich schnell klar das ich dieses erweitern und verbessern will. Nachdem ich verschiedene Methoden zur Erweiterung vorhandener Klassen in jQuery durch hatte und diese alle nicht hinnehmbare Probleme mit sich brachten, entschied ich mich dafür relativ schlicht die Funktionen zu überschreiben und die Originalmethoden vor meinen Änderungen aufzurufen.

 

Das sieht dann ungefähr so aus:

Im zweiten Teil meiner kleinen Reihe geht es um einen, mittlwerweile, alten Bekannten: die Lightbox. Ich stelle hier meine barrierefreie Variante auf Basis der jQueryUI Widget Factory vor, die im Rahmen meiner Diplomarbeit bei der Firma Namics entstand.

 

Achtung: Diese Anleitung bezieht sich auf die jQuery 1.3.x bzw. jQuery UI 1.8.x Variante meines Scripts. Im Gallerie-Modus sind jetzt geringfügige Änderungen nötig.

 

 

Im Zuge meiner Diplomarbeit bei der Full Service Internetagentur Namics habe ich einige barrierefreie Applikationenhttp://jqueryui.com/ für jQuery entwickelt die den Richtlinien der W3CWCAG 2.0 und ARIA entsprechen.

Eine theoretische Ausarbeitung zur Entwicklung dieser Applikationen und der dazugehörigen Theorie findet ihr in meiner Diplomarbeit. Die dort enthaltenen Hintergrundinfos können wertvolle Argumentationshilfen sein.

 

Die 4 Widgets (Live Validierung, Lightbox, Tabs, sortierbare Tabellen) werde ich in diesem und folgenden Posts vorstellen. Den Anfang macht die Live Formular Validierung.

 

Es ist geschafft -- das fremdschämen hat ein Ende. Die Seite steht soweit und ich kann fürs erste keine Fehler erkennen. Wenn ihr welche finden sollt, schreibt mir bitte.