﻿// JScript File

var MenuItems = new Array();
var MenuGraphics = new Array();
var MenuGraphicsOver = new Array();
var LastSubGraphics = null;
var LastSubGraphicsOver = null;
var CurrentGraphics = null;
var SeparatorGraphic = '';
var SeparatorGraphicWidth = 0;
var MenuStartLeft = 0;
var MenuForceMainItemWidth = 151;

var DropDownMenuSlideStep = 5;//10;
var DropDownMenuSlideSpeed = 1;

var MenuItemIDStart = 'divMenuItem'

var MenuItemCSSClass = 'DDMenuItem';
var MenuItemCSSClassOver = 'DDMenuItemOver';
var MenuItemActiveCSSClass = 'DDMenuItemAcive';


var doDebug = true;

function MenuGraphicsSet(l, bg, r, h, lw, rw)
{
    if (!rw) rw = 0;
    if (!lw) lw = 0;
    this.Left = l;
    this.Background = bg;
    this.Right = r;
    this.Height = h;
    this.LeftWidth = lw;
    this.RightWidth = rw;
}

function MenuItem(menuitemid, title, link, subs, isCurrent)
{
    if (!isCurrent) isCurrent = false;
    this.MenuItemID = menuitemid;
    this.Title = title;
    this.Link = link;
    this.SubMenus = subs;
    this.IsCurrent = isCurrent;
}

function BuildDDMenu(Holder)
{
    var hldr = document.getElementById(Holder);
    hldr.style.zIndex = 99999;
    MenuStartLeft = getElementPosition(Holder).left;

    var tbl = document.createElement('table');
    tbl.style.width = hldr.style.width;
    tbl.style.position = 'absolute';
    tbl.style.zIndex = '99999';
    tbl.cellPadding = 0;
    tbl.cellSpacing = 0;
    var row = tbl.insertRow(0);
    var cellcount = 0;
    for (i=0; i<MenuItems.length; i++)
    {
        var MenuItemID = MenuItems[i].MenuItemID;
        
        //Declare all the variables in the global scope
        eval('DDOpeningInstance' + MenuItemID + '=null');
        eval('DDClosingInstance' + MenuItemID + '=null');
        eval('DDCloseTimer' + MenuItemID + '=null');
        
        var cell =row.insertCell(cellcount);
        cell.setAttribute('id', 'cl' + MenuItemIDStart + MenuItems[i].MenuItemID);
        cellcount++;
        
        var div = document.createElement('div');
        div.setAttribute('id', MenuItemIDStart + MenuItems[i].MenuItemID);
        cell.style.zIndex = '99998';
        if (MenuForceMainItemWidth != 0)
        { 
            cell.style.width = MenuForceMainItemWidth + 'px';;
            
        }
        
        div.style.zIndex = '99999';
        div.innerHTML = BuildMenuItemContent(MenuItems[i].MenuItemID, MenuItems[i].Title, MenuItems[i].Link, 0, 0, false, MenuItems[i].IsCurrent);

        div.onmouseover = function () { MainMenuItemMouseMoveControl(this, 'over'); };
        div.onmouseout = function () { MainMenuItemMouseMoveControl(this, 'out'); };

        CreateSubMenuItems(MenuItems[i].MenuItemID, MenuItems[i].SubMenus, Holder, 1);

        cell.appendChild(div);
        if ((SeparatorGraphicWidth > 0) && (i!=MenuItems.length-1))
        {
            cell =row.insertCell(cellcount);
            cellcount++;
            cell.style.width = SeparatorGraphicWidth + 'px';
            cell.style.backgroundImage = 'url(' + SeparatorGraphic + ')';
        }
    }
    hldr.appendChild(tbl);
    PositionMenuItemSubs();
}

function CreateSubMenuItems(ParentID, subs, ContainerID, level)
{
    var container = document.getElementById(ContainerID);
    if (subs)
    {
        for (x=0; x<subs.length; x++)
        {
            var div = document.createElement('div');
            div.setAttribute('id', MenuItemIDStart + subs[x].MenuItemID);
            div.style.visibility = 'hidden';
            div.style.position = 'absolute';
            div.innerHTML = BuildMenuItemContent(subs[x].MenuItemID, subs[x].Title, subs[x].Link, 0, level, (x==subs.length-1));
            
            div.onmouseover = function () {  SubMenuItemMouseOver(ParentID, this.id); };
            div.onmouseout = function () { MainMenuItemOut(ParentID, this.id); };            
            
            container.appendChild(div);
        }
    }
}

