Seit gestern gibt es ein neues Feature hier im Blog. Einen Planet.

Gestern habe ich mich mal damit befasst ein lange von mir geplantes Feature umzusetzen, nämlich die Aggregation und Anzeige von interessanten Artikeln, die ich in meinem Feedreader lese.

Dabei ist nun diese Seite entstanden, die genau das macht. Die Technik dahinter ist noch sehr simpel gehalten und auch noch nicht ganz so performant wie ich das gerne hätte, aber dafür finde ich auch noch eine Lösung in den nächsten Tagen. Dann folgt auch eine weitere Erklärung, wie das geschieht und welche Technologien eingesetzt werden.

Und dann noch eine Sache. Sollten auf dieser Seite Artikel angezeigt werden, die dort nicht gewünscht sind kann man mich bequem über mein Kontaktformular erreichen. Ich werde diesen Artikel dann selbstverständlich aus der Aggregation entfernen.

—
Foto: Notting Hill garden little planet

Ich beobachte nun schon seit einigen Wochen, dass sich an Wochenenden in meinem Feedreader so gut wie nichts tut, obwohl jeder zu dieser Zeit eigentlich am meisten Zeit haben sollte. Ist das eine allgemeine Unlust oder einfach nur eine Wochenend-Faulheit?

Egal, denn dies bringt mich zu meinem eigentlichen Thema. Einem sehr guten Feedreader auf Basis von PHP und AJAX: Tiny Tiny RSS.

Als ich vor einige Zeit damit begonnen habe Feeds zu lesen habe ich mich logischerweise auf die Suche nach einem geeigneten Feedreader begeben. Anfangs habe ich mich hier für Sage entschieden, was ein Add-on für Firefox ist. Doch bald begann die Suche von neuem, da ich auch von unterwegs auf meine Feeds zugreifen wollte. Hierbei habe ich mir diverse Anbieter angeschaut, doch keiner hat mir wirklich gefallen. Schlussendlich bin ich jedoch, durch Zufall, auf Tiny Tiny RSS gestoßen.

Features von Tiny Tiny RSS

Dieses feine Stück Software von Andrew Dolgov bietet alles, was man braucht und sieht nebenbei noch sehr gut aus, was ein weiterer Grund für mich war diesem Reader eine Chance zu geben. Doch hier nun die Features:

• Die Software läuft vollautomatisch auf einem Webserver
• TT-RSS unterstützt diverse Formate wie RSS, RDF, Atom, etc.
• OPML-Importe und Exporte stehen zur Verfügung
• Die Installation und Konfiguration gestaltet sich einfach
• Das Interface benötigt keine Reloads der Seite dank XmlHttpRequest oder einfacher gesagt AJAX
• Die Software ist frei und steht unter einer GPL-Lizenz
• Artikel können selbst aggregiert und anderen verfügbar gemacht werden
• Wie bei Google Mail werden Tastatureingaben unterstützt
• Artikel können intern bewertet werden
• Podcasts werden seit der aktuellen Version ebenfalls unterstützt

Für all das wird ein Webserver oder natürlich auch Webspace mit mindestens PHP 4 und mbstring benötigt. Als Datenbank kann entweder MySQL ab Version 4.1 oder PostgreSQL ab Version 7.4 benutzt werden. Zusätzlich ist es noch praktisch wenn XML-RPC for PHP und Gettext auf dem Server verfügbar sind.

Installation von TT-RSS

Die Installation gestaltet sich sehr einfach. Das heruntergeladene Archiv entpacken, die Konfigurationsdatei anpassen und hochladen. Anschließend noch das Datenbankschema einspielen und schon kann der Spaß beginnen.

Das Datenbankschema einspielen ist hierbei wohl der schwierigste Teil, da dies nicht wie bei WordPress in einer Installationsroutine geschieht, sondern manuell erledigt werden muss. Hierzu kann man, je nach Möglichkeit, die Kommandozeile oder phpMyAdmin verwenden.

Bevor man Tiny Tiny RSS das erste Mal nutzt muss man auch noch angeben, wie die Feeds aktualisiert werden sollen. Am besten eignet sich hierfür ein Cronjob, der die Datei update_feeds.php in bestimmten Abständen aufruft. Jedoch gibt es auch noch diverse andere Methoden, die allesamt hier beschrieben sind.

