// cc 2002-11-12 modifed for HTML_TreeMenuXL // +-----------------------------------------------------------------------+ // | Copyright (c) 2002, Richard Heyes, Harald Radi | // | All rights reserved. | // | | // | Redistribution and use in source and binary forms, with or without | // | modification, are permitted provided that the following conditions | // | are met: | // | | // | o Redistributions of source code must retain the above copyright | // | notice, this list of conditions and the following disclaimer. | // | o Redistributions in binary form must reproduce the above copyright | // | notice, this list of conditions and the following disclaimer in the | // | documentation and/or other materials provided with the distribution.| // | o The names of the authors may not be used to endorse or promote | // | products derived from this software without specific prior written | // | permission. | // | | // | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS | // | "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT | // | LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR | // | A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT | // | OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, | // | SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT | // | LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, | // | DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY | // | THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT | // | (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE | // | OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. | // | | // +-----------------------------------------------------------------------+ // | Author: Richard Heyes | // | Harald Radi | // +-----------------------------------------------------------------------+ // // $Id: TreeMenu.js,v 1.8 2002/11/10 18:16:19 richard Exp $ /** * TreeMenu class */ function TreeMenu(iconpath, myname, linkTarget, defaultClass, usePersistence) { // Properties this.iconpath = iconpath; this.myname = myname; this.linkTarget = linkTarget; this.defaultClass = defaultClass; this.usePersistence = usePersistence; this.imgWidth = 20; this.imgHeight = 20; this.n = new Array(); this.branches = new Array(); this.branchStatus = new Array(); this.layerRelations = new Array(); this.childParents = new Array(); this.cookieStatuses = new Array(); // cc 2002-11-12 this.style = false; this.lineImageWidth = this.imgWidth; this.lineImageHeight= this.imgHeight; this.iconImageWidth = this.imgWidth; this.iconImageHeight= this.imgHeight; this.preloadImages(); } /** * Adds a node to the tree */ TreeMenu.prototype.addItem = function (newNode) { newIndex = this.n.length; newNode.iconImageWidth = this.imgWidth; newNode.iconImageHeight = this.imgHeight; newNode.lineImageWidth = this.imgWidth; newNode.lineImageHeight = this.imgHeight; this.n[newIndex] = newNode; return this.n[newIndex]; } TreeMenu.prototype.SetImageSize = function(w, h) { this.imgWidth = w; this.imgHeight = h; } /** * Preload images hack for Mozilla */ TreeMenu.prototype.preloadImages = function () { var plustop = new Image; plustop.src = this.iconpath + '/plustop.gif'; var plusbottom = new Image; plusbottom.src = this.iconpath + '/plusbottom.gif'; var plus = new Image; plus.src = this.iconpath + '/plus.gif'; var minustop = new Image; minustop.src = this.iconpath + '/minustop.gif'; var minusbottom = new Image; minusbottom.src = this.iconpath + '/minusbottom.gif'; var minus = new Image; minus.src = this.iconpath + '/minus.gif'; var branchtop = new Image; branchtop.src = this.iconpath + '/branchtop.gif'; var branchbottom = new Image; branchbottom.src = this.iconpath + '/branchbottom.gif'; var branch = new Image; branch.src = this.iconpath + '/branch.gif'; var linebottom = new Image; linebottom.src = this.iconpath + '/linebottom.gif'; var line = new Image; line.src = this.iconpath + '/line.gif'; } /** * Main function that draws the menu and assigns it * to the layer (or document.write()s it) */ TreeMenu.prototype.drawMenu = function ()// OPTIONAL ARGS: nodes = [], level = [], prepend = '', expanded = false, visbility = 'inline', parentLayerID = null { /** * Necessary variables */ var output = ''; var modifier = ''; var layerID = ''; var parentLayerID = ''; /** * Parse any optional arguments */ var nodes = arguments[0] ? arguments[0] : this.n var level = arguments[1] ? arguments[1] : []; var prepend = arguments[2] ? arguments[2] : ''; var expanded = arguments[3] ? arguments[3] : false; var visibility = arguments[4] ? arguments[4] : 'inline'; var parentLayerID = arguments[5] ? arguments[5] : null; var currentlevel = level.length; for (var i=0; i 1 ? "top" : 'single'; } else if(i == (nodes.length-1)) { modifier = "bottom"; } else { modifier = ""; } /** * Single root branch is always expanded */ if (!this.doesMenu() || (parentLayerID == null && nodes.length == 1)) { expanded = true; } else if (nodes[i].expanded) { expanded = true; } else { expanded = false; } /** * Make sure visibility is correct based on parent status */ visibility = this.checkParentVisibility(layerID) ? visibility : 'none'; /** * Setup branch status and build an indexed array * of branch layer ids */ if (nodes[i].n.length > 0) { this.branchStatus[layerID] = expanded; this.branches[this.branches.length] = layerID; } /** * Setup toggle relationship */ if (!this.layerRelations[parentLayerID]) { this.layerRelations[parentLayerID] = new Array(); } this.layerRelations[parentLayerID][this.layerRelations[parentLayerID].length] = layerID; /** * Branch images */ var gifname = nodes[i].n.length && this.doesMenu() && nodes[i].isDynamic ? (expanded ? 'minus' : 'plus') : 'branch'; // cc 2002-11-12 variable image dimensions to line below var iconimg = nodes[i].icon ? this.stringFormat('', this.iconpath, nodes[i].icon, nodes[i].iconImageWidth, nodes[i].iconImageHeight) : ''; /** * Build the html to write to the document * IMPORTANT: * document.write()ing the string: '
', layerID, visibility, (nodes[i].cssClass ? nodes[i].cssClass : this.defaultClass)) : this.stringFormat('
', ''); var onMDown = this.doesMenu() && nodes[i].n.length && nodes[i].isDynamic ? this.stringFormat('onmousedown="{0}.toggleBranch(\'{1}\', true)" style="cursor: pointer; cursor: hand"', this.myname, layerID) : ''; // cc 2002-11-12 variable image dimensions to line below var imgTag = this.stringFormat('', this.iconpath, gifname, modifier, layerID, onMDown, nodes[i].lineImageWidth, nodes[i].lineImageHeight); var linkStart = nodes[i].link ? this.stringFormat('', nodes[i].link, this.linkTarget) : ''; var linkEnd = nodes[i].link ? '' : ''; // cc 2002-11-12 All these are additions var selectedStart = nodes[i].selected ? "" : ''; var selectedEnd = nodes[i].selected ? '' : ''; var nobrStart = this.brOK ? '' : ''; var nobrEnd = this.brOK ? '' : ''; // cc 2002-11-12 modified output = this.stringFormat('{0}{1}{2}{3}{4}{5}{6}{7}{8}{9}{10}
', layerTag, nobrStart, prepend, parentLayerID == null && nodes.length == 1 ? '' : imgTag, iconimg, selectedStart, linkStart, nodes[i].title, linkEnd, selectedEnd, nobrEnd); /** * Write out the HTML. Uses document.write for speed over layers and * innerHTML. This however means no dynamic adding/removing nodes on * the client side. This could be conditional I guess if dynamic * adding/removing is required. */ document.write(output + "\r\n"); /** * Traverse sub nodes ? */ if (nodes[i].n.length) { /** * Determine what to prepend. If there is only one root * node then the prepend to pass to children is nothing. * Otherwise it depends on where we are in the tree. */ if (parentLayerID == null && nodes.length == 1) { var newPrepend = ''; } else if (i < (nodes.length - 1)) { // cc 2002-11-12 Both lines, added image size parameters. var newPrepend = prepend + this.stringFormat('', this.iconpath, nodes[i].lineImageWidth, nodes[i].lineImageHeight); } else { var newPrepend = prepend + this.stringFormat('', this.iconpath, nodes[i].lineImageWidth, nodes[i].lineImageHeight); } this.drawMenu(nodes[i].n, level, newPrepend, nodes[i].expanded, expanded ? 'inline' : 'none', layerID); } } } /** * Toggles a branches visible status. Called from resetBranches() * and also when a +/- graphic is clicked. */ TreeMenu.prototype.toggleBranch = function (layerID, updateStatus) // OPTIONAL ARGS: noSave = false { var currentDisplay = this.getLayer(layerID).style.display; var newDisplay = (this.branchStatus[layerID] && currentDisplay == 'inline') ? 'none' : 'inline' for (var i=0; i= 5)); var is_gecko = (agt.indexOf('gecko') != -1); var is_ie = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1)); var is_ie4 = (is_ie && (is_major == 4) && (agt.indexOf("msie 4")!=-1) ); var is_ie4up = (is_ie && (is_major >= 4)); //--> end hide JavaScript