Der Interaktionsdesigner 2020

Mai 2009

Mein Git Tutorial

Der letzte Schrei bei der Versionskontrolle ist Git. Entwickelt von Linus Torvalds, dem Erfinder von Linux, ermöglicht es das Arbeiten auf eine viel flexiblere Art und Weise als SVN. Die Punkte die mich überzeugt haben sind:

  • es muss sehr schnell sein, um mit der großen Code-Masse klarzukommen * nicht jeder darf Patches integrieren, sie müssen vorher durch einen Maintainer kontrolliert werden * das System muss dezentral arbeiten, um einerseits Bandbreite und Performance zu sparen und damit andererseits nicht bei einem Ausfall die ganze Entwicklung still steht (Quelle: Online-Tutorials.de) Nun stellt sich natürlich die Frage wie Git mit Mac OS X zusammenarbeitet, wie man es installiert und seine Projekte in ein Repository packt. Dieser Artikel will das verständlich, kurz und auf deutsch erklären. Letzte Kontrolle der Aktualität: 08 / 2011
Mai 2009

IMAP Postfächer mit CakePHP abfragen

Für ein aktuelles Projekt musste die Anwendung per IMAP auf ein Postfach zugreifen und die Mails auslesen. Das einzige Plugin welches ich gefunden habe war für CodeIgniter, benutzte aber glücklicherweise wenig Corefunktionen was es ermöglicht hat es für CakePHP zu portieren. Es ist jetzt also sehr leicht möglich die Mails aus einem Postfach auszulesen. Im folgenden Beitrag wird gezeigt wie.

Mai 2009

Das komplette HTML eines Elements mit jQuery auslesen

Klingt komisch, ist aber ab und zu ganz nützlich. Worum geht es? Im Elementstack von jQuery liegt ein Element welches an einem anderen Ort wieder eingefügt werden soll. So sieht das HTML Element aus: [code lang=”html”]<a href=”#” id=”ein-interner-link”>Ein <span>wichtiger</span> Link</a> Natürlich wird das Element ausgewählt und das HTML mit der Funktion html ausgelesen. [code lang=”javascript”]$(“#ein-interner-link”).html(); Diese Abfrage liefert allerdings das hier: [code lang=”html”]Ein <span>wichtiger</span> Link Das ist nicht das gesamte HTML, sondern nur das innerHTML. Im folgenden Artikel gibt esdie Lösung. Oder direkt zur verbesserten Lösung.

April 2009

Mit CakePHP in 30 Minuten Tags zu einer Tabelle hinzufügen

Im Web 2.0 geht nichts mehr ohne Tags. Und ohne ein Rapid Development Framework kann das ganz schön haarig werden. Zum Glück springt CakePHP mit leuchtenden Augen (oder waren es die Augen des Entwicklers?) in die Bresche und begeistert mit sehr einfachen Umsetzung. Mit der folgenden Anleitung bekommt ein beliebiges Model die Möglichkeit Tags zu speichern, inklusive Has and belongs to many Beziehung.

April 2009

Mit jQuery und CakePHP voneinander abhängige Selectboxen

CakePHP ist genial, nicht nur was die Erstellung von Formularen angeht. Aber leider setzt der integrierte AjaxHelper Prototype voraus und als überzeugter jQuery-Nutzer kommt das für mich nicht in Frage. Nun gibt es aber beim aktuellen Projekt folgendes Problem: Einem Projekt wird ein Kunde zugeordnet und jedes Projekt kriegt einen Ansprechpartner. Dieser Ansprechpartner ist in der User-Datenbank gespeichert und besitzt eine ID zu einem Kunden. Legt man ein neues Projekt an und wählt einen Kunden aus, sollen nur noch die passenden Ansprechpartner angezeigt werden. Nichts leichter als das! Hier stelle ich meine sehr flexible Möglichkeit für die Umsetzung mit jQuery und CakePHP vor. Grundwissen allerdings vorrausgesetzt.

April 2009

Der beste, native Twitter-Client für OSX

