Yahoo! User Interface Blog (YUIBlog)

Rey Bango von Ajaxian Interviews YUI Entwickler Adam Moore, Satyen Desai, und Luke Smith

30. April 2010 um 13.25 Uhr von Eric Miraglia | In Vermischtes | 2 Kommentare

Rey Bango von Ajaxian (und Microsoft) besuchte Yahoo! letzte Woche , und er hat geschrieben seinem Interview von YUI Mitglieder des Kernteams Adam Moore, Satyen Desai, und Luke Smith. Check it out auf seinem Blog oder im embed unten.

Finden Gespräche: Bloglines | technorati

Teilen und zu erweitern: Lesezeichen mit del.icio.us | Digg it! | reddit!

In der YUI 3 Gallery: Peter Peterson Bewertungen Widget

28. April 2010 um 08.46 Uhr von Peter Peterson | In Entwicklung , YUI 3 Galerie | 4 Kommentare

Ich wollte meine Füße nass mit dem Abschluss Widget-Infrastruktur in YUI 3.1.0 vorgestellt, und ich habe immer das Gefühl, der beste Weg, dies zu tun ist, um einen Code zu schreiben. Ich wollte etwas einfach, und ich stellte fest, dass in einem CSS-Umsetzung ich auf Bewertungen gefunden Komodo Medien . Die daraus resultierende Widget ist die YUI3 Bewertungen Widget ( Demo ). Der Großteil der Arbeit des Widgets wird durch CSS behandelt und ist in der Komodo Medien Artikel beschrieben. Das einzige Problem mit diesem Widget, war einst ein Rating gewählt wurde, nichts wirklich passiert, wenn die Seite neu geladen wurde, und wenn das Widget den Fokus verloren, verlor es seine Bewertung. Hier setzt das YUI 3 Gallery Bewertungen Widget kommt in.

Meine Ziele für das Projekt waren:

• Der Code für das Widget sollte gerade genug, um über die Grundlagen für, wie man eine YUI 3 Widget zu erstellen berühren
• Das Widget würde schrittweise Verbesserung der Seite
• Die Interaktion des Benutzers mit dem Widget lässt sich leicht gefangen
• Fügen Sie eine klare Rating-Taste die es nicht gibt in dem ursprünglichen Entwurf
• Das Widget zugänglich sein sollten für Menschen mit Screen-Readern
• Machen Sie die Instanziierung und Interaktion mit dem Widget einfach tot mit so wenig Code wie möglich.

Es ist leicht, die Bewertungen Widget auf Ihre Seite mit dem YUI Loader hinzugefügt:

 YUI ({
     Galerie: "Galerie-2010.04.14-19-47 '
 }). Verwenden ('Galerie-Ratings', 'Ereignis', function (y) {
     / / Programm-Logik ...
 });

Sie brauchen auch die Bild-Assets und CSS-Datei befindet sich auf GitHub oder von Ihrer eigenen Kopie der Galerie.

Fügen Sie einfach einen Knoten in Ihrer Quelle, die das aktuelle Rating (eine beliebige Zahl zwischen 0 - 5) enthält oder leer ist.

 <span id="myWidget"> 2,5 </ span>

Anschließend können Sie instanziieren Sie das Widget mit dem folgenden Code in der Sandbox:

 var = new myRating Y.Ratings ({srcNode: "# mywidget"});
 myRating.render ();

Ich fühlte, dass es wichtig sei, um dieses Widget einfach anzupassen und so fügte ich noch einige wenige Einstellungen an den Konstruktor. inline wenn auf true gesetzt wird das Rating mit Inline-Text auf der Seite (Standardwert false) angezeigt werden. skin kann so eingestellt werden " klein ", um die Größe des Widgets (Beispiel verringern: )

