Yahoo! User Interface Blog (YUIBlog)

Rey Bango di Ajaxian Interviste YUI Developers Adam Moore, Satyen Desai, e Luke Smith

Rey Bango di Ajaxian (e Microsoft), Yahoo! ha visitato la scorsa settimana , e lui ha pubblicato la sua intervista del team di YUI nucleo membri Adam Moore, Satyen Desai, e Luke Smith. Check it out sul suo blog o in embed qui di seguito.

Trova le conversazioni: bloglines | technorati

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

Nella Galleria YUI 3: Widget Ratings Peter Peterson

Volevo ottenere i miei piedi bagnati con la versione finale del widget di infrastrutture presentati in YUI 3.1.0, e ho sempre sentito il modo migliore per farlo è quello di scrivere del codice. Volevo qualcosa di semplice, e ho scoperto che in una implementazione CSS voti che ho trovato su Komodo media . Il widget è la risultante YUI3 Widget Ratings ( demo ). Il grosso del lavoro del widget è gestito da CSS ed è ben descritto in questo articolo Komodo Media. L'unico problema con questo widget, una volta era un voto è stato scelto, nulla è realmente accaduto a meno che la pagina è stata ricaricata, e quando il widget perso lo stato attivo, ha perso il suo rating. Questo è dove il YUI 3 Galleria widget di voti entra in gioco

I miei obiettivi per il progetto sono stati:

• Il codice per il widget dovrebbe essere sufficiente a toccare le basi per la creazione di un widget di YUI 3
• Il widget sarebbe progressivamente migliorare la pagina
• L'interazione dell'utente con il widget viene facilmente catturato
• Aggiungere un pulsante chiara valutazione che non esiste nel progetto originale
• Il widget deve essere accessibile per persone che utilizzano screen reader
• Fai la creazione di istanze e l'interazione con il semplice widget di morti con il codice meno possibile.

E 'facile aggiungere il widget di voti per la tua pagina usando il caricatore YUI:

 YUI ({
     Galleria: 'gallery-2010/4/14-19-47'
 }). Utilizzare ('Galleria dei voti', 'evento', function (Y) {
     / / Programma di logica ...
 });

Avrete bisogno anche dei beni di immagini e file CSS situati situato a github o dalla vostra copia della galleria.

Basta aggiungere un nodo nell'origine che contiene la corrente nominale (un numero compreso tra 0 - 5) o è vuoto.

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

È quindi possibile istanziare il widget con il seguente codice nel tuo sandbox:

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

Sentivo che era importante fare questo widget facile da personalizzare e così ho aggiunto un po 'di configurazione al costruttore. inline quando è impostata su true viene visualizzato il punteggio in linea con il testo nella pagina (il default è false). skin può essere impostato su " piccolo "per ridurre la dimensione del widget (Esempio: )

Di per sé, il widget di rating non fa altro che ha istituito l'interazione voto per l'utente. Un po 'di lavoro deve essere fatto per utilizzare effettivamente il valore. Lascio che fino a l'implementatore di prendere in considerazione, se aggiungere un callback per l'evento generato quando i cambiamenti di rating, o per fornire un plugin per il widget per gestire automaticamente. Per iniziare, ogni volta che un rating viene cambiato le ratingChange viene generato l'evento. E 'facile da configurare un listener di eventi per catturare l' ratingChange evento per tutti i widget presenti nella pagina. In questo esempio, posso accedere Rating Widget srcNode id 's, la valutazione precedente e il nuovo rating per ogni widget di voto sulla pagina quando le variazioni di rating:

 Y.on ("ratings: ratingChange", function (e) {
   var id = e.target.get ("contentBox") get ("id").;
   Y.log (id + "Nuovo valore:" + + e.newVal "era:" + e.prevVal);
 });  

Idee future per il progetto:

