/SQL/scripts/js/mylittletree.js

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