Yahoo! User Interface Blog (YUIBlog)

Utilizzando YUI 2 sul motore di ricerca DuckDuckGo

DuckDuckGo è un motore di ricerca che utilizza ampiamente YUI. Ecco cosa si usa in particolare:

• ImageLoader. Matt Mlinac di YUI 2 ImageLoader è stata la prima cosa che ho implementato e che in origine mi ha agganciato su YUI per questo progetto. DuckDuckGo ha favicon accanto ai risultati e spesso ha "zero-click Info" sopra i risultati che di solito include un'immagine . Non volevo che queste immagini di competere con i risultati durante il caricamento, come ottenere risultati il ​​più velocemente possibile è l'obiettivo finale.

  L'utilità ImageLoader gestisce bene caricando le immagini dopo il caricamento della pagina. DDG anche auto-carica la pagina successiva dei risultati quando si scorre verso il basso. A volte le icone favicon sono dunque nascoste, e con ImageLoader loro carico è in ritardo (a volte a tempo indeterminato) fino a quando necessario. Per fare questo, c'è un gruppo di immagini differenti per (interno) della pagina, ognuno con il suo grilletto personalizzate.

    div.event = new YAHOO.util.CustomEvent ('it');
       var = new IG1 YAHOO.util.ImageLoader.group (div, 'click');
       ig1.addCustomTrigger (div.event);
       div.ig = IG1;
  

• Cookie. DuckDuckGo ha un sacco di impostazioni , che vengono memorizzati tramite i cookie e alternativamente attraverso params URL . Quando i cookie vengono utilizzati, utilizzo Nicola Zakas di YUI 2 Utility Cookie per ottenere facilmente e impostare i valori.

    YAHOO.util.Cookie.set (cookie, valore {scadenza: new Date ("12 gennaio, 2025")});
     x ki = | | YAHOO.util.Cookie.get ("i"); 

• StyleSheet. Alcune impostazioni DDG cambiare il look and feel del sito. Questi cambiamenti sono in realtà compiuta dopo il caricamento della pagina tramite Luke Smith YUI 2 Utility StyleSheet . Alcuni di questi cambiamenti sono semplici e posso solo usare il setStyle funzione Dom .

    YAHOO.util.Dom.setStyle ('B2', 'display', 'block'); 

  Altri richiedono cambiamenti classe effettiva, che io uso l'utilità di fare.

    . YAHOO.util.StyleSheet ('DDG') set ('ci.', {Display: "blocco"}).
               set (, {display: "blocco"} 'cid.').
               set (, {display: "blocco"} 'CI2.').
               abilitare (); 

• Dom. Io uso anche ad alcune funzioni di base Matt Sweeney componente YUI 2 Dom . Mi fa riferimento setStyle sopra, e ho anche utilizzare il relativo getStyle , addClass e removeClass funzioni. Inoltre, trovo il getViewportHeight , getViewportWidth , getX e getY funzioni che devono essere incredibilmente utile per far funzionare le cose cross-browser, e ora sugli schermi mobili.

• KeyListener. DDG ha un sacco di scorciatoie da tastiera che consentono di navigare i risultati senza il mouse. Io uso il 2 KeyListener YUI componente per abilitare queste scorciatoie.

    kl14 = new YAHOO.util.KeyListener (documento, {tasti: [70]}, {fn: non}); kl14.enable (); 

• Completamento automatico. Attualmente sto lavorando per aggiungere suggerimenti di ricerca al motore di ricerca, e verrà utilizzato Jenny Donnelly YUI 2 Completamento automatico dei componenti per il front-end. Capisco che si sta completamento automatico introdotto in YUI 3 presto. Tutto il resto io uso è già stato introdotto in YUI 3, anche se uso ancora YUI 2. Comunque, io sarò esplorare la migrazione verso YUI 3 presto.

Circa l'autore: Gabriel Weinberg è il fondatore del motore di ricerca DuckDuckGo, con sede a Valley Forge, Pennsylvania. Gabriel è stato uno dei fondatori di avvio per oltre dieci anni, e la sua ultima azienda è stata venduta nel 2006. Gabriele è laureato al MIT in Fisica e di Tecnologia e Policy Program.

Trova conversazioni: Bloglines | technorati

Condividere ed estendere: Bookmark with del.icio.us | Digg it! | reddit!