• Migliorare progressivamente gli elementi dei moduli
• Effettuare il pulsante voto chiaro optional
• Effettuare il configurabile gamme di potenza
• Altre pelli, e la combinazione dei CSS sprites
• Internazionalizzazione

Trova le conversazioni: bloglines | technorati

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

Cinco de NodeJS - May BayJax celebra Server-Side JavaScript con Ryan Dahl, Elia Insua e Dav Glass

BayJax organizzatore Gonzalo Cordero ha annunciato che è tempo per un altro BayJax , e questa volta saremo celebrando l'esplosione del server-side JavaScript con Cinco de Node.js a Yahoo!. Abbiamo tre relatori fantastiche: Ryan Dahl, creatore di Node.js, Elia Insua, creatore di uno dei più importanti astrazioni DOM per il nodo, e Dav Glass, un ingegnere YUI che è stato blogging sul suo lavoro ottenendo YUI 3 in esecuzione sotto il nodo.

Unitevi a noi il 5 maggio @ Yahoo! HQ 17:30-09:00 Come Gonzalo dice: "Sombreros, poncho e abiti luchador sono incoraggiati." RSVP sulla pagina BayJax Meetup .

Ryan descrive il suo discorso in questo modo:

È ben noto che cicli di eventi piuttosto che filettature sono necessari per server ad alte prestazioni. Javascript è un linguaggio unencumbered di thread e progettato specificamente per essere utilizzato con motore asincrono evented I / O, il che rende attraente un mezzo di software di programmazione server. Node.js lega insieme il compilatore Javascript V8 con un ciclo di eventi, un pool di thread per effettuare le chiamate di sistema di blocco, e un parser HTTP attentamente progettato per fornire un browser come interfaccia per la creazione veloce software lato server. Questa conferenza spiegherà progettazione del nodo e su come iniziare con esso. "

Elia, che saranno utilizzare Skype da New York, parlerà del suo progetto, jsdom , che fornisce le astrazioni DOM essenziali che permettono client-side, DOM-dipendente JavaScript per l'esecuzione in Node.js. Questa è una parte importante del cambiamento di paradigma, consentendo livelli di server e client-side il riutilizzo del codice non è mai possibile prima e consentendo progressive enhancement di essere un naturale, outgrowth efficiente del nostro ambiente di sviluppo.

Dav porterà avanti questo tema, mostrando in termini pratici come il fondamento della Node.js, le astrazioni in jsdom, e proprio lavoro di Dav per aggiungere funzionalità distinta per jsdom consentire una piena attuazione, come YUI per illustrare alcune delle promesse enorme di questo tipo di sviluppo. È possibile leggere il lavoro di Dav qui YUIBlog ( Parte 1 , Parte 2 ).

Catch Up On passati Meetups BayJax

Gonzalo ha organizzato una grande serie di eventi BayJax di ritardo. Hai perso qualcuno? Ecco i Theater YUI link per l'ultima della serie:

• Nicholas Zakas, Stoyan Stefanov, Ross Harmes, Julien Lecomte, Matt Sweeney: High Performance JavaScript - Cinque collaboratori di O'Reilly High Performance JavaScript discuss avanzata JavaScript e DOM scripting ottimizzazioni al 2010 Aprile BayJax meetup a Yahoo.
• John Resig: Testing, analisi delle prestazioni e jQuery 1,4 - John Resig di Mozilla, creatore del popolare libreria JavaScript jQuery, le opzioni per le recensioni test e l'analisi delle prestazioni in JavaScript e anteprime i significativi cambiamenti in arrivo in jQuery 1.4.
• Brad Neuberg: Introduzione alla HTML5 - Brad Neuberg di Google offre un'ampia introduzione HTML5 come è in corso di attuazione nei browser moderni, tra cui funzioni come SVG / Canvas, il tag video, archiviazione di database, app-cache, e altro ancora.

Trova le conversazioni: bloglines | technorati

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

In the Wild per il 24 Aprile, 2010