Für sich allein hat die Ratings Widget wenig mehr, dass die Rating-Interaktion für den Benutzer festgelegt. Ein wenig mehr Arbeit getan werden muss, um tatsächlich den Wert verwenden. Ich verlasse, dass bis zu den Implementierer zu prüfen; ob ein Rückruf auf das Ereignis gefeuert hinzuzufügen, wenn die Rating-Änderungen, oder ein Plugin, um das Widget zu liefern, um es automatisch zu behandeln. Um Ihnen den Einstieg, wenn eine Bewertung der geändert wird ratingChange Ereignis ausgelöst wird. Es ist einfach einzurichten einen Ereignis-Listener, die fangen ratingChange Veranstaltung für alle Widgets auf der Seite. In diesem Beispiel ist, melden Sie ich das Rating Widget srcNode 's-ID, das bisherige Rating, und das neue Rating für jede Rating-Widget auf der Seite, wenn die Rating-Änderungen:

 Y.on ("Ratings: ratingChange", function (e) {
   var id = e.target.get ("Contentbox") bekommen ("ID").;
   Y.log (id + "Neuer Wert:" + + e.newVal "war:" + e.prevVal);
 });  

Zukünftige Ideen für das Projekt:

• Schrittweise zu verbessern Formelemente
• Machen Sie das klare Urteil Schaltfläche optional
• Machen Sie den Leistungsbereich konfigurierbaren
• Weitere Skins und Kombination der CSS-Sprites
• Internationalisierung

Finden Gespräche: Bloglines | technorati

Teilen und zu erweitern: Lesezeichen mit del.icio.us | Digg it! | reddit!

Cinco de NodeJS - Mays BayJax feiert Server-Side JavaScript mit Ryan Dahl, Elijah Insua und Dav Glass

27. April 2010 um 11:23 Uhr von Eric Miraglia | In Entwicklung , YUI Events | 3 Kommentare

BayJax Veranstalter Gonzalo Cordero hat angekündigt, dass es an der Zeit für einen anderen BayJax , und dieses Mal feiern wir die Explosion der Server-Side JavaScript mit Cinco de Node.js bei Yahoo!. Wir haben drei fantastische Redner: Ryan Dahl, der Schöpfer der Node.js; Elijah Insua, der Schöpfer von einer der großen DOM-Knoten für Abstraktionen, und Dav Glass, ein YUI-Ingenieur, der seit Blogging über seine Arbeit bekommen YUI 3 läuft unter Node hat.

Bitte besuchen Sie uns am 5. Mai @ Yahoo! HQ 17.30 bis 09.00 Uhr Als Gonzalo es ausdrückt: "Sombreros, Ponchos und luchador Outfits sind erwünscht." RSVP auf dem BayJax Meetup Seite .

Ryan beschreibt seine Rede so:

Es ist bekannt, dass Event-Schleifen statt Fäden für Hochleistungs-Server erforderlich sind. Javascript ist eine Sprache, unbelasteten von Fäden und spezifisch mit asynchronen verwendet werden ausgebildet evented I / O, so dass es ein attraktives Mittel der Programmierung Server-Software. Node.js zusammenhält den V8-Javascript-Compiler mit einem Ereignis-Schleife, eine Thread-Pool für die Herstellung Blockiersystem Anrufe und einer sorgfältig konstruierten HTTP-Parser, um einen Browser-ähnliche Oberfläche zu schaffen, schnelle Server-Side-Software zur Verfügung stellen. Dieser Vortrag wird erklärt, Node Design und wie man mit ihm anzufangen. "

Elia, der in New York von skypen werden, wird über sein Projekt, sprechen jsdom , die die wesentlichen DOM-Abstraktionen, die Client-Seite, DOM-abhängige JavaScript, um unter Node.js. ablaufen zu lassen bietet Dies ist ein wichtiger Bestandteil des Paradigmenwechsels, so dass Ebenen der Server-und Client-Seite die Wiederverwendung von Code nie zuvor möglich war und damit Progressive Enhancement eine natürliche, effiziente Auswuchs unserer Entwicklungsumgebung sein.

