﻿///===============================================================================
/// JVC Canada
/// USER INTERFACE Javascript Functions
///-------------------------------------------------------------------------------
/// Copyright © JVC Canada. All rights reserved.
///===============================================================================


var BubbleTimer;
var VisibleBubbleID="";
var BubbleON_delay=100;
var BubbleOFF_delay=1000;
var objHLclicked="";
var objHLclickedclass=""; 
var objStick; 
var objFocus;  


// BubbleOn() 
//   Simulates a tooltip behavior, but using a DIV tag. 
//   Parameters: 	BubbleID	- ID of the bubble to be displayed (<div>)
//					objHovered	- ID of the object that initiated the call (hover). This parameter is optional, if not provided, it use mouse's coordinated
//					OffSetTop	- TOP coord, pixels to offset in relation to objHovered. This parameter is optional, if not provide uses 0 pixels.
//					OffSetLeft	- LEFT coord, pixels to offset in relation to objHovered. This parameter is optional, if not provide uses 0 pixels.
function BubbleOn(BubbleID, objHovered, OffSetTop, OffSetLeft, delay, objHL, objHLimgON, objHLimgOFF)
{
	// Delay in milliseconds to display bubble
	if (delay==null || typeof(delay)=="undefined") delay=500;

    clearTimeout(BubbleTimer);
   
    // Highlight object background     
    if(objHL != null && objHL != undefined)
    {
        if (objHL.tagName.toLowerCase()=="li")
            objHL.className = objHLimgON;
        else
            objHL.style.backgroundImage = objHLimgON;     
    
    }

    var baf= document.getElementById(BubbleID);
    
   
    // Get coordinates where event was triggered    
    var Coord = new Object(); 
    if (objHovered==null)
		Coord = Locate();
	else	{   
		objH = document.getElementById(objHovered)
		Coord = findPos(objH);	}
		
	
    baf.style.top = Coord.top + (OffSetTop==null ? 0 : OffSetTop) + "px";
    baf.style.left = Coord.left + (OffSetLeft==null ? 0 : OffSetLeft) + "px";
    
	// Shift to left if it doesn't fit in the window //
    var wB = baf.style.width.replace("px","");
    var lB = baf.style.left.replace("px","");
    if ( lB > (document.body.clientWidth - wB)) baf.style.left = (document.body.clientWidth - wB - 5);

    BubbleTimer = setTimeout("BubbleOnShow('" + BubbleID + "');", delay );
    
}

function BubbleDebug(f, tag)
{
	var dbg = document.getElementById("DebugPanel");
	dbg.innerHTML = dbg.innerHTML + 
					"<hr><span style='font-size:14px'><b>" + f + "</b></span><br>" +
					"VisibleBubbleID: <b>" + VisibleBubbleID + "</b><br>" +
					"BubbleTimer: <b>" + BubbleTimer + "</b><br>" + 
					((tag!=null)?"Tag: <font color=red><b>" + tag + "</b></font><br>":""); 	
					
}

function BubbleOnShow(BubbleID)
{	

	// Hide visible balloon
	if (VisibleBubbleID!="" && VisibleBubbleID != BubbleID) 
	{
		BubbleOff(VisibleBubbleID, true);
	}
		
	VisibleBubbleID=BubbleID;
	var baf = document.getElementById(BubbleID);
    baf.style.display=""; 
    
    if (BubbleID == "MenuJVCWorldwideBubble") 
        document.getElementById("ctl00_cmdLanguage").style.display="none";
    
}

function BubbleOff(BubbleID, isTheEnd, delay)
{
	// Delay in milliseconds to hide bubble
	if (delay==null || typeof(delay)=="undefined") delay=1000;

    if (isTheEnd)
    {
            clearTimeout(BubbleTimer);
            var baf = document.getElementById(BubbleID);
            baf.style.display="none";
            VisibleBubbleID="";

            if (BubbleID == "MenuJVCWorldwideBubble") // hack for IE because of z-index not working properly
                document.getElementById("ctl00_cmdLanguage").style.display="";  
                
            FocusOff();
    }
    else
    {
        if (VisibleBubbleID!="")
            BubbleTimer = setTimeout("BubbleOff('"+ BubbleID +"',true)",delay);
        else
            clearTimeout(BubbleTimer);
    }
}

function FocusOff(isIgnoreStick)
{
    if (objFocus!=undefined && objFocus!=null)
    {
        if (isIgnoreStick==null || isIgnoreStick==undefined) isIgnoreStick = false;
    
        var isFocusOn = false;
        
        if (!isIgnoreStick) 
        {
            if (objStick!=undefined && objStick!=null)
                if (objFocus.id == objStick.id.substring(0,8)) isFocusOn = true;
        }   
        
        if (!isFocusOn)
        {
            if (objFocus.tagName.toLowerCase()=="li")
                objFocus.className = "";
            else
                objFocus.style.backgroundImage = 'url(../Img/Button/AccM.gif)';
        }    
    }          
}

function Locate(e){
    var posx=0,posy=0;
    if(e==null) e=window.event;
    if(e.pageX || e.pageY){
        posx=e.pageX; posy=e.pageY;
        }
    else if(e.clientX || e.clientY){
        if(document.documentElement.scrollTop){
            posx=e.clientX+document.documentElement.scrollLeft;
            posy=e.clientY+document.documentElement.scrollTop;
            }
        else{
            posx=e.clientX+document.body.scrollLeft;
            posy=e.clientY+document.body.scrollTop;
            }
        }
        
    var Coord = new Object();
    Coord.left = posx-20;
    Coord.top = posy+10;

    return Coord;
}

