Event.localPointer = function (event) {
    var p = [Event.pointerX(event), Event.pointerY(event)];
    var element = arguments[1] || Event.element(event);
    var e = Position.page($(element));
    return [
        p[0] - (e[0] + (window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0)),
        p[1] - (e[1] + (window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0))
    ];
};

var VB = {
    SITEROOT : "http://www.virtualbroker.com.au",
    ANIMATION: { menu : false },
    CURRENT_SUB_MENU: 0,
    CURRENT_MENU_PANEL: 0,
    MAIN_MENU: null,
    MENU_PANEL_TIMEOUT: null,
    MENU_TIMEOUT: 2200,
    MAIN_MENU: 0,
    LOGIN_PANEL_ACTIVE: false,
    
    cubic: function (pos) {
        pos /= 0.5;
        return pos < 1 ? 0.5 * pos * pos * pos : 0.5 * ((pos - 2) * (pos - 2) * (pos - 2) + 2);
    },
        
    startMenuPanelTimeout: function (event) { 
        var p = Event.localPointer(event, 'menu');
        if ((p[0] > 0) && (p[0] < 230) && (p[1] > 0) && (p[1] < 504)) {
            return;
        }
        VB.clearMenuPanelTimeout();
        VB.MENU_PANEL_TIMEOUT = setTimeout(function () {
            VB.closeSubmenu();
        }, VB.MENU_TIMEOUT); 
    },
    
    clearMenuPanelTimeout: function () {
        if (VB.MENU_PANEL_TIMEOUT) {
            clearTimeout(this.MENU_PANEL_TIMEOUT);
            VB.MENU_PANEL_TIMEOUT = null;
        }
    },
    
    setTimeouts: function () {
        Event.observe($('menu'), 'mouseout', VB.startMenuPanelTimeout.bindAsEventListener(this));
        Event.observe($('menu'), 'mousemove', VB.clearMenuPanelTimeout.bindAsEventListener(this));
    },
    
    openSubmenu: function (index) {
        if (VB.ANIMATION.menu) {
            return;
        }
        Menu.renderSub(index);
        VB.ANIMATION.menu = true;
        if (VB.LOGIN_PANEL_ACTIVE) {
            new Effect.BlindUp('login-panel',
                {
                    transition: VB.cubic,
                    duration: 0.6,
                    afterFinish: function () {
                        VB.ANIMATION.menu = false;
                        VB.LOGIN_PANEL_ACTIVE = false;
                        document.forms[0].reset();
                    }
                }
            );
        }
        new Effect.Fade('logo',
            {
                duration: 0.4
            }
        );
        new Effect.Opacity('submenu',
            {
                duration: 1,
                transition: VB.cubic,
                from: 0.0,
                to: 1.0
            }
        ); 
        new Effect.Move('menu-scroll',
            {
                x: -$('menu').offsetWidth,
                transition: VB.cubic,
                duration: 0.6,
                afterFinish: function () {
                    VB.ANIMATION.menu = false;
                    VB.setTimeouts();
                    VB.CURRENT_MENU_PANEL ++;
                }
            }
        );
    },
    
    closeSubmenu: function () {
        if ((VB.ANIMATION.menu) || (VB.CURRENT_MENU_PANEL < 1)) {
            return;
        }
        VB.ANIMATION.menu = true;
        new Effect.Opacity('submenu',
            {
                duration: 1,
                transition: VB.cubic,
                from: 1.0,
                to: 0.0
            }
        ); 
        new Effect.Move('menu-scroll',
            {
                x: $('menu').offsetWidth,
                transition: VB.cubic,
                duration: 0.6,
                afterFinish: function () {
                    new Effect.Appear('logo',
                        {
                            duration: 2
                        }
                    );
                    VB.ANIMATION.menu = false;
                    VB.CURRENT_MENU_PANEL --;
                }
            }
        );
    },
    
    toggleLoginPanel: function () {
        if (VB.ANIMATION.menu) {
            return;
        }
        VB.ANIMATION.menu = true;
        if (VB.LOGIN_PANEL_ACTIVE) {
            new Effect.BlindUp('login-panel',
                {
                    transition: VB.cubic,
                    duration: 0.6,
                    afterFinish: function () {
                        VB.ANIMATION.menu = false;
                        VB.LOGIN_PANEL_ACTIVE = false;
                        document.forms[0].reset();
                    }
                }
            );
        } else {
            new Effect.BlindDown('login-panel',
                {
                    transition: VB.cubic,
                    duration: 0.6,
                    afterFinish: function () {
                        VB.ANIMATION.menu = false;
                        VB.LOGIN_PANEL_ACTIVE = true;
                    }
                }
            );
        }
    },
    
    checkMainLinks: function () {
        $$('a.login-link').each(function (click) {
            Event.observe($(click), 'click', function (event) {
                //VB.toggleLoginPanel();
                //Event.stop(event);
            }, true);
        });
        $$('a.content').each(function (click) {
            Event.observe($(click), 'click', function (event) {
                VB.getPageContent(click.href);
                Event.stop(event);
            }, true);
        });
    },
    
    checkSubLinks: function () {
        $$('#submenu a.content', '#sitemap-content a.content').each(function (click) {
            Event.observe($(click), 'click', function (event) {
                VB.getPageContent(click.href);
                Event.stop(event);
            }, true);
        });
    },
    
    getPageContent: function (url) {
        VB.fadeContent(url);
    },
    
    fadeContent: function (url) {
        new Effect.Appear('fadebox',
            {
                duration: 0.5,
                queue: {
                    scope: 'contentscope',
                    limit: 2,
                    position: 'end'
                },
                afterFinish: function () {
                    VB.getPageData(url);
                }
            }
        );
    },
    
    appearContent: function () {
        new Effect.Fade('fadebox',
            {
                duration: 0.5,
                queue: {
                    scope: 'contentscope',
                    limit: 2,
                    position: 'end'
                }
            }
        );
    },
    
    getPageData: function (url) {
        new Ajax.Updater('content', url,
            {
                method: 'get',
                asynchronous: true,
                evalScripts: true,
                onSuccess: function () {
					VB.appearContent();
                },
				on404: function () {
					VB.getPageData('support/404.html');
				},
				onFailure:  function (request) {
					alert('Error ' + request.status + ' -- ' + request.statusText);
					document.location.href = VB.SITEROOT;
				}
            }
        );
    }
};