Dav wird dieses Thema voranzubringen, zeigen konkret, wie das Fundament der Node.js, die Abstraktionen in jsdom, Dav und die eigene Arbeit zu BOM Features hinzufügen, um jsdom ermöglichen eine vollständige Umsetzung wie YUI, einen Teil der enormen Versprechen dieser Art illustrieren der Entwicklung. Sie können über Dav die Arbeit hier auf YUIBlog (lesen Sie Teil 1 , Teil 2 ).

Informieren Sie sich über Vergangenheit BayJax Meetups

Gonzalo hat eine große Reihe von BayJax Ereignisse der letzten Zeit organisiert. Haben Sie welche? Hier sind die YUI Theater Links für die neueste in der Reihe:

• Nicholas Zakas, Stoyan Stefanov, Ross Harmes, Julien Lecomte, Matt Sweeney: High Performance JavaScript - Fünf Beiträge zur High Performance O'Reillys JavaScript discuss erweitertem JavaScript und DOM-Scripting Optimierungen am April 2010 BayJax Meetup bei Yahoo.
• John Resig: Testing, Performance-Analyse und jQuery 1.4 - John Resig von Mozilla, Entwickler der populären JavaScript-Bibliothek jQuery, Testberichte Optionen für Test-und Performance-Analyse in JavaScript und Previews die wesentlichen Änderungen in Kürze in jQuery 1.4.
• Brad Neuberg: Einführung in HTML5 - Brad Neuberg von Google bietet eine breit angelegte Einführung in HTML5, wie es in modernen Browsern, darunter Features wie SVG / Canvas, dem Video-Tag, die Speicherung in Datenbanken, App-Cache und mehr umgesetzt werden.

Finden Gespräche: Bloglines | technorati

Teilen und zu erweitern: Lesezeichen mit del.icio.us | Digg it! | reddit!

In the Wild für 24. April 2010

24. April 2010 um 06.57 Uhr von Eric Miraglia | In In the Wild | Kommentare deaktiviert

Nach einer weiteren schönen Ausgabe des YUI: Öffnungszeiten am Freitag , wir runden diese Woche mit nur ein paar Notizen letzten Notizen und Implementierungen aus dem YUI-Entwickler-Community:

• YUI 2 auf Discovery.com : Discovery Channel Rich-Media-Website nutzt YUI 2.8.0 Animation und Connection Manager, unter anderen Komponenten.
  
• YUI 3/Node.js Arbeiten Bewertet von @ dalmaer: "Oh, und YUI 3 schon einen Nizza These Days" : Dion Almaer wirft einen Blick auf Dav Glass 'YUI 3/Node.js Arbeit in Ajaxian. Schreiben die Dion: "Oh, und YUI3 ist wirklich nett, sucht in diesen Tagen. Eine schöne Balance zwischen einem netten API + wirklich gut aussehende Widgets + a Crockford's-wert der Sicherheit Pflege. "
  
• YUI 2 auf RealCyclist.com : In meinem Alter, wenn die Straße steil bringt Sie auf die Suche nach einem leichteren Bike. (Weniger essen kann billiger sein, aber es ist weniger Spaß.) Und wenn Sie schauen auf RealCyclist.com , können Sie auf einer Website durch eine breite Palette von angetrieben einkaufen YUI 2 Komponenten. Auf einem verwandten Thema BonkTown - ist auch YUI-powered, und Sie abholen können Gegenstände wie Überschuhe, die Ihre Füße mehr aerodynamische in einem Zeitfahren zu machen - ein Schnäppchen vor Ort für Radfahrer.
  
• Kostenloser Test-tracker Cuanto mit YUI 2 DataTable, Tabs, Gebinde : Todd Wells schrieb uns über Cuanto sagen: " Cuanto ist ein kostenloses Tool zum Speichern von automatisierten und manuellen Testergebnisse, organisieren sie in logischen Gruppen, die Analyse der Natur der einzelnen Test- Ausfälle, und mit den daraus resultierenden Daten zu nützlichen Statistiken liefern. Es nutzt die YUI-2-Bibliothek ausführlich, einschließlich Container, Event, DataTable, Button und TabView. "( Original-Quelle. )
  
