var NavigationBox = Class.create();

NavigationBox.prototype =
{
    Element: null,
    ElementId: null,
    MinHeightFor2Lines: null,
    ElementIdArrayToApplyClass: null,
    DefaultClassNameArray: null,
    TwoLinesClassNameArray: null,
    
    initialize: function (ElementId, MinHeightFor2Lines, ElementIdArrayToApplyClass, DefaultClassNameArray, TwoLinesClassNameArray)
    {  
        this.Element = $(ElementId);
        this.ElementId = ElementId;
        this.MinHeightFor2Lines = MinHeightFor2Lines;          
        this.ElementIdArrayToApplyClass = ElementIdArrayToApplyClass;
        this.DefaultClassNameArray = DefaultClassNameArray;
        this.TwoLinesClassNameArray = TwoLinesClassNameArray;
        
        Event.observe(window, "resize", this.handleResize.bindAsEventListener(this));
        Event.observe(window, "load", this.handleLoad.bindAsEventListener(this));
    },   
    
    refresh: function ()
    {
        var height = this.Element.getHeight();
                
        if (height >= this.MinHeightFor2Lines)
        {
            this.applyClassNames(this.TwoLinesClassNameArray);
        }
        else
        {
            this.applyClassNames(this.DefaultClassNameArray);
        }
    }, 
    
    applyClassNames: function (ClassNameArray)
    {
        for(var i=0; i<this.ElementIdArrayToApplyClass.length; i++)
        {
            if ($(this.ElementIdArrayToApplyClass[i]).className != ClassNameArray[i])
                $(this.ElementIdArrayToApplyClass[i]).className = ClassNameArray[i];
        } 
    },
    
    handleResize: function ()
    {
        this.refresh();
    },
    
    handleLoad: function ()
    {
        this.refresh();
    }
}