// The following HTML-code is an example HTML-page on how to build a
// a tree. Just cut and paste into an HTML-document. --> Ready to use.
//
//
//
//
//
//
//
//
//
//
//
//
// Generates the HTML-code for an element in the tree.
//
// Important:
// ----------
// You can change the name of the target frame in the "targetWin"
// variable. The default name is (and has to be) "main".
// This specifies the frame in which the url of an Element is loaded into.
// If the url of an Element starts with "http://", then a new window will
// be opened and the url will be loaded into it.
//
// You can edit the "imgAltText" variable to use another language for
// the functional description of the Element's image onclick event.
//
// When there is no image for an element, only the text will be shown.
// When there is only one image for an element, this image will be used
// for the open and the closed state of the element.
var g_treeConfig = null;
var g_imgAltTxt = "Click, to open or close this element of the tree.";
function GenerateElementHTML(level, element)
{
// You can change the following two variables (see above description).
var targetWin = "main";
var eUrl = element.mtEUrl;
if (eUrl.indexOf("http://") > -1) {
if (eUrl.indexOf("-") == 0) {
eUrl = eUrl.slice(1, eUrl.length);
}
else {
targetWin = "_blank";
}
}
if (eUrl.indexOf("+") == 0) {
targetWin = "_top";
eUrl = eUrl.slice(1, eUrl.length);
}
var useImgHref2 = false;
var retHtml = "";
var imgHrefHtml = "";
var imgHtml = "";
var tmpHref = "";
// Set the elements image (open / close) in front of the text (see above description).
if (element.mtEImageOpen || element.mtEImageClose) {
if (!g_treeConfig.mOpenAllElements) {
if (element.mtEChildren) {
tmpHref = "";
imgHrefHtml += tmpHref;
}
else {
useImgHref2 = true;
}
}
var tmpImg = null;
imgHtml += "![" + element.mtEDesc + "](";
if (element.mtEOpen) {
if (element.mtEChildren) {
if (element.mtEImageOpen) {
imgHtml += element.mtEImageOpen;
}
else if (element.mtEImageClose) {
imgHtml += element.mtEImageClose;
}
}
else {
imgHtml += element.mtEImageClose;
}
}
else {
if (element.mtEImageClose) {
imgHtml += element.mtEImageClose;
}
else if (element.mtEImageOpen) {
imgHtml += element.mtEImageOpen;
}
}
imgHtml += ")
0 && g_treeConfig.mCutWordsAtLevel - 1 <= level) {
if (elementText.length > 15 ) {
titleText = elementText;
var subsVal = Math.abs((g_treeConfig.mCutWordsAtLevel - 1 - level) * 3);
if (subsVal < 15) {
elementText = elementText.substr(0, 15 - subsVal) + "...";
}
hasTitleText = true;
}
}
if (elementText.length > 26 && elementText.indexOf("" + textHtml + "";
textHtml = tmpTextHtml;
if (element.mtEBold) {
textHtml = "" + textHtml + "";
}
if (eUrl) {
var urlHtml = "";
if (element.mtEChildren) {
urlHtml = "";
}
textHtml = urlHtml + ">" + textHtml + "";
}
else {
textHtml = tmpHref + textHtml + "";
}
retHtml += "" + textHtml + "";
}
else {
retHtml += "";
}
retHtml = imgHrefHtml + imgHtml + retHtml;
return retHtml;
}
// Adds spaces in front of an element to generate the level depths.
function AddSpaceLine(level, lineArray)
{
var retHtml = "";
for (var idx = 0; idx < level; idx++) {
if (lineArray && (lineArray.length > 0) && (lineArray[idx][0] > 1) && (lineArray[idx][1] < lineArray[idx][0])) {
retHtml += " ";
}
else {
retHtml += " ";
}
}
return retHtml;
}
// Adds the matrix connectors (= images!) in front of an element.
function AddMatrixConnector(level, elementIndex, elementCount, element, lineArray)
{
var retHtml = "";
var doHref = false;
if (level > 0) {
var imgStr = "";
if (element.mtEChildren) {
if (element.mtEOpen) {
imgStr = "empty";
doHref = true;
}
else {
imgStr = "full";
doHref = true;
}
}
else {
imgStr = "normal";
}
retHtml += AddSpaceLine(level - 1, lineArray);
if (doHref && element.mtEID) {
retHtml += "";
}
if (elementIndex == elementCount - 1) {
retHtml += "![](./global/tree_icons/l_" + imgStr + ".gif) ";
}
else {
retHtml += "![](./global/tree_icons/t_" + imgStr + ".gif) ";
}
if (doHref && element.mtEID) {
retHtml += "";
}
}
return retHtml;
}
// Iterates through the tree and generates the HTML-code for the elements in the tree.
function IterateAndBuildTree(level, elementChildren, idStr, elementId, lineArray)
{
var retHtml = "";
for (var idx = 0, cnt = elementChildren.length; idx < cnt; idx++) {
var elementChild=elementChildren[idx];
if (!g_treeConfig.mOpenAllElements) {
if (!elementChild.mtEIDEntered) {
if (level <= 0) {
idStr = "" + idx;
}
else {
idStr += "_" + idx;
}
elementChild.mtEID = idStr;
elementChild.mtEIDEntered = true;
}
else {
idStr = elementChild.mtEID;
}
if (elementId) {
if (elementChild.mtEID == elementId) {
if (elementChild.mtEOpen) {
elementChild.mtEOpen = false;
}
else {
elementChild.mtEOpen = true;
}
var eUrl = elementChild.mtEUrl;
if (eUrl) {
if (eUrl.indexOf("http://") > -1) {
if (eUrl.indexOf("-") == 0) {
eUrl = eUrl.slice(1, eUrl.length);
parent.main.location.href = eUrl;
}
else if (eUrl.indexOf("+") == 0) {
eUrl = eUrl.slice(1, eUrl.length);
top.location.href = eUrl;
}
else {
window.open(eUrl);
}
}
else if (eUrl.indexOf("+") == 0) {
eUrl = eUrl.slice(1, eUrl.length);
top.location.href = eUrl;
}
else {
parent.main.location.href = eUrl;
}
}
}
}
}
retHtml += " | ";
if (g_treeConfig.mShowMatrixConnectors) {
if (level > 0) {
lineArray[level - 1] = new Array(cnt, idx + 1);
}
else {
lineArray = new Array();
}
retHtml += AddMatrixConnector(level, idx, cnt, elementChild, lineArray);
}
else {
retHtml += AddSpaceLine(level);
}
retHtml += GenerateElementHTML(level, elementChild);
retHtml += " |
";
if ((g_treeConfig.mOpenAllElements && elementChild.mtEChildren) || (elementChild.mtEChildren && elementChild.mtEOpen)) {
retHtml += IterateAndBuildTree(level + 1, elementChild.mtEChildren, idStr, elementId, lineArray);
lineArray.length = lineArray.length - 1;
}
if (level > 0) {
var substr = 2;
if (idx >9) {
substr = 3;
}
else if (idx >99) {
substr = 4;
}
else if (idx >999) {
substr = 5;
}
else if (idx >9999) {
substr = 6;
}
idStr = idStr.slice(0, idStr.length - substr);
}
}
return retHtml;
}
// Generates the HTML-code for the tree.
//
// Important:
// ----------
// 1) As first parameter you *** MUST *** pass the root element of the
// tree (tree_element.js).
//
// 2) The second parameter *** CAN BE IGNORED ***.
function GenerateTree(elementId)
{
var retHtml = "";
if (!parent.treeConfig) {
parent.treeConfig = new treeConfiguration();
}
if (!parent.treeConfig.mTreeImgWidth) {
parent.treeConfig.mTreeImgWidth = "18";
}
if (!parent.treeConfig.mTreeImgHeight) {
parent.treeConfig.mTreeImgHeight = "18";
}
if (!parent.treeConfig.mFontFace) {
parent.treeConfig.mFontFace = "Arial, Geneva, sans-serif";
}
if (!parent.treeConfig.mFontSize) {
parent.treeConfig.mFontSize = "2";
}
if (!parent.treeConfig.mFontColor) {
parent.treeConfig.mFontColor = "#000000";
}
g_treeConfig = parent.treeConfig;
if (parent.location.href.indexOf("tree_load") == - 1) {
if (parent.root) {
var lineArray = new Array()
var children = parent.root.mtEChildren;
if (children && children.length) {
retHtml += " ";
retHtml += " ";
retHtml += " | ";
retHtml += IterateAndBuildTree(0, children, "", elementId, lineArray);
retHtml += " | ";
retHtml += " ";
retHtml += " ";
}
}
else {
retHtml += "Error: This HTML-Page does not contain any Tree-Elements!";
}
}
else {
retHtml += "Error: This HTML-Page must be contained within a Frame-Set!";
}
return retHtml;
}
function WinReload()
{
var g_isver = 0;
var g_agent = navigator.userAgent.toLowerCase();
var g_isns = navigator.appName == "Netscape" && (g_isver = parseInt(navigator.appVersion)) >= 4 && (g_isver = parseInt(navigator.appVersion)) <= 5;
var g_isie = navigator.appName == "Microsoft Internet Explorer" && (g_isver = parseInt(navigator.appVersion)) >= 4;
var g_isie5 = g_isie && g_agent.indexOf("msie 5.0") >= 0
if (g_isns) {
window.location.reload();
}
}
|