function SubMenuItemMouseOver(MenuItemID, ChildID)
{
    ForceAllClosed(MenuItemID);
    clearTimeout(eval('DDCloseTimer' + MenuItemID));
    if (ChildID) 
    {
        var SubID = ChildID.substr(MenuItemIDStart.length);
        SetMenuItemImages(SubID, 'in', 1, GetSubIsLastFromID(SubID));
    }
    SetMenuItemImages(MenuItemID, 'in', 0);
    clearTimeout(eval('DDClosingInstance' + MenuItemID));
    OpenSubMenu(GetMenuItemIndex(MenuItemID), 0);
}

function ForceAllClosed(ExcludeMenuItemID)
{
    if(!ExcludeMenuItemID) ExcludeMenuItemID='';
    for (var x=0; x<MenuItems.length; x++)
    {
        if(MenuItems[x].MenuItemID != ExcludeMenuItemID)
        {
            MainMenuItemOutActions(MenuItems[x].MenuItemID);
        }
    }
    
}

function MainMenuItemOut(MenuItemID, ChildID)
{
    if (ChildID) 
    {
        var SubID = ChildID.substr(MenuItemIDStart.length);
        //if (doDebug) document.getElementById('divDebug').innerHTML += 'SetSubClosedImages<br>';
        SetMenuItemImages(SubID, 'out', 1, GetSubIsLastFromID(SubID));
    }
    
    //if (doDebug) document.getElementById('divDebug').innerHTML += 'Out'  + MenuItemID + '<br>';
    eval('DDCloseTimer' + MenuItemID + ' = setTimeout(\'MainMenuItemOutActions("' + MenuItemID + '")\', 100);');
}

function GetSubIsLastFromID(SubID)
{
    for (var x=0; x<MenuItems.length; x++)
    {
        if ((MenuItems[x].SubMenus) && (MenuItems[x].SubMenus[MenuItems[x].SubMenus.length-1].MenuItemID == SubID))
            return true;
    }
    return false;
}

function MainMenuItemOutActions(MenuItemID)
{
    //if (doDebug) document.getElementById('divDebug').innerHTML += 'CloseRunning: ' + MenuItemID + '<br>';
    SetMenuItemImages(MenuItemID, 'out', 0);
    clearTimeout(eval('DDOpeningInstance' + MenuItemID));
    var index = GetMenuItemIndex(MenuItemID);
    if (MenuItems[index].SubMenus) 
    {
        CloseSubMenu(index, MenuItems[index].SubMenus.length-1);
        for (var x=0; x<MenuItems[index].SubMenus.length; x++)
            SetMenuItemImages(MenuItems[index].SubMenus[x].MenuItemID, 'out', 1, (x==MenuItems[index].SubMenus.length-1));
    }
}

function SetMenuItemImages(MenuItemID, dir, index, isLast)
{
    var isCurrent = false;
    for (var i=0; i<MenuItems.length; i++)
    {
        if (MenuItems[i].MenuItemID == MenuItemID)
        {
            isCurrent = MenuItems[i].IsCurrent;
            break;
        }
    }
    if (isCurrent)
        return;
        
    var ImgLeft = '';
    var ImgBg = '';
    var ImgRight = '';
    var cssClass = '';
        
    if (dir == 'in')
    {
        ImgLeft = MenuGraphicsOver[index].Left;
        ImgBg = MenuGraphicsOver[index].Background;
        ImgRight = MenuGraphicsOver[index].Right;
        cssClass = MenuItemCSSClassOver;
    }
    else
    {
        ImgLeft = MenuGraphics[index].Left;
        ImgBg = MenuGraphics[index].Background;
        ImgRight = MenuGraphics[index].Right;
        cssClass = MenuItemCSSClass;
    }
            
    if (index==1)
    {
        if (isLast)
        {
            if (dir == 'in')
            {
                ImgLeft = LastSubGraphicsOver.Left;
                ImgBg = LastSubGraphicsOver.Background;
                ImgRight = LastSubGraphicsOver.Right;
            }
            else
            {
                ImgLeft = LastSubGraphics.Left;
                ImgBg = LastSubGraphics.Background;
                ImgRight = LastSubGraphics.Right;
            }
        }
    }    
    
    document.getElementById('clMenuItemLeft' + MenuItemID).style.backgroundImage = 'url(' + ImgLeft + ')';
    document.getElementById('clMenuItemContent' + MenuItemID).style.backgroundImage = 'url(' + ImgBg + ')';
    document.getElementById('clMenuItemRight' + MenuItemID).style.backgroundImage = 'url(' + ImgRight + ')';
    document.getElementById('clMenuItemContent' + MenuItemID).setAttribute('class', cssClass)
    document.getElementById('clMenuItemContent' + MenuItemID).className = cssClass;
       
}

