//Use this script to display Ajax definitions
//Change the variables below according to your needs
var pathXML = "kick_crosslinks.xml";
var pathThemesFolder = "../App_Themes/KickTheHabit/";

//do not change code below
var oXHR = null;
function ShowCrossLinks(ItemId, e)
{
    //empty div
    document.getElementById("Definition").innerHTML = "";
    //Get Mouse position
    var pos = GetMousePosition(e);
    var x = parseInt(pos.substring(0, pos.lastIndexOf("|")));
    var y = parseInt(pos.substring(pos.lastIndexOf("|") + 1, pos.length));
    //Set Deltas
    x = x - 60;
    //y = y - 40;
    
    //Display loading gif
    var strHTML = "<table width='349' border='0' cellpadding='0' cellspacing='0'><tr><td colspan='4' class='balloon_t1'></td></tr><tr><td class='balloon_t2'></td>";
    strHTML = strHTML + "<td class='balloon_title'>&nbsp;</td>";
    strHTML = strHTML + "<td class='balloon_btn'><img id=btnBalloonClose src=" + pathThemesFolder + "ballon_close_i.png onmouseover=ShowCloseBtn('over'); onmouseout=ShowCloseBtn('out'); onclick=HideCrossLinks(); alt=close /></td><td class='balloon_t3'></td></tr><tr><td class='balloon_l'></td><td colspan='2' class='balloon_central'>";
    strHTML = strHTML + "<p class='balloon_def'><center><img src='" + pathThemesFolder + "ajax-loader.gif' alt='loading definition' /></center></p>";
    strHTML = strHTML + "</td><td class='balloon_r'></td></tr><tr><td colspan='4' class='balloon_b'></td></tr></table>";
    document.getElementById("Definition").style.top = y + "px";
    document.getElementById("Definition").style.left = x + "px";
    document.getElementById("Definition").innerHTML = strHTML;
    document.getElementById("Definition").style.visibility = "visible";
    
    // Create XMLHttpRequest objet
    get_Xhr();
    if (oXHR == null) return; //check if OK
    
    //State: 0	Non initialisé | 1	Début du transfert | 2	Données transférées | 3	Données accessibles en partie | 4	Données accessibles
    oXHR.onreadystatechange = function()
    {
        //If query is finished and without errors
        //if(oXHR.readyState == 4 && oXHR.status == 200)
        if(oXHR.readyState == 4)
        {
            //What to do when XML is loaded
            //Load the nodes
            oNodes = oXHR.responseXML.documentElement.getElementsByTagName("ITEM");

            var strKeyword = "";                                        
            var strDef = "";
            var strLinks = "";
            //loop trough the nodes and search for the one with proper ID
            for (i = 0; i < oNodes.length; i++)
            {
                //Process only element nodes (type 1)
                if (oNodes[i].nodeType==1)
                { 
                    //Get the node with searched id
                    if (oNodes[i].getAttributeNode("id").nodeValue == ItemId)
                    {
                        //Get the key word
                        strKeyword = oNodes[i].getElementsByTagName("KEYWORD")[0].firstChild.nodeValue;
                        //Get the definition
                        strDef = oNodes[i].getElementsByTagName("DEFINITION")[0].firstChild.nodeValue;
                        //Get the links
                        oLinks = oNodes[i].getElementsByTagName("LINK");
                        for (j = 0; j < oLinks.length; j++)
                        {
                            var strTarget = oLinks[j].getElementsByTagName("TARGET")[0].firstChild.nodeValue;
                            //check if internal or external link
                            if (strTarget.substring(0, 7) == "http://")
                            {
                                strLinks = strLinks + "<a href='" + strTarget + "' class='balloon_links' target='_blank'>" + oLinks[j].getElementsByTagName("LABEL")[0].firstChild.nodeValue + "</a><br />";
                            }
                            else
                            {
                                strLinks = strLinks + "<a href='" + strTarget + "' class='balloon_links'>" + oLinks[j].getElementsByTagName("LABEL")[0].firstChild.nodeValue + "</a><br />";
                            }
                        }
                    }
                } 
            }
            
            //output
            strHTML = "<table width='349' border='0' cellpadding='0' cellspacing='0'><tr><td colspan='4' class='balloon_t1'></td></tr><tr><td class='balloon_t2'></td>";
            strHTML = strHTML + "<td class='balloon_title'>" + strKeyword + "</td>";
            strHTML = strHTML + "<td class='balloon_btn'><img id=btnBalloonClose src=" + pathThemesFolder + "ballon_close_i.png onmouseover=ShowCloseBtn('over'); onmouseout=ShowCloseBtn('out'); onclick=HideCrossLinks(); alt=close /></td><td class='balloon_t3'></td></tr><tr><td class='balloon_l'></td><td colspan='2' class='balloon_central'>";
            strHTML = strHTML + "<p class='balloon_def'>" + strDef + "</p>";
            if (strLinks != "")
            {
                strHTML = strHTML + "<p class='balloon_see'>See also</p>";
                strHTML = strHTML + "<p>" + strLinks + "</p>";
            }
            strHTML = strHTML + "</td><td class='balloon_r'></td></tr><tr><td colspan='4' class='balloon_b'></td></tr></table>";
            document.getElementById("Definition").innerHTML = strHTML;
        }
        else
        {
            //alert("status : "+oXHR.status)
        }
    }
    //Call the XML asynchrone mode 
    oXHR.open("GET", pathXML, true);
    //Send query
    oXHR.send(null);
}

