﻿window.VisionX_menu = true;

var _oVxOpenMenu;
var _oVxMenuShadow;
var _oVxMenuHeight;
var _oVxMenuWidth;
var _oVxMenuTop;
var _oVxMenuLeft;
var _oVxMenuButton;
var _oVxMenuOpactity;
var _oVxMenuOpactiyTimer;
var _oVxMenuOpactiyTimerInterval = 30;
var _oVxMenuOpactiyTimerStep = 0.15;
var _oVxMenuOpactiyTimerStart = 0.2;
var _oVxMenuBtnVertOverlap = 3;
var _oVxMenuShadowOffset = 2;

function _VxOpenPopupMenuReduceOpacity()
{
    if (_oVxOpenMenu)
    {
        _oVxMenuOpactity = _oVxMenuOpactity + _oVxMenuOpactiyTimerStep;
        
        if (_oVxMenuOpactity > 1)
        {
            makeOpaque(_oVxOpenMenu, 1.0);
            
            if (browser.isIE)
            {
                // Once an element is made opaque, clear text is broken on IE. To fix this, we have to completely
                // remove the FILTER: tag 
                _oVxOpenMenu.style.cssText = _oVxOpenMenu.style.cssText.replace(/FILTER:/, "");
            }
            _VxPopupMenuCreateShadow();
        }
        else {
            makeOpaque(_oVxOpenMenu, _oVxMenuOpactity);
            setTimeout(_VxOpenPopupMenuReduceOpacity, _oVxMenuOpactiyTimerInterval);
        }
    }
}

function VxPopupMenuGetOpenedBy(oMenu)
{
    return oMenu["openedBy"];
}

function VxOpenPopupMenu(oLink, event, oMenu, hdlrOnClose, bDialog)
{
    _VxPopupMenuCloseIfOpen(event);

    oMenu["openedBy"] = oLink; // save a reference to our parent object
    oMenu["hdlrOnClose"] = hdlrOnClose; // save any custom onclose handler
    oMenu["bDialog"] = bDialog; // Behaves like a dialog box rather than a menu    
        
    // display menu in hidden mode just so we can determine it's height when rendered
    oMenu.style.top = "0px";
    oMenu.style.left = "0px";    
    oMenu.style.visibility = "hidden";
    document.body.appendChild(oMenu);
    
    // position menu within screen
    _oVxMenuHeight = getElementHeight(oMenu);
    _oVxMenuWidth = getElementWidth(oMenu);
    _oVxMenuButton = oLink;
    _oVxOpenMenu = oMenu;
    
    _VxPopupMenuFindBestPosition();
    
    if (_oVxOpenMenu) // check re-positioned menu still exists
    {
        // apply effects
        if (browser.isIE)
        {
            // font smoothing doesn't work on IE with opacity, so can't fade in menu
            _VxPopupMenuCreateShadow();
        }
        else
        {
            makeOpaque(_oVxOpenMenu, _oVxMenuOpactiyTimerStart);
            _oVxMenuOpactity = _oVxMenuOpactiyTimerStart;
            _oVxMenuOpactiyTimer = setTimeout(_VxOpenPopupMenuReduceOpacity, _oVxMenuOpactiyTimerInterval);
        }
        
        // make visible
        _oVxOpenMenu.style.visibility = "visible";
    
        // setup event listeners
        cancelBubbling(event); // cancel this event or click will trigger again when this event bubbles up to document level
        attachEventToElement(window.document, "onmousedown", _VxPopupMenuCloseIfOpen);
        attachEventToElement(window, "onresize", _VxPopupMenuOnPageChange);
        attachEventToElement(window, "onscroll", _VxPopupMenuOnPageChange);
    }
}

function VxPopupMenuDisableAutoPositioning()
{
    if (!_oVxOpenMenu)
        return;

    _oVxOpenMenu["bDisablePositioning"] = true;
}

function VxPopupMenuReposition()
{
    if (!_oVxOpenMenu)
        return;

    _oVxOpenMenu["bDisablePositioning"] = false;

    _VxPopupMenuFindBestPosition();
}

function _VxPopupMenuOnPageChange()
{
    if (_oVxOpenMenu && _oVxOpenMenu["bDisablePositioning"])
        return;    

    _VxPopupMenuFindBestPosition();
}