function BuildOnClick(Link)
{
    var ret = ' onclick="';
    if (Link.toLowerCase().substr(0,11) == 'javascript:')
        ret += Link.substr(11);
    else
        ret += 'document.location = \'' + Link + '\';';
    
    ret += '" ';
    return ret;
}

function BuildMenuItemContent(MenuItemID, Title, Link, SubCount, level, isLastSub, isCurrent)
{
    var LeftImg = MenuGraphics[level].Left;
    var RightImg = MenuGraphics[level].Right;
    var BgImg = MenuGraphics[level].Background;
    var He = MenuGraphics[level].Height;
    var Lw = MenuGraphics[level].LeftWidth;
    var Rw = MenuGraphics[level].RightWidth;
    var cssClass = MenuItemCSSClass;
    
    if (isLastSub)
    {
        LeftImg = LastSubGraphics.Left;
        RightImg = LastSubGraphics.Right;
        BgImg = LastSubGraphics.Background;
        He = LastSubGraphics.Height;
    }
    
    if (isCurrent) 
    {
        if (level==0)
        {
            LeftImg = CurrentGraphics.Left;
            RightImg = CurrentGraphics.Right;
            BgImg = CurrentGraphics.Background;
            He = CurrentGraphics.Height;
            cssClass = MenuItemActiveCSSClass;
        }
        else
            isCurrent = false;
    }
        
    
    var ret = '<table cellpadding="0" cellspacing="0">';
    ret += '<tr style="height:' + He + 'px;"><td';
    if (!isCurrent) ret += BuildOnClick(Link);
    ret += ' id="clMenuItemLeft' + MenuItemID + '" style="background-image:url(' + LeftImg + '); width:' + Lw + 'px; height:' + He + 'px">&nbsp;</td>'
    ret += '<td class="' + cssClass + '" ';
    if (!isCurrent) ret += BuildOnClick(Link) 
    ret += ' id="clMenuItemContent' + MenuItemID + '" style="height:' + He + 'px; background-image:url(' + BgImg + ')">';
    //if (Link != '') ret += '<a href="' + Link + '">';
    ret += doReplace(Title, ' ', '&nbsp;');
    //if (Link != '') ret += '</a>';
    ret += '</td>'
    ret += '<td' 
    if (!isCurrent) ret += BuildOnClick(Link) 
    ret += ' id="clMenuItemRight' + MenuItemID + '" style="background-image:url(' + RightImg + '); width:' + Rw + 'px; height:' + He + 'px">&nbsp;</td>'
    ret += '</tr>'
    ret += '</table>'
    return ret;
}

