TrialTool for YUI Examples

In my last post, I had mentioned about YAHOO Hack day, and the hack that won us the XBox and iPods. This post is about another hack that we had submitted.
Some believe that the best way to start writing code is looking at examples. The YQL Console is a great example that show the various YQL queries and lets users manipulate and execute them in the console to see results.
TrialTool is a console for Javascript APIs and I thought it would be great if we could adapt the YUI examples be shown in a console similar to YQL. There are a lot of examples and writing them in the Trial Tool Example file format would be hard. Hence, we used YQL and Yahoo pipes to automatically parse individual examples and change them to a format that TrialTool could use. If you look at the source code of individual examples, all examples start and end with comments. Yahoo pipes would visit the individual web sites, and pick up the content inside the comments.
The content inside the comment is then split into fourparts
  • Title of the page which is all the content enclosed inside the H1 tag. This is assigned to [a.class="example-name"]'s innerHTML.
  • The content of the Script tag
  • Everything, except script tags inside [div.id="example-canvas"] , inside a [div.class="example-html", to indicate the corresponding HTML tags required for the example.
  • Everything else inside the [div.class="example-docs"] tag, for documentation.
The four are enclosed inside an [li.class="example"] and given out. Thus, we have all the examples listed in sequential order. I then manually categorized them by forking functionality. Using the "Fork Mode", examples that were incorrectly parsed were removed. These were examples that were
  • were dependent on server
  • required to be opened in a new window
  • did not confirm to the parsing format.
Looks like I will have to manually add the examples in. I seem to have most of the examples in and I hope people trying out YUI3 find these examples in TrialTool, a good starting point.