Dopo un'altra bella edizione della YUI: Ore aperto il Venerdì , ci completano questa settimana con le note poche note e le più recenti implementazioni dallo sviluppo YUI comunità:

• YUI 2 su Discovery.com : Discovery Channel mediatico ricco sito fa uso di YUI 2.8.0 Animazione e Connection Manager, tra gli altri componenti.
  
• 3/Node.js YUI lavoro Inviato da @ dalmaer: "Oh, e YUI 3 è Really Looking Nizza These Days" : Dion Almaer dà un'occhiata al lavoro Dav Glass YUI 3/Node.js in Ajaxian. Scrivi la Dion: "Oh, e YUI3 sta cercando veramente bello in questi giorni. Un buon equilibrio tra un bel + API widget davvero carine + un Crockford's-worth individuals su sicurezza delle cure ".
  
• YUI 2 su RealCyclist.com : Alla mia età, quando la strada diventa ripida si inizia a guardare per una moto più leggera. (Mangiare meno può essere meno costoso, ma è meno divertente.) E se si guarda RealCyclist.com , e 'possibile acquistare su un sito alimentato da una vasta gamma di YUI 2 componenti. Su un argomento correlato, BonkTown - un sito affare per i ciclisti - è anche YUI-powered, ed è possibile raccogliere oggetti come copriscarpe che rendono i piedi più aerodinamica in una prova a cronometro.
  
• Prova gratuita-tracker Cuanto Utilizzando YUI due DataTable, Tabs, Containers : Todd Wells ha scritto per raccontarci Cuanto: " Cuanto è uno strumento gratuito per memorizzare i risultati di test automatizzati e manuali, organizzandoli in gruppi logici, analizzando la natura del singolo test guasti, e utilizzando i dati risultanti per fornire statistiche utili. Esso utilizza la libreria YUI 2 ampiamente, tra contenitore, evento, DataTable, Button e la visualizzazione a scheda. "( fonte originale. )
  
• Eseguire uno script PHP in background utilizzando AJAX [e YUI] : Mindraven ha un post delineare come avviare attività in background PHP utilizzando Thomas Connection Manager di Sha di YUI .
  
• Introduzioni di lingua spagnola a YUI il DesarrolloWeb.com : Il team di DesarrolloWeb.com hanno messo insieme una serie di quattro articoli in lingua spagnola introducting agli sviluppatori web di YUI , YUI 3 , eventi semplici , e aggiungere / rimuovere le classi CSS in YUI . La loro YUI manuale "pretende ofrecer Una serie di articoli simili teóricos prácticos y de las Librerías YUI, quadro delle Nazioni Unite Javascript y CSS".
• Y! Ricercare Ingegnere @ BRETTS scrive della sua Galleria di fuori del modulo Eventi : Brett Stimmerman di Ricerca Yahoo! dicsusses il suo nuovo fuori Eventi modulo per la Galleria 3 YUI. Eventi al di fuori "consente elementi di sottoscrivere gli eventi DOM che si verificano al di fuori di essi. Un evento si verifica al di fuori del sottoscrittore se l'obiettivo non è la stessa sottoscrittore, o qualsiasi degli antenati del sottoscrittore. "( fonte originale. )
  

Quanto abbiamo perso? Fateci sapere via @ yuilibrary o nei commenti qui sotto (se ti senti retro).

Restate sintonizzati: Rey Bango dal Ajaxian fermato da Yahoo ieri e ha registrato un video-intervista con YUI ingegneri Luke Smith, Satyen Desai e Adam Moore. Quella sessione, oltre a un colloquio con l'organizzatore dell'evento BayJax Gonzalo Cordero, deve essere in esecuzione sul Ajaxian la prossima settimana.

Trova le conversazioni: bloglines | technorati

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

YUI Theater - Adam Granicz: "Sviluppo Web Robusto e rapido con WebSharper" (57 min.)

