/*
    Browse, Browse Sale, and Calendar all share collapse panels on the left that need very similar behaviours.
    
    This class encapsulates these behaviours to avoid duplication.
    
*/

Site.Controllers.CollapsePanel = Class.create
(
    Site.Base,
    {
        initialize: function($super, element)
        {
            $super();
            
            this.element = element;
        
            this.collapsePanels = [];
            
            this.addBlocks("collapsePanelAfterOpen", "collapsePanelBeforeClose");
            
            element.select("li.collapse-panel").each
            (
                function(collapsePanel)
                {
                    var panel = collapsePanel.select("div.panel").first();
                    var button = collapsePanel.select("p").first();
            
                    this.collapsePanels.push(new Site.Widgets.CollapsePanel(button, panel, {afterOpen: this.blocks.collapsePanelAfterOpen, beforeClose: this.blocks.collapsePanelBeforeClose}));
                    
                    panel = null;
                    button = null;
                },
                this
            );
        },
    
        collapsePanelBeforeClose: function(element)
        {
            /* 
                the overflow auto on the lists causes a few animation problems in firefox(!) notably:
                 * Gecko (Mac) - scrollbars push adjacent to content above  
                 * Gecko (PC)  - flickering content above
            
                so we hide the overflow before animating
            */
            
            if (!Prototype.Browser.IE)
            {
                if (list = element.select("ul").first())
                {
                    //list.style.overflow = "hidden";
                    list = null;
                }
            }
        },

        collapsePanelAfterOpen: function(element)
        {
            // restore the overflow after the panel is open
        
            if (!Prototype.Browser.IE)
            {
                if (list = element.select("ul").first())
                {
                    //list.style.overflow = "auto";
                    list = null;
                }
            }

        }        
    }
);