Eindruck

Mein Eindruck von Tiny Tiny RSS ist sehr gut, auch nach der langen Zeit, die ich dieses Tool nun schon nutze. Das Interface reagiert schnell und ist intuitiv zu bedienen. Jeder kommt damit binnen Minuten zurecht. Die Einstellungen, die man tätigen kann sind ebenfalls sehr umfangreich. Man kann nahezu alles konfigurieren. Man kann Feeds auch in Kategorien einteilen, um einen besseren Überblick zu behalten und zur besseren Identifikation der Feeds werden die Favicons der Websites angezeigt, sofern verfügbar.

Alles in allem kann ich dieses Tool jedem besten Gewissens empfehlen, da auch Updates leicht von der Hand gehen, die relativ regelmäßig veröffentlicht werden und neue Features oder Bugfixes enthalten. Ganz nebenbei gibt es auch noch ein sehr praktisches Add-on für Firefox, mit dem immer darüber informiert ist, wie viele neue Artikel gelesen werden wollen und man kann seine Installation mittels eines Bookmarklets oder Favlets als Feedreader registrieren. Was das ist beschreibt Perun in seinem neuen Blog Webwork-Tools.

Features

• Dynamische Generierung des Kalenders
• Hervorhebung von Tagen mit belegten Ferienwohnungen
• Hervorhebung von Wochenenden
• Hervorhebung des heutigen Tages
• Mittels Parameter kann zwischen verschiedenen Wohnungen unterschieden werden
• Jahres-, bzw. Monatsanzeige
• Anlegen von Buchungen
• Bearbeiten von Buchungen
• Löschen von Buchungen
• Authentifizierung mittels Session

Bekannte Probleme

• Beim Springen zwischen Detailseiten im Backend gibt es Probleme
• erzeugter Kalender ist noch nicht zu 100% validierbar
• …?

Hintergrund

Hintergrund dieser Entwicklung ist der, dass ich vorhabe die Website meiner Oma irgendwann einmal zu relaunchen mit einem neuen frischen Design und vielen praktischen Funktionalitäten wie der, dass man direkt sehen kann, ob die Wohnungen frei sind oder nicht.

Da dieses System dann natürlich auch im Produktivbetrieb laufen soll habe ich den bisherigen Stand des Projektes online gestellt und würde mir wünschen, dass es von euch Lesern auf Bugs und fehlende nützliche Features untersucht wird.

Der Link zum Frontend ist http://development.ajaveeb.de/buchungssystem/index.php.
Das Backend erreicht man über http://development.ajaveeb.de/buchungssystem/admin/index.php.
Die Zugangsdaten zum Backend sind folgende:

• User: demo
• Passwort: demo

Bugs und fehlende Features können natürlich jederzeit gerne in die Kommentare geschrieben werden. Ich werde sie dann in die obige Liste aufnehmen und versuchen zu beheben, wenn das Sinn macht.

Ich bedanke mich schon mal im Voraus für jeden, der sich auf die Suche begibt und mir diverse Dinge meldet

Optik und Funktionen

Am Design hat sich nichts grundlegend geändert bis auf die Tatsache, dass die bisherigen Icons durch modernere ersetzt wurden und die Adressleiste nun etwas zeitgemäßer daherkommt. In besagter Adressleiste befindet sich nun das Favicon einer Website, sofern vorhanden, in einer eigenen kleinen Box und bei einem Klick darauf bekommt man ein paar Infos zu der aktuellen Seite wie Identitätsdaten und ob die Seite verschlüsselt aufgerufen wurde. Auf der rechten Seite der Leiste findet man wie gewohnt das Feedicon, wenn ein Feed zur Verfügung steht und eine Neuerung. Bei einem Klick auf das Sternicon kann man die momentane Seite direkt in seine Bookmarks aufnehmen oder sofern schon ein Bookmark vorhanden ist dieses bearbeiten.

Auch die Add-on-Verwaltung wurde grundlegend überarbeitet. So werden nun beim Aufruf dieser direkt empfohlene Add-ons angezeigt und ein kleiner Suchbalken, über dann man ohne den Umweg auf die Website von Mozilla Erweiterungen suchen und installieren kann. An der Anzeige von bereits installierten Add-ons hat sich nichts geändert, ebenso wenig an der Anzeige von installierten Themes. Neu hinzugekommen ist jedoch ein Reiter für installierte Plugins wie Flash, Silverlight, etc. Auch die Anzeige der Downloads wurde überarbeitet, jedoch fällt mir hier negativ auf, dass der Button zum “Aufräumen” einer kleinen Suchbox weichen musste.

