var userInterface = Class.create({

    wWidth : null,
    
    wHeight : null,

    marginHeight : 5,

    marginWidth : 5,

    fixedWidth: null,
    fixedHeight: null,

    mapMaximunHeight: false,

    
    init: function(options){

        extend(this, options);

        this.header = $("#divHeader");
        this.menus = $("#divMenus");
        this.menuSearch = $("#divMenuSearch");
        this.menuSeparator = $(".divMenuSeparator");
        this.menuResizable = $("#divMenus .ui-resizable-e");
        this.menusTitle = $(".menuTitle");
        this.menuLayersManager = $("#divMenuLayersManager");
        this.menuLayersManagerBody = $("#divMenuLayersManagerBody");
        this.vseparator = $("#divVSeparator");
        this.vseparatorcontainer = $(".dragContainer");
        this.map = $("#divMap");
        this.mapContainer = $("#divMapContainer");
        this.mapOL = $("#divMap_OpenLayers_ViewPort");
        this.footer = $("#divFooter");
        this.overviewMap = $("#divOverviewMap");
        this.baseLayerSwitcher = $("#divBaseLayerSwitcher");
        this.statusBar = $("#divStatusBar");
        this.scaleSelector = $("#divScaleSelector");
        this.toolBar = $("#divMapToolBar");
        this.info = $("#divInfo");
        this.profile = $("#divProfile");
        this.text = $("#divText");
        this.slider = $("#divTransparency");
        this.obsolete = $("#divObsoleteBrowser");

        this.loading = $("#divLoading");

    },

    resize: function(){

        this.hideOverflow();

        this.getSizes();
        this.resizeHeader();
        this.resizeObsolete();
        this.resizeMenus();
        this.resizeMap();
        this.resizeVSeparator();
        this.resizeToolBar();
        this.resizeStatusBar();
        this.resizeScaleSelector();
        this.resizeOverviewMap();
        this.resizeBaseLayerSwitcher();
        this.resizeSlider();
        this.resizeInfo();
        this.resizeProfile();
        this.resizeText();
        this.resizeFooter();

        this.resizeLoading();

        this.restoreOverflow();
    },

    resizeMenuMap : function() {
        this.resizeMap();
        this.resizeVSeparator();
        this.resizeToolBar();
        this.resizeStatusBar();
        this.resizeScaleSelector()
        this.resizeOverviewMap();
        this.resizeBaseLayerSwitcher();
        this.resizeSlider();
        this.resizeInfo();
        this.resizeText();
        this.resizeProfile();
    },

    resizeMapHeight: function() {
        this.resizeMap();
        this.resizeToolBar();
        this.resizeStatusBar();
        this.resizeScaleSelector();
        this.resizeOverviewMap();
        this.resizeProfile();
    },

    hideOverflow: function() {
        if (!this.originalOverflow) {
            this.originalOverflow = $("body").css("overflow");
        }
        if(this.loading.css("display") == "none") {
            this.originalOverflow = $("body").css("overflow");
        }
        $("body").css("overflow","hidden");

    },

    restoreOverflow: function() {
        if(this.loading.css("display") == "none") {
            $("body").css("overflow",this.originalOverflow);
        }
    },


    getSizes: function() {
        this.wWidth = $(window).width();
        this.wHeight = $(window).height();

        this.left = 0;

        if (this.fixedWidth) {
            this.left = Math.round((this.wWidth - this.fixedWidth) / 2,0);
            if (this.mapMaximunHeight) {
                this.left -= 9;
            }
            this.wWidth = this.fixedWidth;
        }
    },

    resizeHeader: function() {
        if (!this.header) return false;

        this.header.width(this.wWidth);
        this.header.css("left",this.left);
    },

    resizeLoading: function() {
        if (!this.loading) return false;

        var lWidth  = $(window).width();
        var lHeight = this.wHeight;

        this.loading.width(lWidth);
        this.loading.height(lHeight);

        var lBack = $(this.loading.selector+"Background");

        lBack.height(lHeight);
        lBack.width(lWidth);

        var lBody = $(this.loading.selector+"Body");

        lBody.height(lHeight*0.8);
        lBody.width(lWidth*0.8);
        lBody.css("top",lHeight*0.1);
        lBody.css("left",lWidth*0.1);
        
    },

    resizeObsolete: function() {
        if (!this.obsolete) return false;

        this.obsolete.css("left",this.left+320);
    },

    resizeBaseLayerSwitcher: function() {
        if (!this.overviewMap) return false;

        this.baseLayerSwitcher.css("top",this.header.height() + this.marginHeight + Math.round((this.mapContainer.outerHeight() - this.mapContainer.innerHeight())/2));
        this.baseLayerSwitcher.css("left",this.left + this.wWidth - this.baseLayerSwitcher.width() - Math.round((this.mapContainer.outerWidth() - this.mapContainer.innerWidth())/2)) ;
    },

    resizeInfo: function() {
        if (!this.info) return false;


        //if divInfo was not moved (left && top == -1), put under transparency
        if (parseInt(this.info.css("left")) == 0) {
            this.info.css("left",parseInt(this.map.css("left")) + this.map.innerWidth() - this.info.outerWidth() - this.marginWidth);
        }
        
        if (parseInt(this.info.css("top")) == 0) {
            this.info.css("top",parseInt(this.slider.css("top")) + this.slider.outerHeight() + this.marginHeight * 2);
        }


        var maxHeight = 200;
        var minHeight = this.mapContainer.outerHeight();

        var height = parseInt(this.overviewMap.css("top")) - parseInt(this.baseLayerSwitcher.css("top")) - this.baseLayerSwitcher.height() - this.marginHeight * 4;
        if (height < minHeight) height = minHeight;
        if (height > maxHeight) height = maxHeight;

        //this.info.css("top",parseInt(this.baseLayerSwitcher.css("top")) + this.baseLayerSwitcher.height() + this.marginHeight * 2);
        //this.info.height(height);
        $(this.info.selector+"Body").height(height);
        $(this.info.selector+"Body").width(this.info.innerWidth()-10);
        this.info.height("auto");

        if (this.info.css("display") != "none") {
            if ((parseInt(this.info.css("left")) + this.info.width() + this.marginWidth) > this.wWidth) {
                this.info.css("left",this.left + this.wWidth - this.info.width() - this.marginWidth);
            }

            if ((parseInt(this.info.css("left")) - this.marginWidth) < (this.menus.width() + this.vseparator.width())) {
                this.info.css("left",this.left + this.menus.width() + this.vseparator.width() + this.marginWidth);
            }
        }

    },


    resizeText: function() {
        if (!this.text) return false;

        var maxHeight = 200;
        var minHeight = this.mapContainer.outerHeight();

        var height = parseInt(this.overviewMap.css("top")) - parseInt(this.baseLayerSwitcher.css("top")) - this.baseLayerSwitcher.height() - this.marginHeight * 4;
        if (height < minHeight) height = minHeight;
        if (height > maxHeight) height = maxHeight;

        //this.text.css("top",parseInt(this.baseLayerSwitcher.css("top")) + this.baseLayerSwitcher.height() + this.marginHeight * 2);
        //this.text.height(height);
        $(this.text.selector+"Body").height(height);
        this.text.height("auto");

        $(this.text.selector+"Body").height(height);

        if (this.text.css("display") != "none") {
            if ((parseInt(this.text.css("left")) + this.text.width() + this.marginWidth) > this.wWidth) {
                this.text.css("left",this.left + this.wWidth - this.text.width() - this.marginWidth);
            }

            if ((parseInt(this.text.css("left")) - this.marginWidth) < (this.menus.width() + this.vseparator.width())) {
                this.text.css("left",this.left + this.menus.width() + this.vseparator.width() + this.marginWidth);
            }
        }
    },

    resizeOverviewMap: function() {
        if (!this.overviewMap) return false;

        this.overviewMap.css("top",this.header.height() + this.mapContainer.outerHeight() - this.overviewMap.height() - this.marginHeight - Math.round((this.mapContainer.outerHeight() - this.mapContainer.innerHeight())/2));
        this.overviewMap.css("left",this.left + this.wWidth - this.overviewMap.width() - this.marginWidth - Math.round((this.mapContainer.outerWidth() - this.mapContainer.innerWidth())/2));
    },

    resizeToolBar: function() {
        if (!this.toolBar) return false;

        var mWidth = this.menus.width();
        if (this.menus.css("display") == "none") mWidth = 0;

        this.toolBar.css("left",this.left + mWidth + this.vseparator.width() + Math.round((this.mapContainer.outerWidth() - this.mapContainer.innerWidth())/2) + this.marginWidth);
    },

    resizeStatusBar: function() {
        if (!this.statusBar) return false;

        var mWidth = this.menus.width();
        if (this.menus.css("display") == "none") mWidth = 0;


        this.statusBar.css("top",this.header.height() + this.mapContainer.outerHeight() - this.statusBar.height() - this.marginHeight - parseInt(this.statusBar.css("borderBottomWidth")) - Math.round((this.mapContainer.outerHeight() - this.mapContainer.innerHeight())/2));
        this.statusBar.css("left",this.left + mWidth + this.vseparator.width() + Math.round((this.mapContainer.outerWidth() - this.mapContainer.innerWidth())/2) + this.marginWidth);
    },

    resizeScaleSelector: function() {
        if (!this.scaleSelector) return false;

        var mWidth = this.menus.width();
        if (this.menus.css("display") == "none") mWidth = 0;
        
        this.scaleSelector.css("top",this.header.height() + this.mapContainer.outerHeight() - this.statusBar.height() - this.marginHeight - parseInt(this.statusBar.css("borderBottomWidth")) - Math.round((this.mapContainer.outerHeight() - this.mapContainer.innerHeight())/2));
        this.scaleSelector.css("left",this.left + mWidth + this.vseparator.width() + Math.round((this.mapContainer.outerWidth() - this.mapContainer.innerWidth())/2) + this.marginWidth + this.statusBar.width()/2);


    },

    resizeMenus: function() {
        if (!this.menus) return false;

        this.menus.css("left",this.left);
        this.menus.css("top",this.header.height());
        if (this.menus.css("display") != "none") {
            if (parseInt(this.vseparator.css("left"))) {

                this.resizeMenuSearch();
                this.resizeMenuLayersManager();
            }
        }

        var menuHeight = 0;
        if (this.mapMaximunHeight) {
            menuHeight = (this.wHeight * 0.95);
        } else {
            menuHeight = (this.wHeight - this.header.height() - this.footer.height());
        }

        this.menus.height(menuHeight);
        this.menuResizable.height(menuHeight);
        //this.menuVSeparator.height(menuHeight);

        var menuTitles = $(this.menus.selector+" .menuTitle");

        var resizableE = $(this.menus.selector+" .ui-resizable-e");

        var menuWidth = this.menus.innerWidth();

        //menuTitles.width(menuWidth - parseInt(menuTitles.css("borderLeftWidth")) - (this.menus.outerWidth() - this.menus.innerWidth())- parseInt(menuTitles.css("borderRightWidth")) - parseInt(menuTitles.css("paddingLeft")) - parseInt(menuTitles.css("paddingRight")) - (resizableE.width() + parseInt(resizableE.css("right"))));

        this.menus.width(menuWidth);
        
    },

    resizeMenuSearch: function(height) {
        if (!this.menuSearch) return false;

        var divSearchBodyHeight = 0;
        var h3s = (($("#divMenuSearchBody h3").outerHeight())* $("#divMenuSearchBody h3").length);
        divSearchBodyHeight = this.menuSearch.height() - h3s;
        //if (!document.all) divSearchBodyHeight -= this.marginHeight;
        
        $("#divMenuSearchBody").height(this.menuSearch.height());
        $("#divMenuSearchBody div.ui-accordion-content").height(divSearchBodyHeight);

        $("#results_topo").height(divSearchBodyHeight-$("#input_topo").height()-5);

        this.menuSearch.width(this.menus.innerWidth() - (this.menuSearch.outerWidth() - this.menuSearch.innerWidth()));
        //this.menuSearch.width(parseInt(this.vseparator.css("left")));

        $("#results_topo").height(divSearchBodyHeight - 20);


    },

    resizeMenuLayersManager: function() {
        if (!this.menuLayersManager) return false;

        //fix for IE, that draws the scroller outside the div, not inside, and
        //the width of the div change
        if (document.all)
            $('.egvControlLayersManagerDiv').width(this.menuLayersManagerBody.width()-36);

        var menush = 0;

        if (this.mapMaximunHeight) {
            menush = (this.wHeight * 0.95);
        } else {
            menush = (this.wHeight - this.header.height() - this.footer.height());
        }

        var menuBodyHeight = menush - this.menuSearch.outerHeight() - this.menuSeparator.height() - (this.menuLayersManager.outerHeight() - this.menuLayersManager.innerHeight());

        this.menuLayersManagerBody.height(menuBodyHeight - this.menusTitle.attr("offsetHeight"));
        this.menuLayersManager.height(menuBodyHeight - (this.menuLayersManager.outerHeight() - this.menuLayersManager.innerHeight()));
        this.menuLayersManager.height(menuBodyHeight);

        this.menuLayersManager.width(this.menus.width() - (this.menuLayersManager.outerHeight() - this.menuLayersManager.innerHeight()));
        $("#divMenuLayersManagerTitle").width(this.menuLayersManager.innerWidth() - Math.round((this.menuLayersManager.outerHeight() - this.menuLayersManager.innerHeight())/2));

    },

    resizeVSeparator: function() {
        if (!this.vseparator) return false;

        var mWidth = this.menus.width();
        if (this.menus.css("display") == "none") mWidth = 0;

        if (this.mapMaximunHeight == true) {
            this.mapContainer.outerHeight(this.wHeight * 0.95);
        } else {
            //this.vseparator.height(this.wHeight - this.header.height() - this.footer.height());
        }
        this.vseparator.css("left",mWidth + this.left);
        this.vseparator.css("top",this.header.height());
        this.vseparator.height(this.menus.outerHeight());
        
    },

    resizeMap: function() {
        if (!this.map) return false;

        var mWidth = this.menus.outerWidth();
        var sepWidth = this.vseparator.outerWidth();
        if (this.menus.css("display") == "none") mWidth = 0;

        var mapHeight = 0;

        if (this.mapMaximunHeight == true) {
            mapHeight = this.wHeight * 0.95;
        } else {
            mapHeight = (this.wHeight - this.header.height() - this.footer.height());
        }

        if (this.profile.css("display") != "none") {
            mapHeight = mapHeight - this.profile.outerHeight();
        }

        this.mapContainer.height(mapHeight - (this.mapContainer.outerHeight() - this.mapContainer.innerHeight()));

        this.mapContainer.width(this.wWidth - mWidth - sepWidth - (this.mapContainer.outerWidth() - this.mapContainer.innerWidth()));
        this.mapContainer.css("left",this.left + mWidth + sepWidth);
        this.mapContainer.css("top",this.header.height());

        this.map.width(this.mapContainer.width());
        this.map.height(this.mapContainer.height());

        this.map.css("left",parseInt(this.mapContainer.css("left")) + Math.round((this.mapContainer.outerWidth() - this.mapContainer.innerWidth())/2));
        this.map.css("top",parseInt(this.mapContainer.css("top")) + Math.round((this.mapContainer.outerHeight() - this.mapContainer.innerHeight())/2));

    },

    resizeProfile: function() {
        if (!this.profile) return false;

        if (this.profile.css("display") != "none") {

            var profileBody = $(this.profile.selector+"Body")

            profileBody.height(this.profile.innerHeight() - $(this.profile.selector+"Title").outerHeight() - (this.profile.outerHeight() - this.profile.innerHeight() - (profileBody.outerHeight() - profileBody.innerHeight())));
            //this.profile.height("auto");

            this.profile.width(this.mapContainer.outerWidth());
            this.profile.css("left",parseInt(this.mapContainer.css("left")));
            this.profile.css("top",parseInt(this.mapContainer.css("top"))+this.mapContainer.outerHeight());
            //this.prof
            /*
            if ((parseInt(this.profile.css("left")) + this.profile.width() + this.marginWidth) > this.wWidth) {
                this.profile.css("left",this.left + this.wWidth - this.profile.width() - this.marginWidth);
            }

            if ((parseInt(this.profile.css("left")) - this.marginWidth) < (this.menus.width() + this.vseparator.width())) {
                this.profile.css("left",this.left + this.menus.width() + this.vseparator.width() + this.marginWidth);
            }
            */
        }
    },

    resizeSlider: function() {
        if (!this.slider) return false;

        this.slider.css("top",this.header.height() + this.marginHeight + Math.round((this.mapContainer.outerHeight() - this.mapContainer.innerHeight())/2) + this.baseLayerSwitcher.outerHeight());
        this.slider.css("left",this.left + this.wWidth - this.slider.width() - Math.round((this.mapContainer.outerWidth() - this.mapContainer.innerWidth())/2) - this.marginWidth) ;
    },


    resizeFooter: function() {
        if (!this.footer) return false;

        this.footer.css("top",this.header.height() + this.menus.outerHeight());
        this.footer.width(this.wWidth);

        this.footer.css("left",this.left);

    }
});