YUI AccordionView widget

Feed Frenzy

This is an example of the YUI AccordionView widget in action. This widget was created by Marco van Hylckama Vlieg. All code is licensed under the BSD license.

This is a simple feed reader, generated entirely from script. Because the panels are huge, animation is disabled because it wouldn't look very smooth on most machines. This example uses the YUI TabView widget and some backend PHP code. Of course all this code is included in the zipfile.

Code

(function() {
    var myAccordion = new YAHOO.widget.AccordionView('menu', 
    {   collapsible: false, 
        expandable: false, 
        width: 'auto', 
        animate: false
    });

    var myPanels = [
    {label: 'World News', content: '<div id="p1"></div>'},
    {label: 'Web Development', content: '<div id="p2"></div>'},
    {label: 'Design', content: '<div id="p3"></div>'},
    {label: 'Gadgets and Photography', content: '<div id="p4"></div>'}
    ];
    myAccordion.addPanels(myPanels);
    myAccordion.openPanel(0);
    myAccordion.appendTo('container');

    var tabViews = [new YAHOO.widget.TabView(), 
                    new YAHOO.widget.TabView(), 
                    new YAHOO.widget.TabView(), 
                    new YAHOO.widget.TabView()];

    var aFeeds = [
        [
            {label: 'Reuters', feed: 'http://feeds.reuters.com/reuters/topNews'},
            {label: 'Associated Press', feed: 'http://hosted.ap.org/lineups/TOPHEADS.rss?SITE=AP&SECTION=HOME'},
            {label: 'CNN World News', feed: 'http://rss.cnn.com/rss/cnn_world.rss'},
            {label: 'BBC News', feed: 'http://newsrss.bbc.co.uk/rss/newsonline_uk_edition/front_page/rss.xml'},
            {label: 'Yahoo! News', feed: 'http://rss.news.yahoo.com/rss/topstories'},
            {label: 'Google News', feed: 'http://news.google.com/?output=rss'},
        ],
        [
            {label: 'Think Vitamin', feed: 'http://feeds.feedburner.com/vitaminmasterfeed'},
            {label: 'Zeldman', feed: 'http://www.zeldman.com/rss/'},
            {label: 'Chris Heilmann', feed: 'http://www.wait-till-i.com/feed/'},
            {label: 'Roger Johansson', feed: 'http://www.456bereastreet.com/feed.xml'},
            {label: 'YUI', feed: 'http://feeds.yuiblog.com/YahooUserInterfaceBlog'},
            {label: 'YDN', feed: 'http://developer.yahoo.net/blog/index.xml'},
            {label: 'Eric Meyer', feed: 'http://meyerweb.com/eric/thoughts/rss2/summary'},
            {label: 'Dave Shea', feed: 'http://www.mezzoblue.com/rss/index.xml'},
            {label: 'Stoyan', feed: 'http://www.phpied.com/feed/'},
            {label: 'Snook', feed: 'http://feeds.feedburner.com/snookca'},
            {label: 'Marco', feed: 'http://www.i-marco.nl/weblog/rss.xml'}
        ],
        [
            {label: 'Shaun Inman', feed: 'http://www.shauninman.com/feeds/posts'},
            {label: 'John Hicks', feed: 'http://feeds.feedburner.com/hicksdesign'},
            {label: 'Veerle Pieters', feed: 'http://feeds.feedburner.com/veerlesblog'},
            {label: 'Cameron Moll', feed: 'http://www.cameronmoll.com/index.xml'},
            {label: 'Jason Santa Maria', feed: 'http://www.jasonsantamaria.com/articles/rss/'},
            {label: 'Mark Boulton', feed: 'http://www.markboulton.co.uk/journal/rss_2.0/'},
            {label: 'Khoi Vinh', feed: 'http://feeds.feedburner.com/subtraction'},
            {label: 'Andy Rutledge', feed: 'http://www.andyrutledge.com/feeds/arfeed.xml'}
        ],
        [
            {label: 'Engadget', feed: 'http://feeds.engadget.com/weblogsinc/engadget'},
            {label: 'Gizmodo', feed: 'http://feeds.gawker.com/gizmodo/excerpts.xml'},
            {label: 'DP Review', feed: 'http://www.dpreview.com/feeds/news.xml'},
            {label: 'Ken Rockwell', feed: 'http://www.kenrockwell.com/rss.php'},
            {label: 'Mac Rumors', feed: 'http://www.macrumors.com/macrumors.xml'},
            {label: 'Uber Gizmo', feed: 'http://feeds.feedburner.com/ubergizmo'},
            {label: 'Crave', feed: 'http://news.cnet.com/8300-17938_105-1.xml'}
        ]
    ];
    var i, j, oConfig, bActive;
    for (i=0;i<tabViews.length;i++) {
        for(j=0;j<aFeeds[i].length;j++) {
            bActive = (j === 0) ? true : false;
        if(aFeeds[i][j]) { // no idea why I'm doing this but IE breaks if I don't
                oConfig = {
                    label: aFeeds[i][j].label,
                    dataSrc: 'php/rss.php?feed=' + aFeeds[i][j].feed,
                    cacheData: true,
                    active: bActive
                    }
            };
            tabViews[i].addTab(new YAHOO.widget.Tab(oConfig));
        }
        tabViews[i].appendTo('p' + (i+1));
    }
})();