function get_Xhr()
{
    //Create a XMLHttRequest function
    if(window.XMLHttpRequest)
    {// code for IE7, Firefox, Mozilla, etc.
        oXHR = new XMLHttpRequest();
    }
    else if(window.ActiveXOject)
    {
        try
        {//Other
            oXHR = new ActiveXObject("Msxml2.XMLHTTP");
        }
        catch(e)
        {
            try
            {// code for IE5, IE6
                oXHR = new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch(el)
            {
                oXHR = null;
            }
        }
    }
    else
    {
        // Diplsay error message
        var strHTML = "<table width='349' border='0' cellpadding='0' cellspacing='0'><tr><td colspan='4' class='balloon_t1'></td></tr><tr><td class='balloon_t2'></td>";
        strHTML = strHTML + "<td class='balloon_title'>&nbsp;</td>";
        strHTML = strHTML + "<td class='balloon_btn'><img id=btnBalloonClose src=" + pathThemesFolder + "ballon_close_i.png onmouseover=ShowCloseBtn('over'); onmouseout=ShowCloseBtn('out'); onclick=HideCrossLinks(); alt=close /></td><td class='balloon_t3'></td></tr><tr><td class='balloon_l'></td><td colspan='2' class='balloon_central'>";
        strHTML = strHTML + "<p class='balloon_def'><center>Your browser does not support Ajax.<br /><br />Please update your browser.</center></p>";
        strHTML = strHTML + "</td><td class='balloon_r'></td></tr><tr><td colspan='4' class='balloon_b'></td></tr></table>";
        document.getElementById("Definition").style.top = y + "px";
        document.getElementById("Definition").style.left = x + "px";
        document.getElementById("Definition").innerHTML = strHTML;
        document.getElementById("Definition").style.visibility = "visible";
        //alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest\nVeuillez le mettre à jour");
    }
    return oXHR;
}

function GetMousePosition(e)
{
    // capture the mouse position
    var posx = 0;
    var posy = 0;
    if (!e) var e = window.event;
    if (e.pageX || e.pageY)
    {
        posx = e.pageX;
        posy = e.pageY;
    }
    else if (e.clientX || e.clientY)
    {
        posx = e.clientX;
        posy = e.clientY;
    }
    //alert('Mouse position is: X = ' + posx + ' Y = ' + posy);
    return posx + "|" + posy;
}

function HideCrossLinks()
{
    document.getElementById("Definition").style.visibility = "hidden";
    document.getElementById("Definition").innerHTML = "";
    document.getElementById("Definition").style.top = "0px";
    document.getElementById("Definition").style.left = "0px";
}

function ShowCloseBtn(action)
{
    if (action == 'over')
    {
        document.getElementById("btnBalloonClose").src = pathThemesFolder + "ballon_close_h.png";
    }
    else
    {
        document.getElementById("btnBalloonClose").src = pathThemesFolder + "ballon_close_i.png";
    }
}