Ja, ich bin dabei. Folge meinen Updates unter http://www.twitter.com/paul_lunow. Ich bin eingestiegen in die Welt des Microbloggings. Als voll aktiver Mitbewohner der Web 2.0 WG darf Twitter im Portfolio natürlich nicht fehlen. Dabei habe ich nicht immer so gedacht. Lange habe ich jede Umfrage lächelnd mit der Antwort “Den Mist brauche ich nicht” beantwortet und bin weiter gezogen. Aber das hat sich geändert! Twitter rückt mehr und mehr in den Webmittelpunkt und mit einer guten Auswahl von Menschen deren Updates man folgt, erhält man viele lustige oder nützliche Informationen. Ein paar Autoren von Fachbüchern sind ebenfalls dabei und während man ihr Buch ließt kommt eine Nachricht wie “Mache Glühwein warm, von wegen Frühling”, dass macht es menschlicher, näher. Und man wird immer wieder überrascht. Zum Beispiel von den Drei Fragezeichen oder Fettes Brot. Alle dabei. Und zu guter Letzt ist es ein nettes Gefühl zu wissen, nein zu lesen(!), dass man nachts um halb 2 nicht der einzige ist, der vor dem Computer sitzt und sich mit Dingen beschäftigt die bei Stromausfall keine Sau interessieren. Also los gehts! Allerdings hat wohl niemand Lust ständig Neuladen auf der Twitterseite zu drücken. Deshalb braucht man einen guten Twitter-Client: Ein kurzer Test mit Schreenshots, Links und persönlicher Empfehlung folgt in diesem Artikel.

März 2009

Layout mit 100 Prozent Höhe

Diesmal geht es die Höhe von Div-Containern. Findige Designer haben sich ausgedacht ein Layout zu basteln, welches eine Fußzeile besitzt die immer am unteren Bildschirmrand klebt. Es sei denn der Inhalt ist größer, dann muss die Fußzeile mit runterrutschen. Soweit kein Problem; vor einiger Zeit habe ich ein schönes Beispiel gefunden welches genau diese Problem löst, in allen Browsern und nur mit CSS. Was aber, wenn die Seite mit dem 960 Grid System CSS Framework aufgebaut wurde und nicht nur ein Footer hat sondern zwei? Um genau zu sein, ist die Breite vom CSS Framework auf 960 Pixel beschränkt, der Footer mit Inhalten befindet sich innerhalb des umfassenden Containers, aber die Hintergrundgrafik soll über die gesamte Breite gehen. Unmöglich? Niemals! Es folgt eine Skizze, der Lösungsansatz und ein paar Worte über das 960.gs.

März 2009

Cooles Templatesystem für PHP

Ich habe ein paar Stunden in ein Templatesystem für PHP investiert. Vorher habe ich mir natürlich Smarty und viele weitere Lösungen angesehen, aber keiner der Ansätze hat mich so richtig glücklich gestimmt. Marker, wie in TYPO3 mit “ausgedachten” Zeichen zu umgeben, um anschließend eine neue Syntax für Schleifen und Bedingungen zu lernen, finde ich zu kompliziert. Außerdem habe ich mich hier im Blog schon einmal positiv über die Kurzschreibweisen von PHP geäußert. Da ist es natürlich nur noch ein kleiner Schritt zu einer funktionalen Klasse, welche ein PHP Template mit Inhalt befüllt. Im folgenden Beitrag stelle ich meine einfach zu nutzende Möglichkeit vor. Es ist mein erster Ansatz Richtung Template und ich freue mich sehr über Kommentare und Verbesserungsvorschläge!

März 2009

Animierte Header mit TYPO3 und jQuery

Viele schöne Seiten präsentieren großflächige und hochauflösende Bilder. Natürlich wollen unsere Designer das auch und damit der geneigte Besucher Abwechslung bekommt und die Bilder mit dem Inhalt der Seite harmonieren können, wird die Seite mit TYPO3 aufgebaut und die Kopfbilder über die Seiteneigenschaften (Ressourcen / Dateien) selbst gepflegt. Soweit kein Problem und schon tausendmal implementiert. Aber wie sieht es aus, wenn der Redakteur mehrere Bilder auswählt? Na logisch: auf der Seite werden sie sehr sanft übergelendet (fadeIn, fadeOut). Und klar, das passiert natürlich mit jQuery und dem genialen **Plugin innerfade **von den medienfreunden. Diese Technik eingesetzt findet sich zum Beispiel auf der Seite zur Ausstellung über Audrey Hepburn.

März 2009

WordPress Benutzeranmeldung im Frontend