Ebenfalls überarbeitet wurde die Lesezeichenverwaltung. Diese kommt nun wesentlich aufgeräumter daher und bietet vielfältige Möglichkeiten zur Anzeige und Sortierung der Bookmarks. So befindet sich auf der linken Seite ein Baummenü, dass die verschiedenen Ordner darstellt. Klickt man auf einen dieser Ordner wird im rechten Teil des Fensters der Inhalt dargestellt. Klickt man wiederum dort auf ein Lesezeichen erscheinen unterhalb des Inhalts die Möglichkeiten zur Bearbeitung.

Ein Blick unter die Haube

Blickt man ein klein wenig tiefer fällt sofort die Möglichkeit auf angezeigte Seiten komplett stufenlos zu zoomen, egal ob der Entwickler nun daran gedacht und relative Größen verwendet oder pixelgenau gearbeitet hat. Womit Firefox hier jedoch noch nicht zurecht kommt sind Websites, die eine Variable Breite haben, da diese die gegebene variable Breite (meist 100% des Sichtfensters) behalten egal wie man sie vergrößert oder verkleinert.

Blickt man noch ein wenig tiefer fällt der enorm schnelle Seitenaufbau auf, der m.E. schon fast an Safari herankommt. Egal, welche Seite man aufruft, sie wird rasend schnell geladen, selbst dann wenn mehrere Javascriptbibliotheken und Unmengen an Bildern eingebaut sind. Ein gutes Beispiel für solch eine Seite ist die Startseite von Bayern.by, dem Tourismusportal von Bayern. Und Nein, für diesen Link werde ich nicht bezahlt

Was auch eher erst auf den zweiten Blick auffällt ist, dass das Speichermanagement enorm verbessert wurde. Hat Firefox 2 noch wahrlich gigantische Mengen von RAM gefressen begnügt sich die neue Version mit einem kleinen Bruchteil dieser Menge. Bestes Beispiel hierfür ist meine Arbeit. Durch die intensive Arbeit mit unserem CMS und den dazugehörigen Portalen, die inzwischen viele AJAX-Features aufweisen, hat sich der Speicherbedarf von Firefox teilweise auf wahnwitzige 1,2 GB erhöht, was für einen Browser absolut inakzeptabel ist. Daraus resultierende Folgen waren ein sehr langsamer Seitenaufbau und eine allgemein schlechtere Performance meines PCs. Seit auf die aktuelle Betaversion umgestiegen bin braucht Firefox meist maximal 200 MB, was die Geschwindigkeit in keinster Weise beeinträchtigt.

Fazit

Ich kann nur jedem, der sich auf die neuste Version von Firefox freut, dazu raten in jedem Fall umzusteigen. Auch ein Umstieg auf die aktuelle Betaversion ist zu empfehlen, da sie schon sehr stabil und sicher läuft und wenn man mal von der Inkompatibilität einiger Add-ons absieht, wirklich mehr Vorteile als Nachteile zu bieten hat. Hierzu hat jedoch Frank schon mal einen Eintrag in seinem Blog geschrieben, wie man das umgehen kann.

Dieser Artikel beschäftigt sich mit genau diesem Thema und versucht praktische und vor allem praktikable Lösungsvorschläge zu liefern. Ich beginne hier beim Grundlegensten aller Projekte, der Idee, und gehe dann auf alle weiteren nötigen Schritte ein, bis endlich eine funktionsfähige Website entstanden ist.

Am Anfang steht die Idee

Ohne eine gute Idee scheitert jedes Projekt schon im Ansatz. Aber wenn man es geschafft hat eine tolle Idee zu haben, bei der man nicht vor unendlich großen Hürden aufgrund fehlender Kenntnisse o.Ä. steht, kann es endlich losgehen. Der nächste Schritt ist es seinen Einfall weiterzuentwickeln und sich ein Konzept zu schaffen, mit dem man arbeiten kann. Ob dies nun durch massives Brainstorming, Austausch mit anderen oder spontan unter der Dusche entsteht ist egal. Die Hauptsache ist, dass schlussendlich eine Art roter Faden entsteht, an den man sich bei der Entwicklung halten kann.