• Führen Sie ein PHP Script im Hintergrund mit AJAX [und YUI] : Mindraven hat einen Beitrag zu skizzieren , wie man PHP-Hintergrund-Tasks starten mit Thomas Shas YUI Connection Manager .
  
• Spanische Sprache Einführungen in YUI auf DesarrolloWeb.com : Das Team von DesarrolloWeb.com haben zusammen eine Reihe von vier spanischsprachige Artikel introducting Webentwickler YUI , YUI 3 , einfache Ereignisse , und das Hinzufügen / Entfernen CSS-Klassen in YUI . Ihre YUI Handbuch "una serie Pretende ofrecer de artículos teóricos prácticos y de las Librerías YUI, UN-Rahmenkonvention Javascript CSS y."
• Y! Suche Ingenieur @ BRETTS schreibt über seine äußere Ereignisse Galerie-Modul : Brett Stimmerman von Yahoo! Search dicsusses seine neue äußere Ereignisse Modul für das YUI 3 Galerie. Außerhalb Events "können Elemente bis auf DOM-Ereignisse, die außerhalb von ihnen auftreten zu abonnieren. Ein Ereignis tritt außerhalb des Teilnehmers, wenn das Ziel nicht die Teilnehmer selbst, oder der Teilnehmer-Vorfahren. "( ursprüngliche Quelle. )
  

Wie viel haben wir vermissen? Lassen Sie uns wissen, via @ yuilibrary oder in den Kommentaren unten (wenn du dich fühlst retro).

Bleiben Sie dran: Rey Bango aus Ajaxian gestoppt gestern von Yahoo und verzeichnete ein Video-Interview mit YUI Ingenieure Luke Smith, Satyen Desai und Adam Moore. Das Session, plus ein Gespräch mit BayJax Veranstalter Gonzalo Cordero, sollte auf Ajaxian laufen in der kommenden Woche.

Finden Gespräche: Bloglines | technorati

Teilen und zu erweitern: Lesezeichen mit del.icio.us | Digg it! | reddit!

YUI Theater - Adam Granicz: "Robust und Rapid Web Development mit WebSharper" (57 min.)

23. April 2010 um 20.49 Uhr von Eric Miraglia | In Entwicklung , YUI Theater | 2 Kommentare

Adam Granicz gestoppt durch Yahoo! zu Beginn dieser Woche, darüber zu sprechen der F #-Programmiersprache und deren Verwendung in Web-Anwendungsentwicklung.

Granicz Firma, Intellifactory , produziert die WebSharper Plattform. WebSharper füllt die Rolle in der F #-Community, dass GWT und ähnliche Werkzeuge in der Java-Community zu füllen und verspricht eine stark typisierte, schnell, eng integrierte Entwicklung Erfahrung mit Einsatz, um Rich-Web-Anwendungen. Als Fybit die Riatrax4JS und yui4java für Java-Entwickler tun, bringt WebSharper die Macht der YUI 2 bis F #-Entwickler, so dass eine breite Palette von YUI Widgets zur Verfügung.

Wenn das Video einbetten unten nicht richtig dargestellt wird in Ihren RSS-Reader der Wahl, achten Sie darauf, klicken Sie sich durch, um die hochauflösende Version des Videos auf YUI Theater zu sehen .

• Download-HD-Videos (480p ~ 572MB)
• Video herunterladen (M4V)

Andere Recent YUI Theater Videos:

