Interfaz de usuario de Yahoo! Blog (YUIBlog)

Edificio TipTheWeb con YUI 3

Sobre el autor: Eric Ferraiuolo es un director de TipTheWeb y Co-Fundador de Software Oddnut . Él escribe en su blog: 925 HTML , y se puede encontrar en Twitter: @ ericf . Eric era un presentador invitado en YUIConf 2009 .

TipTheWeb es un nuevo servicio que permite a las personas apoyan directamente su contenido web favorito al inclinar ella. Por ejemplo, si usted encuentra una gran entrada en el blog, se podría inclinar de 25 centavos de dólar.

TipTheWeb es una organización sin fines de lucro que promueve de libre acceso y de alta calidad de contenidos web mediante la concesión de los editores que reciben propinas. Si publica en línea, usted puede utilizar su cuenta TipTheWeb para reclamar los lugares que publican para recibir consejos y ser elegibles para recibir premios de TipTheWeb.

Uso TipTheWeb de YUI 3

La interfaz de usuario de TipTheWeb está completamente construido en la cima de YUI 3 (que bebió el Kool-Aid.) El enfoque que tomamos fue utilizar YUI 3 como el fundamento y la estructura de nuestro código JavaScript. Hemos construido 33 personalizados YUI 3 módulos (56 si se incluyen submódulos, plugins, y rodillo-ups), varios de los cuales hemos contribuido al YUI 3 Galería: Administrador de componentes , Markout , Extras de superposición y de recursos REST .

Las clases de nivel de página

Las características fundamentales de TipTheWeb se implementan en algunos Web pages altamente funcionales que comunican con el servidor a través de Ajax. Para cada una de estas páginas hemos creado una costumbre YUI 3 módulos que expone una clase de nivel de página que permita coordinar las acciones entre las partes funcionales de la página.

En una de las páginas principales de nuestra aplicación, la página de consejos, usted puede ver cómo este enfoque se aplica con el TipsWindow clase a nivel de página. Las principales partes funcionales de la página son los widgets: CreateTip utilizados para la creación de consejos, y los reproductores TipList para la edición, la cancelación, y la financiación de los consejos existentes.

Un lote de superposiciones

Usamos Y.Overlay s extensivamente a través de la interfaz de usuario de nuestra aplicación para poner en práctica el usuario interacciones, lo que nos permite mantener la interfaz libre de cables sin dejar de tener la funcionalidad de las características avanzadas disponibles en la página. Necesitábamos características que no fueron incorporados en Y.Overlay , por lo que hemos desarrollado superposición de Extras , que es en el YUI 3 Galería y siendo utilizado por una gran cantidad de otros sitios de YUI 3 potencia. Aquí hay algún lugar donde se utiliza superposiciones de TipTheWeb:

Estado actual de TipTheWeb

Nos encantaría que usted pruebe TipTheWeb , ahora estamos en invitar a sólo beta, por lo que solicitar una invitación en nuestro sitio y le enviaremos un código de invitación.

No te pierdas nuestra charla en YUIConf 2010 , donde estaremos presentando (más en profundidad) sobre cómo utilizamos YUI 3 y YQL en TipTheWeb.

Buscar conversaciones: Bloglines | technorati

Compartir y ampliar: Marcar página con del.icio.us | Digg It! | reddit!