Design: der Hauptbestandteil eines Templates

Logischerweise sollte man sich bei der Konzeption seiner Idee auch schon diverse Gedanken zum Design machen, denn immerhin ist das der wichtigste Bestandteil bei der Template-Entwicklung. Ohne Design kein Template, so einfach ist das.

Wie man letztendlich sein Design entwickelt ist jedem selbst überlassen. Ob mit Photoshop auf den Pixel genau oder skizzenhaft mit Papier und Bleistift. Der wichtige Teil hierbei ist jedes gewünschte Feature von Anfang an in den Prozess mit einzubeziehen, damit man nicht plötzlich vor einem großen Problem steht und mühselig eine mehr schlechte als rechte Lösung zu praktizieren.

Ist das Design endlich fertig hilft es ungemein das entstandene Bild erst einmal eine Weile auf sich wirken zu lassen und sich direkt Gedanken dazu zu machen, wie man dieses Ungetüm mit allen seinen Details in Quelltext verwandelt. Hierzu gibt es diverse Dienstleister, doch kostengünstiger und spaßbringender ist es, sich selbst an die Arbeit zu machen. Steht das grobe Grundgerüst ist der Moment gekommen sich die Spezifikationen für das gewählte Publishing-System anzusehen. Bei WordPress beispielsweise gibt es bei der Navigation für die Seiten eine CSS-Klasse, die automatisch an die Listenelemente gehängt wird, sollte die aufgeführte Seite aufgerufen werden. Also warum sollte man sich hier selbst eine ausgefeilte Lösung überlegen, wenn man vorhandene Sachen direkt nutzen kann?

Die technische Umsetzung oder das Spiel mit dem Feuer

Hat man es nun endlich geschafft nach Stunden des Fluchens aufgrund zickender Browser, Inkompatibilitäten oder nicht vorhandenen, aber dringend benötigter, Eigenschaften von HTML und CSS endlich einen zufriedenstellenden HTML-Dummy zu erstellen beginnt der Spaß erst richtig, denn nun beginnt die Implementierung.

Der erste Schritt sollte der sein den entstandenen HTML-Dummy in eine Standarddatei (bei WordPress die index.php im Ordner /wp-content/themes/dein-theme) zu kopieren und die CSS-, Javascript- und Bilddateien an die richtige Stelle zu bringen. Anschließend fängt man damit an den zuvor mühselig erstellten Quelltext zu zerlegen und in einzelne Dateien zu packen, die je nach benötigter Anzeige eingebunden werden. Statische Inhalte und dynamische Inhalte sollten ebenfalls strikt voneinander getrennt werden, um nicht zu einem späteren Zeitpunkt den Überblick zu verlieren.

Nach dem Zerlegen des Quelltextes sollte man mit dem existenziellsten Bestandteil der Website anfangen: der Navigation. Hat man diese umgesetzt und im Backend natürlich die entsprechende Struktur der Site angelegt fällt es schon um Meilen leichter zu den Seiten zu kommen, an denen man momentan entwickelt, da man sich umständliches Kopieren von Links, etc. sparen kann.

Nun liegt es im Ermessen des Entwicklers, ob er mit einer Inhaltsseite oder der Startseite weiter macht. Letztere ist in den meisten Fällen bei großen Projekten sehr schwierig umzusetzen, da hier viele Dinge aus dem System gleichzeitig angezeigt werden sollen. Im Großen und Ganzen empfiehlt es sich erst einmal die einfachen Dinge wie normale Inhaltsseiten oder Listentemplates umzusetzen und sich erst dann zu den wirklich schwierigen zu begeben.

Kleiner Tipp noch am Rande: Am Anfang geht alles sehr schnell, da man dank der leicht umzusetzenden Sachen schnell Fortschritte erzielt. Jedoch werden die Aufgaben immer schwieriger und zeitintensiver, je weiter man fortschreitet. Hier also nicht gleich frustrieren

