// This js file contains functions to support Learning Paths
// All function and global variables are preceded by lp_

// for printing
lp_v_cTitleTextColor = "#99ccFF";
lp_v_cTitleBackground = '#163A5E';

//lp_v_cTitleTextColor = '#163A5E';
lp_v_cTitleTextColor = '#001C72';

//lp_v_cTitleBackground = "#FFFFF5";
//lp_v_cTitleBackground = "#99ccFF";
lp_v_cTitleBackground = "#FFE38D";

lp_v_cBorderColor = "#000000";
lp_v_cBorderColorHot = "#CC0000";

lp_v_cStaticBackground = '#CC0000';

function lp_m_loadLearningPath(p_oRoot){
	
	if (typeof(p_oRoot) == 'undefined')
	{
	    var oRoot = document.getElementById('forest');
	}
	else
	{
	    var oRoot = p_oRoot
	}
	
	//if (document.getElementById('forest') != null){
	if (oRoot != null){
		//lp_m_RemoveWhitespace(document.getElementById('forest'));
		lp_m_RemoveWhitespace(oRoot);
		
		//var l_oStyleSheet = document.styleSheets['forjs'].cssRules;
		l_oSheet = document.styleSheets.length-1;
		while(l_oSheet>0)
		{
			if (document.styleSheets[l_oSheet].title == 'forjs')
			{
				if (navigator.appName == 'Microsoft Internet Explorer')
				{
					var l_cssRules = document.styleSheets[l_oSheet].rules;
				}
				else
				{
					var l_cssRules = document.styleSheets[l_oSheet].cssRules;
				}
				break;
			}
			
			--l_oSheet;
		}
		
		l_cssRules[0].style.display = 'none';

	    l_oSheet = document.styleSheets.length-1;
	    while(l_oSheet>=0)
        {
          if (navigator.appName == 'Microsoft Internet Explorer')
          {
            var l_oRules = document.styleSheets[l_oSheet].rules.length-1;
          }
          else
          {
            var l_oRules = document.styleSheets[l_oSheet].cssRules.length-1;
          }
          while(l_oRules>=0)
          {
                    
              if (navigator.appName == 'Microsoft Internet Explorer')
              {
                 var l_oThisRule = document.styleSheets[l_oSheet].rules[l_oRules];
              }
              else
              {
                 var l_oThisRule = document.styleSheets[l_oSheet].cssRules[l_oRules];
              }
                    
	          if (l_oThisRule.selectorText == '.learningPathNode')
	          {
	              lp_v_cTitleTextColor = l_oThisRule.style.color;
	              lp_v_cTitleBackground = l_oThisRule.style.backgroundColor;
                  break;
              }
              --l_oRules;
           }
           --l_oSheet;
        }
		
		// Get the root node for each path (or tree).
		//var l_aTrees = document.getElementById('forest').childNodes;
		var l_aTrees = oRoot.childNodes;
		var l_nTreeCount = l_aTrees.length;
		var i= l_nTreeCount;
		
		while(i>0){
			// Get a Tree
			var l_oTree = l_aTrees[i-1];
			
			// There may be optional branchs.
			// Each option contains a line object and a title object
			// To get the number of optional branches divide by 2
			var l_nBranchOptions = l_oTree.childNodes[0].childNodes[0].childNodes[0].childNodes.length / 2
			
			for(var ii=0; ii<l_nBranchOptions; ++ii){
				var l_nBranchElement = ii*2 // Calculate the number of the first element for the branch.
				var l_oTreeLine = l_oTree.childNodes[0].childNodes[0].childNodes[0].childNodes[l_nBranchElement];// table.tbody.tr.td.div
				
				if (ii>0){ // Optional branch?
					var l_oPrevTitle = l_oTree.childNodes[0].childNodes[0].childNodes[0].childNodes[l_nBranchElement-1];// table.tbody.tr.td.div
				}
				
				var l_oTreeTitle = l_oTree.childNodes[0].childNodes[0].childNodes[0].childNodes[l_nBranchElement+1];// table.tbody.tr.td.div
				with (l_oTreeTitle.style){
					// The line shouldn't extend beyond the left side of the title - hide it!.
					marginLeft = '0px'
					//left = '-1px';// Cover any over hanging line.
				}
				
				// set the margin before the heigth - for IE, changing the margin changes the clientHeight
				
				with (l_oTreeLine.style){
					// Create the horizontal border that intersects the text.
					// The height of line object also sets the top position of the text.
					
					var l_nPixelHeight = l_oTreeLine.parentNode.clientHeight / 2;
					
					if (ii>0){ // Optional branch?
						var l_nPixelHeight = l_oTreeLine.parentNode.clientHeight / (l_nBranchOptions*1.5);
						var l_nPixelHeight = l_nPixelHeight + (l_oPrevTitle.offsetHeight);
						
						// Adjust the line to intercept the previous optional branch.
						//top = - l_oTreeTitle.offsetHeight;
						top = - (l_oPrevTitle.offsetHeight + 1); // add 1 so the vertical line meets the horizonal of the prev
						
						borderRight = "1px solid black";
						zIndex = 1;
					}
					
					left = '1px';
					height = l_nPixelHeight + 'px';
				}
				
				if (ii>0){ // Optional branch?
					with (l_oTreeTitle.style){
						top = (- l_oPrevTitle.offsetHeight) - 10;// move the title up with the line
						zIndex = 2;
					}
				}
				
				var l_oTreeTitleCell = l_oTree.childNodes[0].childNodes[0].childNodes[0];// table.tbody.tr.td
				with (l_oTreeTitleCell.style){
					// The root node doesn't start on a vertical line - hide it!
					borderLeft = "0px solid black";
				}
				
				var l_oBranchTitle = l_oTree.childNodes[0].childNodes[0].childNodes[0].childNodes[l_nBranchElement+1];// table.tbody.tr.td
				lp_m_SetTitleStyles(l_oBranchTitle);
			}
			
			//l_oTree.childNodes[0].childNodes[0].childNodes[1].childNodes[i-1].childNodes[0].childNodes[0].childNodes[0].childNodes[1].childNodes[1].style.display = 'none';// hide the Details
			
			// Process each branch of the tree.
			var l_oFirstBranch = l_oTree.childNodes[0].childNodes[0].childNodes[1];// table.tbody.tr.td
			lp_m_BuildBranch(l_oFirstBranch);
			
			--i;
		}
		
	 // Add event handlers to make details moveable.
		with (document.getElementById('lp_details')){
			if (navigator.appName == 'Microsoft Internet Explorer'){
				
				onmousedown = lp_m_OnDownDetails;
				onmousemove = lp_m_DragDropDetails;
				onmouseup = lp_m_OnUpDetails;
				
			}
			else { // mozilla
				addEventListener('mousedown', lp_m_OnDownDetails, false)	
				//addEventListener('mousemove', lp_m_DragDropDetails, false)	
				//addEventListener('mouseup', lp_m_OnUpDetails, false)	
			}
		}
		
		if (navigator.appName == 'Microsoft Internet Explorer'){
		
		}
		else
		{
			/*
				put the mousemove event on the body. Thus, if the mouse moves off
				the "Detail Window" the drag will still take place.
			*/
			
			document.body.addEventListener('mousemove', lp_m_DragDropDetails, true)
			
			// the same is true for the mouse up.
			document.body.addEventListener('mouseup', lp_m_OnUpDetails, false)
		}
		
		// Offset the detail page to create the shadow.
		with(document.getElementById('lp_detailPage').style){
			
			top = '-4px';
			
			if (navigator.appName == 'Microsoft Internet Explorer'){
				left = '-2px';
			}
			else{// Mozilla has to be different!
				left = '-4px';
			}
		}
		
	 	// show the learning path
		//document.getElementById('forest').style.visibility = 'visible';
		oRoot.style.visibility = 'visible';
	}
	else{
	// do nothing
	}
} // end function lp_m_loadLearningPath

