ameos_dragndropupload: Viele Files bequem per Drag & Drop auf TYPO3 Server laden

image

Sobald man mehr als nur ein paar wenige Dateien auf einen TYPO3-Server hochladen möchte, wird der Upload über das TYPO3-Backend zur Qual, weil man jede Datei einzeln auswählen muss. In der Regel greift man dann zu einem FTP-Client, um die Files auf den Server zu spielen. Das mag noch funktionieren, so lange man die klassische Filelist benutzt – wenn man allerdings den modernen Digital Asset Manager DAM einsetzt, dann sind solche Uploads durch die Hintertüre nur bedingt zu empfehlen.

Eine saubere und dennoch komfortable Lösung bietet die Extension ameos_dragndropupload: Sie fügt dem TYPO3-Backend ein neues Register namens «Mass upload» hinzu. Dort können Dateien und/oder Verzeichnisse per Drag & Drop auf den Server befördert werden. Das Ganze funktioniert unabhängig davon, ob man die Filelist oder DAM benutzt – entscheidend ist nur, dass im Browser das Java-Plugin installiert ist.

Aardvark & Firebug: Beliebige Webseiten direkt im Firefox bearbeiten

Es gibt verschiedene Situationen, in denen man eine Webseite gerne direkt im Browser anpassen würde. Beispielsweise wenn man nur einzelne Elemente der Seite ausdrucken bzw. screenshotten möchte. Oder wenn man jemandem veranschaulichen möchte, wie die Seite umgebaut werden soll. Oder um eine Seite auf die wesentlichen Elemente zu reduzieren und sie anschliessend als Template zu nutzen.

Nun ist ein Browser per Definition ein Programm, um Webseiten anzuzeigen – nicht um sie zu bearbeiten. Zwei Firefox-Extensions machen es trotzdem möglich: Aardvark und Firebug.

image

Aardvark ist die einfachere und schnellere Variante. Ein roter Rahmen zeigt an, welches HTML-Element sich gerade unter dem Mauszeiger befindet, und per Tastaturkürzel wird dieses Element bearbeitet. Um den DIV-Tag in unserem Beispiel zu entfernen genügt es, die Taste «R» (remove) zu drücken; mit der Taste «C» (colorize) würde er eingefärbt. Die Möglichkeiten sind beschränkt, dafür sind auch keine HTML-Kenntnisse erforderlich.

image

Mit Firebug, dem Universalwerkzeug für Web-Entwickler, kann man das natürlich auch. Hier editiert man den HTML-Quelltext einer Seite und sieht sofort die modifizierte Seite. Dies ermöglicht weitaus detailliertere und komplexere Eingriffe in eine Seite – sofern man weiss, was man tut. Übrigens lassen sich so auch eingebundene CSS Styles editieren. Auf diese Weise kann man sehr rasch alternative Formatierungen ausprobieren.

FLOW3: Das neue PHP-Framework für TYPO3 Version 5

image

Während die Entwicklung von TYPO3 Version 4.x kontinuierlich voranschreitet (gerade wurde die Version 4.2.0 beta 1a veröffentlicht), arbeitet ein Team um Robert Lemke schon seit einiger Zeit an der 5. Generation von TYPO3 (vgl. Auf dem Weg zu TYPO3 Version 5.0 «Phoenix»). Diese baut auf einem neu entwickelten PHP-Framework auf, das seit kurzem einen Namen hat: FLOW3.

Wie Robert Lemke in einem Interview darlegt, vermochte keines der existierenden PHP-Frameworks die Anforderungen der TYPO3-Core-Entwickler restlos zu befriedigen. Eine Vergleichstabelle zeigt, in welchen Punkten sich FLOW3 von anderen bekannten Frameworks wie dem Zend Framework, Symfony, cakePHP, eZ Components, Ruby on Rails oder dem Java-Framework Spring unterscheidet. FLOW3 ist aber nicht bloss die Basis von TYPO3 Version 5, sondern soll auch als eigenständiges Framework für andere Projekte zur Verfügung stehen – wenn es einmal fertig ist, denn im Moment gibt es weder fertige Packages noch eine vollständige Dokumentation. Die Version 1.0 ist für die zweite Hälfte 2008 geplant.

