<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet href="/stylesheets/rss.css" type="text/css"?>
<rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/">
  <channel>
    <title>Dev411 Blog: Comparing CPAN Modules with YUI DataTable</title>
    <link>http://www.dev411.com/blog/2007/11/09/comparing-cpan-modules-with-yui-datatable</link>
    <language>en-us</language>
    <ttl>40</ttl>
    <description>John Wang on Technology</description>
    <item>
      <title>Comparing CPAN Modules with YUI DataTable</title>
      <description>&lt;p&gt;There is a lot of choice on the CPAN for open source Perl libraries and sometimes it's difficult to get an idea of how modules compare to each other. &lt;a href="http://ratings.cpan.org"&gt;CPAN Ratings&lt;/a&gt; is a good source of reviews but it's not convenient to compare one module with another. To provide a partial solution, I whipped up a quick &lt;a href="http://www.dev411.com/perl/cpancompare"&gt;CPAN Compare&lt;/a&gt; page which will pull the CPAN Ratings from a number of modules and summarize them for you.&lt;/p&gt;

&lt;div style="text-align:center;margin:1em 0 1em 0"&gt;&lt;a href="/perl/cpancompare/"&gt;&lt;img alt="CPAN Compare Modules" src="/images/articles/cpan_compare_ss_400x.png" style="border:0" /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p&gt;I decided to use &lt;a href="http://developer.yahoo.com/yui/datatable/"&gt;YUI DataTable&lt;/a&gt; for this. I've heard good things about YUI so I decided to give it a try. Getting the example code to work off of the Yahoo website almost as straight forward as say using Scriptaculous demos but it was faster than working with Dojo in the early days. The nice thing about the DataTable is that it takes a JavaScript array which can be populated using server-side JSON generated code. I used JSON::XS for this.&lt;/p&gt;

&lt;p&gt;YUI DataTable has a nice sorting feature and it can sort on text, numbers, dates, etc. However, it does not seem to be able to sort on visual information only so if you include HTML markup, that will be used for sorting as well. To get around this I used standard text sorting and customized the title fields to assist in the sorting. For example, in a link, I start with &amp;lt;a title=" instead of &amp;lt;a href=" because title is arbitrary and can be used to mirror the InnerHTML. For numbers a text sort will have 25 come before 4 so I added leading zeros to numbers using sprintf and put them in the title attribute as well.&lt;/p&gt;

&lt;p&gt;A few Perl modules and the Logo Creator website made this easy to set up. YUI DataTable has a nice default CSS so I just left that as is.&lt;/p&gt;

&lt;p&gt;Note: YUI DataTable is convenient if you just drop in a Perl data structure and have it generate the HTML and JS for you. This script uses 3 DataTables (ratings, popular and recent) so I wrote a Perl wrapper for YUI which takes a hashref and generates the client code, extracting the fields from the column definitions. This works because YUI does not require the HTML table to be built beforehand. By not having an underlying table, it's faster to get running but also won't fallback as nicely for people who aren't running JS (8% of users?). As an alternative, jQuery has a &lt;a href="http://ideamill.synaptrixgroup.com/jquery/tablefilter/tabletest.htm"&gt;couple&lt;/a&gt; of &lt;a href="http://tablesorter.com/docs/#Demo"&gt;add ons&lt;/a&gt; which work by enhancing an existing HTML table. jQuery has some nice syntax but I haven't gotten around to using it yet. Perhaps it's worth a look.&lt;/P&gt;</description>
      <pubDate>Fri, 09 Nov 2007 00:09:00 -0600</pubDate>
      <guid isPermaLink="false">urn:uuid:ae818063-2322-4837-b2a9-4bed5ff26768</guid>
      <author>John Wang</author>
      <link>http://www.dev411.com/blog/2007/11/09/comparing-cpan-modules-with-yui-datatable</link>
      <category>yui</category>
      <category>perl</category>
    </item>
    <item>
      <title>"Comparing CPAN Modules with YUI DataTable" by John Wang</title>
      <description>&lt;p&gt;The most useful part of the source code is probably the Perl YUI wrapper I wrote to take away some of the pain of writing the JS. You can find it &lt;a href="http://www.dev411.com/perl/DataTable.pm.txt" rel="nofollow"&gt;here&lt;/a&gt;.&lt;/p&gt;


	&lt;p&gt;There are two schools of thought on writing server-side wrappers for AJAX/DHTML libraries with one side thinking they are the bomb (Rails folks) and others thinking that writing in one language for server-side code and JS for the client-side is the way to go (Catalyst folks), for YUI DataTable, I thought it was definitely nice to have a Perl wrapper.&lt;/p&gt;</description>
      <pubDate>Tue, 24 Jun 2008 02:20:28 -0500</pubDate>
      <guid isPermaLink="false">urn:uuid:1808a07c-d6b3-4290-a90a-8ee85f13bc9b</guid>
      <link>http://www.dev411.com/blog/2007/11/09/comparing-cpan-modules-with-yui-datatable#comment-252</link>
    </item>
    <item>
      <title>"Comparing CPAN Modules with YUI DataTable" by Just in</title>
      <description>&lt;p&gt;Would like to see the entire source code :)&lt;/p&gt;</description>
      <pubDate>Wed, 02 Apr 2008 01:37:43 -0500</pubDate>
      <guid isPermaLink="false">urn:uuid:83c82546-b015-4748-8a9c-43a358cecb44</guid>
      <link>http://www.dev411.com/blog/2007/11/09/comparing-cpan-modules-with-yui-datatable#comment-241</link>
    </item>
    <item>
      <title>"Comparing CPAN Modules with YUI DataTable" by John Wang</title>
      <description>&lt;p&gt;Thanks for the heads up. It&amp;#8217;s working again :)&lt;/p&gt;</description>
      <pubDate>Sun, 30 Dec 2007 06:58:53 -0600</pubDate>
      <guid isPermaLink="false">urn:uuid:5255c445-db8c-446b-a17e-cc825190d714</guid>
      <link>http://www.dev411.com/blog/2007/11/09/comparing-cpan-modules-with-yui-datatable#comment-229</link>
    </item>
    <item>
      <title>"Comparing CPAN Modules with YUI DataTable" by Ask Bj&#248;rn Hansen</title>
      <description>&lt;p&gt;Any plans to make this work (again?)?&lt;/p&gt;


	&lt;p&gt;:-)&lt;/p&gt;


	&lt;p&gt;(the buttons just shows some blog posting from your blog)&lt;/p&gt;


	&lt;pre&gt;&lt;code&gt;- ask&lt;/code&gt;&lt;/pre&gt;</description>
      <pubDate>Sun, 02 Dec 2007 15:07:30 -0600</pubDate>
      <guid isPermaLink="false">urn:uuid:3ec57ae8-a612-4299-9ff5-f95122beada6</guid>
      <link>http://www.dev411.com/blog/2007/11/09/comparing-cpan-modules-with-yui-datatable#comment-221</link>
    </item>
  </channel>
</rss>