Adam Granicz fermato da Yahoo! all'inizio di questa settimana per parlare il linguaggio di programmazione F # e il suo utilizzo nello sviluppo di applicazioni web.

Granicz società, la Intellifactory , produce la piattaforma WebSharper. WebSharper riempie il ruolo nella comunità F # che GWT e strumenti simili compilare la comunità Java, promettendo una fortemente tipizzato, veloce, esperienza di sviluppo strettamente integrato con l'implementazione di applicazioni web ricche. Come Fybit di Riatrax4JS e yui4java fare per gli sviluppatori Java, WebSharper porta la potenza di YUI 2 a F # sviluppatori, creando una vasta gamma di widget YUI disponibili.

Se il video qui sotto incorporare non viene visualizzato correttamente nel vostro lettore RSS di scelta, essere sicuri di scegliere attraverso per visualizzare la versione ad alta risoluzione del video su YUI Theater .

• Scaricare video HD (480p ~ 572MB)
• Scarica il video (m4v)

Altri recenti YUI Theater Video:

• Nicholas Zakas, Stoyan Stefanov, Ross Harmes, Julien Lecomte, Matt Sweeney: High Performance JavaScript - Cinque collaboratori di O'Reilly High Performance JavaScript discuss avanzata JavaScript e DOM scripting ottimizzazioni al 2010 Aprile BayJax meetup a Yahoo.
• Douglas Crockford: Crockford su JavaScript - Parte 5: La fine di tutte le cose - Yahoo! 's JavaScript architetto Douglas Crockford conclude la sua parte di cinque serie di lezioni sul linguaggio di programmazione JavaScript con un commento su questioni relative alla sicurezza e le prestazioni in JavaScript.
• Douglas Crockford: Crockford su JavaScript - Episodio IV: La metamorfosi di Ajax - Yahoo! 's JavaScript architetto Douglas Crockford continua la sua serie di lezioni sul linguaggio di programmazione JavaScript con l'analisi del Document Object Model (DOM) e un'esplorazione di Ajax.
• Douglas Crockford: Crockford su JavaScript - Act III: Funzione Ultimate - Yahoo! 's JavaScript architetto Douglas Crockford continua la sua serie di lezioni sul linguaggio di programmazione JavaScript con una discussione di funzioni in JavaScript. 'Le funzioni sono la parte migliore di JavaScript,' Crockford dice. 'E' dove il potere è, è il luogo dove la bellezza è. ' Guarda il video per capire perché.
• Douglas Crockford: Crockford su JavaScript - Capitolo 2: And Then There Was JavaScript - Yahoo! 's JavaScript architetto Douglas Crockford in rassegna le caratteristiche del linguaggio di programmazione JavaScript.
• Douglas Crockford: Crockford su JavaScript - Volume 1: The Early Years - Douglas Crockford pone il linguaggio di programmazione JavaScript nel suo giusto contesto storico, tracciando la struttura del linguaggio e le convenzioni (e alcune delle sue stranezze) torna alle proprie radici nei primi decenni di computer scienza.

Iscrizione a YUI Theater:

• YUI Theater RSS feed
• YUI Theater su iTunes

Trova le conversazioni: bloglines | technorati

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

YUI: Orario di apertura per Venerdì 23 Aprile

La prossima puntata di YUI: Orario di apertura è domani, Venerdì 23!

Le prime ore di apertura è stato un successo enorme, con circa 30 persone che entrano in conversazione e qualche grande e un feedback sia per Smith Lauren modulo Galleria YUISand così come per YUI.

Il tempo sarà lo stesso di prima, 10:00-12:00 PDT. Il principale punto all'ordine del giorno per questa settimana sarà una introduzione e la revisione del codice di Eric Ferraiuolo 's modulo Component gallerista . Ho anche intenzione di iniziare l'apertura delle conversazioni con un "YUI 3 punta o trucco" di sorta.