function lp_m_BuildBranch(p_oBranch){

	// get the number of stems in this branch
	var l_nStemCount = p_oBranch.childNodes.length;// td

	
	if(l_nStemCount == 0){// There are no stems on this branch
		
		l_oBranchTitle = p_oBranch.parentNode.childNodes[0].childNodes[1];// td.tr.td.div
		
		// go back to the "learning node" and clean-up the horizonal line.
		with (l_oBranchTitle.style){
			// hide the line by covering it with the title.
			if (navigator.appName == 'Microsoft Internet Explorer'){
				marginRight = '0px'
			}
			else{
				marginRight = '-1px'
			}
		}
		
	}
	else{
		
		var i = l_nStemCount;
		
		// go through each stem and create the connecting lines.		
		while(i>0){
			
			var l_oLine = p_oBranch.childNodes[i-1].childNodes[0].childNodes[0].childNodes[0].childNodes[0];
			
			with (l_oLine.style){
			 // create the horizonal border that intersects the text.
			 // the height of line object also sets the top position of the text
			 
				// Is this is an only child?
				if (l_nStemCount == 1){
					// if so, set the line height the to the same value as the line of its parent.
					if (navigator.appName == 'Microsoft Internet Explorer'){
						if (p_oBranch.parentNode.childNodes[0].childNodes.length > 2){ // There are Optional Branches
							var l_nLastline = p_oBranch.parentNode.childNodes[0].childNodes.length - 2;
							var l_nPixelHeight = p_oBranch.parentNode.childNodes[0].childNodes[0].offsetHeight + (p_oBranch.parentNode.childNodes[0].childNodes[l_nLastline].offsetHeight / 2);
						}
						else{
							var l_nPixelHeight = p_oBranch.parentNode.childNodes[0].childNodes[0].offsetHeight;
							if (l_nPixelHeight > 0)l_nPixelHeight -= 1;// not sure why it is off by a pixel, but it is.
						}
					}
					else{
						var l_nPixelHeight = p_oBranch.parentNode.childNodes[0].childNodes[0].clientHeight;
					}
				}
				else{
					// calculate the height
					var l_nPixelHeight = Math.round(l_oLine.parentNode.clientHeight / 2);
				}
				
				height = l_nPixelHeight + 'px';
				
				if (i > 1){
					left = '0px';
				}
				else{
				 //  for the top stem offset the line object to cover 50% of the table border
				 //  the border will then connect to the bottom border of the div creating a 45 turn.
					
					left = '-1px';
					backgroundColor = 'white';
				}
				
				
				if (i == l_nStemCount && l_nStemCount > 1){
					// on the last stem create the 45 turn by setting the left border on the line object
					borderLeft = "1px solid black";
				}
				
			}
			
			var l_oBranchTitle = p_oBranch.parentNode.childNodes[0].childNodes[1];// td.tr.td.div
			var l_oBranchTitle = p_oBranch.childNodes[i-1].childNodes[0].childNodes[0].childNodes[0].childNodes[1];// td.table.tbody.tr.td.div
			//l_oBranchTitle = p_oBranch.parentNode.childNodes[0].childNodes[1];// td.tr.td.div
	
			with (l_oBranchTitle.style){
				/*
				if (l_nStemCount == 1){
					if (navigator.appName == 'Microsoft Internet Explorer'){
						marginRight = '0px'
					}
					else{
						marginRight = '-1px'
					}
				}
				*/
			}
			lp_m_SetTitleStyles(l_oBranchTitle);
//l_oLine.title = l_oBranchTitle.outerHTML			
			var l_oTitleCell = p_oBranch.childNodes[i-1].childNodes[0].childNodes[0].childNodes[0];
					
			with (l_oTitleCell.style){
				if (i == l_nStemCount){
					// on the last stem finish creating the 45 turn by removing the table border
					borderLeft = "0px solid black";
				}
			}
			
			--i;
		}
	}

	// Process each stem as a new branch.

	var i = l_nStemCount

	while(i>0){
		var l_oNextBranch = p_oBranch.childNodes[i-1].childNodes[0].childNodes[0].childNodes[1];// td.table.tbody.tr.td
		lp_m_BuildBranch(l_oNextBranch);
	 --i;
	}
} // end function lp_m_BuildBranch

