logo

Content Linking (Javascript/XML)

Purpose: Content linking provides a hierarchial table of contents. The javascript source code can walk a hierarchial tree displaying a title, description, and make an url available for hyper link. This is great snippet if you want to put a book online. The first level can be your chapters and the second level can be subsections in the chapter.

<script language=javascript>
var nodeContentLinkingDoc;
var sContentLinkingCurrentNodeKey;
sContentLinkingCurrentNodeKey="root";
var goBottomNode;

function content_linking_next()
{
	var oNode;
	var oCurrentNode;
	var oOldNode;
	var sRetText;

	oNode=content_linking_getNode(sContentLinkingCurrentNodeKey);
	sRetText="";
	
	/*Rule 1 - Check for a Descendant */
	oCurrentNode=oNode.firstChild;

	/*Rule 2 - Check for a Sibling */
	if(oCurrentNode==null)
	{
		oCurrentNode=oNode.nextSibling;
	}	
	/*Rule 3 - Check for Parent Node' Sibling */
	if(oCurrentNode==null)
	{
		oCurrentNode=oNode.parentNode;
		while (oCurrentNode!=null)
		{
			oOldNode=oCurrentNode;

			oCurrentNode=oCurrentNode.nextSibling;
			if (oCurrentNode==null)
			{
				oCurrentNode=oOldNode.parentNode;
			}
			else
			{
			sContentLinkingCurrentNodeKey=oCurrentNode.getAttribute("key");
				break;
			}
		}
	}	

	if (oCurrentNode != null)
	{
		sContentLinkingCurrentNodeKey=oCurrentNode.getAttribute("key");
		sRetText=oCurrentNode.getAttribute("key");
	}
	else
	{
		sRetText=oNode.getAttribute("key");
	}
	return(sRetText);
}
function content_linking_previous()
{
	var oNode;
	var oCurrentNode;
	var oOldNode;
	var sRetText;

	sRetText="";

	/* Rule 1 - Find Sibling - Find the bottom-most child of the sibling*/
	oNode=content_linking_getNode(sContentLinkingCurrentNodeKey);
	oCurrentNode=oNode.previousSibling;

	/* Rule 2 - Find Siblings bottom of the tree*/
	if (oCurrentNode!=null)
	{
		goBottomNode=null;
		bottomOfTree(oCurrentNode);
		oCurrentNode=goBottomNode;
	}

	/* Rule 3 - Find Parent*/
	if (oCurrentNode==null)
	{
		oOldNode=oCurrentNode;
		oCurrentNode=oNode.parentNode;
		if (oCurrentNode.getAttribute("key")=="root")
		{
			oCurrentNode=oOldNode;
		}
	}
	if (oCurrentNode != null)
	{
		sContentLinkingCurrentNodeKey=oCurrentNode.getAttribute("key");
		sRetText=oCurrentNode.getAttribute("key");
	}
	else
	{
		sRetText=oNode.getAttribute("key");
	}
	return(sRetText);
}
function contentLinkingClass()
{
       var sXML;
   nodeContentLinkingDoc=new ActiveXObject("Microsoft.XMLDOM");

sXML="<xml>";
sXML=sXML+"<node parent_key=\'na\' key=\'root\'"
sXML=sXML+" title=\'Content\' description=\'Content Linking\' img_src=\'\' >";
sXML=sXML+"</node>";
sXML=sXML+"</xml>";

   nodeContentLinkingDoc.async = 0;
   nodeContentLinkingDoc.loadXML(sXML);
}
function add(sParent_Key,sKey,sTitle,sDescription,sUrl,sImg_Url)
{
	var oNewNode;
	var oParentNode;
	var sCriteria;

	oNewNode=nodeContentLinkingDoc.createElement("node");

	/* 1-Search for Parent Node Match */

	sCriteria="//node[@key $eq$ \ '"+sParent_Key+"\']";

	oParentNode=nodeContentLinkingDoc.selectSingleNode(sCriteria);
	
	/* 2-Insert new Node into Document Object Model (dom) structure*/

	if(oParentNode!=null)
	{
		oNewNode.setAttribute("parent_key",sParent_Key);
		oNewNode.setAttribute("key",sKey);
		oNewNode.setAttribute("description",sDescription);
		oNewNode.setAttribute("img_src",sImg_Url);
		oNewNode.setAttribute("title",sTitle);
		oNewNode.setAttribute("url",sUrl);
		oParentNode.appendChild(oNewNode);
	}
	

}
function bottomOfTree(oNode)
{
	goBottomNode=oNode;

	if  (oNode.hasChildNodes()>0)
	{
		bottomOfTree(oNode.lastChild);		
	}

}
function traverseTree(oNode)
{

	document.write("<dl>");
	do
	{
		if (oNode.getAttribute("img_src") != "") 
		{
document.write("<dt><ddr>"
+"<img src='"+oNode.getAttribute("img_src")
+"'>"+"<a href='javascript:0' onClick='content_click(\""
+oNode.getAttribute("parent_key")+"\",\""
+oNode.getAttribute("key")+"\"); 
return false;'>"+oNode.getAttribute("title")+"</a>");
		}
		else
		{
document.write("<dt><ddr>"
+"<a href='javascript:0' onClick='content_click(\""
+oNode.getAttribute("parent_key")+"\",\""
+oNode.getAttribute("key")+"\"); 
return false;' target=BLANK>"+oNode.getAttribute("title")+"</a>");
		}

		if  (oNode.hasChildNodes()>0)
		{
			traverseTree(oNode.firstChild);		
		}
		oNode=oNode.nextSibling;
	}
	while(oNode != null);
	document.write("</dl>");
}
function content_linking_getNode(sKey) { 
	var oNode;

	sCriteria="//node[@key $eq$ \ '"+sKey+"\']";

	oNode=nodeContentLinkingDoc.selectSingleNode(sCriteria);

	if(oNode != null)
	{
		return(oNode);
	}
	else
	{
		alert("Content Linking Node not found-"+sKey);
	}

} 
function getContentLinkingXMLDocument()
{	
	return(nodeContentLinkingDoc);
}
function content_click(sParent_Key,sKey)
{
	var oNode;

	sCurrentNodeKey=sKey;
	oNode=content.getNode(sCurrentNodeKey);

	frmSetup.txtSelection.value=oNode.getAttribute("title");
	frmSetup.txtDescription.value=oNode.getAttribute("description");

	sCurrent_Url=oNode.getAttribute("url");
	//alert(sCurrent_Url);

}
function load_url()
{
	location.href=sCurrent_Url;
}
function load_data()
{
	var oRootNode;

	oRootNode=getContentLinkingXMLDocument().selectSingleNode("/xml/node");

content.add("root",
"A2",
"ShipToTransferBillTo",
"Transfers ShipTo Field field information to BillTo Fields",
"http://www.listensoftware.com/xml/xml08252002.xml",
"http://www.listensoftware.com/folder.gif");	

content.add("root",
"A3",
"validation",
"Returns the length of a string","http://www.listensoftware.com/jsvalidation.html",
"http://www.listensoftware.com/folder.gif");	

	content.add("root","A4","loadXML",
"Takes an xml file, applies and xsl style sheet, and produces and string output",
"http://www.listensoftware.com/xml/xml188682.xml",
"http://www.listensoftware.com/folder.gif");	

	content.add("root","A5",
"ud_splice",
"Return all previous character up to the pattern match",
"http://www.listensoftware.com/xml/xml190158.xml",
"http://www.listensoftware.com/folder.gif");	

	content.add("root",
"A6",
"setStatusLine",
"Display a message on the Status Line",
"http://www.listensoftware.com/xml/xml190415.xml",
"http://www.listensoftware.com/folder.gif");	

	content.add("root",
"A7",
"highlight",
"Returns a character phrase with html highlighting a Pattern.  
The hightlight is dependant on the type.",
"http://www.listensoftware.com/xml/xml191356.xml",
"http://www.listensoftware.com/folder.gif");	

	content.add("root",
"A8",
"HtmlAscii",
"Return a stream of HTML Ascii Codes quantified by the iterations parameter",
"http://www.listensoftware.com/xml/xml195147.xml",
"http://www.listensoftware.com/folder.gif");	

	content.add("root",
"A9",
"quickViewWindow",
"Launches another Window and Displays the HTML contents Output",
"http://www.listensoftware.com/xml195275.xml",
"http://www.listensoftware.com/folder.gif");	

	content.add("root",
"A10",
"addItem",
"Insert an Item into a select control",
"http://www.listensoftware.com/xml/xml198731.xml",
"http://www.listensoftware.com/folder.gif");	

	content.add("root",
"A11",
"TabClick",
"Build a html tab control",
"http://www.listensoftware.com/xml/xml202281.xml",
"http://www.listensoftware.com/folder.gif");	

	content.add("root",
"A12",
"sendtoHTTP",
"Inline transmission of data to an http server",
"http://www.listensoftware.com/xml/xml204915.xml",
"http://www.listensoftware.com/folder.gif");	

	content.add("root",
"A13",
"auto_link",
"Automatic jump to a url on when the mouse moves over a link",
"http://www.listensoftware.com/xml/xml208865.xml",
"http://www.listensoftware.com/folder.gif");	

	content.add("root",
"A14",
"animateImages",
"Rotating Image and Dynamically Change the Link",
"http://www.listensoftware.com/xml/xml248710.xml",
"http://www.listensoftware.com/folder.gif");	

	content.add("root",
"A15",
"selectedItem",
"Search a select and item in a listbox (key match)",
"http://www.listensoftware.com/xml/xml254280.xml",
"http://www.listensoftware.com/folder.gif");	

	content.add("root",
"A16",
"getSelectedText",
"Displays the Text portion of an selected item of a list box",
"http://www.listensoftware.com/xml/xml258677.xml",
"http://www.listensoftware.com/folder.gif");	

	content.add("root",
"A17",
"MultiDimensionalArray",
"Building a MultiDimensional Array in Javascript",
"http://www.listensoftware.com/xml/xml265746.xml",
"http://www.listensoftware.com/folder.gif");	

content.add("root",
"A18",
"scripting.dictionary",
"Simulate an associative array using the scripting.dictionary class",
"http://www.listensoftware.com/xml285693.xml","http://www.listensoftware.com/folder.gif");	

	content.add("root",
"A19",
"content.add",
"Dynamically creating a Table of Contents class",
"http://www.listensoftware.com/xml/xml288481.xml",
"http://www.listensoftware.com/folder.gif");	

	content.add("root",
"A20",
"indexOf",
"Explains how to find a string inside of a bigger string",
"http://www.listensoftware.com/xml/xml300124.xml",
"http://www.listensoftware.com/folder.gif");	

	content.traverseTree(oRootNode);
}


var content=new contentLinkingClass();
content.add=add;
content.getNode=content_linking_getNode;
content.traverseTree=traverseTree;
content.next=content_linking_next;
content.previous=content_linking_previous;
content.getNode=content_linking_getNode;
var sCurrent_Url;

</script>

<form name="frmSetup">
<table width=500 border=1>
<tr>
<td width=200>
<script language=javascript>
	load_data();
</script>
</td>
<td valign=top>
<pre>
<input type="button" name="cmdNext" value="Next" onClick="	
	var sCurrentNodeKey=content.next();	
	var oNode=content.getNode(sCurrentNodeKey);	
	frmSetup.txtSelection.value=oNode.getAttribute('title');
	frmSetup.txtDescription.value=oNode.getAttribute('description');
	sCurrent_Url=oNode.getAttribute('url');
"><input type="button" name="cmdPrevious" value="Previous" onClick="
	var sCurrentNodeKey=content.previous();
	var oNode=content.getNode(sCurrentNodeKey);
	frmSetup.txtSelection.value=oNode.getAttribute('title');
	frmSetup.txtDescription.value=oNode.getAttribute('description');
">
Node
<input type="textbox" name="txtSelection">
<input type=button name=cmdLoad value="Load" OnClick="load_url();">

Description
<textarea name="txtDescription" rows=5 cols=40>
</textarea>
<pre>
</td>
</tr>
</table>
</form>
s