var _FLOATING_WINDOW = null;

function GetFloatingWindow(id, maxtop) {
    if (_FLOATING_WINDOW == null) _FLOATING_WINDOW = new FloatingWindow(id, maxtop);
    return _FLOATING_WINDOW;
}

function FloatingWindow(id, maxtop) {
    this.id = id;
    this.maxtop = (maxtop ? maxtop : 230);
    this.panes = new Array();
    this.wnd = null;
    this.wnd_content = null;
    this.wnd_menu = null;
    this.current_pane_priority = null;
    this.onrenderedlisteners = new Array();

    this.addRenderListener = function(listener) {
        this.onrenderedlisteners[this.onrenderedlisteners.length] = listener;
    }

    this.init = function() {
        _FLOATING_WINDOW = this;

        FLOATING_WINDOW_RENDER();

        Event.observe(window, 'scroll', function() {
            _FLOATING_WINDOW.onScroll();
        });

    }


    this.render = function() {
        this.wnd = $(this.id);
        if (!this.wnd) {
            this.wnd = document.createElement('div');
            this.wnd.id = this.id;
            this.wnd.className = 'floating_window';

            this.wnd.innerHTML = '<span class="l"></span><span class="m"></span><span class="r"></span><span class="cmenu" id="' + this.id + '_menu"></span><span class="c" id="' + this.id + '_content"></span>';
            document.body.appendChild(this.wnd);

            this.wnd_content = $(this.id + '_content');
            this.wnd_menu = $(this.id + '_menu');
        }

        this.wnd.style.display = 'block';
        this.wnd_menu.style.display = 'none';

        this.renderContent();
        this.onScroll();
    }
    
    this.setHTML = function(title, priority, html) {
        var pane = this.panes.find(function (item) {
            return (item.priority == priority);
        });
        
        if (pane) {
            pane.title = title;
            pane.hmtl = html;
        } else {
            this.panes[this.panes.length] = {title:title, priority:priority, html:html};
            this.panes = this.panes.sortBy(function(item){
                return -item.priority;
            });
            this.current_pane_priority = this.panes[0].priority;
        }
        
        this.renderContent();
    }

    this.renderContent = function() {
        if (this.panes && this.panes.length > 0 && this.wnd_content && this.wnd_menu) {
            this.wnd_menu.style.display = (this.panes.length > 1 ? 'block' : 'none');
            var idx = 0;
            if (this.panes.length > 1) {
                var menu = new Array();
                for (var i = 0; i < this.panes.length; i++) {
                    if (this.panes[i].priority == this.current_pane_priority) {
                        menu[menu.length] = '<strong>' + this.panes[i].title + '</strong>';
                        idx = i;
                    } else {
                        menu[menu.length] = '<a href="javascript://" onclick="_FLOATING_WINDOW.switchPane(' + this.panes[i].priority + ')">' + this.panes[i].title + '</a>';
                    }
                }
                this.wnd_menu.innerHTML = menu.join('<br/>');
            }

            this.wnd_content.innerHTML = this.panes[idx].html;
        }

        for (var i=0; i<this.onrenderedlisteners.length; i++)
            this.onrenderedlisteners[i]();
    }
    
    this.switchPane = function(priority) {
        if (this.wnd_content && priority != this.current_pane_priority) {
            var cp = this.current_pane_priority;
            var curpane = this.panes.find(function (item) {
                return (item.priority == cp);
            });
            if (curpane) curpane.html = this.wnd_content.innerHTML;
        }
        this.current_pane_priority = priority;
        this.renderContent();
    }
    
    this.removePane = function(priority) {
        var idx = -1;
        for (var i=0; i<this.panes.length; i++)
            if (this.panes[i].priority == priority) {
                idx = i;
                break;
            }
            
        if (idx >= 0) this.panes.splice(idx, 1);
        
        if (this.panes.length) this.renderContent();
        else this.hide();
        
    }
    
    this.show = function() {
        if (this.wnd) this.wnd.style.display = 'block';
    }

    this.hide = function() {
        if (this.wnd) this.wnd.style.display = 'none';
    }
    
    this.onScroll = function() { 
        if (this.wnd) {
            var off = document.viewport.getScrollOffsets();
            var dim = document.viewport.getDimensions();
            
            
            var top = off.top + 20;
            if (top < this.maxtop) top = this.maxtop;
            
            this.wnd.style.left = '820px';
            this.wnd.style.top = top + 'px';
        }
    }
    
    this.init();
}


function FLOATING_WINDOW_RENDER() {
    if (document.loaded) {
        _FLOATING_WINDOW.render();
    } else {
        window.setTimeout('FLOATING_WINDOW_RENDER()', 100);
    }
}