function lp_m_RemoveWhitespace(p_cToClean){
// remove child elements which contain only whitespace
// This is only an issue with Mozilla browsers (i.e., Netscape and Firefox).

	if (navigator.appName == 'Netscape'){
		for (var i=p_cToClean.childNodes.length-1; i>=0; i--){
			var l_cType = p_cToClean.childNodes[i].nodeType;
			if(l_cType == 1){// element node - process the children
				lp_m_RemoveWhitespace(p_cToClean.childNodes[i]); 
			}
			else if (l_cType == 3 && !(/[^\t\n\r ]/.test(p_cToClean.childNodes[i].data))){ // text node w/ only whitespace - remove
				var oldChild = p_cToClean.removeChild(p_cToClean.childNodes[i])
			}
			else if (l_cType == 8){ // comment node - remove
				var oldChild = p_cToClean.removeChild(p_cToClean.childNodes[i])
			}
		}
	}
} // end function lp_m_RemoveWhitespace

function lp_m_SetTitleStyles(p_oElement){
	with (p_oElement){
		
		//if (getAttribute('allowHighlight') == 'true') // attributes are returned as strings
		if (style.backgroundColor != 'red') // attributes are returned as strings
		{
			setAttribute('allowHighlight', 'false');
			style.color = lp_v_cTitleTextColor;
			childNodes[0].style.color = lp_v_cTitleTextColor;
			style.backgroundColor = lp_v_cTitleBackground;
		}
		else
		{
			setAttribute('allowHighlight', 'true');
			style.color = lp_v_cTitleBackground;
			childNodes[0].style.color = lp_v_cTitleBackground;
			style.backgroundColor = lp_v_cStaticBackground;
		}
	}
}