var Menu = {
    
    renderMenuItem: function (item, index) {
        var i = index;
        Menu.RENDERED_ITEM = '';
        var options = {
            link: '#',
            style: '',
            title: '',
            target: '',
            onclick: ''
        };
        if (item.link) {
            options.link = item.link;
        }
        if (item.style) {
            options.style = ' class="' + item.style + '"';
        }
        if (item.title) {
            options.title = ' title="' + item.title + '"';
        }
        if (item.target) {
            options.target = ' target="' + item.target + '"';
        }
        if (item.onclick) {
            options.onclick = ' onclick="' + item.onclick + '"';
        }
        if (item.subitems) {
            options.onclick = ' onclick="VB.openSubmenu(' + i + '); return false;"';
        }
        if (item.spacebefore) {
            Menu.RENDERED_ITEM += '<br/>\n';
        }
        Menu.RENDERED_ITEM += '<p>';
        Menu.RENDERED_ITEM += '<a' + options.style + ' href="' + options.link + '" ';
        Menu.RENDERED_ITEM += options.onclick;
        Menu.RENDERED_ITEM += options.title;
        Menu.RENDERED_ITEM += options.target;
        Menu.RENDERED_ITEM += ' >' + item.name + '</a>';
        Menu.RENDERED_ITEM += '</p>\n';
    },
    
    renderMain: function () {
        Menu.MAIN_MENU = '';
        MenuData.items.each(function (item, i) {  
            Menu.renderMenuItem(item, i);
            Menu.MAIN_MENU += Menu.RENDERED_ITEM;
        });
        VB.MAIN_MENU = Menu.MAIN_MENU;
        $('mainmenu').update(VB.MAIN_MENU);
        VB.checkMainLinks();
    },
    
    renderSub: function (index) {
        
        Menu.CURRENT_MENU = '';
        var PARENT = MenuData.items[index];
        
        Menu.CURRENT_MENU += '<p>' + PARENT.name + '</p>\n';
        
        PARENT.subitems.each(function (item, i) {
            Menu.renderMenuItem(item, i);
            Menu.CURRENT_MENU += Menu.RENDERED_ITEM;
        });
        
        Menu.CURRENT_MENU += '<p class="level-up">';
        Menu.CURRENT_MENU += '<a href="#" onclick="VB.closeSubmenu();return false">Back to main navigation</a>';
        Menu.CURRENT_MENU += '</p>';
        
        VB.CURRENT_SUB_MENU = Menu.CURRENT_MENU;
        $('submenu').update(VB.CURRENT_SUB_MENU);
        VB.checkSubLinks();
    },

    buildSitemap: function () {
        var SITEMAP = '<ul>';
        MenuData.items.each(function (item) {
            if ((item.style === 'content') || (item.subitems)) {
                SITEMAP += '<li>';
                if ((item.style === 'content') && (item.link)) {
                    SITEMAP += '<a href="' + item.link + '" class="content" >';
                }
                SITEMAP += item.name;
                if ((item.style === 'content') && (item.link)) {
                    SITEMAP += '</a>';
                }
                if (item.subitems) {
                    SITEMAP += '<ul>';
                    item.subitems.each(function (item) {
                        SITEMAP += '<li>';
                        if ((item.style === 'content') && (item.link)) {
                            SITEMAP += '<a href="' + item.link + '" class="content" >';
                        }
                        SITEMAP += item.name;
                        if ((item.style === 'content') && (item.link)) {
                            SITEMAP += '</a>';
                        }
                        SITEMAP += '</li>';
                    });
                    SITEMAP += '</ul>';
                }
                SITEMAP += '</li>';
            }
        });
        SITEMAP += '</ul>';
        $('sitemap-content').update(SITEMAP);
    }
};