SIMILE Timeplot: Aus Datenreihen Kurvendiagramme erzeugen

image

Mit SIMILE Timeplot kann man aus Datenreihen Kurvendiagramme erzeugen und diese direkt in die eigene Website einbinden. Das Vorgehen ist sehr ähnlich wie bei Google Maps: Etwas JavaScript reicht, um die Datenquelle zu spezifizieren und das Aussehen der Grafik zu definieren. Und weil die Grafik bei jedem Seitenaufruf neu gezeichnet wird, kann man auch Realtime-Daten darstellen – etwa Temperaturverläufe, Aktienkurse oder Umsatzzahlen.

image

Ähnliches kann man auch mit der Google Chart API (obige Abbildung) erreichen – Prinzip und Resultat sind allerdings unterschiedlich. Ein Google Chart wird allein durch den Aufruf einer URL mit einem mehr oder minder komplexen QueryString erzeugt, Timeplot erfordert JavaScript. Google Chart kann eine ganze Reihe unterschiedlicher Diagrammtypen generieren (z.B. Balken-, Torten- und Mengendiagramme), Timeplot ist auf Kurvendiagramme über einer Zeitachse limitiert. Google Chart liefert rein PNG-Grafiken ohne Interaktivität aus – Timeplot blendet beim Mouseover die aktuellen Daten ein und öffnet per Mausklick Infofenster mit weiterführenden Informationen. Und last but not least ist Timeplot Open Source (BSD Licence), während die Google Chart API zwar kostenlos, aber nur gemäss diesen Terms of Service genutzt werden darf.

SVG-Vektorgrafiken erstellen mit GLIPS Graffiti Editor

image

SVG (Scalable Vector Graphics) ist ein faszinierendes Grafikformat: Da es auf XML basiert, kann es mit jedem Texteditor bearbeitet werden, und deshalb lässt sich eine SVG-Grafik auch sehr einfach mit einer Skriptsprache wie z.B. PHP manipulieren.

Der einfachste Weg, um eine SVG-Grafik zu erstellen oder zu betrachten führt aber über ein Grafikprogramm. Nebst dem Klassiker Inkscape kann man dafür beispielsweise auch den GLIPS Graffiti Editor nutzen, der sich auf die grundlegenden Funktionen beschränkt und deshalb sehr übersichtlich und leicht zu erlernen ist. Wie viele Java-Programme ist GLIPS ein kleines bisschen träge, dafür läuft es auf allen Betriebssystemen, die Java unterstützen. Als Lizenz kommt die Lesser General Public License (LGPL) zum Einsatz.

TV-Browser: Die digitale Programmzeitschrift

image

Wer sich nicht einfach vor den Fernseher setzen und zappen mag, sondern seinen TV-Konsum im voraus plant, bekommt mit dem TV-Browser ein mächtiges Werkzeug in die Hand: Das Java-Programm bietet eine Fülle von Konfigurations- und Selektionsmöglichkeiten, um sich eine massgeschneiderte Programmzeitschrift zusammenzustellen.

Zur Aktualisierung der Daten ist jeweils ein Internet-Verbindung erforderlich, danach kann der TV-Browser auch offline genutzt werden. Für mich als durchschnittlichen Fernseher bietet der TV-Browser weit mehr, als ich je brauchen werde (was gelegentlich auf Kosten der Übersichtlichkeit geht), für einen TV-Junkie ist die Ausstattung aber wahrscheinlich gerade richtig. Auch die Auswahl an über 500 TV- plus 80 Radio-Sendern (v.a. deutschsprachiger Raum, Skandinavien und Grossbritannien) ist in der Regel mehr als genug.

TV-Browser läuft auf allen Betriebssystemen, für die es ein Java Runtime Environment gibt (Windows, Mac OS X, Linux) und unterliegt der GNU General Public Licence (GPL).