• Nicholas Zakas, Stoyan Stefanov, Ross Harmes, Julien Lecomte, Matt Sweeney: High Performance JavaScript - Fünf Beiträge zur High Performance O'Reillys JavaScript discuss erweitertem JavaScript und DOM-Scripting Optimierungen am April 2010 BayJax Meetup bei Yahoo.
• Douglas Crockford: Crockford über JavaScript - Teil 5: The End of All Things - Yahoo! 's JavaScript Architekt Douglas Crockford schließt seine fünfteilige Vortragsreihe an der Programmiersprache JavaScript mit einer Überprüfung der Fragen im Zusammenhang mit Sicherheit und Leistung in JavaScript.
• Douglas Crockford: Crockford über JavaScript - Episode IV: Die Metamorphose der Ajax - Yahoo! 's JavaScript Architekt Douglas Crockford setzt seine Vortragsreihe über die JavaScript-Programmiersprache mit einer Analyse des Document Object Model (DOM) und eine Auseinandersetzung mit Ajax.
• Douglas Crockford: Crockford über JavaScript - Act III: Funktion der Ultimate - Yahoo! 's JavaScript Architekt Douglas Crockford setzt seine Vortragsreihe über die Programmiersprache JavaScript mit einer Diskussion der Funktionen in JavaScript. 'Funktionen sind die besten Teil von JavaScript,' sagt Crockford. "Es ist, wo die Macht ist, ist es, wo die Schönheit ist." Sehen Sie das Video an, warum lernen.
• Douglas Crockford: Crockford über JavaScript - Kapitel 2: And Then There Was JavaScript - Yahoo! 's JavaScript Architekt Douglas Crockford einen Überblick über die Features der Programmiersprache JavaScript.
• Douglas Crockford: Crockford über JavaScript - Volume 1: The Early Years - Douglas Crockford stellt die Programmiersprache JavaScript in den richtigen historischen Kontext, Rückverfolgung der Sprache die Struktur und Konventionen (und einige seiner Macken) zurück zu ihren Wurzeln in den frühen Jahrzehnten des Computers Wissenschaft.

Abonnieren von YUI Theater:

• YUI Theater RSS-Feed
• YUI Theater auf iTunes

Finden Gespräche: Bloglines | technorati

Teilen und zu erweitern: Lesezeichen mit del.icio.us | Digg it! | reddit!

YUI: Öffnen Sie Stunden für Freitag, 23 April

22. April 2010 um 12.32 Uhr von Luke Smith | In Entwicklung | 4 Kommentare

Die nächste Rate in Höhe von YUI: Öffnungszeiten ist morgen, Freitag der 23.!

Die ersten Öffnen Sie Stunden war ein riesiger Erfolg, mit etwa 30 Menschen, die sich in einigen großen und Gespräch und Feedback sowohl für Lauren Smith YUISand Galerie-Modul sowie für YUI.

12.00 Uhr PDT - Die Zeit wird die gleiche wie zuvor, 10.00 Uhr sein. Der primäre Punkt der Tagesordnung für diese Woche wird eine Einführung und Überprüfung von Code sein Ferraiuolo Eric 's Gallery Component Manager-Modul . Ich bin auch bald anfangen Öffnen der Gespräche mit einem "YUI 3 Tipp oder Trick" der Arten.

Diese Woche werden wir von Kollegen YUIer verbunden werden Satyen Desai ( @ dezziness ), der leitende Architekt hinter dem Attribut , Base- und Widget -Infrastruktur Stücke in YUI 3. (Wenn Sie möchten, dass Satyen vor der Veranstaltung gerecht zu werden, können Sie auf, dass YUI Theater zu tun .)

Wie zuvor, ist der Plan, mithilfe von Adobe Connect für Screen Sharing und Voice over tun einer Konferenz Brücke. Dies ist die Info für den Beitritt in:

1. Wählen Sie sich in 1-888-371-8922 (Teilnehmer außerhalb der USA, mailen Sie mir für eine lokale Nummer)
2. Geben Sie den Teilnehmer-Code 47188953
3. Join the Screen-Sharing-Sitzung (dies wird Sie auffordern, die Adobe Connect-Plugin zu installieren, wenn dies Ihre erste Mal benutzen)