function PositionMenuItemSubs(leftOnly, SetOnlyThisMenuItemID)
{
    if (!SetOnlyThisMenuItemID) SetOnlyThisMenuItemID = '';

    var mainmaxwidth = 0;
    var SetMainWidth = 0;
    var clWidth = 0;
    //if (!leftOnly)
    //{
        if (MenuForceMainItemWidth == 0)
        {
            for (var i=0; i<MenuItems.length; i++)
            {
                var w = document.getElementById('clMenuItemContent' + MenuItems[i].MenuItemID).offsetWidth;
                if (w > mainmaxwidth) mainmaxwidth = w;
            }
        }  
        else
            mainmaxwidth = MenuForceMainItemWidth;
        
        SetMainWidth = (1*mainmaxwidth) - (1*MenuGraphics[0].LeftWidth) - (1*MenuGraphics[0].RightWidth);
        clWidth = (1*mainmaxwidth) - (1*MenuGraphics[1].LeftWidth) - (1*MenuGraphics[1].RightWidth);
    //}  
    
    //position all items as left aligned
    for (var i=0; i<MenuItems.length; i++)
    {
        var cont = true;
        var dobreak = false;
        if (SetOnlyThisMenuItemID != '')
        {
            cont = false;
            if (MenuItems[i].MenuItemID == SetOnlyThisMenuItemID)
            {
                cont = true;
                dobreake=true;
            }
        }
        
        if (cont)
        {
            var elem = document.getElementById(MenuItemIDStart + MenuItems[i].MenuItemID);
            document.getElementById('clMenuItemContent' + MenuItems[i].MenuItemID).style.width = SetMainWidth + 'px';
            var pos = getElementPosition(MenuItemIDStart + MenuItems[i].MenuItemID);
            var top = pos.top;
            var zindex = elem.style.zIndex;
            zindex-=4;
            var submaxwidth = clWidth;
            if (MenuItems[i].SubMenus)
            {
                for (x=0; x<MenuItems[i].SubMenus.length; x++)
                {
                    var sub = document.getElementById(MenuItemIDStart + MenuItems[i].SubMenus[x].MenuItemID)
                    if (!leftOnly) 
                    {
                        sub.style.top = top + 'px';
                        sub.style.zIndex = zindex;     
                        zindex--;
                    }
                    var ws = document.getElementById('clMenuItemContent'+ MenuItems[i].SubMenus[x].MenuItemID).offsetWidth;
                    if (ws > submaxwidth) submaxwidth = ws;    
                    sub.style.left = pos.left + 'px';    
                }
            }
            if (!leftOnly) 
            {
                if ((MenuItems[i].SubMenus))
                {
                    for (x=0; x<MenuItems[i].SubMenus.length; x++)
                        document.getElementById('clMenuItemContent'+ MenuItems[i].SubMenus[x].MenuItemID).style.width = submaxwidth + 'px'
                }
            }
        }
        if (dobreak) break;
    }
    
    var lastid = MenuItemIDStart + MenuItems[MenuItems.length-1].MenuItemID;
    var farright = document.getElementById(lastid).offsetWidth + getElementPosition(lastid).left;

    //loop through all items to check right hand edge doesnt overlap leftcount
    for (i=0; i<MenuItems.length; i++)
    {
        if (MenuItems[i].SubMenus)
        {
            var divMain = document.getElementById(MenuItemIDStart + MenuItems[i].MenuItemID);
            var rightofsub = getElementPosition(MenuItemIDStart + MenuItems[i].SubMenus[0].MenuItemID).left + document.getElementById(MenuItemIDStart + MenuItems[i].SubMenus[0].MenuItemID).offsetWidth;
            var targetleft = farright - document.getElementById(MenuItemIDStart + MenuItems[i].SubMenus[0].MenuItemID).offsetWidth;
            
            //alert(i + '   ' + rightofsub + ' ' + farright);
            if (rightofsub > farright)
            {
                for (x=0; x<MenuItems[i].SubMenus.length; x++)
                {
                    var div = document.getElementById(MenuItemIDStart + MenuItems[i].SubMenus[x].MenuItemID);
                    div.style.left = targetleft + 'px';
                }
            }
        }
   }
}

function GetMenuItemIndex(MenuItemID)
{
    var index = -1;
    for(j=0; j<MenuItems.length; j++)
    {
        if (MenuItems[j].MenuItemID == MenuItemID)
        {
            index = j;
            break;
        }
    }
    return index;
}

function CloseSubMenu(MenuItemsIndex, SubMenuItemsIndex)
{  
    var elemid = MenuItemIDStart + MenuItems[MenuItemsIndex].SubMenus[SubMenuItemsIndex].MenuItemID;
    var SubMenuItem = document.getElementById(elemid);
    var currenttop = getElementPosition(elemid).top;

    var targettop = getElementPosition(MenuItemIDStart + MenuItems[MenuItemsIndex].MenuItemID).top;
    
    if (SubMenuItemsIndex != 0)
    {
        var previouselemid = MenuItemIDStart + MenuItems[MenuItemsIndex].SubMenus[SubMenuItemsIndex-1].MenuItemID;
        targettop = getElementPosition(previouselemid).top;
    }
    
    //if (doDebug) document.getElementById('divDebug').innerHTML += 'Closing ' + SubMenuItemsIndex + ' target:' + targettop + '   Current:' + currenttop + '<br>';
    
    var difference = (currenttop - targettop);
    var steps = (((difference/DropDownMenuSlideStep)^2)^0.5) + '';
    var bits = steps.split('.');
    if (bits.length > 1)
    {
        var intbit = bits[0];
        var t= ((intbit*1) * SlideShowSliderStep);
        SubMenuItem.style.top = t + 'px';
        SetAllSubOtherMenuTops(MenuItemsIndex, SubMenuItemsIndex, t)
    }
    
    if (currenttop > targettop)
    {
        var t = ((1*currenttop) - DropDownMenuSlideStep);
        SubMenuItem.style.top = t + 'px';
        SetAllSubOtherMenuTops(MenuItemsIndex, SubMenuItemsIndex, t);
        eval('DDClosingInstance' + MenuItems[MenuItemsIndex].MenuItemID + ' = setTimeout(\'CloseSubMenu(' + MenuItemsIndex + ', ' + SubMenuItemsIndex + ')\', DropDownMenuSlideSpeed);');
    }
    else
    {
        SubMenuItem.style.visibility = 'hidden';
        SubMenuItemsIndex--;
        if (SubMenuItemsIndex < 0)
        {    
            //alert('closed');
        }
        else
        {
            CloseSubMenu(MenuItemsIndex, SubMenuItemsIndex);
        }
    }
}

