Edificio Sideline: Lezioni di YUI + Adobe AIR
31 marzo 2009 alle 09:52 am da Chad Auld | In Development , le implementazioni YUI | 13 commentiChi l'Autore: Chad Auld è un front-end Ingegnere lavorare con il team di Yahoo! Buzz Marketing. A long-time open-source collaboratore, ha recentemente contribuito a iniziare il progetto MiaCMS , una nuova generazione di fork di Mambo costruito utilizzando YUI. In questo articolo, ci guida attraverso il processo di sviluppo di un'applicazione desktop con YUI sulla piattaforma Adobe Air.
Vi siete mai chiesti cosa si dice in questo momento circa la vostra azienda, brand, servizio, prodotto, ecc? Sideline , ispirato da un recente progetto trucco interna a Yahoo!, va al di là del processo standard sondaggio presso i clienti per farvi ascoltare in tempo reale per le persone parlare dei vostri prodotti e quindi utilizzare tale feedback per migliorare il servizio o aiutare gli utenti con i loro problemi.
In poche parole, gli obiettivi del nostro progetto sono stati
- Creare un'applicazione desktop che permette la creazione, il raggruppamento e auto-esecuzione di query di ricerca avanzata contro Twitter
- Sfruttare esistenti competenze-set e gli strumenti
- Mirate Windows, Mac OS X e sistemi operativi Linux e ridurre al minimo la quantità di codice della piattaforma specifica che deve essere scritto
- Open source il codice in modo che altri possano imparare, contribuire e / o estendere il prodotto in maniera che ritengono opportuna
Il nostro team di front-end ingegneri sono esperti in JavaScript, CSS, HTML e PHP, ma non ha avuto una grande esperienza nello sviluppo di applicazioni desktop. Quindi la domanda diventa, come sfruttare al massimo le nostre attuali competenze-set per lo sviluppo desktop? La risposta per noi era di utilizzare la piattaforma Adobe AIR , che "consente agli sviluppatori di utilizzare tecnologie web di provata efficacia per creare rich Internet application che girano al di fuori del browser su più sistemi operativi". Dal momento che AIR supporta HTML / JavaScript sviluppo (in aggiunta a Flex e Flash), potremmo costruire la nostra applicazione sulle tecnologie web tradizionali, sulla cima di YUI , e lo hanno eseguito sui tre principali sistemi operativi desktop.
Griglie YUI in AIR
Sideline contiene una estesa applicazione della Biblioteca YUI. Si spera, dovrebbe servire come un grande esempio per gli altri sviluppatori interessati alla sperimentazione della YUI e Adobe AIR. Il layout dell'applicazione è costruito utilizzando griglie YUI e fa anche uso dei ruoli ARIA aggiunti di recente Landmark . Griglie lavorato molto bene in ambiente AIR e reso riprogettazioni che si sono verificati a metà dello sviluppo facile da implementare con minimi cambiamenti di codice. Proprio come in un ambiente browser standard, YUI Grids può servire come base ideale per un'applicazione AIR, anche se lo sviluppatore decide di non utilizzare il resto della libreria JavaScript e ha optato invece per un altro quadro.
YUI componenti in AIR
Oltre alle griglie, Sideline utilizza anche il Dom , eventi , Drag and Drop , JSON , Selector , i container , i pulsanti , i menu , le Slider e visualizzazione a scheda componenti. Sono lieto di comunicare che tutti i componenti YUI eseguito molto bene in ambiente AIR e ha richiesto nessuna modifica. Sideline fa implementare un design abbastanza personalizzato e così alcuni scuoiamento personalizzata dei componenti YUI è stato richiesto, ma non modifiche di base. Maggior parte delle applicazioni AIR tendono ad avere un'applicazione desktop ricca sentono a loro. Per questo livello di personalizzazione, l' articolo di skinning YUI è un grande riferimento per iniziare.
Al di là del Browser
Il più significativo miglioramento della piattaforma Adobe AIR sull'ambiente web tradizionale è l'accesso a un database locale SQLite e il file system dell'utente. L'accesso al database locale sta diventando sempre più disponibile in ambiente web tradizionali attraverso tecnologie come HTML 5 e Gears stoccaggio lato client, ma per ora queste soluzioni non sono onnipresenti. Per chi è interessato nello sviluppo di AIR, Sideline ha affrontato molte delle attività comuni che un'applicazione AIR tipico potrebbe richiedere, per esempio, il recupero dei dati esterni, gestione degli aggiornamenti delle applicazioni, interagire con il database locale, lavorando con il file system locale, lanciando finestre del browser nativo, visualizzazione delle notifiche sul desktop, ecc dovrebbe rivelarsi un utile riferimento in tal senso.
Suggerimenti per lo sviluppo AIR
- Conosci il tuo ambiente. AIR utilizza il motore open source WebKit del browser sotto il cofano. Lo sviluppo del web tradizionale è finalizzato a rendere un'opera un'applicazione o un sito in più browser / sistemi operativi possibili. Quali browser a sostegno proviene generalmente fino a un fattore di costo rispetto al loro utilizzo. Tuttavia, codifica per un singolo motore di rendering riduce la necessità di preparare e testare contro il rigirarsi di combinazioni potenziali sul mercato. Detto questo, abbia ancora senso a svilupparsi in maniera cross-browser, dove possibile, in quanto ci può venire un momento in cui l'applicazione ha bisogno di trovare la via del ritorno in un ambiente browser più tradizionale. Utilizzando un framework come YUI renderà questo processo relativamente indolore. E 'semplice per vedere i browser e le piattaforme attualmente supportate da YUI tramite il supporto grafico Graded Browser . Gli sviluppatori dovrebbero essere abbastanza sicuro di prendere alcune scorciatoie di base durante la creazione di un'applicazione AIR (con
-webkit-border-radiusrende angoli arrotondati una brezza), ma usarli con parsimonia e documentare in modo che siano facili da individuare successivamente. - Durante lo sviluppo di una complessa applicazione in qualsiasi ambiente un solido set di strumenti di debug è un must-have. Adobe fornisce alcuni strumenti utili per il debug AIR out of the box. Gli sviluppatori dovrebbero indagare AIR Debug Launcher (ADL) , la Introspector HTML , e il visualizzatore sorgente HTML . In aggiunta agli strumenti in bundle, Aptana Studio con il suo plugin Adobe AIR si è rivelata una risorsa indispensabile. Il plugin Aptana fornisce assistenza con la creazione di un progetto AIR, l'importazione di comuni framework JavaScript, il debugging, l'imballaggio / esportazione e la firma digitale dell'applicazione.
- Non dimenticare le tecniche di esecuzione che abbiamo appreso dall'ambiente browser standard (cioè, ottimizzare le immagini, minify e combinare dell'applicazione CSS e JavaScript, e pesanti basate su eventi applicazioni come Sideline, usufruire di tecniche di delegazione degli eventi ) . Le applicazioni AIR possono essere eseguite sul desktop e quindi c'è indulgenza un po 'di più con prestazioni rispetto per l'ambiente tipico browser, ma ricorda come il browser stesso, il contenitore AIR consuma anche un pezzo di memoria del sistema prima ancora calci di codice personalizzato dell'applicazione in .
The Road Ahead
La versione beta di Sideline può essere installata http://sideline.yahoo.com . Il codice è open source sotto i termini della licenza BSD e ospitato su GitHub . Diamo il benvenuto a contributi, feedback, e / o suggerimenti. Inoltre, nello spirito di mantenere le cose il più aperto possibile e che supporta la tecnologia emergente che probabilmente il porting Sideline al titanio in un prossimo futuro. Un certo lavoro iniziale è già stato fatto sulla porta e continuerà nelle prossime settimane. E 'anche possibile che Sideline finirà per l'attuazione di un ORM javascrip come JazzRecord per facilitare le interazioni tra le piattaforme di database. Se qualcuno ha suggerimenti addizionali di sostegno alle piattaforme multiple ci piacerebbe sentirli.
Ora vai avanti e fork si !
Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!
Attuazione Focus: DocLanding
30 marzo 2009 alle 10:24 da Eric Miraglia | In implementazioni YUI | 1 commento
Fishback Todd è il Presidente di DocLanding , una soluzione web-based di gestione dei documenti. Todd ci unisce sulla YUIBlog per discutere la scelta del suo team di utility YUI e widget nell'interfaccia utente DocLanding. Si può imparare di più su DocLanding dalla sua presentazione a Fall 2008 Conference Demo .
Parlaci un po 'di DocLanding - quali sono i problemi centrali si risolvono per gli utenti?
DocLanding è una soluzione on-demand di gestione dei documenti che offre funzionalità di classe enterprise document management per una frazione dei costi della maggior parte delle soluzioni enterprise. Il software può essere fornito attraverso la nostra offerta Software as a Service (SaaS) o come in-house sistema. I nostri clienti sono principalmente nel settore dei servizi finanziari e nelle arene sanitari.
Problemi comuni che risolviamo per i nostri clienti includono fornire un web-based repository centralizzato per la forza lavoro distribuita, on-demand web-based di scansione per gli uffici con scarsi volumi di carta, e la scansione in batch sul desktop-based negli uffici ad alto volume di carta. Altri problemi ci sono indirizzi condivisione sicura dei documenti e la collaborazione, la modifica dei documenti / annotazioni, controllo delle versioni, documento di commenti e watermarking documento. Il nostro approccio unico repository di documenti controllati separatamente, ma legata consente agli utenti di accedere ai repository diversi con un unico login comune.
Quali sono stati l'interfaccia utente particolare sfide poste dalla progettazione del vostro prodotto?
Abbiamo imparato da alcuni dei nostri lavori precedenti che semplicemente non si può sottovalutare l'importanza del design user-friendly. Creazione di un sito web è abbastanza facile, ma la creazione di una vera applicazione web che deve soddisfare le esigenze degli imprenditori è un vero lavoro. Il nostro prodotto cerca di prendere la gestione dei documenti dal rigorosamente il dominio della grande impresa e renderla disponibile per qualsiasi piccola impresa. Gestione elettronica dei documenti nel suo nucleo non è un compito semplice. L'obiettivo è di organizzare e controllare l'accesso a un gran numero di file, oltre a renderli completamente ricercabili. Per questo motivo, l'interfaccia utente è in realtà in cui la maggior parte del tempo di sviluppo è stata tradizionalmente speso.
Abbiamo riscontrato che vi farà risparmiare tempo e denaro per i problemi di supporto, quando il vostro sito sarà semplice e facile da usare. Parte di questo è rilassante le specifiche necessarie per gestire il sito. Abbiamo ottenuto la nostra abita in fondo a quasi qualsiasi browser moderno con JavaScript e Flash. Il disegno sito principale siamo arrivati a presentare le sue sfide con il suo uso molto specifico dello spazio sullo schermo. Abbiamo trovato i nostri utenti erano più in grado di sfruttare appieno la domanda quando ci attenzione ai colori, l'iconografia e la vicinanza dei controlli alla loro funzione. Noi pensiamo che siamo sulla strada giusta perché la nostra pagina di feedback è tornato più le richieste di funzionalità aggiuntive che per richieste di aiuto.
Si è scelto YUI per ottimizzare i consumi tuo sito. Cosa ti ha portato a questa decisione?
La risposta semplice è la coerenza e la velocità. Avevamo bisogno di un quadro che ci permetterebbe di soddisfare le specifiche di progettazione del nostro prodotto. Più in particolare, abbiamo avuto ambiziosi obiettivi di progettazione come mantenere una visualizzazione a schermo e ridurre al minimo o eliminare postback a pagina intera. Inoltre, volevamo i nostri elementi necessari per guardare e funzionano in modo identico in tanti diversi browser come abbiamo potuto gestire. Ci sono problemi di coerenza sufficienti tra i browser e le loro metodologie di rendering da affrontare già, quindi qualsiasi quadro abbiamo scelto è necessario per ridurre la quantità di browser-specific di codifica avremmo dovuto fare. Dopo aver sperimentato con una varietà di diversi toolkit, YUI è uscito chiaramente in cima. C'era un po 'di una curva di apprendimento per tutti i prodotti, ma YUI ha avuto il miglior payoff.
Il quadro di base non richiede un plug-in, gioca bene con. NET, e gli script sono leggeri, stretto e solido. Una volta ottenuto il blocco della struttura, abbiamo trovato illuminante per confrontare le nostre pagine vecchie di interfaccia tradizionali alle versioni YUI. In ogni caso, regolando la nostra metodologia UI tornato enormi vantaggi in termini di prestazioni e la coerenza con leggeri download ai nostri clienti.
Quali componenti YUI stai usando più pesantemente nella tua app?
Si sta usando un bel po 'dei componenti. I più favorevoli sono stati quelli che ci permettono di fare altrettanto con e su uno schermo il più possibile, in modo che il TreeView , Menu , SimpleDialog e Layout Manager sono stati estremamente utili. In verità stiamo usando quasi tutti i controlli, ma soprattutto apprezzare la Uploader controllo capacita 's di gestire la selezione multipla di file. Stiamo cercando una soluzione a questo problema per qualche tempo e YUI è stata la più elegante che abbiamo incontrato finora. Facciamo buon uso della Utility JSON e Connection Manager per ridurre notevolmente le dimensioni e il numero di richieste al server che facciamo, che mantiene la nostra impronta verso il basso e soprattutto continua a lavorare i nostri utenti, non aspettare.
Quali sono le prospettive per DocLanding? Quali sono le sfide su cui stai lavorando per affrontare nelle vostre prossime uscite?
Stiamo costantemente lavorando per migliorare il set di funzionalità del nostro prodotto. I nostri utenti hanno chiesto per le funzionalità per integrare meglio la redazione dei documenti con l'applicazione principale, quindi faremo il tempo per questo. Stiamo lavorando anche su una migliore accogliere il caricamento di file di grandi dimensioni. In caso contrario, abbiamo diverse idee sul tavolo e stiamo peso quali sarebbe più vantaggioso per i nostri utenti. Una versione del sito ottimizzata per i telefoni cellulari e netbook è in fase di progettazione già, come pure gli strumenti per importare cartelle strutturate dal desktop direttamente in DocLanding. Sperimentalmente, stiamo giocando con l'idea di un solo memorizzare i metadati sul sito e tirando i contenuti direttamente da macchine client collegati in rete eseguono il nostro software. In definitiva, le esigenze dei nostri utenti dettare in quale direzione ci muoviamo successiva.
Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!
Costruire un veloce People-Finder per Flickr con YUI automatico
26 marzo 2009 alle 08:59 am da Ross Harmes | In Development | 1 commentoIn Flickr , abbiamo recentemente aggiunto un nuovo selettore di persone-widget per alcune delle nostre pagine, questa funzione si basa sul completamento automatico YUI controllo . Il widget di persone-selettore permette ai nostri soci di selezionare gli individui dalla loro lista dei contatti, che possono contenere verso l'alto di 20.000 voci. A causa della grande quantità di dati coinvolti, le tecniche tradizionali per il recupero e l'analisi dei dati non erano fattibili, soprattutto a causa di rallentare estremamente i tempi di analisi. In questo post, daremo uno sguardo ad alcuni dei formati di dati diversi che abbiamo provato e alla configurazione di completamento automatico che abbiamo trovato per essere più performante.
In primo luogo, ecco un riassunto video di quello che stavamo cercando di realizzare, la nuova interazione con le persone-Finder Widget è raffigurato a destra:
Recupero e analisi: XHR e dati personalizzati
La sfida più grande era trovare un formato di dati che sarebbe stato veloce da scaricare, veloce da analizzare, e - soprattutto - sicuro. In primo luogo abbiamo cercato di XML e Ajax, ma parsing XML dimostrato di essere molto a rallentare - in realtà, abbiamo scoperto che questo approccio potrebbe far cadere il browser su insiemi di dati più grandi. Poi abbiamo provato una combinazione di Ajax e JSON, questo era significativamente più veloce, ma ci sono voluti più di 80 secondi per analizzare il nostro più grande insieme di dati (un array che contiene circa 10.700 oggetti, ciascuno con diverse proprietà).
Alla fine, abbiamo trovato due di trasporto / parse tecniche che si sono rivelate estremamente veloce:
- Recupero JSON (avvolto in una funzione di callback) utilizzando i tag script generati in modo dinamico;
- l'analisi di un formato personalizzato di dati (un carattere di controllo elenco delimitato) utilizzando
split(), prese con l'Ajax (utilizzando Connection Manager YUI ).
Alla fine, siamo andati con il formato personalizzato. Formattazione nostra JSON in modo che potesse essere eseguita da un tag script dinamico era un approccio meno sicuro e non una vittoria performance. Utilizzando XHR ci ha dato una soluzione più sicura e ancora molto performante.
User Interaction: YUI automatico
Una volta abbiamo avuto un modo per ottenere i dati in JavaScript rapidamente, la prossima sfida era quella di creare un modo per l'utente per cercare rapidamente l'elenco dei contatti. Per fare questo, ci siamo rivolti al controllo automatico di YUI. E 'soddisfatto le nostre esigenze esattamente: estremamente veloce e molto configurabile. Per usarlo con i nostri dati personalizzati, abbiamo creato una funzione da utilizzare come l'istanza di completamento automatico di DataSource, ogni pressione di un tasto nel widget attiva questa funzione e passa nella stringa di ricerca. All'interno di questa funzione, abbiamo il ciclo di tutti i contatti del socio e cercare di abbinare la query su quattro campi diversi. Abbiamo usato le espressioni regolari per fare il matching stringa.
Anche per grandi insiemi di contatti, abbiamo trovato questa tecnica per essere estremamente efficiente. Ecco la versione di base di quello che abbiamo fatto:
searchContacts funzione (query) { partite var = [], queryRegEx = new RegExp (query, 'i'), / / query dovrebbe essere / / Controllati prima / / Utilizzando in una regex. contatto; for (var n = 0, len = contacts.length; n <len; n + +) { contattare = contatti [n]; if (contact.username.search (queryRegEx) == -1! | | ! contact.realname.search (queryRegEx) == -1 | | ! contact.emailAddress.search (queryRegEx) == -1 | | contact.alias.search (queryRegEx)! == -1) { matches.push (contatto); } } corrispondenze; }
Una volta che abbiamo avuto i dati collegati al widget, abbiamo fatto una modifica alla configurazione di default automatico: Abbiamo impostato la queryDelay parametro 0 (il valore predefinito è 200 ms). Ciò significa che non vi sarà alcun ritardo tra un tasto e viene iniziata una ricerca. Ci sono aspetti negativi di questo (il display automatico tende a tremolare un po 'se si digita alcuni caratteri in rapida successione), ma abbiamo trovato che sia il miglioramento più grande singola abbiamo fatto, più importante anche di ottimizzazioni alla nostra funzione di ricerca. Mentre un queryDelay di 200 ms o più potrebbe essere più appropriato per XHR o altro DataSources remoto, abbiamo scoperto che la nostra regex-based DataSource con i dati locali è stato all'altezza del compito di ricerca in ogni battitura. Con il completamento automatico, abbiamo ottenuto caching liberi aggiunti alla miscela in modo che ogni determinata ricerca avrebbe solo da fare una volta.
Maggiori dettagli su tutte queste tecniche, compresi i dettagli completi sui formati di dati diversi profili e dati completi per ciascuno di essi, possono essere trovati sul code.flickr blog.
Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!
In the Wild per il 25 marzo 2009
25 Marzo 2009 alle 9:08 pm YUI Team | In In the Wild | 3 commentiNotizie e le note della comunità YUI nelle ultime settimane. Fateci sapere nei commenti cosa abbiamo perso, e noi lo prendo la prossima volta:
- Ross Harmes su YUI completamento automatico e lo Flickr People Finder : Flickr Ross Harmes ha un pezzo interessante sul blog di Flickr Codice di fare super-veloce ricerca suggeriscono la creazione della funzione di Popolo Flickr Finder. Ross discute in dettaglio il processo che usa per elaborare elenchi di contatti in fretta sul client, inducendole in JavaScript. Da lì, si rivolse a Jenny Donnelly YUI Completamento automatico : "[Con] serie di contatti in JavaScript, avevamo bisogno di un modo per cercare attraverso di loro e selezionarne uno. Per questo, abbiamo usato ottimo widget di completamento automatico YUI. Per ottenere i dati nel widget, abbiamo creato un DataSource oggetto che esegue una funzione per ottenere risultati. Questa funzione è sufficiente ad anello attraverso il nostro array di contatto e la query di data contro quattro diverse proprietà di ogni contatto, usando una espressione regolare (RegExp oggetti si è rivelato estremamente adatto per questo, con il tempo medio di ricerca per il caso di 10.000 contatti provenienti in sotto 38ms). Dopo i risultati sono stati raccolti, il widget automatico preso cura di tutto il resto, compresi la memorizzazione nella cache i risultati. "
- W3C Sito Beta Utilizzando ripristino YUI e Fonts : Nicole Sullivan ha scritto per dirci che reset YUI e Fonts fanno parte della riprogettazione nuovo sito del W3C, che potete vedere in anteprima qui. Il sito utilizza anche OOCS Nicole lavoro.
- Site Brasile Kellogg Costruita con connessione YUI, animazione e più : il Brasile di Kellogg sito web implementa una serie di componenti YUI. Abbiamo notato Connection Manager , Animazione , Get , e altro ancora, tutto scendendo tramite un unico combo manico URL da yahooapis.com. Nizza. ( fonte originale. )
- Avvistamento YUI - Greenbookings.com, sostenibile del sito di viaggi : Yvo Schaap ha scritto per raccontarci Greenbookings.com , un sito di viaggi lanciato di recente che si concentra sul mondo emergente della mobilità sostenibile. Quando si prenota tramite Greenbookings, saranno caclulate e consente di compensare l'impronta di carbonio generato dai tuoi viaggi. Yvo Scrive: "Ho lavorato con il framework YUI per molto tempo e ieri uscito il mio nuovo sito web greenbookings.com che ha quasi tutti i moduli del quadro in uso: calendario, schede, DataTable , la storia + calendario intervallo , griglie, autocomplete, e molti altri. Anche molti sforzi sono stati spendere per un caricamento della pagina molto veloce, eliminando tutti i javascript dal collettore al fondo della pagina. "Noi amiamo il sito e l'utilizzo del contributo di John Peloquin di YUI, il calendario Intervallo per la selezione della data .
-
Avvistamento YUI - Infinite Site Gioco Crossword : Marco Egli ha scritto per raccontarci una nuova versione di Crossword Infinite, un sito di giochi con una vasta gamma di programmi di utilità YUI e widget. "Venerdì scorso una nuova versione di Crossword Infinite è stato rilasciato. E 'la prima versione che è disponibile in lingua inglese. Si tratta di un cruciverba infinito che scorre completamente nel browser. Diversi componenti YUI sono stati utilizzati per lo sviluppo, compresa l'animazione, Button, Connection Manager, DataTable, JSON, menu e altro ancora. Il gioco punta allo sviluppo del puzzle più grande cruciverba del mondo. Gli utenti possono giocare e aggiungere le proprie domande. Si tratta di una miscela di cruciverba e scrabble ". Controlla il gioco qui , assicuratevi di accedere e utilizzare i menu nella parte inferiore dello schermo per aggiungere le proprie domande. - DevX, "Yahoo interfacce utente Rich Web per sviluppatori Java" : DevX ha un nuovo articolo per sviluppatori Java interessati a YUI . Scrive Narayanan AR: " Questo è il primo articolo in una serie di tre parti che si rivolge principalmente agli sviluppatori Java che non sono esperti di JavaScript, ma stanno sviluppando applicazioni web con framework server-side (come JavaServer Pages, Struts, o in primavera). In questa puntata, i novizi JavaScript vedrà come utilizzare YUI per la configurazione e il design, e deve imparare molte cose sulla programmazione orientata agli oggetti JavaScript. Per i già esperti in JavaScript sviluppatori, questa serie di articoli che serve come introduzione alla libreria YUI ".
- Video: "YUI per Freaks di controllo" con Christian Heilmann : La squadra ha Ajaxian Christian Heilmann di YUI parlare sul video; verificarlo qui o nel lettore incorporato qui di seguito.
-
YUI automatico e calendario sul sito Turkish Airlines : Cagatay Civici scritto per raccontarci l'utilizzo del sito Turkish Airlines ha di YUI automatico e Calendar sul proprio strumento di prenotazione. Molti siti di turismo hanno utilizzato questa combinazione nel corso degli anni; Southwest.com è stato uno dei primi adottanti del calendario YUI e continua ad utilizzare una delle versioni originali di Calendar sul proprio sito di prenotazione corrente. proprio sito di viaggi di Yahoo è un altro buon esempio di come questi widget possono essere utilizzati insieme - è stata attuata da YUI ImageLoader autore Matt Mlinac. ( fonte originale. ) - Caridy Patino Mayea: "YUI3: Controllo degli eventi principali Strokes (KeyUp, KeyDown, KeyPress)" : Caridy (autore dei popolari Biblioteca Bubbling estensioni YUI) ha un nuovo blog post up sulla gestione degli eventi chiave nel YUI 3 . ( fonte originale. )
- Mockups Balsamiq per i componenti YUI : i mockup to Go blog ha diverse componenti YUI deriso usando l'interfaccia di Balsamiq, compresi menu e pulsanti , i calendari e Caroselli . ( fonte originale. )
- Più di Matt Snider su YUI-EXT-MVC : Matt ha continuato a lavorare al suo YUI-EXT-MVC progetto . Secondo Matt, "il vantaggio di AJAX utilizzando il sistema delle classi Controller 'è che semplifica Connection Manager YUI e uno sviluppatore può pre-registrare richiamate, assicurando il tipo di risposta attesa. È disponibile presso http://code.google.com/p/yui-ext-mvc/source/browse/trunk/assets/js/mvc/lib/controller.js . In futuro sarà l'aggiunta di modelli logici di comando per il recupero dei dati JSON e HTML dal server. "
-
Paul Tarjan di Geo Explorer con YQL e YUI : SearchMonkey ingegnere Paul Tarjan ha una demo interessante usando YUI Visualizzazione a scheda e Yahoo Maps API Ajax per visualizzare i risultati di una ricerca YQL geo . L'interfaccia consente di immettere un nome di luogo e quindi cercare quella posizione, fratelli che la localizzazione, gli antenati quella posizione, ecc Per il contesto più ampio e perché questo è interessante, vedi post del blog PHP inventore Rasmus Lerdorff in materia . ( fonte originale. ) - Meg Smitley - "Caricare dinamicamente YUI Dipendenze" : Meg scrive (il Meglog) : "Sto usando YUI Grids e LayoutManager per la spina dorsale di interfaccia mia applicazione sin dalla fine dello scorso anno. E 'stata una curva di apprendimento ripida e io mi considero ancora alle prime armi molto e, infatti, notato solo questa settimana la scheda' caricamento dinamico 'il Configurator YUI . Piuttosto che staticamente tra cui la richiesta e le risorse YUI CSS JavaScript, è possibile utilizzare YUILoader per importare dinamicamente il carico. Anche se mi rendo conto che YUI esperti non sarà impressionato dalla mia YUILoader-epifania, questo approccio mi ha aiutato a dimagrire file JS mia app riducendo le preoccupazioni di manutenzione e quindi mi sento vale la pena ricordare a beneficio dei niubbi altri. " check-out il suo articolo per maggiori dettagli .
- Utilizzo di Carosello con SugarCRM : Roger Smith ha un tutorial sul blog degli sviluppatori SugarCRM che fornisce "una personalizzazione veloce e semplice ListView che sfrutta il widget di Carousel dalla UI Yahoo (YUI) library . Questa personalizzazione cambia completamente il look and feel del ListView contatto da un 'righe e le colonne dei vista dei risultati di ricerca a una visione Yahoo UI Carousel. La libreria YUI è inclusa nel SugarCRM e fornisce una tonnellata di funzionalità dell'interfaccia utente al di là di quello che usiamo nella domanda core ".
Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!
Georgiann Puckett: YUI / ASTRA Program Manager (AdaLovelaceDay09)
24 marzo, 2009 alle 8:06 am da Eric Miraglia | In Development | 1 commento
[Nota: Questo post fa parte della partecipazione della squadra di YUI a Ada Lovelace Day , una celebrazione di tecnici femminili in tutto il mondo.]
Georgiann Puckett (meglio conosciuta come "George") serve come il responsabile del programma per YUI e progetti affiliate (compresa la biblioteca ASTRA). Programma di gestione di complessi programmi tecnici comprendenti più progetti è uno dei lavori più impegnativi di una società di software, e George è ideale per la sfida. Lei porta in tavola una pronta intelligenza, la pazienza e la disciplina per gestire grandi flussi di dati, e una comprensione profondamente radicata dei processi con cui vengono sostenuti programmi di successo. Il suo background serve qui e - come C / C + + veterano di ingegneria, può empatizzare direttamente con le esperienze di ingegneri con i quali lavora.
Comunicati YUI uscire con centinaia di modifiche, molte delle quali sono suggerite o contribuito per sviluppatori di tutto il mondo. Dal suo ingresso la squadra due anni fa, George ha rivoluzionato il modo in cui viene gestito tutte queste informazioni. Questo è portato a una migliore previsione, migliore comunicazione e una migliore qualità su tutta la linea.
George ha anche fornito la leadership per la squadra encomiabile YUI nel sostenere importanti progetti interni a Yahoo. Quando si designa un progetto interno come una "grande scommessa", qualcosa di cruciale per il futuro della società, noi squadra con il team di frontend del progetto di ingegneria e assicurarsi che stiamo facendo tutto il possibile per sostenerli. George gestisce questi rapporti, assicurando che i nostri collaboratori ottenere tempestive, ben documentati build e che le loro priorità sono accuratamente riflettono nei nostri piani di rilascio. Avere la capacità di comprendere le esigenze dei diversi progetti "e per faciliate nostre collaborazioni di successo non è una sfida da poco, e George ha fatto il lavoro pesante necessarie per garantire che YUI e gli ingegneri ASTRA stanno fornendo il giusto supporto al momento giusto tutto Yahoo.
Parlando di heaving lifting .... George è ben noto a Yahoo come un tecnico eccezionale e un sostenitore instancabile YUI, ma è anche ben noto a chi frequenta una palestra di Yahoo dipendente. Troverete George là quattro o cinque notti alla settimana lavorando per migliorare proprio record mondiale modulo i pesi liberi.
Opera di Don Giorgio e il suo impegno generale verso l'eccellenza è certamente ispirato tutti noi che lavoriamo con lei nel corso degli ultimi anni. Ho chiesto a George che l'aveva ispirato e la mandò giù per il sentiero verso una carriera nella tecnologia.
Qual è stata la tua prima esperienza con i computer?
Ero intento a entrare in un pre-med pista al college e ho avuto un corso AP Calculus il mio ultimo anno come parte del curriculum di preparazione college. Per fortuna ha voluto che l'insegnante ha ottenuto una borsa di studio per due computer Apple come parte di un processo per insegnare la programmazione a livello di scuola superiore. Non solo abbiamo capito - abbiamo ottenuto competitività che cercando di fare le caratteristiche più robusti con la minima quantità di codice. Il primo corso di elettronica digitale, in un college dove ho avuto modo di circuiti di programma su un tagliere usando il linguaggio assembly sigillato l'affare.
Hai avuto la femmina modelli tecnologo che ti hanno influenzato?
Ci sono due donne con cui ho lavorato che ho colpito e ho imparato molto da. Darragh Muldoon, co-fondatore di Software Cricket, mi ha assunto il college nel gran lunga l'avventura più straordinaria di avvio della mia carriera. Era non era un tecnologo di per sé, ma ho imparato molto da lei per quanto riguarda le sue competenze delle persone nei principali tecniche gente, costruendo le squadre, e la crescita di una società. L'altra donna guardo fino al imparato da Sheila era Brady, che ha aumentato attraverso la truppa al regista-level nella divisione software di sistema Apple. Lei sicuramente ha saputo guidare un comunicato, in molti casi importanti squadre composte principalmente da ingegneri di sesso maschile. Ha esposto un livello di affidabilità, competenza e aggressività che potrebbe essere apprezzato da qualsiasi ingegnere - maschio o femmina.
Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!
Jenny Han Donnelly: Ingegnere YUI (AdaLovelaceDay09)
24 marzo, 2009 alle 8:05 pm da Eric Miraglia | In Development | 3 commenti
[Nota: Questo post fa parte della partecipazione della squadra di YUI a Ada Lovelace Day , una celebrazione di tecnici femminili in tutto il mondo.]
Jenny Han Donnelly è l'autore di tre componenti YUI:
- Il controllo DataTable : YUI DataTable è uno dei widget firma nostri dell'interfaccia utente, fornendo un potente menù di opzioni interattive per dati tabulari.
- Il controllo automatico : automatico fornisce typeahead, suggerire, filtrazione e combo-box funzionalità di qualsiasi area di immissione del testo.
- Il DataSource Utility : Condiviso da DataTable, completamento automatico e il controllo Grafici , DataSource funge da canale tra widgets e alle potenziali fonti di dati, compresi dati sul lato server, array JavaScript, DOM e strutture come le tabelle HTML.
Lavoro di Jenny ci ispira in parte a causa delle sfide tecniche che assume - provare a ottenere le intestazioni fisse con scorrimento xy di lavorare in IE6 utilizzando una tabella di base semanticamente sound a volte, se avete dei dubbi. Jenny ha assunto alcune delle sfide più complesse HCI ovunque in YUI e progettata per adattarle qualsiasi ambiente. DataSource altri componenti YUI consente di lavorare con qualsiasi cosa, da file flat a JSON e XML per array e strutture DOM JavaScript. Abbiamo sentito da migliaia di persone sul forum di YUI con tutte queste caratteristiche e più in modo eclettico e innovativo.
Stiamo anche ispirato la leadership organizzativa Jenny ha dimostrato nel suo tempo a Yahoo. Attualmente, lei è il direttore principale di YUIBlog, portando le voci tecnici da tutta Yahoo a queste pagine per condividere le loro intuizioni. Ha inoltre organizzato il nostro annuale summit di ingegneria frontend a Yahoo, portando centinaia di ingegneri di Yahoo da tutto il mondo insieme in una ricca settimana di conferenza tecnica. Ha insegnato corsi di una settimana YUI agli ingegneri negli Stati Uniti, Corea e Giappone, e lei è stato un membro integrante del gruppo trucco giorno a Yahoo che è una parte così importante della nostra cultura ingegneristica.
Se lei è la codifica, la scrittura, l'insegnamento o portano - che sono tutti aspetti della descrizione del lavoro il tecnico moderno - Jenny imposta una barra in alto con la sua intelligenza, dedizione, fantasia e ingegno. Ada ne sarebbe orgoglioso.
[ foto di Jenny utilizzata per gentile concessione di Stephen Woods]
Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!
Sondaggio: Quando è una fisarmonica non è una fisarmonica?
23 marzo, 2009 alle 9:20 pm Christian Crumlish | In Progettazione e Sviluppo | 6 commenti
Sto cercando il feedback da parte di persone che hanno progettato o costruito un'interfaccia che utilizza un modulo "fisarmonica" (o stanno pensando di farlo). Vedete, ho lavorato su un modello di progettazione per i moduli di fisarmonica, e mi piacerebbe buttare via una manciata di domande aperte alla comunità attraverso questa breve rassegna . Sarò ascoltare anche altrove, su Twitter ( @ mediajunkie ) e sulla mailing list in cui i web designer e sviluppatori appendere fuori.
(Mi rendo conto che questo non è un sondaggio scientifico. Sto solo interessato a coinvolgere l'intera comunità in una discussione invece di cercare di imporre la mia vista o Yahoo! 's vista sulla comunità come autorevole.)
Ovunque io vada ultimamente, sembra che gli interaction designer e sviluppatori web si parla di widget fisarmonica e discutendo su ciò che rende una fisarmonica una fisarmonica. Non tutti coloro che lavorano in questo campo ha sentito il termine (alcuni possono semplicemente fare riferimento a "pannelli truccato" o "pannelli comprimibili"), ma la maggior parte ottiene il succo abbastanza facilmente. Ironia della sorte, nessuno degli elementi dell'interfaccia utente descritti come fisarmoniche condividere il comportamento effettivo di un mondo reale fisarmonica (strumento musicale): vale a dire che lo stretching una fisarmonica apre tutte le pieghe in modo uniforme.
Fisarmoniche stato un on-e off topic di discussione sui principali mailing list IxDA , li abbiamo discusso nel nostro Pattern Library seminario a Vancouver all'inizio di questo mese, e c'è stata una discussione in corso sulla fisarmonica nella nostra mailing list interna di progettazione qui a Yahoo !.
Così mi sono seduto con alcune persone della squadra di YUI (e Marco, il creatore di uno sperimentale widget di fisarmonica YUI ) un po 'di tempo fa per ordinare attraverso un progetto di un modello di fisarmonica che potrebbe aiutare a informare lo sviluppo di un componente ufficiale YUI.
In generale, la maggior parte delle persone d'accordo su che cosa stiamo parlando quando parliamo di un elemento di interfaccia fisarmonica. Tutti concordano sul fatto che fisarmoniche sono usati per comprimere il contenuto in uno spazio limitato e che sono costituiti da pannelli che possono collassare o espandere. Al di là di questo, ci sono un certo numero di sottili sfumature che non tutti sono d'accordo su.
Una tendenza che ho notato è che il front-end gli sviluppatori tendono ad essere agnostico su come dovrebbe funzionare la fisarmonica, considerandola semplicemente una variante di un widget albero. I progettisti tendono ad essere più prescrittivo, dicendo che per essere una fisarmonica deve comportarsi in tal modo e modo (ma non tutti i progettisti d'accordo su cosa queste regole sono).
Alla fine, la gente YUI produrrà codice che può essere fatto per fare praticamente qualsiasi cosa. Non stiamo andando a cercare di imporre il proprio gusto o le preferenze nel design attraverso la funzionalità del codice stesso. Tuttavia, useremo il modello associato per dare suggerimenti e consigli tratti dall'esperienza della comunità intero progetto, e probabilmente per le pressioni comportamenti predefiniti che corrispondono a ciò che la maggior parte delle persone si aspettano.
Quindi, se hai pochi minuti e un parere, si prega di visitare il sondaggio e fatemi sapere cosa ne pensate!
Chiudo il sondaggio il 30 aprile.
Condividi ed estendere: Segnalibro con Del.icio.us | Digg it! | reddit!

Copyright © 2006-2012 Yahoo! Inc. Tutti i diritti riservati. Privacy Policy - Termini di servizio
Powered by WordPress su Yahoo! Web Hosting .