Questa settimana saremo raggiunti da collega YUIer Satyen Desai ( @ dezziness ), l'architetto principale dietro la Attribute , Base , e Widget pezzi infrastrutture in YUI 3. (Se vuoi incontrare Satyen prima dell'evento, si può fare che su YUI Theater .)

Come prima, il piano è quello di utilizzare Adobe Connect per la condivisione dello schermo e fare la voce su un ponte conferenza. Questa è l'informazione per l'adesione in:

1. Comporre al 1-888-371-8922 (non statunitensi partecipanti, mandatemi una email per un numero locale)
2. Inserisci il codice partecipante 47188953
3. Partecipa alla sessione di condivisione dello schermo (questa vi verrà chiesto di installare il plugin Adobe Connect se questa è la prima volta ad usarlo)

E come detto con la prima YUI: Orario di apertura, è possibile tenersi aggiornati con il programma imminente e gli argomenti seguendo @ yuilibrary su Twitter o iscrivendoti al Calendario degli eventi YUI .

Se questa è la prima volta che hai letto su YUI: Orario di apertura, è un forum aperto con me stesso e gli altri membri del team YUI e alcune grandi menti della comunità YUI. Potete saperne di più qui .

Spero di vedervi lì!

Trova le conversazioni: bloglines | technorati

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

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

L'edizione 2010 di aprile del meetup BayJax a Yahoo! caratterizzato cinque altoparlanti, i quali sono co-autori del volume nuovo Alto JavaScript Performance dal O'Reilly ( capitolo libero disponibile qui ). Ci sono stati circa 200 i partecipanti che riempiono la URL Cafe, nel cuore di Yahoo!, e udirono distintamente cinque interessanti assume web-app performance.

Se il video qui sotto incorporare non viene visualizzato correttamente nel vostro lettore RSS di scelta, essere sicuri di scegliere attraverso per visualizzare la versione ad alta risoluzione del video su YUI Theater .

• Scaricare video HD (480p ~ 572MB)
• Scarica il video (m4v)

Altri recenti YUI Theater Video:

• Douglas Crockford: Crockford su JavaScript - Parte 5: La fine di tutte le cose - Yahoo! 's JavaScript architetto Douglas Crockford conclude la sua parte di cinque serie di lezioni sul linguaggio di programmazione JavaScript con un commento su questioni relative alla sicurezza e le prestazioni in JavaScript.
• Douglas Crockford: Crockford su JavaScript - Episodio IV: La metamorfosi di Ajax - Yahoo! 's JavaScript architetto Douglas Crockford continua la sua serie di lezioni sul linguaggio di programmazione JavaScript con l'analisi del Document Object Model (DOM) e un'esplorazione di Ajax.
• Douglas Crockford: Crockford su JavaScript - Act III: Funzione Ultimate - Yahoo! 's JavaScript architetto Douglas Crockford continua la sua serie di lezioni sul linguaggio di programmazione JavaScript con una discussione di funzioni in JavaScript. 'Le funzioni sono la parte migliore di JavaScript,' Crockford dice. 'E' dove il potere è, è il luogo dove la bellezza è. ' Guarda il video per capire perché.
• Douglas Crockford: Crockford su JavaScript - Capitolo 2: And Then There Was JavaScript - Yahoo! 's JavaScript architetto Douglas Crockford in rassegna le caratteristiche del linguaggio di programmazione JavaScript.
• Douglas Crockford: Crockford su JavaScript - Volume 1: The Early Years - Douglas Crockford pone il linguaggio di programmazione JavaScript nel suo giusto contesto storico, tracciando la struttura del linguaggio e le convenzioni (e alcune delle sue stranezze) torna alle proprie radici nei primi decenni di computer scienza.

Iscrizione a YUI Theater:

• YUI Theater RSS feed
• YUI Theater su iTunes

[ Foto di Nicole Sullivan ;. usato per gentile concessione]

Trova le conversazioni: bloglines | technorati

Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!