function lp_m_OnMouseOver(me){
	//lp_m_HighlightPath(me, lp_v_cTitleBackground, lp_v_cTitleTextColor);
	//lp_m_HighlightPath(me, null, null, lp_v_cBorderColorHot, 'dashed');
	lp_m_HighlightPath(me, null, 'transparent', lp_v_cBorderColorHot, 'dashed');
}

function lp_m_OnMouseOut(me){
	//lp_m_HighlightPath(me, lp_v_cTitleTextColor, lp_v_cTitleBackground );
	//lp_m_HighlightPath(me, null, null, lp_v_cBorderColor, 'solid');
	lp_m_HighlightPath(me, null, 'opaque', lp_v_cBorderColor, 'solid');
}
lp_HighLightSource = null;
function lp_m_HighlightPath(p_oLightSource, p_cTextColor, p_cBackground, p_cBorder, p_cBorderStyle){
// to highlight the border only set p_cTextColor and p_cBackground to null

	// set defaults
	if (typeof(p_cBorder) == 'undefined') p_cBorder = null;
	if (typeof(p_cBorderStyle) == 'undefined') p_cBorderStyle = null;
	
	// There may be optional branchs.
	var l_nBranchOptions = p_oLightSource.parentNode.childNodes.length / 2
	
	for(var ii=0; ii<l_nBranchOptions; ++ii){
		var l_nBranchElement = ii*2
		
		with (p_oLightSource.parentNode.childNodes[l_nBranchElement+1])
		{
			
			if (getAttribute('allowHighlight') == 'true')// an attribute is returned as a string
			{
				var l_allowHighlight =  false;
			}
			else
			{
				var l_allowHighlight =  true;
			}
			
			if (l_allowHighlight)
			{
				if (p_cTextColor != null)
				{
					style.color = p_cTextColor;
					childNodes[0].style.color = p_cTextColor;
					
					// store the text color. The user will eventually mouse off and we will need to know what color to restore too.
					setAttribute('storedtxcolor',p_cTextColor);
				}
				
				if (p_cBackground != null)
				{
				
					if (p_cBackground == 'transparent')
					{
						setAttribute('storedbgcolor',style.backgroundColor);
						setAttribute('storedtxcolor',childNodes[0].style.color);
						
						style.backgroundColor = '#ffffff';
						childNodes[0].style.color = lp_v_cTitleTextColor;
						
					}
					else if(p_cBackground == 'opaque')
					{
						// put it back to the stored color
						style.backgroundColor = getAttribute('storedbgcolor');
						childNodes[0].style.color = getAttribute('storedtxcolor');
					}
					else
					{
						// save the background color. The user will eventually mouse off and we will need to know what color to restore too.
						setAttribute('storedbgcolor',p_cBackground);
						style.backgroundColor = p_cBackground;
					}
				}
				
				if (p_cBorder != null)
				{
					style.borderColor = p_cBorder;
				}
				
				if (p_cBorderStyle != null)
				{
					style.borderStyle = p_cBorderStyle;
				}
			}
		}
	}

	if (p_oLightSource.parentNode.parentNode.parentNode.parentNode.parentNode.id.toLowerCase() != 'forest'){ //div.td.tr.tbody.table.body
		lp_m_HighlightPath(p_oLightSource.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.childNodes[0].childNodes[1], p_cTextColor,p_cBackground, p_cBorder, p_cBorderStyle); // div.td.tr.tbody.table.td.tr.td.div
	}
} // end function lp_m_HighlightPath