Neue Benutzer können sich bei WordPress bequem anmelden, wenn bei den Einstellungen die entsprechende Checkbox angeklickt wurde. Allerdings können sich die Benutzer nur im Backend anmelden, und das ist doch alles andere als elegant. Außerdem kann der Benutzer nur seinen Namen und eine E-Mailadresse angeben. Weitere Daten werden nicht abgefragt und das Passwort automatisch generiert. Suboptimal. Es gibt das Plugin Register Plus welches auf vielfältige Art erlaubt das Registrierungsformular zu erweitern (auch mit eigenen Feldern). Aber trotzdem befindet sich das Teil noch im Backend. Aber das muss nicht so bleiben.

Februar 2009

Automatisch erkennen wie CSV Dateien aufgebaut sind

CSV Dateien sind z.B. Exports aus Datenbanken oder Excel. Der Name steht für _Comma-Separated Values _und bedeutet, dass die Werte von einem Komma getrennt sind. Damit kann man einfach eine CSV importieren und zum Beispiel in PHP weiter verarbeiten. Tja, einfach ist das natürlich nicht und jedes Programm erstellt andere CSV Dateien. Ich habe eine Funktion geschrieben die versucht automatisch zu erkennen wie eine CSV Datei aufgebaut ist. Hier ist eine Demo und im folgenden Artikel kommt die Funktionsweise.

Februar 2009

jQuery UI Progressbar und PHP verbinden

Der neuste Release Candidate vom jQuery Userinterface 1.6 ist genial! Vor allem das neue Element, die Progressbar, hat es mir angetan. Die Bedienung ist sehr einfach, einem Element wird die Progressbar zugewiesen und die Bar dehnt sich in den gegebenen Proportionen automatisch aus. Herrlich und sehr einfach mit einer Schleife in JavaScript zu verändern. Aber wie um alles in der Welt kriegt man die Bar dazu den aktuellen Status einer langwierigen PHP Operation wider zu spiegeln? Ich habe eine ganze Weile herumprobiert und das folgende ist dabei heraus gekommen. Hier ist die Demo und im Beitrag folgt die Beschreibung.

Februar 2009

Seiteninhalte einer Seite in einem Marker ausgeben

Der Titel klingt etwas komisch, aber die Funktion an sich ist super praktisch. Worum geht es? Es gibt verschiedene Situationen in denen Inhalte vom Redakteur gepflegt werden sollen, die z.B. auf jeder Seite auftauchen sollen. Aktuell hatten wir das mit einem Copyright Hinweis der auf jeder Seite erscheinen “musste”. Die erste Idee war, es einfach fest ins Template zu schreiben, aber das ist natürlich super unpraktisch bei Mehrsprachigkeit und der “Workflow” des Redakteurs ist alles andere als optimal. Also wird der Inhalt**einer versteckten Seite in ein Marker transportiert **und im Template ausgegeben. Ganz einfach!

Februar 2009

Voneinander abhängige Selectboxen mit jQuery

Folgendes Szenario: Für einen Kunden gibt es ein sehr umfangreiches Formular mit einer Menge Eingabemöglichkeiten, die voneinander abhängig sind. Zum Beispiel bedeutet die Auswahl von “monatlich”, “vierteljährlich”, “halbjährlich” und “jährlich” eine Veränderung der Auswahlbox von Monaten (0-11). Wählt man “halbjährlich” darf nur noch 0 oder 6 ausgewählt werden. Nichts leichter als das, habe ich gesagt, jQuery kann schließlich alles. Töten wir den Internet Explorer? Nein, das können wir nicht (bla bla), dann wirds halt etwas komplizierter.

Februar 2009

CSS Dateien mit jQuery nachladen

Diesmal kurz und knackig ein wirklich praktischer Tipp! Als verantwortungsvoller Webentwickler lege ich natürlich eine print.css an und versuche dem Kunden zu erklären, dass ein Ausdruck der Seite anders, aber super gut aussieht und das der aktuelle Webstandard ist und unbedingt eingesetzt werden sollte. Aber die Antwort ist dann: “Das versteht doch kein Mensch. Können Sie nicht einfach einen Button einrichten um die Vorschau anzeigen zu lassen? Nach meinen Erfahrungen müsste das einfach zu machen sein.” Jaja… nicht aufregen. Lieber über die neue Aufgabe freuen und darüber bloggen: Wie und warum man eine CSS Datei dynamisch nachladen kann. Getestet in Firefox, Safari, IE6 und 7.