Yahoo! User Interface Blog (YUIBlog)

Was hat dich beim Aufbau einer Web-Schnittstelle zu iTunes interessiert? Oder ist das eine dumme Frage?

(Nein, nicht eine dumme Frage :)) Ich habe eine ansehnliche Sammlung Lied in meinem iTunes. Eine App für die Bereitstellung mich mit Web-Zugang schien mir eine nette Sache zu haben, und es würde mir die Möglichkeit, mit Web-und Desktop-Technologien in der gleichen Anwendung zu spielen.

Sie wählten YUI für viele der UI-Elemente in Ihre Anwendung. Welche spezifischen YUI-Komponenten verwenden Sie, und für welche Zwecke?

YUI Konsistenz sowie der anmutende Umnutzung von Komponenten accross das gesamte Ökosystem können Sie ganz einfach aufgreifen, jede neue Komponente, die Sie während das Projekt Fortschritte brauchen. Also ich habe versucht, mit YUI-nur festhalten, und ich musste mich woanders umsehen nur für den Flash-Player Lied, aus offensichtlichen Gründen.

pulpTunes produziert eine einzelne Webseite, deren Layout wird durch den erklärten Grids CSS lib. Keine Notwendigkeit von fiesen CSS-Hacks, und Sie können Ihre Seite garantiert das gleiche in allen gängigen Browsern aussehen. Dies ist einer meiner Lieblings-YUI-Bibliotheken, aufgrund der immensen Zeitersparnis und Seelenfrieden der ERGO.

Die Lieder-Liste ist eine DataTable von einem accompained Paginator , durch eine XHR Anschluss zugeführt. Anpassen der Tabelle und Seitenumbruch Aussehen war einfach nur durch Überschreiben einige CSS-Regeln aus dem Sam Haut, die sehr gut kommentiert ist. Die benutzerdefinierten Formatierer für die Rating-Spalte ist eine 3-Liner JavaScript-Code. Die Tabelle (und die Wiedergabeliste Abschnitt auf der linken Seite) nutzen die Menu-Komponente, um ein Kontextmenü zu zeigen, Operationen auf einem Musiktitel oder eine Wiedergabeliste durchzuführen.

Ich bin mit einem Slider -Komponente des Spielers Puffer einzustellen. Mit ihr Punkt, an dem Punkt im Download-Fortschritt Sie das Lied zu spielen beginnen wollen.

Es gibt nur wenige Popup-Meldungen und Dialoge in der App, die gerendert werden mit dem Container -Komponente.

Die meisten der YUI-Komponenten habe ich (es gibt 12) aus geholt yui.yahooapis.com in einer einzigen Anfrage durch die sehr bequem YUI Loader . Und natürlich, ich bin mit dem YUI Compressor auf 15k komprimieren die ein JavaScript-Datei, die alle der App-Logik hält.

Sie verwenden Dav Glass Effects Package zusätzlich zu YUI. Welche Funktionen werden Sie mit dem Zeichnen von Dav-Kollektion speziell?

Ich komme aus einem Prototype + Scriptaculous Welt, war ich sehr erleichtert fest, dass jemand bereits auf YUI all die tollen Effekte von Scriptaculous portiert. Und [da DAV ist ein Mitglied der] YUI Team, konnte ich über dessen Qualität sicher sein. Ich benutze die BlindDown und BlindUp Effekte zu zeigen, und blenden Sie die Songs Covern.

Eines der wichtigsten Elemente Ihrer Anwendung ist die DataTable, dass Sie die songlists Anzeige verwenden. Welche Erfahrungen haben wie der Bau eines XHR-fed DataTable mit JSON-Daten? Welche Lehren haben Sie gelernt, dass es wert sind mit anderen Entwicklern?

Die XHR Fütterung Teil war ziemlich einfach. Zwar erinnerte ich mich versucht, etwas HTML in der JSON-Antwort, die nicht funktionierte wieder, aber das sah aus wie ein Browser-Bug.

Nummerierung und Sortierung war einfach wie gut, aber ich musste, um eine benutzerdefinierte Funktion GenerateRequest bieten, denn wenn ich mich recht erinnere, übernimmt YUI die Aufzeichnungen seit der ersten Anfrage an den Server sortiert werden sollen, und in meinem Fall wollte ich, bis der Benutzer warten tatsächlich auf eine Spaltenüberschrift, um zu starten Rückkehr sortierten Datensätze geklickt.

Ich hatte auch einige Probleme auf den ersten, wenn die versuchen, bestimmte Datensätze in der Tabelle abrufen, aber dann merkte ich, die Existenz einer ganzen Reihe von Hilfsmethoden nur dafür, wie getTrEl() und getRecord() , die nicht in der allgemeinen Dokumentation erwähnt . Also mein Rat ist offensichtlich, dass Ihr die gesamte API lesen für jede Komponente, die Sie tun wirst schwere Arbeit auf.

pulpTunes ist ein SourceForge-Projekt . Sie suchen eine Gemeinschaft von Entwicklern zu bauen, um an dem Projekt mit Ihnen zu arbeiten?

Ja, das ist die Idee. Ich bin auch mit SourceForge für die Bugs und Feature Requests verfolgen, so dass jede Art von Feedback der Anwender ist auch willkommen. Grafische Designer sind ebenso eingeladen, wenn sie, um zusätzliche Skins für die App zur Verfügung stellen möchten.

Was kommt als nächstes für pulpTunes?

Es war nur wenige Tage, da die erste stabile Version ist out, und die Resonanz war überwältigend. Ich glaube, ich habe schon eine ziemlich gute Vorstellung der wichtigsten Merkmale für die nächste Version: Benutzerauthentifizierung, suchen, Shuffle und Repeat-Tasten und die Fähigkeit, Musiktitel bewerten.