// findPos() 
//   Returns the coordinates of an object on the screen
//   Parameters: 	obj - id of the object to check coordinates
// 
function findPos(obj) {
	var curleft = curtop = 0;
	if (obj.offsetParent) {
		curleft = obj.offsetLeft
		curtop = obj.offsetTop
		while (obj = obj.offsetParent) {
			curleft += obj.offsetLeft
			curtop += obj.offsetTop
		}
	}
	
	var Coord = new Object();
    Coord.left = curleft;
    Coord.top = curtop;

    return Coord;
	
	//return [curleft,curtop];
}


//////////////////////////////////////////////
//  Navigation
//
var NavSubVisible = "";

function NavOver(isMain, ctl_ID, target, BubbleObj)
{
    // Get Handle to objects
    var hilite; 
    var objHovered = $get(ctl_ID); // document.getElementById(ctl_ID);
    var topOffSet = 0;
    var leftOffSet = 0;
    

    var ctlwidth = eval(objHovered.getAttribute("ctlwidth"));
    
    if (!isNumeric(ctlwidth))
    {
       ctlwidth = ( (objHovered.innerHTML.substring(0,4).toLowerCase()=="<img") ? -5 : (objHovered.innerHTML.length * 6)  );
    }

    // Get coordinates where event was triggered    
    var Coord = new Object(); 
    Coord = findPos(objHovered);	
    if (isMain==1)        
    {
    
        topOffSet = (isIE() ? 25 : 16);
        leftOffSet = (isIE() ? 48 : 53);

        // hilite effect
        hilite = document.getElementById("NavMainHilite");
	    // Display hilite
	    hilite.style.top = Coord.top - topOffSet + "px" ; 
	    hilite.style.left = 0 - 49 + Coord.left + 20 + (objHovered.clientWidth - 20)/2 + "px" ;
	    hilite.style.display="";
	    //if(objHovered.clientWidth > 60)
	    // hilite.style.width= objHovered.clientWidth - 20 + "px";
	    // else
	    // hilite.style.width= 97 + "px";
	    
        // Display Sub menu
        if (NavSubVisible != target)
        {
            if (NavSubVisible != "")
            {
                // hide current submenu
                var objON  = document.getElementById(NavSubVisible);
                objON.style.display = "none";
            }
            if (target != "")
            {
                // display new menu
                var objOFF = document.getElementById(target);
                objOFF.style.display = "";
                Coord = findPos(document.getElementById("NavMain"));
                objOFF.style.top = Coord.top + topOffSet + "px";
                objOFF.style.left = Coord.left + "px"; 
            }
            NavSubVisible = target;
         } 
         
        // hide hilite effect from sub menu
        hilite = document.getElementById("NavSubHilite");
        hilite.style.display = "none";
        
    }
    else // (IsMain = 0) --> Sub menu
    {
    
        topOffSet = 6; //(isIE() ? 6 : 58);
        leftOffSet = 5; //(isIE() ? 5 : -42);
    
        // hilite effect
        hilite = document.getElementById("NavSubHilite");
        
	    // Display hilite
	    hilite.style.top = Coord.top - topOffSet + "px"; 
	    hilite.style.width = ctlwidth + "px";
	    hilite.style.left = Coord.left + leftOffSet + "px";
	    hilite.style.display="";        
	    
	    // Bubble object
	    if (BubbleObj!="")
	    {
	        BubbleOn(BubbleObj, ctl_ID, 24, 5, BubbleON_delay);
	    }
    }
}

function NavOut(isMain, ctl_ID, target, BubbleObj)
{
    // Bubble object
    if (BubbleObj!="")
    {
        BubbleOff(BubbleObj,false,BubbleOFF_delay);
    }

}

function StyleStick(objIdClicked)
{
    FocusOff(true);

    // Restore className from previous obj clicked //
    if (objStick != undefined && objStick != null)
    { 
        if (objStick.tagName.toLowerCase() == "li")
            objStick.className = "";
        else
            objStick.style.backgroundImage = "url(../Img/Button/AccM.gif)";     
            
        // turn off menu focus case option clicked was from the submenu
        if (objStick.id.length > 8)
        {
            var objStickTop = document.getElementById(objStick.id.substring(0,8));
            if (objStickTop != null)
            {
                if (objStickTop.tagName.toLowerCase() == "li")
                    objStickTop.className = "";
                else
                    objStickTop.style.backgroundImage = "url(../Img/Button/AccM.gif)";
            }
        }
    }

    // Assign object clicked to objStick
    objStick = document.getElementById(objIdClicked);
    
    if (objStick != undefined && objStick != null)
    {
        if (objStick.tagName.toLowerCase()=="li")
            objStick.className = "NavMenuON";
        else
            objStick.style.backgroundImage = "url(../Img/Button/AccMHot.gif)";     
            
        // turn on menu focus case option clicked was from the submenu
        if (objStick.id.length>8)
        {
            var objStickTop = document.getElementById(objStick.id.substring(0,8));
            if (objStickTop != null)
            {
                if (objStickTop.tagName.toLowerCase() == "li")
                    objStickTop.className = "NavMenuON";
                else
                    objStickTop.style.backgroundImage = "url(../Img/Button/AccMHot.gif)";
            }
        }
    }
}