function lp_m_OnClick(me, p_oEvent){

	if (lp_HighLightSource != null)
	{
		lp_m_HighlightPath(lp_HighLightSource, lp_v_cTitleTextColor, lp_v_cTitleBackground, null, null);
	}

	lp_m_HighlightPath(me, lp_v_cTitleBackground, lp_v_cTitleTextColor);
	lp_HighLightSource = me; // save the source
	
	lp_m_DisplayDetails(me, p_oEvent);
}

function lp_m_DisplayDetails(me, p_oEvent){
	
		// populate the detail window

	// Replace the class attribute with an ID attribute.
	// The div is used for dynamic updating from the Learning Path table.
	var l_cDetails = me.childNodes[1].innerHTML;
	l_cDetails = l_cDetails.replace(/title=('|")?Title('|")?/, "id='lp_pathtitle'")
	l_cDetails = l_cDetails.replace(/title=('|")?Format('|")?/, "id='lp_pathformat'")
	l_cDetails = l_cDetails.replace(/title=('|")?Additional formats('|")?/, "id='lp_pathformat'")
	l_cDetails = l_cDetails.replace(/title=('|")?Description('|")?/, "id='lp_pathdesc'")
	l_cDetails = l_cDetails.replace(/title=('|")?More Details('|")?/, "id='lp_pathMore'")

	//document.getElementById('lp_detailPage').innerHTML = me.childNodes[1].innerHTML;
	document.getElementById('lp_detailPage').innerHTML = l_cDetails;
	
	
	document.getElementById('lp_detailShadow').innerHTML = me.childNodes[1].innerHTML; // The shadow will be given the same size as the page. 
	document.getElementById('lp_detailShadow').childNodes[0].style.visibility = 'hidden';
	
	
	with (document.getElementById('lp_details')){
		style.visibility = 'visible';
		// set the position
		if (document.getElementById('lp_details').dragged != true){
			
			style.width = '400px';
			
			if (navigator.appName == 'Microsoft Internet Explorer'){
				var l_nWinWidth = document.body.clientWidth;
				var l_nWinHeight = document.body.clientHeight;
			}
			else{
				var l_nWinWidth = window.innerWidth;
				var l_nWinHeight = window.innerHeight;
			}
			
			var l_nDetailWidth = parseInt(style.width);
			var l_nDetailHeight = document.getElementById('lp_detailPage').offsetHeight;
			var l_nDetailRight = p_oEvent.clientX + l_nDetailWidth;
			
			if (l_nDetailRight > l_nWinWidth){
				var l_nLeftOffset = (l_nDetailRight - l_nWinWidth) + 35;// add a little padding - Netscape includes the scrollbar in the innerwidth
			}
			else{
				var l_nLeftOffset = 0;
			}
			
			//if (navigator.appName == 'Microsoft Internet Explorer')
			//{
			
				//style.left = p_oEvent.clientX - l_nLeftOffset;
				//style.top = (document.body.scrollTop + p_oEvent.clientY) + 10;// add a little padding
				
				// IE doesn't support scrollY
				// scrollTop is not supported with the doctype HTML 4.01 Transitional loose.dtd
				//var l_nY = (document.body.scrollTop + p_oEvent.clientY) + 10;// add a little padding
				//var l_nY = (document.documentElement.scrollTop + p_oEvent.clientY);
				
				
			//}
			//else
			//{
				//var l_nY = window.scrollY + p_oEvent.clientY;
			//}
			
			var l_nY = me.offsetTop
			
			if (l_nY + l_nDetailHeight > l_nWinHeight){
			    l_nY -= l_nDetailHeight // put the window above the node
			    //l_nY -= 10; // add some padding
			}
			else
			{
			    l_nY +=  me.offsetHeight; // add the node height
			    l_nY += 10; // add some padding
			}
			
			var l_nX = p_oEvent.clientX - l_nLeftOffset
			
			style.left = l_nX + 'px';
			style.top = l_nY + 'px';
		}
		else{
			
		}

	}



	// reset
	lp_PrevSelectedLPitem = null

} // end function lp_m_DisplayDetails

lp_PrevSelectedLPitem = null;

function lp_m_SelectLPitem(me, p_cMoreHref,p_cType){

	document.getElementById("lp_pathtitle").innerHTML = me.innerHTML;	
	document.getElementById("lp_pathformat").innerHTML = p_cType;
	document.getElementById("lp_pathdesc").innerHTML = me.title;

	if (p_cMoreHref != "")
	{
		document.getElementById("lp_pathMore").href = p_cMoreHref;
	}

	// change the icon
	if (lp_PrevSelectedLPitem == null)
	{
		// The default selection is always the last item in the learning path.
		
		// TODO need a better way to located the last item.
		// me.td.tr.table.tr.td.img
		//me.parentNode.parentNode.parentNode.childNodes[me.parentNode.parentNode.parentNode.childNodes.length-3].childNodes[0].childNodes[0].src = "/App_Graphcs/spacer.gif";
		var l_oItems = me.parentNode.parentNode.parentNode.childNodes
		for (var i= l_oItems.length-1; i>0; i--)
		{
			var l_nContentLen = me.parentNode.parentNode.parentNode.childNodes[i].childNodes[0].innerHTML.length
			if (l_nContentLen > 1) // filter spacer rows
			{
				
				var l_nContentNodeType = me.parentNode.parentNode.parentNode.childNodes[i].childNodes[0].childNodes[0].nodeType
				if (l_nContentNodeType == 1) // filter non-element rows - rows contianing only text
				{
					var l_cContentTag = me.parentNode.parentNode.parentNode.childNodes[i].childNodes[0].childNodes[0].tagName
					if (l_cContentTag.toUpperCase() == 'IMG') // filter tags other than img
					{
						var l_cContentSrc = me.parentNode.parentNode.parentNode.childNodes[i].childNodes[0].childNodes[0].src
						if (l_cContentSrc.indexOf('navigate_right_sm.jpg') > 1) // look for the nav icon
						{
							me.parentNode.parentNode.parentNode.childNodes[i].childNodes[0].childNodes[0].src = "/App_Graphcs/spacer.gif";
							break;
						}
					}
				}
			}
		}
		
	}
	else
	{
		lp_PrevSelectedLPitem.parentNode.parentNode.childNodes[0].childNodes[0].src = "/App_Graphcs/spacer.gif";
	}
	
	me.parentNode.parentNode.childNodes[0].childNodes[0].src = "/App_Graphcs/navigate_right_sm.jpg";
	
	lp_PrevSelectedLPitem = me;
	
}

function lp_m_ExpandDigest(me,p_cTopicCount)
{
	var l_nTopicCount = parseInt(p_cTopicCount);
	
	// Setting display to an empty string returns the value to default.
	// Alternately, display would need to be set to 'table-row' for firefox
	// and 'block' for IE.

	// expand / collapse the eTopic rows
	// an extra iteration is added for the spacer row	
	for(var i=me.parentNode.parentNode.rowIndex; i<me.parentNode.parentNode.rowIndex+l_nTopicCount+1; ++i)
	{
		if (me.src.indexOf('plus_compact.png') > 0)
		{
			me.parentNode.parentNode.parentNode.childNodes[i+1].style.display = '';
		}
		else
		{
			me.parentNode.parentNode.parentNode.childNodes[i+1].style.display = 'none';
		}
	}

	// toggle the plus / minus
	if (me.src.indexOf('plus_compact.png') > 0)
	{
		me.src = '/App_Graphcs/minus_compact.png';
	}
	else
	{
		me.src = '/App_Graphcs/plus_compact.png';
	}
}

function lp_m_OnDownDetails(mozillaevent){

	// set the mozilla event object to the same object name as IE
	if (navigator.appName == 'Microsoft Internet Explorer'){
		var l_oEvent = window.event;
	}
	else{
		var l_oEvent = mozillaevent;
	}

	document.getElementById('lp_details').moving=true;
	
	if (navigator.appName == 'Microsoft Internet Explorer'){
		document.getElementById('lp_details').setCapture();
	}

	var l_nY = l_oEvent.clientY;
	var l_nX = l_oEvent.clientX;

	if (navigator.appName == 'Microsoft Internet Explorer'){
		var l_nTop =  document.getElementById('lp_details').style.pixelTop
		var l_nLeft =  document.getElementById('lp_details').style.pixelLeft
	}
	else{ // mozilla
		var l_nTop =  parseInt(document.getElementById('lp_details').style.top);
		var l_nLeft =  parseInt(document.getElementById('lp_details').style.left);
	}
	
	document.getElementById('lp_details').clickY= l_nY - l_nTop;
	document.getElementById('lp_details').clickX= l_nX - l_nLeft;

} // end function lp_m_OnDownDetails

function lp_m_OnUpDetails(){
	document.getElementById('lp_details').moving=false;
	if (navigator.appName == 'Microsoft Internet Explorer'){
		this.releaseCapture();
	}
	
} // end function lp_m_OnUpDetails

function lp_m_DragDropDetails(mozillaevent){

	// set the mozilla event object to the same object name as IE
	if (navigator.appName == 'Microsoft Internet Explorer'){
		var l_oEvent = window.event;
	}
	else{
		var l_oEvent = mozillaevent;
	}
	
	if(document.getElementById('lp_details').moving==true){
		
		var l_nClickY = document.getElementById('lp_details').clickY;
		var l_nClickX = document.getElementById('lp_details').clickX
		
		if (navigator.appName == 'Microsoft Internet Explorer'){	
			document.getElementById('lp_details').style.pixelLeft = l_oEvent.clientX - l_nClickX;
			document.getElementById('lp_details').style.pixelTop = l_oEvent.clientY - l_nClickY;
		}
		else{
			document.getElementById('lp_details').style.left = (l_oEvent.clientX - l_nClickX) + 'px';
			document.getElementById('lp_details').style.top = (l_oEvent.clientY - l_nClickY) + 'px';
		}
		
		document.getElementById('lp_details').dragged = true;
	}
} // end function lp_m_DragDropDetails

function lp_m_CloseDetails(){
	document.getElementById('lp_details').style.visibility = 'hidden';
	
	if (lp_HighLightSource != null)
	{
		lp_m_HighlightPath(lp_HighLightSource, lp_v_cTitleTextColor, lp_v_cTitleBackground, null, null);
		lp_HighLightSource = null;
	}
	
} // end function lp_m_CloseDetails