Der eben genannte Tipp gilt natürlich auch dann, wenn mal nicht gleich etwas so funktionieren will, wie es soll. Je umfangreicher die zu bewältigende Aufgabe, desto schleppender geht es voran, aber das was zählt ist das Ergebnis. Und wenn dieses erzielt wird fällt jeder bisherige Stress ab wie Schuppen von den Augen. Ebenfalls eine zeitraubende Angelegenheit sind Dinge, die man beim Design vergessen hat oder neue, zusätzliche Anforderungen und Features. Auch hier gilt dann erst einmal überlegen, wie man dies angeht und dann anfangen Code zu schreiben.

Der Schluss vom Lied: Eine funktionierende Website

Sind alle Features implementiert und Anforderungen umgesetzt kann man sich ruhigen Gewissens zurücklehnen und sein Gesamtwerk betrachten. Jedoch sollte man selbst zu diesem Zeitpunkt das gesamte Projekt noch einmal grundlegend überdenken: Ist wirklich alles eingebaut? Gibt es noch Features, die praktisch wären? Wie sieht es mit der Usability aus? Hier hilft es meist das Projekt anderen Leuten zu präsentieren, die dann sehr oft noch diverse Tipps für Verbesserungen geben können, die man auch noch vor dem Onlinestart umsetzen sollte.

Erst dann, wenn wirklich alles funktioniert und niemanden beim schnellen Überflug etwas ins Auge fällt kann die Site online gehen. Eventuell nimmt man sich aber auch noch kurz vor dem Release etwas Zeit und beachtet meine Tipps zur Optimierung von Quelltext.

Wem das zu viel auf einmal ist kann auch einen Blick auf MiniAjax werfen. Das ist im Grunde genommen exakt das Gleiche, nur eben kleiner und übersichtlicher.

Und wenn wir schon bei zusätzlichen Features dank Ajax sind, sollte man beim Einbau solcher Skripts natürlich nicht vergessen diverse Fallbacklösungen einzubauen, da es auch Personen geben soll die Javascript nicht brauchen und es deshalb deaktiviert haben.

Diese Konkurrenz heißt Flowplayer und ist ein extrem anpassbarer, gut aussehender Player, der nebenbei auch noch viele Formate unterstützt, wie z.B. FLV, MP3, H.264 und sogar Bilder in den Formaten JPG und PNG.

Die Kernfeatures des Tools sind neben der großen Formatunterstützung eine flexible Konfiguration, progressiver Download (wie bspw. bei YouTube), Streaming, Thumbnails, Vollbild und Playlists. Zudem kann er stark an die eigenen Bedürfnisse angepasst werden durch eine Javascript-API und kann sogar von anderen Flashfilmen angesprochen werden. Und für diejenigen, die Werbung in ihren Filmen anbieten wollen gibt es auch diverse Möglichkeiten.

Alles in allem sieht der Player wirklich gut aus. Wer weiß, vielleicht verwende auch ich ihn mal in einem Projekt, wo sich sowas anbietet.

Sieht man momentan im Bugtracker nach sieht es aber noch recht mager aus. 302 geschlossene und über 500 offene Tickets lassen in meinen Augen wenig Hoffnung, dass alle Fehler bis zum Release beseitigt werden.

Aber selbst wenn noch ein paar Tickets übrig bleiben (hoffen wir, dass dies keine allzu groben Lücken sind) scheint diese neue Version einige interessante neue Features zu haben.

Features

Zum einen soll die Software insgesamt schneller sein als bisherige Veröffentlichungen. Natürlich können Plugins diese gewonnene Geschwindigkeit wieder zunichte machen, aber davon wollen wir mal nicht ausgehen.

Zum anderen soll der Cache überarbeitet werden. Momentan wird entweder alles gecached oder nichts. Will man Teile des Frontends vom Caching ausschließen muss man den Kern von WordPress hacken und das rächt sich spätestens beim nächsten Update.

Bisher waren Updates trotz der relativ leichten Installation sehr mühsam. Man muss alle Plugins deaktivieren, das Update einspielen und anschließend wieder alle Plugins aktivieren. Dies soll in der neuen Version anders werden. Steht eine Aktualisierung ins Haus kann man jetzt auf einen Button klicken, der alle Plugins deaktiviert und nach dem Update alle zuvor aktiven Plugins wieder reaktiviert.

Die größte Änderung jedoch hat das Backend erfahren. Hier präsentiert sich WordPress von nun an in einer edlen Optik mit einem überarbeiteten Dashboard und einer verbesserten Menüstruktur. Trotzdem finde ich das Design nicht unbedingt gelungen.