SIMILE Timeline: Visualisierung von Geschichte auf der Zeitachse

image

Als Historiker habe ich mich seit jeher dafür interessiert, wie man eine Abfolge von Ereignissen und Perioden visuell darstellen kann. Und als Informatiker habe ich stets nach Desktop- und Web-Applikationen gesucht, welche diese Ideen auch umsetzen können – bisher mit mässigem Erfolg: WikiTimeLine beispielsweise ist zwar ein interessanter Ansatz, kann aber weder visuell noch in der Bedienung wirklich überzeugen. Und Web-2.0-Produkte wie z.B. CircaVie oder Timeline kommen zwar optisch attraktiv daher, konzentrieren sich aber mehr auf Community-Funktionalität und Gimmicks als auf eine wirklich übersichtliche und interaktive Visualisierung.

SIMILE Timeline dagegen kommt meiner Vorstellung von einer perfekten Lösung schon sehr nahe. Zunächst ist die doppelte Zeitachse mit den unterschiedlichen Zoom-Stufen eine wirklich schöne Idee. Leider nicht selbstverständlich ist auch die Möglichkeit, sowohl punktuelle Ereignisse als auch Perioden zu visualisieren. Sehr hilfreich ist ferner die Möglichkeit (auf obigem Screenshot nicht sichtbar), die Einträge auf der Zeitachse per Volltextsuche zu filtern oder farbig zu markieren. Ein empfehlenswerter Showcase ist die Religion Timeline über jüdische und christliche Geschichte.

Das schönste aber ist: SIMILE ist nicht nur Open Source (BSD-Lizenz), sondern kann auch sehr einfach in die eigene Website eingebunden werden: Alles was es braucht, ist HTML, JavaScript sowie eine XML-Datei mit den darzustellenden Ereignissen bzw. Perioden. Wer schon einmal ein Google Maps Mashup erstellt hat, wird das Konzept von Timeline rasch begreifen.

SIMILE steht übrigens für Semantic Interoperability of Metadata and Information in unLike Environments und ist ein Projekt der University of California in Berkeley.

P.S. Es gibt auch ein SIMILE Timeline Plug-In für WordPress, das es erlaubt, Blog-Artikel anhand ihres Publikationsdatums auf einer Zeitachse zu platzieren. Aus meiner Sicht ist das nicht unbedingt die sinnvollste Anwendung für Timeline – aber eine hübsche Alternative für ein chronologisch sortiertes Blog-Archiv ist es allemal, wie dieses Beispiel zeigt.

TYPO3 Praxis: Drag & Drop im Backend

image

Lange war Drag & Drop eine Bedienungstechnik, welche Desktop-Programmen vorbehalten war. Dank AJAX kann man heute aber auch auf Webseiten Elemente durch blosses Verschieben mit der Maus umgruppieren. Im Backend von TYPO3 lassen sich auf diese Weise im Seitenbaum einzelne Seiten bequem verschieben oder auch kopieren: An der Zielposition erscheint das oben gezeigte Popup, über das man die auszuführende Aktion auswählt.

Ähnliches geht auch mit Inhaltselementen auf einer einzelnen Seite – allerdings ist in diesem Fall die Installation der Extension gb_bedraganddrop erforderlich.

TYPO3 Tuning: Skins für das Backend

image

Das Backend von TYPO3 ist funktional, aber keine Schönheit. Was viele nicht wissen: Dieses Backend unterstützt Skins (Themes) und kann über entsprechende Extensions visuell angepasst werden.

Allerdings ist die Auswahl an brauchbaren Skins sehr bescheiden: Nebst der Extension t3skin_improved, welche einige Detailverbesserungen im Standard-Skin implementiert, sind vor allem skin_grey_2 (Screenshot oben) und modern_skin (Screenshot unten) zu erwähnen. Diese beiden aber lohnen sich, wenn man sich am Standard-Design von TYPO3 irgendwann sattgesehen hat.

image