function _VxPopupMenuFindBestPosition()
{   
    if (_oVxOpenMenu)
    {
        var pos = getDocumentCoords(_oVxMenuButton);
        _oVxMenuTop = pos["top"] + getElementHeight(_oVxMenuButton) - _oVxMenuBtnVertOverlap;
        _oVxMenuLeft = pos["left"];
        
        _oVxOpenMenu.style.top = _oVxMenuTop + "px";
        _oVxOpenMenu.style.left = _oVxMenuLeft + "px";
        
        var scroll = getWindowScrollOffsets(window);
        var viewpt = getBrowserViewport();

        // adjust vertical pos
        if ( (_oVxMenuTop + _oVxMenuHeight) > (scroll["y"] + viewpt["height"]) )
        {
            // ok, bottom of menu would be below bottom viewport, so see if we can make menu appear above
            
            if ( (pos["top"] - _oVxMenuHeight + _oVxMenuBtnVertOverlap) > scroll["y"] )
            {
                _oVxMenuTop = pos["top"] - _oVxMenuHeight + _oVxMenuBtnVertOverlap;
            }
        }
        
        // adjust horizontal pos
        if ( (_oVxMenuLeft + _oVxMenuWidth) > (scroll["x"] + viewpt["width"]) )
        {
            // ok, right of menu would be outside right viewport, so make menu appear to left
            
            _oVxMenuLeft = pos["left"] + getElementWidth(_oVxMenuButton) - _oVxMenuWidth;
        }
        
        // finally make menu visible
        _oVxOpenMenu.style.top = _oVxMenuTop + "px";
        _oVxOpenMenu.style.left = _oVxMenuLeft + "px";
        
        // position the shadow, if it exists
        _VxPopupMenuPositionShadow();   
    }
}

function _VxPopupMenuCloseIfOpen(e)
{
    // If the menu/dialog exists and it should behave like a dialog then stop it closing
    // if this click is inside the menu/dialog

    if (_oVxOpenMenu && _oVxOpenMenu["bDialog"])
    {
        var oTarget = getEventSource(e);

        if (_oVxOpenMenu == oTarget || IsAncestorDescendent(_oVxOpenMenu, oTarget))
            return true;
    }

    // If the menu exists and has a custom close handler then call it now

    var hdlrOnClose;
    
    if (_oVxOpenMenu && _oVxOpenMenu["hdlrOnClose"])
    {
        hdlrOnClose = _oVxOpenMenu["hdlrOnClose"];
    }

    _VxPopupMenuDestroyShadow();
    
    if (_oVxOpenMenu)
    {
        _oVxOpenMenu.parentNode.removeChild(_oVxOpenMenu);
        _oVxOpenMenu = null;
    }

    _VxPopupMenuRemoveEventListeners();

    if (hdlrOnClose)
        hdlrOnClose();
    
    return true;
}

function _VxPopupMenuRemoveEventListeners()
{
    clearTimeout(_oVxMenuOpactiyTimer);
    detachEventFromElement(window.document, "onclick", _VxPopupMenuCloseIfOpen);
    detachEventFromElement(window, "onresize", _VxPopupMenuOnPageChange);
    detachEventFromElement(window, "onscroll", _VxPopupMenuOnPageChange);
}

function _VxPopupMenuDestroyShadow()
{
    if (_oVxMenuShadow)
    {
        _oVxMenuShadow.parentNode.removeChild(_oVxMenuShadow);
        _oVxMenuShadow = null;
    }
}

function _VxPopupMenuCreateShadow()
{
    _VxPopupMenuDestroyShadow();
    
    _oVxMenuShadow = document.createElement("div");
    _oVxMenuShadow.style.backgroundColor = "#000000";
    _oVxMenuShadow.style.position = "absolute";
    _oVxMenuShadow.style.width = _oVxMenuWidth + "px";
    _oVxMenuShadow.style.height = _oVxMenuHeight + "px";
    _oVxMenuShadow.style.visibility = "hidden";
    makeOpaque(_oVxMenuShadow, 0.15);
    _VxPopupMenuPositionShadow();
    document.body.appendChild(_oVxMenuShadow);
    _oVxMenuShadow.style.visibility = "visible";
}

function _VxPopupMenuPositionShadow()
{
    if (_oVxMenuShadow)
    {
        _oVxMenuShadow.style.top = (_oVxMenuTop + _oVxMenuShadowOffset) + "px";
        _oVxMenuShadow.style.left = (_oVxMenuLeft + _oVxMenuShadowOffset) + "px";  
    } 
}

function VxOnMouseOverItem(oItem)
{
    if (!hasCssClass(oItem, "wt_disabled") && hasCssClass(oItem, "wt_selectable"))
    {
        var origClassName = oItem["origClassName"];
        if (!origClassName)
        {
            oItem["origClassName"] = oItem.className;
            origClassName = oItem.className;
        }
        oItem.className = origClassName + " wt_selected";
    }
}

function VxOnMouseOutItem(oItem)
{
    var origClassName = oItem["origClassName"];
    if (origClassName)
    {
        oItem.className = origClassName;
    }
}