function MainMenuItemMouseMoveControl(cntrl, action)
{
    MenuItemID = cntrl.id.substring(MenuItemIDStart.length)
    
    if (action == 'over')
    {
        PositionMenuItemSubs(true, MenuItemID);
        MainMenuItemOver(MenuItemID);
    }
    else
        MainMenuItemOut(MenuItemID)
}


function MainMenuItemOver(MenuItemID)
{
    //alert(MenuItemID);
    //if (doDebug) document.getElementById('divDebug').innerHTML += 'Over'  + MenuItemID + '<br>';
    clearTimeout(eval('DDCloseTimer' + MenuItemID));
    clearTimeout(eval('DDClosingInstance' + MenuItemID));
    OpenSubMenu(GetMenuItemIndex(MenuItemID), 0)
    SetMenuItemImages(MenuItemID, 'in', 0, false);
    ForceAllClosed(MenuItemID);
}

function OpenSubMenu(MenuItemsIndex, SubMenuItemsIndex)
{ 
    if (MenuItems[MenuItemsIndex].SubMenus)
    {
        var elemid = MenuItemIDStart + MenuItems[MenuItemsIndex].SubMenus[SubMenuItemsIndex].MenuItemID;
        var SubMenuItem = document.getElementById(elemid);
        SubMenuItem.style.visibility = 'visible';
        
        var currenttop = getElementPosition(elemid).top;
        
        var targettop = 0;
        
        if (SubMenuItemsIndex == 0)
        {
            targettop = getElementPosition(MenuItemIDStart + MenuItems[MenuItemsIndex].MenuItemID).top;
            targettop += MenuGraphics[0].Height;
        }
        else
        {
            targettop = getElementPosition(MenuItemIDStart + MenuItems[MenuItemsIndex].SubMenus[SubMenuItemsIndex-1].MenuItemID).top;
            targettop += MenuGraphics[1].Height;
        }
        //Check we are starting from a position divisble by slider step
        var difference = (targettop - currenttop);
        var steps = (difference/DropDownMenuSlideStep);
        if (steps < 0) steps = steps*-1;
        
        //var steps = (((difference/DropDownMenuSlideStep)));
        //if (doDebug) document.getElementById('divDebug').innerHTML += steps.toFixed(1) + '<br>';
        steps = steps + '';
        var bits = steps.split('.');
        if (bits.length > 1)
        {
            var intbit = bits[0]*1;
            //if (doDebug) document.getElementById('divDebug').innerHTML += 'dif' + difference + '<br>';
            //if (doDebug) document.getElementById('divDebug').innerHTML += 'cur' + currenttop + '<br>';
            //if (doDebug) document.getElementById('divDebug').innerHTML += 'tar' + targettop + '<br>';
            var t = (currenttop*1) + difference - (DropDownMenuSlideStep * intbit);
            
            SubMenuItem.style.top = t + 'px';
            SetAllSubOtherMenuTops(MenuItemsIndex, SubMenuItemsIndex, t)
        }
        
        if (currenttop < targettop)
        {
            var t = ((1*currenttop) + DropDownMenuSlideStep);
            SubMenuItem.style.top = t + 'px';
            SetAllSubOtherMenuTops(MenuItemsIndex, SubMenuItemsIndex, t)
            eval('DDOpeningInstance' + MenuItems[MenuItemsIndex].MenuItemID + ' = setTimeout(\'OpenSubMenu("' + MenuItemsIndex + '", "' + SubMenuItemsIndex + '");\', DropDownMenuSlideSpeed);');
        }
        else
        {
            SubMenuItemsIndex++;
            if (SubMenuItemsIndex <= MenuItems[MenuItemsIndex].SubMenus.length-1)
                OpenSubMenu(MenuItemsIndex, SubMenuItemsIndex);
        }
    }
}

function SetAllSubOtherMenuTops(MenuItemsIndex, SubMenuItemsIndex, top)
{
    var start = SubMenuItemsIndex*1;
    var ed = MenuItems[MenuItemsIndex].SubMenus.length*1;
    for (var ii=start; ii<ed; ii++)
    {
        if  (MenuItems[MenuItemsIndex].SubMenus[ii])
        {
            document.getElementById(MenuItemIDStart + MenuItems[MenuItemsIndex].SubMenus[ii].MenuItemID).style.top = top + 'px';
        }
        else
           break;
    }
}