var change_category;

(function() {
    
    var tweener;
    
    // setup the change function
    change_category = {
        init: function(id_name, path, element, func)
        {
            // find the open category
            var cat = false;
            var cats = $$('#categories .cat_control');
            var new_tab = $(this.title.toLowerCase());
            for(var i = 0; i < cats.length; i++)
            {
                // capture the open cat
                if (!cats[i].tweener) cats[i].tweener = new Fx.Tween($$('#' + cats[i].id)[0], {duration: 'short', fps: 100, link: 'chain'});
                if (cats[i].style.display != 'none')
                    cat = cats[i];
                
                // store the tab we're changing to
                if (new_tab == cats[i])
                    new_tab = cats[i];
            }
            
            // capture any same clicks
            if (cat == new_tab)
                return false;
            
            // change the tabs
            cat.tweener.start('opacity', 0).chain(function() 
            {
                // add the tweener
                cat.style.display = 'none';
                new_tab.tweener.set('opacity', 0);
                new_tab.style.display = '';
                new_tab.tweener.start('opacity', 1);
                
                // change the buttons
                var buttons = $$('#categories .wrapping_box li');
                for(var i = 0; i < buttons.length; i++)
                {
                    buttons[i].className = 'cat_' + buttons[i].firstChild.title.toLowerCase();
                    if (buttons[i].className == 'cat_' + new_tab.id)
                        buttons[i].className = buttons[i].className + ' on';
                }
            });
            return false;
        }
    };
})();

window.addEvent("domready", function() {
  $$('#categories .wrapping_box ul li a').addEvent('click', change_category.init);
});