/SQL/scripts/js/mylittletree.js
JavaScript | 239 lines | 200 code | 14 blank | 25 comment | 47 complexity | 9316651a6992daa9c45f85c7c4fa89b4 MD5 | raw file
1// 2// myLittleTree v1.0 3// 4// Web site : http://www.mylittletools.net 5// Email : webmaster@mylittletools.net 6// (c) 2000-2002, Elian Chrebor, myLittleTools.net, All rights reserved. 7// 8// This file is not freeware. 9// You cannot re-distribute it without any agreement with myLittleTools.net. 10// Contact webmaster@mylittletools.net for more info. 11// 12// Logs : 13// 20020701 : expandNode function added 14// 20020618 : first release 15// 16 17 18// Images 19var mlt_blank = new Image(16,22); 20var mlt_exp = new Image(16,22); 21var mlt_exp_last = new Image(16,22); 22var mlt_red = new Image(16,22); 23var mlt_red_last = new Image(16,22); 24var mlt_node = new Image(16,22); 25var mlt_node_last = new Image(16,22); 26var mlt_line = new Image(16,22); 27 28// String 29var mlt_Error = "Cannot initialize myLittleTree object. Dynamic navigation is disabled."; 30var mlt_Alt = "Click to expand or reduce." 31 32// checks browser 33var mlt_DOM = (document.getElementById) ? true : false; 34var mlt_NS4 = (document.layers) ? true : false; 35var mlt_IE = (document.all) ? true : false; 36var mlt_IE4 = mlt_IE && !mlt_DOM; 37var mlt_Mac = (navigator.appVersion.indexOf("Mac") != -1); 38var mlt_IE4M = mlt_IE4 && mlt_Mac; 39var mlt_Opera = (navigator.userAgent.indexOf("Opera")!=-1); 40var mlt_isOK = !mlt_Opera && !mlt_IE4M && (mlt_DOM); 41 42// Constructor 43function myLittleTree_Folder(pId, pFatherId, pDescription, pIcon, pLink, pTarget, pCSSClass) 44{ 45 this.fatherId = pFatherId; 46 this.id = pId; 47 this.description = pDescription; 48 this.link = pLink; 49 this.target = pTarget; 50 this.icon = pIcon; 51 this.CSSClass = pCSSClass; 52 this.isOpened = false; 53 this.children = new Array(); 54 this.imageopen = ""; 55 this.imageclose = ""; 56} 57 58function myLittleTree(pLitteralName, pImageFolder) 59{ 60 if (arguments.length > 0) 61 this.litteralName = pLitteralName 62 else 63 { 64 alert(mlt_Error); 65 mlt_isOK = false; 66 } 67 (arguments.length > 1) ? this.imageFolder = pImageFolder : this.imageFolder = ""; 68 this.folderCount = 0; 69 this.root = ""; 70 this.index = new Array(); 71 this.tree = new Array(); 72 this.addFolder = mlt_addFolder; 73 this.createHTML = mlt_createHTML; 74 this.clickNode = mlt_clickNode; 75 this.expandNode = mlt_expandNode; 76 mlt_setImages(this.imageFolder); 77} 78 79// defines images 80function mlt_setImages(pImageFolder) 81{ 82 mlt_blank.src = pImageFolder + "mlt_blank.gif"; 83 mlt_exp.src = pImageFolder + "mlt_exp.gif"; 84 mlt_exp_last.src = pImageFolder + "mlt_exp_last.gif"; 85 mlt_red.src = pImageFolder + "mlt_red.gif"; 86 mlt_red_last.src = pImageFolder + "mlt_red_last.gif"; 87 mlt_node.src = pImageFolder + "mlt_node.gif"; 88 mlt_node_last.src = pImageFolder + "mlt_node_last.gif"; 89 mlt_line.src = pImageFolder + "mlt_line.gif"; 90} 91 92// Adds a Node 93function mlt_addFolder(pId, pFatherId, pDescription, pIcon, pLink, pTarget, pCSSClass) 94{ 95 var myIcon, myLink, myTarget, myCSSClass; 96 (arguments.length > 3) ? myIcon = pIcon : myIcon = ""; 97 (arguments.length > 4) ? myLink = pLink : myLink = ""; 98 (arguments.length > 5) ? myTarget = pTarget : myTarget = ""; 99 (arguments.length > 6) ? myCSSClass = pCSSClass : myCSSClass = ""; 100 this.tree[this.folderCount] = new myLittleTree_Folder(pId, pFatherId, pDescription, myIcon, myLink, myTarget, myCSSClass); 101 this.index[pId] = this.folderCount++; 102 (pFatherId != null) ? this.tree[this.index[pFatherId]].children[this.tree[this.index[pFatherId]].children.length] = pId : this.root = pId; 103 return (true); 104} 105 106// Opens/Closes a Node 107function mlt_clickNode(pNodeId) 108{ 109 var myNode = this.tree[this.index[pNodeId]]; 110 myNode.isOpened = !(myNode.isOpened); 111 document.getElementById("IMG_" + myNode.id).src = (myNode.isOpened) ? myNode.imageclose : myNode.imageopen; 112 for (var i = 0; i < myNode.children.length; i++) 113 { 114 if (myNode.isOpened) 115 { 116 document.getElementById(myNode.children[i]).style.display = "block"; 117 document.getElementById("IMG_" + myNode.children[i]).src = this.tree[this.index[myNode.children[i]]].imageopen; 118 } 119 else 120 { 121 if (this.tree[this.index[myNode.children[i]]].isOpened) 122 this.clickNode(myNode.children[i]); 123 document.getElementById(myNode.children[i]).style.display = "none"; 124 } 125 } 126 return (true); 127} 128 129// Expands a full Node 130function mlt_expandNode(pNodeId) 131{ 132 if (! mlt_isOK) return (false); 133 var myNode = this.tree[this.index[pNodeId]]; 134 myNode.isOpened = true; 135 document.getElementById("IMG_" + myNode.id).src = myNode.imageclose; 136 for (var i = 0; i < myNode.children.length; i++) 137 { 138 //this.expandNode(myNode.children[i]); 139 document.getElementById(myNode.children[i]).style.display = "block"; 140 } 141 return (true); 142} 143 144// computes HTML code 145function mlt_createHTML() 146{ 147 var myIcon = ""; 148 if (this.tree[this.index[this.root]].icon != "") myIcon = "<IMG SRC=\"" + this.imageFolder + this.tree[this.index[this.root]].icon + "\" BORDER=0 ALIGN=MIDDLE ALT=\"myLittleTree\"> "; 149 var myHTML = "<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0"; 150 if (mlt_isOK) myHTML += " STYLE=\"display: block;\""; 151 myHTML += " ID=\"" + this.root + "\" SUMMARY=\"" + this.root + "\"><TR><TD NOWRAP> </TD><TD NOWRAP"; 152 (this.tree[this.index[this.root]].CSSClass == "") ? myHTML += ">" : myHTML += " CLASS=\"" + this.tree[this.index[this.root]].CSSClass + "\">"; 153 myHTML += myIcon; 154 if (this.tree[this.index[this.root]].link != "") 155 { 156 myHTML += "<A HREF=\"" + this.tree[this.index[this.root]].link + "\""; 157 if (this.tree[this.index[this.root]].CSSClass != "") myHTML += " CLASS=\"" + this.tree[this.index[this.root]].CSSClass + "\""; 158 (this.tree[this.index[this.root]].target == "") ? myHTML += ">" : myHTML += " TARGET=\"" + this.tree[this.index[this.root]].target + "\">"; 159 } 160 myHTML += this.tree[this.index[this.root]].description; 161 if (this.tree[this.index[this.root]].link != "") myHTML += "</A>"; 162 myHTML += "</TD></TR></TABLE>\n"; 163 myHTML += mlt_createNodeHTML(this, this.root, ""); 164 return (myHTML); 165} 166 167function mlt_createNodeHTML(pObj, pNodeId, pLineStatus) 168{ 169 var myNode, myIndex, myHTML = "", myCollapse, j, myLineStatus, myIcon, myStyle, myAlt; 170 myNode = pObj.tree[pObj.index[pNodeId]]; 171 for (var i = 0; i < myNode.children.length; i++) 172 { 173 myIndex = pObj.index[myNode.children[i]]; 174 (pNodeId == pObj.root) ? myStyle = "block" : myStyle = "none"; 175 if (pObj.tree[myIndex].children.length > 0) 176 { 177 if (i == myNode.children.length-1) 178 { 179 pObj.tree[myIndex].imageopen = mlt_exp_last.src; 180 pObj.tree[myIndex].imageclose = mlt_red_last.src; 181 myAlt = mlt_Alt; 182 } 183 else 184 { 185 pObj.tree[myIndex].imageopen = mlt_exp.src; 186 pObj.tree[myIndex].imageclose = mlt_red.src; 187 myAlt = mlt_Alt; 188 } 189 } 190 else 191 { 192 if (i == myNode.children.length-1) 193 { 194 pObj.tree[myIndex].imageopen = mlt_node_last.src; 195 pObj.tree[myIndex].imageclose = mlt_node_last.src; 196 myAlt = ""; 197 } 198 else 199 { 200 pObj.tree[myIndex].imageopen = mlt_node.src; 201 pObj.tree[myIndex].imageclose = mlt_node.src; 202 myAlt = ""; 203 } 204 } 205 206 myCollapse = "<IMG SRC=\"" + mlt_blank.src + "\" BORDER=0 WIDTH=5 ALT=\"myLittleTree :: spacing\">"; 207 if (pLineStatus.length >= 1) 208 for (j = 0; j < pLineStatus.length ; j++) 209 (pLineStatus.charAt(j) == "1") ? myCollapse += "<IMG SRC=\"" + mlt_blank.src + "\" BORDER=0 ALT=\"myLittleTree :: spacing\">" : myCollapse += "<IMG SRC=\"" + mlt_line.src + "\" BORDER=0 ALT=\"myLittleTree :: line\">"; 210 if (mlt_isOK) 211 (pObj.tree[myIndex].children.length > 0) ? myCollapse += "<A HREF=# onclick=\"" + pObj.litteralName + ".clickNode('" + pObj.tree[myIndex].id + "'); return false;\"><IMG SRC=\"" + pObj.tree[myIndex].imageopen + "\" BORDER=0 ID=\"IMG_" + pObj.tree[myIndex].id + "\" ALT=\"" + myAlt + "\"></A>" : myCollapse += "<IMG SRC=\"" + pObj.tree[myIndex].imageopen + "\" BORDER=0 ID=\"IMG_" + pObj.tree[myIndex].id + "\" ALT=\"" + myAlt + "\">"; 212 else 213 myCollapse += "<IMG SRC=\"" + pObj.tree[myIndex].imageclose + "\" BORDER=0 ID=\"IMG_" + pObj.tree[myIndex].id + "\" ALT=\"" + myAlt + "\">"; 214 myIcon = ""; 215 if (pObj.tree[myIndex].icon != "") myIcon = "<IMG SRC=\"" + pObj.imageFolder + pObj.tree[myIndex].icon + "\" BORDER=0 ALT=\"myLittleTree\" ALIGN=MIDDLE>"; 216 myHTML += "<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0"; 217 if (mlt_isOK) myHTML += " STYLE=\"display: " + myStyle + ";\""; 218 myHTML += " ID=\"" + pObj.tree[myIndex].id + "\" SUMMARY=\"" + pObj.tree[myIndex].id + "\"><TR><TD NOWRAP>" + myCollapse + "</TD><TD NOWRAP"; 219 (pObj.tree[myIndex].CSSClass == "") ? myHTML += ">" : myHTML += " CLASS=\"" + pObj.tree[myIndex].CSSClass + "\">"; 220 myHTML += myIcon + " "; 221 if (pObj.tree[myIndex].link != "") 222 { 223 myHTML += "<A HREF=\"" + pObj.tree[myIndex].link + "\""; 224 if (pObj.tree[myIndex].CSSClass != "") myHTML += " CLASS=\"" + pObj.tree[myIndex].CSSClass + "\""; 225 (pObj.tree[myIndex].target == "") ? myHTML += ">" : myHTML += " TARGET=\"" + pObj.tree[myIndex].target + "\">"; 226 } 227 myHTML += pObj.tree[myIndex].description; 228 if (pObj.tree[myIndex].link != "") myHTML += "</A>"; 229 myHTML += "</TD></TR></TABLE>\n"; 230 231 if (pObj.tree[myIndex].children.length > 0) 232 { 233 myLineStatus = pLineStatus; 234 (i == myNode.children.length-1) ? myLineStatus += "1" : myLineStatus += "0"; 235 myHTML += mlt_createNodeHTML(pObj, pObj.tree[myIndex].id, myLineStatus); 236 } 237 } 238 return (myHTML); 239}