Und wie bei der ersten YUI erwähnt: Öffnungszeiten, können Sie immer auf dem Zeitplan der anstehenden Themen und durch folgenden Termin @ yuilibrary auf Twitter oder abonnieren Sie den YUI Veranstaltungskalender .

Wenn dies das erste Sie über YUI gelesen haben: Öffnen Sie Stunden, es ist ein offenes Forum mit mir selbst und anderen YUI Team-Mitglieder und einige große Geister aus der YUI-Community. Sie können mehr darüber lesen Sie hier .

Wir hoffen, Sie dort zu sehen!

Finden Gespräche: Bloglines | technorati

Teilen und zu erweitern: Lesezeichen mit del.icio.us | Digg it! | reddit!

YUI Theater - Nicholas Zakas, Stoyan Stefanov, Ross Harmes, Julien Lecomte, Matt Sweeney: "High Performance JavaScript" (92 min.)

21. April 2010 um 10:36 Uhr von Eric Miraglia | In Entwicklung , YUI Theater | Kommentare deaktiviert

Die April-Ausgabe 2010 des BayJax Meetup bei Yahoo! vorgestellten fünf Lautsprecher sind allesamt Co-Autoren auf der neuen High Performance JavaScript Volumen von O'Reilly ( kostenlos Kapitel finden Sie hier ). Es waren etwa 200 Teilnehmer füllen die URLs Cafe im Herzen von Yahoo!, und sie hörten fünf deutlich interessanter übernimmt web-app Leistung.

Wenn das Video einbetten unten nicht richtig dargestellt wird in Ihren RSS-Reader der Wahl, achten Sie darauf, klicken Sie sich durch, um die hochauflösende Version des Videos auf YUI Theater zu sehen .

• Download-HD-Videos (480p ~ 572MB)
• Video herunterladen (M4V)

Andere Recent YUI Theater Videos:

• Douglas Crockford: Crockford über JavaScript - Teil 5: The End of All Things - Yahoo! 's JavaScript Architekt Douglas Crockford schließt seine fünfteilige Vortragsreihe an der Programmiersprache JavaScript mit einer Überprüfung der Fragen im Zusammenhang mit Sicherheit und Leistung in JavaScript.
• Douglas Crockford: Crockford über JavaScript - Episode IV: Die Metamorphose der Ajax - Yahoo! 's JavaScript Architekt Douglas Crockford setzt seine Vortragsreihe über die JavaScript-Programmiersprache mit einer Analyse des Document Object Model (DOM) und eine Auseinandersetzung mit Ajax.
• Douglas Crockford: Crockford über JavaScript - Act III: Funktion der Ultimate - Yahoo! 's JavaScript Architekt Douglas Crockford setzt seine Vortragsreihe über die Programmiersprache JavaScript mit einer Diskussion der Funktionen in JavaScript. 'Funktionen sind die besten Teil von JavaScript,' sagt Crockford. "Es ist, wo die Macht ist, ist es, wo die Schönheit ist." Sehen Sie das Video an, warum lernen.
• Douglas Crockford: Crockford über JavaScript - Kapitel 2: And Then There Was JavaScript - Yahoo! 's JavaScript Architekt Douglas Crockford einen Überblick über die Features der Programmiersprache JavaScript.
• Douglas Crockford: Crockford über JavaScript - Volume 1: The Early Years - Douglas Crockford stellt die Programmiersprache JavaScript in den richtigen historischen Kontext, Rückverfolgung der Sprache die Struktur und Konventionen (und einige seiner Macken) zurück zu ihren Wurzeln in den frühen Jahrzehnten des Computers Wissenschaft.

Abonnieren von YUI Theater:

• YUI Theater RSS-Feed
• YUI Theater auf iTunes

[ Fotos von Nicole Sullivan ;. mit freundlicher Genehmigung verwendet]

Finden Gespräche: Bloglines | technorati

Teilen und zu erweitern: Lesezeichen mit del.icio.us | Digg it! | reddit!