Building TipTheWeb with YUI 3
TipTheWeb is a new service that lets people directly support their favorite web content by tipping it. For instance, if you find a great blog post, you could tip it 25 cents.
TipTheWeb is a non-profit organization promoting freely-accessible, high-quality web content by awarding publishers that receive tips. If you publish online, you can use your TipTheWeb account to claim the places you publish to receive tips and be eligible to receive awards from TipTheWeb.
TipTheWeb's Use of YUI 3
The core features of TipTheWeb are implemented on a few highly-functional web pages which communicate with the server over Ajax. For each of these pages we created a custom YUI 3 module that exposes a page-level class used to coordinate actions between the functional parts of the page.
In one of our application's main pages, the Tips page, you can see how this approach is applied with the page-level class TipsWindow. The main functional parts of the page are the widgets: CreateTip used for creating tips, and the TipList widgets for editing, canceling, and funding existing tips.
A Lot of Overlays
Y.Overlays extensively throughout our application's UI to implement user-interactions; this allows us to keep the interface clutter-free while still having the functionality for advanced features available on the page. We needed features that were not built into
Y.Overlay, so we developed Overlay Extras, which is in the YUI 3 Gallery and being used by a lot of other YUI 3 powered sites. Here are some place where we use Overlays on TipTheWeb:
Current State of TipTheWeb
Be sure to catch our talk at YUIConf 2010 where we will be presenting (more in depth) on how we use YUI 3 and YQL at TipTheWeb.