Das neue Backend

Das Dashboard sieht sehr gut aus. Dort ist alles schön übersichtlich und man sieht alles Wichtige auf den ersten Blick. Auch scheint es die Möglichkeit zu geben in den einzelnen Boxen diverse Feeds anzeigen zu lassen. So kann man die für sich wichtigsten, auf WordPress bezogenen RSS-Feed direkt anzeigen lassen und ist immer auf dem aktuellen Stand der Dinge.

Klickt man jedoch weiter stellt man sehr schnell fest, dass das Design zwar nett anzusehen, jedoch zum Arbeiten wenig geeignet ist. Hierfür fehlt der Kontrast zwischen den einzelnen Elementen. Man weiß manchmal fast nicht wo der eine Bereich aufhört und der nächste beginnt. Besonders auf Monitoren mit schwachem Kontrast könnte das sehr anstrengend für die Augen werden.

Besonders stark ausgeprägt ist dieser Effekt auf der wichtigsten Seite des gesamten Backends: Schreiben, bzw. Write. Die Boxen sind selbst auf meinem sehr hellen Bildschirm nur schwer voneinander zu unterscheiden. Zudem wurde die gewohnte Anordnung der Elemente verworfen, so dass nun die Auswahl für die Kategorie, Diskussionen und für den Slug nur durch nervendes Scrollen zu erreichen sind.

Eine, bzw. zwei positive Sachen gibt es auf dieser Seite trotzdem zu berichten: Das Textfeld lässt sich stufenlos vergrößern oder verkleinern und es gibt neue Buttons, mit denen man sehr einfach diverse Multimediainhalte einbinden kann. So kann man bspw. sehr einfach Bilder in seinen Einträgen einbetten. Anscheinden wird es dort auch die Möglichkeit geben Audiodateien oder Videos direkt einzubetten. Diese Funktionen sind aber zum jetzigen Zeitpunkt noch nicht funktionsfähig.

Im Bereich Verwalten, bzw. Manage sieht es sehr aufgeräumt aus. Hier hat man wieder sehr schnell alle nötigen Informationen erfasst. Doch auch hier fehlt meiner Meinung nach eine sehr wichtige Funktion. Derzeit kann man zwar schon nach Kategorie oder Veröffentlichungsmonat filtern, jedoch fehlt eine Sortierfunktion der Tabelle. So könnte man sehr schnell und einfach alphabetisch oder nach dem Autor sortieren.

Die Media Library- oder zu deutsch Uploads-Seite sieht irgendwie noch aus wie eine Mischung aus Version 2.3 und 2.5. Drumherum sieht alles neu aus, aber es gibt dort immer noch einen der momentan allzu bekannten blauen Balken mit Tabs darauf. Ansonsten sieht auch dieser Bereich sehr gut aus. Die Einstellungsmöglichkeiten für die vorhandenen Dateien sind umfangreich und leicht zu erreichen.

Der Bereich für die Kommentare ist womöglich derjenige, dem bisher am wenigsten Beachtung geschenkt wurde. Dort sieht man noch sehr viele unschöne Dinge, weswegen ich hierüber auch kein Urteil fällen kann.

Die Plugins-Seite sieht wie die Seite zur Verwaltung sehr aufgeräumt und gut aus. Am bekannten Schema hat sich hier nichts geändert. Grün hinterlegte Plugins sind installiert, weiß hinterlegte nicht.

Die Benutzer, bzw. Users-Seite sieht momentan ein klein wenig überladen aus. Es wird zwar klar, was was ist und was es bezweckt, aber es steckt alles auf einer einzigen Seite, was die Übersichtlichkeit erschwert.

Fazit

Alles in allem lohnt es sich das Update auf Version 2.5 zu wagen. Die neuen Features sind eine Bereicherung für die Arbeit mit der Software und das Design sieht gut aus. Wenn auch sehr kontrastarm, aber eventuell wird in dieser Richtung noch etwas geschraubt. Logischerweise kann ich hier nicht für alle sprechen, aber genau aus diesem Grund gibt es hier noch einen Link zur Demo der aktuellen Alpha-Version, wo sich dann jeder sein eigenes Bild davon machen kann. Zum Einloggen gibt es den Benutzer admin mit dem Passwort demo.