Please click here for an English version of this article.

 

 

Seit diesem Wochenende ist meine erste TYPO3 Extension im TER verfügbar: beautyOfCode Syntax Highlighter

 

Diese Extension nutzt das jQuery Plugin beautyOfCode von Lars Corneliussen um das mittlerweile recht bekannte Syntax Highlighter 2.0 von Alex Gorbatchev zu implementieren. Bekannt deshalb weil es von einigen Größen eingesetzt wird: wordpress.com, Aptana, Mozilla Developer Center, SitePoint und das Yahoo Developer Network gehören dazu.

 

Der Quellcode wird XHTML 1.0 Strict kompatibel auf der Webseite eingebettet und per Java-Script gehighlighted. Die RegEx Anweisungen und die Stylesheets die für die verschiedenen Sprachen werden per lazy-loading nachgeladen.

 

Es gibt einige nette Features wie Zeilenumbruch, Zeilen einfärben, Code einklappen, Tabulator Länge bestimmen und eine Toolbar, aber seht am besten selbst:

Erweiterungen für den Mozilla Firefox gibt es wie Sand am Meer. Hier sind meine persönlichen Lieblinge zur Produktivitätssteigerung und Webentwicklung.

 

Außerdem stelle ich in diesem Blogpost die Add-On Collector Erweiterung von Mozilla vor, die einem das Entdecken von neuen, praktischen Addons sehr erleichtert.

Meine

 

Zwischen den Jahren war Groß-Reine-Machen angesagt. Zumindest was meine Computer angeht. Soll heißen ich hab meinen Laptop und den PC auf der Arbeit neu aufgesetzt.

 

Interessanterweise hatte ich auf beiden ein Problem nach der Installation von Flash bzw. den Suiten (Adobe Creative Suite Design Stadard CS4 und Adobe Creative Suite Webdesign CS4). In Firefox, Google Chrome und dem InternetExplodierer kam folgende Fehlermeldung wenn ich ein vimeo Flash Video aufgerufen habe (egal ob auf vimeo.com oder woanders):

 

Error #2044: securityError unverarbeitet. text=Error #2048: Verletzung der Sicherheits-Sandbox: http://assets.vimdeo.co/rev/1/flash/moogaloo_np.swf? ...

 

Nachdem man der Browser kurz hängt und man das Fenster weggeklickt hat, läuft das Video ohne Probleme. Nervig ist das aber alle mal.

 

 

Hier auch noch ein Screenshot Originalgröße

Der Fehler scheint ein typisches Zugriffsproblem innerhalb von Flash zu sein. Stichwort: Sandboxing.

 

Der Fehler scheint mit der Installation von Flash (der reinen Runtime wie auch der Entwicklungsumgebung) zusammenzuhängen. Allerdings hat vimeo selbst auch was verbockt, denn der Error tritt nur bei vimeo auf. 

 

Trotz google konnte ich unter der Fehlermeldung keine Treffer landen. Erst eine allgemeinere Flash Fehler Suche hat mich auf diese Webseite geleitet:

 

http://www.flashplayerfixer.com/flash-player-error-2044.php

 

Die dort beschriebene, einfache Lösung aus Deinstallieren per Tool von Adobe und das erneute installieren hilft bereits.

 

Beide Links gehen zu Adobe's Setup Paketen, aber ich musste Firefox auch nochmal installieren lassen. Übrigens kann Firefox das jetzt endlich im Dialog (ohne Neustart) -- also wirklich, das geht jetzt!

 

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.

 

 

Die reCaptcha Extension für TYPO3,  jm_ reCaptcha, hat leider keinen noscript Tag der das Ausfüllen bei Abgeschaltetem JavaScript ermöglicht.  Gemäß der Spezifikation von reCaptcha habe ich diese hinzugefügt. Das ganze ist noch ohne LL VAriablen aber ich habe den Bug / das Feature an die Entwickler weitergeleitet und hoffe es wird bald eingebaut.

 

Folgende Zeilen sind eine Erweiterung der Datei class.tx_jmrecaptcha.php ab ungefähr Zeile 121.

Im vorerst letzten Blogpost, zu den während meiner Diplomarbeit bei Namics entstandenen  jQuery Accessible Rich Internet Appllications, stelle ich sortierbare Tabellen vor. Mit dem Widget lassen sich standardkonforme HTML Tabellen sehr einfach um einige nützliche Funktionen erweitern oder man nutzt es als Grundlage komplexer Anwendungen in denen tabellarisch Daten dargestellt werden.

 

 

Andere Blog-Posts zu meiner

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.

 

Firefox lässt sich einfach und schnell mit vielen Funktionen erweitern. Gerade als Webdesigner, Frontender oder Developer braucht man davon eigentlich einen ganzen Satz. Hier meine Lieblinge. Egal ob es darum geht Wireframes zu zeichnen, per FTP Daten zu übertragen, Flash Versionen zu testen, Testing, Barrierefreiheit oder einen anderen Browser aufrufen. Alles lässt sich schneller und praktischer machen...

Kommentare und Ergänzungen sind mehr als erwünscht!

 

Tes