Yahoo User Interface Blog (YUIBlog)

Gebouw TipTheWeb met YUI 3

5 oktober 2010 om 21:35 door Eric Ferraiuolo | In ontwikkeling , In the Wild , YUI Implementaties | No Comments

Over de auteur: Eric Ferraiuolo is een bestuurder van TipTheWeb en mede-oprichter van Oddnut Software . Hij schrijft op zijn blog: 925 HTML , en is te vinden op Twitter worden: @ ericf . Eric was een featured presentator bij YUIConf 2009 .

TipTheWeb is een nieuwe dienst waarmee mensen direct hun favoriete web content ondersteuning door kantelen het. Bijvoorbeeld, als je een geweldige blog post, kan je een tip dat 25 cent.

TipTheWeb is een non-profit organisatie ter bevordering van vrij toegankelijke, kwalitatief hoogstaande web content door het toekennen van uitgevers die tips te ontvangen. Als u online te publiceren, kunt u gebruik maken van uw TipTheWeb account om de plaatsen die u publiceert naar tips te ontvangen en in aanmerking komen voor prijzen vanaf TipTheWeb ontvangen te vorderen.

TipTheWeb Gebruik van YUI 3

De gebruikersinterface van TipTheWeb is volledig gebouwd op de top van YUI 3 (we dronken de Kool-Aid.) De aanpak die we namen was het YUI 3 te gebruiken als de basis en structuur voor onze JavaScript-code. We hebben gebouwd 33 custom YUI 3 modules (56 als je onder andere submodules, plugins, en de roll-ups), waarvan een aantal hebben we bijgedragen de YUI 3 Gallery: Component Manager , MarkOut , Overlay Extra's , en de REST Resource .

Page-niveau klassen

De hoofdkenmerken van TipTheWeb worden uitgevoerd op een aantal zeer functionele webpagina's die communiceren met de server via Ajax. Voor elk van deze pagina's hebben we een aangepaste YUI 3 module die een pagina-level class gebruikt om acties tussen de functionele onderdelen van de pagina te coördineren blootstelt.

In een van de belangrijkste onze applicatie pagina's, de Tips pagina kunt u zien hoe deze aanpak wordt toegepast met de pagina-level class TipsWindow. De belangrijkste functionele onderdelen van de pagina zijn de widgets: CreateTip gebruikt voor het creëren tips, en de TipList widgets voor het bewerken, annuleren, en de financiering van bestaande tips.

A Lot van Overlays

We maken gebruik van Y.Overlay s veel door UI onze applicatie de gebruiker-interactie uit te voeren; dit stelt ons in staat om de interface te houden rommel-vrij, terwijl nog steeds de functionaliteit voor geavanceerde functies die beschikbaar zijn op de pagina. We hadden behoefte aan functies die niet zijn ingebouwd in Y.Overlay , dus we ontwikkelden Overlay Extra's , die in de YUI drie Gallery en wordt gebruikt door een groot aantal andere YUI 3 aangedreven sites. Hier zijn enkele plaats waar we Overlays gebruiken op TipTheWeb:

De huidige staat van TipTheWeb

We willen liefde voor jou om uit te proberen TipTheWeb , zijn we nu in slechts invite-beta, dus vragen om een uitnodiging op onze site en wij sturen u een uitnodiging code.

Zorg ervoor dat u het gesprek op te vangen YUIConf 2010 , waar we zullen presenteren (meer in diepte) over de manier waarop wij gebruik van YUI 3 en YQL op TipTheWeb.

Zoek gesprekken: Bloglines | technorati

Delen en uit te breiden: Bookmark met del.icio.us | digg it! | reddit!