-/**
-* Original Author of this file: Martin Mouritzen. (martin@nano.dk)
-*
-*
-* (Lack of) Documentation:
-*
-*
-* If a finishedLoading method exists, it will be called when the tree is loaded.
-* (good to display a div, etc.).
-*
-*
-* You have to set the variable rootNode (as a TreeNode).
-*
-* You have to set a container element, this is the element in which the tree will be.
-*
-*
-* TODO:
-* Save cookies better (only 1 cookie for each tree). Else the page will totally cookieclutter.
-*
-***********************************************************************
-* Configuration variables.
-************************************************************************/
-
-// Should the rootNode be displayed.
-var showRootNode = true;
-
-// Should the dashed lines between nodes be shown.
-var showLines = true;
-
-// Should the nodes be sorted? (You can either specify a number, then it will be sorted by that, else it will
-// be sorted alphabetically (by name).
-var sortNodes = true;
-
-// This is IMPORTANT... use an unique id for each document you use the tree in. (else they'll get mixed up).
-var documentID = window.location.href;
-
-// being read from cookie.
-var nodesOpen = new Array();
-
-// RootNode of the tree.
-var rootNode;
-
-// Container to display the Tree in.
-var container;
-
-// Shows/Hides subnodes on startup
-var showAllNodesOnStartup = false;
-
-// Is the roots dragable?
-var dragable = false;
-
-
-/************************************************************************
-* The following is just instancevariables.
-************************************************************************/
-var href = '';
-
-// rootNodeCallBack name (if null, it's not selectable).
-var rootNodeCallBack = null;
-
-// selectedNode
-var selectedNode = null;
-
-var states = '';
-var statearray = new Array();
-
-var treeNodeEdited = null;
-
-var editaborted = false;
-
-var floatDragElement = null;
-var colouredElement = null;
-var draggedNodeID = null;
-var lastDraggedOnNodeID = null;
-
-
-/**
-* The TreeNode Object
-* @param id unique id of this treenode
-* @param name The title of this node
-* @param icon The icon if this node (Can also be an array with 2 elements, the first one will represent the closed state, and the next one the open state)
-* @param param A parameter, this can be pretty much anything. (eg. an array with information).
-* @param orderNumber an orderNumber If one is given the nodes will be sorted by this (else they'll be sorted alphabetically (If sorting is on).
-*/
-function TreeNode(id,name,icon,param,orderNumber) {
- this.id = id;
- this.childs = new Array();
- this.name = (name == null ? 'unset name' : name);
- this.icon = (icon == null ? '' : icon);
- this.parent = null;
- this.handler = null;
- this.param = (param == null ? '' : param);
- this.orderNumber = (orderNumber == null ? -1 : orderNumber);
-
- this.openeventlisteners = new Array();
- this.editeventlisteners = new Array();
- this.moveeventlisteners = new Array();
- this.haschilds = false;
- this.editable = false;
- this.linestring = '';
-
- this.nextSibling = null;
- this.prevSibling = null;
-
- this.childsHasBeenFetched = false;
-
- this.getID = function() {
- return this.id;
- }
- this.setName = function(newname) {
- this.name = newname;
- }
- this.getName = function() {
- return this.name;
- }
- this.getParam = function() {
- return this.param;
- }
- this.setIcon = function(icon) {
- this.icon = icon;
- }
- this.getIcon = function() {
- if (typeof(this.icon) == 'object') {
- return this.icon[0];
- }
- return this.icon;
- }
- this.getOpenIcon = function() {
- if (typeof(this.icon) == 'object') {
- return this.icon[1];
- }
- return this.icon;
- }
- this.hasIcon = function () {
- return this.icon != '';
- }
- this.getOrderNumber = function() {
- return this.orderNumber;
- }
- this.addOpenEventListener = function(event) {
- this.openeventlisteners[this.openeventlisteners.length] = event;
- }
- this.gotOpenEventListeners = function() {
- return (this.openeventlisteners.length > 0);
- }
- this.addEditEventListener = function(event) {
- this.editeventlisteners[this.editeventlisteners.length] = event;
- }
- this.gotEditEventListeners = function() {
- return (this.editeventlisteners.length > 0);
- }
- this.addMoveEventListener = function(event) {
- this.moveeventlisteners[this.moveeventlisteners.length] = event;
- }
- this.gotMoveEventListeners = function() {
- return (this.moveeventlisteners.length > 0);
- }
- this.addChild = function(childNode) {
- var possiblePrevNode = this.childs[this.childs.length - 1]
- if (possiblePrevNode) {
- possiblePrevNode.nextSibling = childNode;
- childNode.prevSibling = possiblePrevNode;
- // alert(childNode.prevSibling);
- }
-
- this.childs[this.childs.length] = childNode;
- childNode.setParent(this);
-
- if (sortNodes) {
- function sortByOrder(a,b) {
- var order1 = a.getOrderNumber();
- var order2 = b.getOrderNumber();
- if (order1 == -1 || order2 == -1) {
- return a.getName().toLowerCase() > b.getName().toLowerCase() ? 1 : -1;
- }
- else {
- if (order1 == order2) {
- // If they got the same order number, then we'll sort by their title.
- return a.getName().toLowerCase() > b.getName().toLowerCase() ? 1 : -1;
- }
- else {
- return order1 - order2;
- }
- }
- }
- this.childs.sort(sortByOrder);
- }
- }
- this.removeChild = function(childNode) {
- var found = false;
- for (var i=0;i<this.childs.length;i++) {
- if (found) {
- this.childs[i] = this.childs[i + 1];
- }
- if (this.childs[i] == childNode) {
- if (i == (this.childs.length - 1)) {
- this.childs[i] = null;
- }
- else {
- this.childs[i] = this.childs[i + 1];
- }
- found = true;
- }
- }
- if (found) {
- this.childs.length = this.childs.length-1;
- }
- }
- this.resetChilds = function() {
- this.childs = new Array();
- }
- this.setHasChilds = function(hasChilds) {
- this.haschilds = hasChilds;
- }
- this.hasChilds = function() {
- if (this.haschilds == true) {
- return true;
- }
- return (this.childs.length > 0);
- }
- this.getChildCount = function() {
- return this.childs.length;
- }
- this.getFirstChild = function() {
- if (this.hasChilds()) {
- return this.childs[0];
- }
- return null;
- }
- this.gotHandler = function() {
- return this.handler != null;
- }
- this.setHandler = function(handler) {
- this.handler = handler;
- }
- this.getHandler = function() {
- return this.handler;
- }
- this.setParent = function(parent) {
- this.parent = parent;
- }
- this.getParent = function() {
- return this.parent;
- }
- this.getLineString = function() {
- return this.linestring;
- }
- this.setLineString = function(string) {
- this.linestring = string;
- }
- this.isEditable = function() {
- return this.editable;
- }
- this.setEditable = function(editable) {
- this.editable = editable;
- }
-
-}
-function getTreeNode(nodeID) {
- return findNodeWithID(rootNode,nodeID);
-}
-function findNodeWithID(node,nodeID) {
- if (node.getID() == nodeID) {
- return node;
- }
- else {
- if (node.hasChilds()) {
- for(var i=0;i<node.getChildCount();i++) {
- var value = findNodeWithID(node.childs[i],nodeID);
- if (value != false) {
- return value;
- }
- }
- }
- return false;
- }
-}
-function readStates() {
- //setCookie('tree' + documentID,'');
- states = getCookie('tree' + documentID);
- if (states != null) {
- var array = states.split(';');
- for(var i=0;i<array.length;i++) {
- var singlestate = array[i].split('|');
- statearray[i] = new Array();
- statearray[i]["key"] = singlestate[0];
- statearray[i]["state"] = singlestate[1];
- }
- }
-}
-function getState(nodeID) {
- for(var i=0;i<statearray.length;i++) {
- if (statearray[i]["key"] == nodeID) {
- state = statearray[i]["state"];
- if (state == null || state == '') {
- state = 'closed';
- }
- return state;
- }
- }
- return "closed";
-}
-function writeStates(nodeID,newstate) {
- //alert(nodeID);
- var str = '';
- var found = false;
- for(var i=0;i<statearray.length;i++) {
- if (statearray[i]["key"] == nodeID) {
- statearray[i]["state"] = newstate;
- found = true;
- }
- if (statearray[i]["state"] != null) {
- str += statearray[i]["key"] + '|' + statearray[i]["state"] + ';';
- }
- }
- if (found == false) {
- statearray[statearray.length] = new Array();
- statearray[statearray.length - 1]["key"] = nodeID;
- statearray[statearray.length - 1]["state"] = newstate;
- if (newstate != null) {
- str += nodeID + '|' + newstate + ';';
- }
- }
- setCookie('tree' + documentID,str);
-}
-function showTree(path) {
- readStates();
-
- href = path;
- window.focus();
- window.onblur = blurSelection;
- window.onfocus = focusSelection;
- var str = '';
- str = '<div id="node' + rootNode.getID() + '" class="treetitle" style="display:' + (showRootNode == true ? 'block' : 'none') + '">';
- str += '<nobr>';
- if (rootNode.hasIcon()) {
- str += '<img src="' + rootNode.getIcon() + '" style="vertical-align:middle;">';
- }
- str += '<span style="vertical-align:middle;"> ' + rootNode.getName() + '</span>';
- str += '</nobr></div>';
-
- if (rootNode.hasChilds()) {
- for(i=0;i<rootNode.childs.length;i++) {
- nodeContents = showNode(rootNode.childs[i],(i == (rootNode.getChildCount() -1)));
- str = str + nodeContents;
- }
- }
- container.innerHTML = str;
- if (window.finishedLoading) {
- finishedLoading();
- }
-}
-/**
-* Shows the given node, and subnodes.
-*/
-function showNode(treeNode,lastNode) {
- linestring = treeNode.getLineString();
- var state = getState(treeNode.getID());
- var str;
- str = '<div style="filter:alpha(opacity=100);" ondragenter="dragEnter(' + treeNode.getID() + ');" ondragleave="dragLeave();" ondragstart="startDrag(' + treeNode.getID() + ');" ondrag="dragMove();" ondragend="endDrag(' + treeNode.getID() + ')" id="node' + treeNode.getID() + '">';
- str += '<nobr>';
- for(var y=0;y<linestring.length;y++) {
- if (linestring.charAt(y) == 'I') {
- str += '<img src="' + href + 'static/' + (showLines ? 'line' : 'white') + '.gif" style="width:19px;height:20px;vertical-align:middle;">';
- }
- else if (linestring.charAt(y) == 'B') {
- str += '<img src="' + href + 'static/white.gif" style="width:19px;height:20px;vertical-align:middle;">';
- }
- }
- if (treeNode.hasChilds()) {
- // If this is the first child of the rootNode, and showRootNode is false, we want to display a different icon.
- if (!showRootNode && (treeNode.getParent() == rootNode) && (treeNode.getParent().getFirstChild() == treeNode)) {
- if (!lastNode) {
- str += '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/' + (state == 'open' ? (showLines ? 'minus_no_root' : 'minus_nolines') : (showLines ? 'plus_no_root' : 'plus_nolines')) + '.gif" style="width:19px;height:20px;vertical-align:middle;" OnClick="handleNode(' + treeNode.getID() + ');">';
- }
- else {
- str += '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/' + (state == 'open' ? 'minus_last' : 'plus_last') + '_no_root.gif" style="width:19px;height:20px;vertical-align:middle;" OnClick="handleNode(' + treeNode.getID() + ');">';
- }
- }
- else {
- if (!lastNode) {
- str += '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/' + (state == 'open' ? (showLines ? 'minus' : 'minus_nolines') : (showLines ? 'plus' : 'plus_nolines')) + '.gif" style="width:19px;height:20px;vertical-align:middle;" OnClick="handleNode(' + treeNode.getID() + ');">';
- }
- else {
- str += '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/' + (state == 'open' ? (showLines ? 'minus_last' : 'minus_nolines') : (showLines ? 'plus_last' : 'plus_nolines')) + '.gif" style="width:19px;height:20px;vertical-align:middle;" OnClick="handleNode(' + treeNode.getID() + ');">';
- }
- }
- }
- else {
- // If this is the first child of the rootNode, and showRootNode is false, we want to display a different icon.
- if (!showRootNode && (treeNode.getParent() == rootNode) && (treeNode.getParent().getFirstChild() == treeNode)) {
- if (!lastNode) {
- str += '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/' + (showLines ? 't_no_root' : 'white') + '.gif" style="width:19px;height:20px;vertical-align:middle;">';
- }
- else {
- str += '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/white.gif" style="width:19px;height:20px;vertical-align:middle;">';
- }
- }
- else {
- if (!lastNode) {
- str += '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/' + (showLines ? 't' : 'white') + '.gif" style="width:19px;height:20px;vertical-align:middle;">';
- }
- else {
- str += '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/' + (showLines ? 'lastnode' : 'white') + '.gif" style="width:19px;height:20px;vertical-align:middle;">';
- }
- }
- }
- iconStartImage = treeNode.getIcon();
- if (state != 'closed') {
- if (treeNode.hasChilds()) {
- iconStartImage = treeNode.getOpenIcon();
- }
- }
-
- str += '<img id="iconimage' + treeNode.getID() + '" src="' + iconStartImage + '" style="vertical-align:middle;" OnClick="selectNode(' + treeNode.getID() + ')">';
- str += ' <span unselectable="ON" style="vertical-align:middle;" class="treetitle" ID="title' + treeNode.getID() + '" OnDblClick="handleNode(' + treeNode.getID() + ')" OnClick="selectNode(' + treeNode.getID() + ')">';
- str += treeNode.getName();
- str += '</span>';
- str += '</nobr>';
- str += '</div>';
-
- if (treeNode.hasChilds()) {
- if (state == 'open') {
- str += '<div id="node' + treeNode.getID() + 'sub" style="display:block;">';
- fireOpenEvent(treeNode);
- // alert('openevent: ' + treeNode.getName());
- }
- else {
- str += '<div id="node' + treeNode.getID() + 'sub" style="display:' + (showAllNodesOnStartup == true ? 'block;' : 'none;') + ';">';
- }
- var subgroupstr = '';
- var newChar = '';
-
- if (!lastNode) {
- newChar = 'I';
- }
- else {
- newChar = 'B';
- }
- for(var z=0;z<treeNode.getChildCount();z++) {
- treeNode.childs[z].setLineString(linestring + newChar);
- }
- for(var z=0;z<treeNode.getChildCount();z++) {
- subgroupstr += showNode(treeNode.childs[z],(z == (treeNode.getChildCount() -1)));
- }
- str += subgroupstr;
- str += '</div>';
- }
- else {
- str += '<div id="node' + treeNode.getID() + 'sub" style="display:none;">';
- str += '</div>';
- }
- return str;
-}
-/*
-function mouseMove() {
- if (dragging) {
- alert('bob');
- }
-}
-function mouseUp() {
- if (dragging) {
- alert('dropped on something!');
- }
-}
-*/
-function startDrag(nodeID) {
- if (!dragable) {
- return;
- }
- draggedNodeID = nodeID;
-
- var srcObj = window.event.srcElement;
- while(srcObj.tagName != 'DIV') {
- srcObj = srcObj.parentElement;
- }
- floatDragElement = document.createElement('DIV');
-
- floatDragElement.innerHTML = srcObj.innerHTML;
- floatDragElement.childNodes[0].removeChild(floatDragElement.childNodes[0].childNodes[0]);
-
- document.body.appendChild(floatDragElement);
- floatDragElement.style.zIndex = 100;
- floatDragElement.style.position = 'absolute';
- floatDragElement.style.filter='progid:DXImageTransform.Microsoft.Alpha(1,opacity=60);';
-}
-function findSpanChild(element) {
- if (element.tagName == 'SPAN') {
- return element;
- }
- else {
- if (element.childNodes) {
- for(var i=0;i<element.childNodes.length;i++) {
- var value = findSpanChild(element.childNodes[i]);
- if (value != false) {
- return value;
- }
- }
- return false;
- }
- }
-}
-function dragEnter(nodeID) {
- if (!dragable) {
- return;
- }
- lastDraggedOnNodeID = nodeID;
-
- if (colouredElement) {
- findSpanChild(colouredElement).className = 'treetitle';
- }
- colouredElement = window.event.srcElement;
- while(colouredElement.tagName != 'DIV') {
- colouredElement = colouredElement.parentElement;
- if (colouredElement.tagName == 'BODY') {
- // Something gone seriously wrong.
- alert('Drag failure, reached <BODY>!');
- return;
- }
- }
- findSpanChild(colouredElement).className = 'treetitleselectedfocused';
-}
-function dragLeave() {
- if (!dragable) {
- return;
- }
-}
-function endDrag(nodeID) {
- if (!dragable) {
- return;
- }
- if (lastDraggedOnNodeID != null) {
- fireMoveEvent(getTreeNode(lastDraggedOnNodeID),draggedNodeID,lastDraggedOnNodeID);
- }
-}
-function dragProceed() {
- if (!dragable) {
- return;
- }
- var dragged = getTreeNode(draggedNodeID);
- var newparent = getTreeNode(lastDraggedOnNodeID);
-
- var oldparent = dragged.getParent();
-
- oldparent.removeChild(dragged);
- newparent.addChild(dragged);
-
- refreshNode(oldparent);
- refreshNode(newparent);
-
- _dragClean()
-}
-function dragCancel() {
- if (!dragable) {
- return;
- }
- _dragClean()
-}
-/**
-* Don't call this yourself.
-*/
-function _dragClean() {
- if (!dragable) {
- return;
- }
- if (colouredElement) {
- findSpanChild(colouredElement).className = 'treetitle';
- }
-
- floatDragElement.parentElement.removeChild(floatDragElement);
- floatDragElement = null;
- colouredElement = null;
- draggedNodeID = null;
- lastDraggedOnNodeID = null;
-}
-function dragMove() {
- if (!dragable) {
- return;
- }
- floatDragElement.style.top = window.event.clientY;
- floatDragElement.style.left = window.event.clientX;
-}
-function editEnded() {
- if (treeNodeEdited != null) {
- // treeNodeEdited.getID();
- var editTitle = document.getElementById('title' + treeNodeEdited.getID());
- var input = editTitle.childNodes[0];
-
- var newValue = input.value;
-
- if (newValue == treeNodeEdited.getName()) {
- editTitle.innerHTML = newValue;
- treeNodeEdited = null;
- return;
- }
-
- fireEditEvent(treeNodeEdited,newValue);
-
- if (!editaborted) {
- treeNodeEdited.setName(newValue);
- editTitle.innerHTML = newValue;
- }
-
- treeNodeEdited = null;
- }
-}
-function selectNode(nodeID) {
- var treeNode = getTreeNode(nodeID);
-
- if (selectedNode != null) {
- if (selectedNode == nodeID) {
- if (treeNode.isEditable()) {
- if (treeNodeEdited == treeNode) {
- return;
- }
- treeNodeEdited = treeNode;
- var editTitle = document.getElementById('title' + treeNode.getID());
- editTitle.className = 'editednode';
-
-
- editTitle.innerHTML = '<input type="text" onKeypress="if (event.keyCode == 13) { this.onblur = null; editEnded(); }" name="editednode" class="editednodeinput">';
- var input = editTitle.childNodes[0];
- input.value = treeNode.getName();
- input.focus();
- input.select();
- input.onblur = editEnded;
- }
- return;
- }
- if (treeNodeEdited != null) {
- editEnded();
- }
- var oldNodeTitle = document.getElementById('title' + selectedNode);
- oldNodeTitle.className = 'treetitle';
- }
- selectedNode = nodeID;
- var nodetitle = document.getElementById('title' + selectedNode);
- nodetitle.className = 'treetitleselectedfocused';
-
- if (treeNode.gotHandler()) {
- eval(treeNode.getHandler() + '(getTreeNode(' + nodeID + '));');
- }
- else {
- standardClick(treeNode);
- }
-}
-function refreshNode(treeNode) {
- var submenu = document.getElementById('node' + treeNode.getID() + 'sub');
- var str = '';
- for(var i=0;i<treeNode.getChildCount();i++) {
- var parent = treeNode.getParent();
- if (!parent) {
- treeNode.childs[i].setLineString(treeNode.getLineString() + 'B');
- }
- else {
- if (parent.childs[parent.childs.length - 1] == treeNode) {
- treeNode.childs[i].setLineString(treeNode.getLineString() + 'B');
- }
- else {
- treeNode.childs[i].setLineString(treeNode.getLineString() + 'I');
- }
- }
- str += showNode(treeNode.childs[i],i == (treeNode.getChildCount() - 1));
- }
- var actionimage = document.getElementById('handler' + treeNode.getID());
- if (treeNode.getChildCount() == 0) {
- // TreeNode haven't got any children, make sure the right image is displayed.
- if (actionimage.src.indexOf('last') == -1) {
- actionimage.src = href + 'static/' + (showLines ? 't' : 'white') + '.gif';
- }
- else {
- actionimage.src = href + 'static/' + (showLines ? 'lastnode' : 'white') + '.gif';
- }
- actionimage.onclick = null;
-
- // Close the submenu
- if (submenu) {
- submenu.style.display = 'none';
- }
- }
- else {
- // We have children, make sure to display the + and - icon.
- if (actionimage.src.indexOf('plus') != -1) {
- // The TreeNode have already got children, and displays them.
- }
- else if (actionimage.src.indexOf('minus') != -1) {
- // The TreeNode have already got children, and displays them.
- }
- else {
- if (actionimage.src.indexOf('last') == -1) {
- actionimage.outerHTML = '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/' + (showLines ? 'plus' : 'plus_nolines') + '.gif" style="width:19px;height:20px;vertical-align:middle;" OnClick="handleNode(' + treeNode.getID() + ');">';
- }
- else {
- actionimage.outerHTML = '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/plus_last.gif" style="width:19px;height:20px;vertical-align:middle;" OnClick="handleNode(' + treeNode.getID() + ');">';
- }
- }
- }
- submenu.innerHTML = str;
-}
-function handleNode(nodeID) {
- var treeNode = getTreeNode(nodeID);
- if (!treeNode.hasChilds()) { // No reason to handle a node without childs.
- return;
- }
-
- var submenu = document.getElementById('node' + nodeID + 'sub');
-
- var iconimageholder = document.getElementById('iconimage' + nodeID);
- var actionimage = document.getElementById('handler' + nodeID);
-
- // This will be used if showRootNode is set to false.
- var firstChildOfRoot = false;
- if (actionimage.src.indexOf('_no_root') != -1) {
- firstChildOfRoot = true;
- }
-
- if (submenu.style.display == 'none') {
- writeStates(nodeID,'open');
- fireOpenEvent(treeNode);
- submenu.style.display = 'block';
-
- iconimageholder.src = treeNode.getOpenIcon();
-
- if (actionimage.src.indexOf('last') == -1) {
- actionimage.src = href + 'static/' + ((firstChildOfRoot) ? 'minus_no_root' : (showLines ? 'minus' : 'minus_nolines')) + '.gif';
- }
- else {
- actionimage.src = href + 'static/' + ((firstChildOfRoot) ? 'minus_last_no_root' : (showLines ? 'minus_last' : 'minus_nolines')) + '.gif';
- }
- }
- else {
- writeStates(nodeID,'closed');
- submenu.style.display = 'none';
-
- iconimageholder.src = treeNode.getIcon();
-
- if (actionimage.src.indexOf('last') == -1) {
- actionimage.src = href + 'static/' + ((firstChildOfRoot) ? 'plus_no_root' : (showLines ? 'plus' : 'plus_nolines')) + '.gif';
- }
- else {
- actionimage.src = href + 'static/' + ((firstChildOfRoot) ? 'plus_last_no_root' : (showLines ? 'plus_last' : 'plus_nolines')) + '.gif';
- }
- }
-}
-function fireOpenEvent(treeNode) {
- if (treeNode.gotOpenEventListeners()) {
- for(var i=0;i<treeNode.openeventlisteners.length;i++) {
- eval(treeNode.openeventlisteners[i] + '(' + treeNode.getID() + ');');
- }
- }
-}
-function fireEditEvent(treeNode,newVal) {
- if (treeNode.gotEditEventListeners()) {
- for(var i=0;i<treeNode.editeventlisteners.length;i++) {
- eval(treeNode.editeventlisteners[i] + '(' + treeNode.getID() + ',\'' + escape(newVal) + '\');');
- }
- }
-}
-function fireMoveEvent(treeNode,draggedNodeID,droppedOnNodeID) {
- if (treeNode.gotMoveEventListeners()) {
- for(var i=0;i<treeNode.moveeventlisteners.length;i++) {
- eval(treeNode.moveeventlisteners[i] + '(' + draggedNodeID + ',' + droppedOnNodeID + ');');
- }
- }
-}
-function blurSelection() {
- if (selectedNode != null) {
- var oldNodeTitle = document.getElementById('title' + selectedNode);
- oldNodeTitle.className = 'treetitleselectedblured';
- }
-}
-function focusSelection() {
- if (selectedNode != null) {
- var oldNodeTitle = document.getElementById('title' + selectedNode);
- oldNodeTitle.className = 'treetitleselectedfocused';
- }
-}
-function getCookieVal (offset) {
- var endstr = document.cookie.indexOf (";",offset);
- if (endstr == -1) {
- endstr = document.cookie.length;
- }
- return unescape(document.cookie.substring(offset,endstr));
-}
-function getCookie (name) {
- var arg = name + "=";
- var alen = arg.length;
- var clen = document.cookie.length;
- var i = 0;
- while (i < clen) {
- var j = i + alen;
- if (document.cookie.substring(i, j) == arg) {
- return getCookieVal(j);
- }
- i = document.cookie.indexOf(" ", i) + 1;
- if (i == 0) {
- break;
- }
- }
- return null;
-}
-function setCookie (name, value) {
- var argv = setCookie.arguments;
- var argc = setCookie.arguments.length;
- var expires = (argc > 2) ? argv[2] : null;
- var path = (argc > 3) ? argv[3] : null;
- var domain = (argc > 4) ? argv[4] : null;
- var secure = (argc > 5) ? argv[5] : false;
- document.cookie = name + "=" + escape (value) + ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + ((path == null) ? "" : ("; path=" + path)) + ((domain == null) ? "" : ("; domain=" + domain)) + ((secure == true) ? "; secure" : "");
-}
-function expandNode() {
- var state = getState(selectedNode);
- if (state == 'open') {
- var currentTreeNode = getTreeNode(selectedNode);
- if (currentTreeNode.hasChilds()) {
- selectNode(currentTreeNode.childs[0].getID());
- }
- }
- else {
- handleNode(selectedNode);
- }
-}
-function subtractNode() {
- var state = getState(selectedNode);
- if (state == 'closed') {
- var currentTreeNode = getTreeNode(selectedNode);
- var parent = currentTreeNode.getParent();
- if (parent != null && parent != rootNode) {
- selectNode(parent.getID());
- }
- }
- else {
- handleNode(selectedNode);
- }
-}
-function selectPrevNode() {
- var currentTreeNode = getTreeNode(selectedNode);
- if (currentTreeNode.prevSibling != null) {
-
- var state = getState(currentTreeNode.prevSibling.getID());
-
- if (state == 'open' && currentTreeNode.prevSibling.hasChilds()) {
- // We have to find the last open child of the previoussiblings childs.
- var current = currentTreeNode.prevSibling.childs[currentTreeNode.prevSibling.childs.length - 1];
- var currentstate = 'open';
- while (current.hasChilds() && (getState(current.getID()) == 'open')) {
- current = current.childs[current.childs.length - 1];
- }
- selectNode(current.getID());
- }
- else {
- selectNode(currentTreeNode.prevSibling.getID());
- }
- }
- else {
- if (currentTreeNode.getParent() != null && currentTreeNode.getParent() != rootNode) {
- selectNode(currentTreeNode.getParent().getID());
- }
- }
-}
-function selectNextNode() {
- var currentTreeNode = getTreeNode(selectedNode);
-
- var state = getState(selectedNode);
- if (state == 'open' && currentTreeNode.hasChilds()) {
- selectNode(currentTreeNode.childs[0].getID());
- }
- else {
- if (currentTreeNode.nextSibling != null) {
- selectNode(currentTreeNode.nextSibling.getID());
- }
- else {
- // Continue up the tree until we either hit null, or a parent which have a child.
- var parent = currentTreeNode;
- while ((parent = parent.getParent()) != rootNode) {
- if (parent.nextSibling != null) {
- selectNode(parent.nextSibling.getID());
- break;
- }
- }
- /*
- if (currentTreeNode.getParent().nextSibling != null) {
- selectNode(currentTreeNode.getParent().nextSibling.getID());
- }
- */
- }
- }
-}
-function keyDown(event) {
- if (window.event) {
- event = window.event;
- }
- if (event.keyCode == 38) { // Up
- selectPrevNode();
- return false;
- }
- else if (event.keyCode == 40) { // Down
- selectNextNode();
- return false;
- }
- else if (event.keyCode == 37) { // left
- subtractNode();
- return false;
- }
- else if (event.keyCode == 39) { // right
- expandNode();
- return false;
- }
-}
-document.onkeydown = keyDown;
+/**\r
+* Original Author of this file: Martin Mouritzen. (martin@nano.dk)\r
+*\r
+*\r
+* (Lack of) Documentation:\r
+*\r
+*\r
+* If a finishedLoading method exists, it will be called when the tree is loaded.\r
+* (good to display a div, etc.).\r
+*\r
+*\r
+* You have to set the variable rootNode (as a TreeNode).\r
+*\r
+* You have to set a container element, this is the element in which the tree will be.\r
+*\r
+*\r
+* TODO: \r
+* Save cookies better (only 1 cookie for each tree). Else the page will totally cookieclutter.\r
+*\r
+***********************************************************************\r
+* Configuration variables.\r
+************************************************************************/\r
+\r
+// Should the rootNode be displayed.\r
+var showRootNode = true;\r
+\r
+// Should the dashed lines between nodes be shown.\r
+var showLines = true;\r
+\r
+// Should the nodes be sorted? (You can either specify a number, then it will be sorted by that, else it will\r
+// be sorted alphabetically (by name).\r
+var sortNodes = true;\r
+\r
+// This is IMPORTANT... use an unique id for each document you use the tree in. (else they'll get mixed up).\r
+var documentID = window.location.href;\r
+\r
+// being read from cookie.\r
+var nodesOpen = new Array();\r
+\r
+// RootNode of the tree.\r
+var rootNode;\r
+\r
+// Container to display the Tree in.\r
+var container;\r
+\r
+// Shows/Hides subnodes on startup\r
+var showAllNodesOnStartup = false;\r
+\r
+// Is the roots dragable?\r
+var dragable = false;\r
+\r
+\r
+/************************************************************************\r
+* The following is just instancevariables.\r
+************************************************************************/\r
+var href = '';\r
+\r
+// rootNodeCallBack name (if null, it's not selectable).\r
+var rootNodeCallBack = null;\r
+\r
+// selectedNode\r
+var selectedNode = null;\r
+\r
+var states = '';\r
+var statearray = new Array();\r
+\r
+var treeNodeEdited = null;\r
+\r
+var editaborted = false;\r
+\r
+var floatDragElement = null;\r
+var colouredElement = null;\r
+var draggedNodeID = null;\r
+var lastDraggedOnNodeID = null;\r
+\r
+\r
+/**\r
+* The TreeNode Object\r
+* @param id unique id of this treenode\r
+* @param name The title of this node\r
+* @param icon The icon if this node (Can also be an array with 2 elements, the first one will represent the closed state, and the next one the open state)\r
+* @param param A parameter, this can be pretty much anything. (eg. an array with information).\r
+* @param orderNumber an orderNumber If one is given the nodes will be sorted by this (else they'll be sorted alphabetically (If sorting is on).\r
+*/\r
+function TreeNode(id,name,icon,param,orderNumber) {\r
+ this.id = id;\r
+ this.childs = new Array();\r
+ this.name = (name == null ? 'unset name' : name);\r
+ this.icon = (icon == null ? '' : icon);\r
+ this.parent = null;\r
+ this.handler = null;\r
+ this.param = (param == null ? '' : param);\r
+ this.orderNumber = (orderNumber == null ? -1 : orderNumber);\r
+ \r
+ this.openeventlisteners = new Array();\r
+ this.editeventlisteners = new Array();\r
+ this.moveeventlisteners = new Array();\r
+ this.haschilds = false;\r
+ this.editable = false;\r
+ this.linestring = '';\r
+ \r
+ this.nextSibling = null;\r
+ this.prevSibling = null;\r
+ \r
+ this.childsHasBeenFetched = false;\r
+\r
+ this.getID = function() {\r
+ return this.id;\r
+ }\r
+ this.setName = function(newname) {\r
+ this.name = newname;\r
+ }\r
+ this.getName = function() {\r
+ return this.name;\r
+ }\r
+ this.getParam = function() {\r
+ return this.param;\r
+ }\r
+ this.setIcon = function(icon) {\r
+ this.icon = icon;\r
+ }\r
+ this.getIcon = function() {\r
+ if (typeof(this.icon) == 'object') {\r
+ return this.icon[0];\r
+ }\r
+ return this.icon;\r
+ }\r
+ this.getOpenIcon = function() {\r
+ if (typeof(this.icon) == 'object') {\r
+ return this.icon[1];\r
+ }\r
+ return this.icon;\r
+ }\r
+ this.hasIcon = function () {\r
+ return this.icon != '';\r
+ }\r
+ this.getOrderNumber = function() {\r
+ return this.orderNumber;\r
+ }\r
+ this.addOpenEventListener = function(event) {\r
+ this.openeventlisteners[this.openeventlisteners.length] = event;\r
+ }\r
+ this.gotOpenEventListeners = function() {\r
+ return (this.openeventlisteners.length > 0);\r
+ }\r
+ this.addEditEventListener = function(event) {\r
+ this.editeventlisteners[this.editeventlisteners.length] = event;\r
+ }\r
+ this.gotEditEventListeners = function() {\r
+ return (this.editeventlisteners.length > 0);\r
+ }\r
+ this.addMoveEventListener = function(event) {\r
+ this.moveeventlisteners[this.moveeventlisteners.length] = event;\r
+ }\r
+ this.gotMoveEventListeners = function() {\r
+ return (this.moveeventlisteners.length > 0);\r
+ }\r
+ this.addChild = function(childNode) {\r
+ var possiblePrevNode = this.childs[this.childs.length - 1]\r
+ if (possiblePrevNode) {\r
+ possiblePrevNode.nextSibling = childNode;\r
+ childNode.prevSibling = possiblePrevNode;\r
+ // alert(childNode.prevSibling);\r
+ }\r
+\r
+ this.childs[this.childs.length] = childNode;\r
+ childNode.setParent(this);\r
+\r
+ if (sortNodes) {\r
+ function sortByOrder(a,b) {\r
+ var order1 = a.getOrderNumber();\r
+ var order2 = b.getOrderNumber();\r
+ if (order1 == -1 || order2 == -1) {\r
+ return a.getName().toLowerCase() > b.getName().toLowerCase() ? 1 : -1;\r
+ }\r
+ else {\r
+ if (order1 == order2) {\r
+ // If they got the same order number, then we'll sort by their title.\r
+ return a.getName().toLowerCase() > b.getName().toLowerCase() ? 1 : -1;\r
+ }\r
+ else {\r
+ return order1 - order2;\r
+ }\r
+ }\r
+ }\r
+ this.childs.sort(sortByOrder);\r
+ }\r
+ }\r
+ this.removeChild = function(childNode) {\r
+ var found = false;\r
+ for (var i=0;i<this.childs.length;i++) {\r
+ if (found) {\r
+ this.childs[i] = this.childs[i + 1];\r
+ }\r
+ if (this.childs[i] == childNode) {\r
+ if (i == (this.childs.length - 1)) {\r
+ this.childs[i] = null;\r
+ }\r
+ else {\r
+ this.childs[i] = this.childs[i + 1];\r
+ }\r
+ found = true;\r
+ }\r
+ }\r
+ if (found) {\r
+ this.childs.length = this.childs.length-1;\r
+ }\r
+ }\r
+ this.resetChilds = function() {\r
+ this.childs = new Array();\r
+ }\r
+ this.setHasChilds = function(hasChilds) {\r
+ this.haschilds = hasChilds;\r
+ }\r
+ this.hasChilds = function() {\r
+ if (this.haschilds == true) {\r
+ return true;\r
+ }\r
+ return (this.childs.length > 0);\r
+ }\r
+ this.getChildCount = function() {\r
+ return this.childs.length;\r
+ }\r
+ this.getFirstChild = function() {\r
+ if (this.hasChilds()) {\r
+ return this.childs[0];\r
+ }\r
+ return null;\r
+ }\r
+ this.gotHandler = function() {\r
+ return this.handler != null;\r
+ }\r
+ this.setHandler = function(handler) {\r
+ this.handler = handler;\r
+ }\r
+ this.getHandler = function() {\r
+ return this.handler;\r
+ }\r
+ this.setParent = function(parent) {\r
+ this.parent = parent;\r
+ }\r
+ this.getParent = function() {\r
+ return this.parent;\r
+ }\r
+ this.getLineString = function() {\r
+ return this.linestring;\r
+ }\r
+ this.setLineString = function(string) {\r
+ this.linestring = string;\r
+ }\r
+ this.isEditable = function() {\r
+ return this.editable;\r
+ }\r
+ this.setEditable = function(editable) {\r
+ this.editable = editable;\r
+ }\r
+ \r
+}\r
+function getTreeNode(nodeID) {\r
+ return findNodeWithID(rootNode,nodeID);\r
+}\r
+function findNodeWithID(node,nodeID) {\r
+ if (node.getID() == nodeID) {\r
+ return node;\r
+ }\r
+ else {\r
+ if (node.hasChilds()) {\r
+ for(var i=0;i<node.getChildCount();i++) {\r
+ var value = findNodeWithID(node.childs[i],nodeID);\r
+ if (value != false) {\r
+ return value;\r
+ }\r
+ }\r
+ }\r
+ return false;\r
+ }\r
+}\r
+function readStates() {\r
+ //setCookie('tree' + documentID,'');\r
+ states = getCookie('tree' + documentID);\r
+ if (states != null) {\r
+ var array = states.split(';');\r
+ for(var i=0;i<array.length;i++) {\r
+ var singlestate = array[i].split('|');\r
+ statearray[i] = new Array();\r
+ statearray[i]["key"] = singlestate[0];\r
+ statearray[i]["state"] = singlestate[1];\r
+ }\r
+ }\r
+}\r
+function getState(nodeID) {\r
+ for(var i=0;i<statearray.length;i++) {\r
+ if (statearray[i]["key"] == nodeID) {\r
+ state = statearray[i]["state"];\r
+ if (state == null || state == '') {\r
+ state = 'closed';\r
+ }\r
+ return state;\r
+ }\r
+ }\r
+ return "closed";\r
+}\r
+function writeStates(nodeID,newstate) {\r
+ //alert(nodeID);\r
+ var str = '';\r
+ var found = false;\r
+ for(var i=0;i<statearray.length;i++) {\r
+ if (statearray[i]["key"] == nodeID) {\r
+ statearray[i]["state"] = newstate;\r
+ found = true;\r
+ }\r
+ if (statearray[i]["state"] != null) {\r
+ str += statearray[i]["key"] + '|' + statearray[i]["state"] + ';';\r
+ }\r
+ }\r
+ if (found == false) {\r
+ statearray[statearray.length] = new Array();\r
+ statearray[statearray.length - 1]["key"] = nodeID;\r
+ statearray[statearray.length - 1]["state"] = newstate;\r
+ if (newstate != null) {\r
+ str += nodeID + '|' + newstate + ';';\r
+ }\r
+ }\r
+ setCookie('tree' + documentID,str);\r
+}\r
+function showTree(path) {\r
+ readStates();\r
+ \r
+ href = path;\r
+ window.focus();\r
+ window.onblur = blurSelection;\r
+ window.onfocus = focusSelection;\r
+ var str = '';\r
+ str = '<div id="node' + rootNode.getID() + '" class="treetitle" style="display:' + (showRootNode == true ? 'block' : 'none') + '">';\r
+ str += '<nobr>';\r
+ if (rootNode.hasIcon()) {\r
+ str += '<img src="' + rootNode.getIcon() + '" style="vertical-align:middle;">';\r
+ }\r
+ str += '<span style="vertical-align:middle;"> ' + rootNode.getName() + '</span>';\r
+ str += '</nobr></div>';\r
+ \r
+ if (rootNode.hasChilds()) {\r
+ for(i=0;i<rootNode.childs.length;i++) {\r
+ nodeContents = showNode(rootNode.childs[i],(i == (rootNode.getChildCount() -1)));\r
+ str = str + nodeContents;\r
+ }\r
+ }\r
+ container.innerHTML = str;\r
+ if (window.finishedLoading) {\r
+ finishedLoading();\r
+ }\r
+}\r
+/**\r
+* Shows the given node, and subnodes.\r
+*/\r
+function showNode(treeNode,lastNode) {\r
+ linestring = treeNode.getLineString();\r
+ var state = getState(treeNode.getID());\r
+ var str;\r
+ str = '<div style="filter:alpha(opacity=100);" ondragenter="dragEnter(' + treeNode.getID() + ');" ondragleave="dragLeave();" ondragstart="startDrag(' + treeNode.getID() + ');" ondrag="dragMove();" ondragend="endDrag(' + treeNode.getID() + ')" id="node' + treeNode.getID() + '">';\r
+ str += '<nobr>';\r
+ for(var y=0;y<linestring.length;y++) {\r
+ if (linestring.charAt(y) == 'I') {\r
+ str += '<img src="' + href + 'static/' + (showLines ? 'line' : 'white') + '.gif" style="width:19px;height:20px;vertical-align:middle;">';\r
+ }\r
+ else if (linestring.charAt(y) == 'B') {\r
+ str += '<img src="' + href + 'static/white.gif" style="width:19px;height:20px;vertical-align:middle;">';\r
+ }\r
+ }\r
+ if (treeNode.hasChilds()) {\r
+ // If this is the first child of the rootNode, and showRootNode is false, we want to display a different icon.\r
+ if (!showRootNode && (treeNode.getParent() == rootNode) && (treeNode.getParent().getFirstChild() == treeNode)) {\r
+ if (!lastNode) {\r
+ str += '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/' + (state == 'open' ? (showLines ? 'minus_no_root' : 'minus_nolines') : (showLines ? 'plus_no_root' : 'plus_nolines')) + '.gif" style="width:19px;height:20px;vertical-align:middle;" OnClick="handleNode(' + treeNode.getID() + ');">';\r
+ }\r
+ else {\r
+ str += '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/' + (state == 'open' ? 'minus_last' : 'plus_last') + '_no_root.gif" style="width:19px;height:20px;vertical-align:middle;" OnClick="handleNode(' + treeNode.getID() + ');">';\r
+ }\r
+ }\r
+ else {\r
+ if (!lastNode) {\r
+ str += '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/' + (state == 'open' ? (showLines ? 'minus' : 'minus_nolines') : (showLines ? 'plus' : 'plus_nolines')) + '.gif" style="width:19px;height:20px;vertical-align:middle;" OnClick="handleNode(' + treeNode.getID() + ');">';\r
+ }\r
+ else {\r
+ str += '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/' + (state == 'open' ? (showLines ? 'minus_last' : 'minus_nolines') : (showLines ? 'plus_last' : 'plus_nolines')) + '.gif" style="width:19px;height:20px;vertical-align:middle;" OnClick="handleNode(' + treeNode.getID() + ');">';\r
+ }\r
+ }\r
+ }\r
+ else {\r
+ // If this is the first child of the rootNode, and showRootNode is false, we want to display a different icon.\r
+ if (!showRootNode && (treeNode.getParent() == rootNode) && (treeNode.getParent().getFirstChild() == treeNode)) {\r
+ if (!lastNode) {\r
+ str += '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/' + (showLines ? 't_no_root' : 'white') + '.gif" style="width:19px;height:20px;vertical-align:middle;">';\r
+ }\r
+ else {\r
+ str += '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/white.gif" style="width:19px;height:20px;vertical-align:middle;">';\r
+ }\r
+ }\r
+ else {\r
+ if (!lastNode) {\r
+ str += '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/' + (showLines ? 't' : 'white') + '.gif" style="width:19px;height:20px;vertical-align:middle;">';\r
+ }\r
+ else {\r
+ str += '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/' + (showLines ? 'lastnode' : 'white') + '.gif" style="width:19px;height:20px;vertical-align:middle;">';\r
+ }\r
+ }\r
+ }\r
+ iconStartImage = treeNode.getIcon();\r
+ if (state != 'closed') {\r
+ if (treeNode.hasChilds()) {\r
+ iconStartImage = treeNode.getOpenIcon();\r
+ }\r
+ }\r
+ \r
+ str += '<img id="iconimage' + treeNode.getID() + '" src="' + iconStartImage + '" style="vertical-align:middle;" OnClick="selectNode(' + treeNode.getID() + ')">';\r
+ str += ' <span unselectable="ON" style="vertical-align:middle;" class="treetitle" ID="title' + treeNode.getID() + '" OnDblClick="handleNode(' + treeNode.getID() + ')" OnClick="selectNode(' + treeNode.getID() + ')">';\r
+ str += treeNode.getName();\r
+ str += '</span>';\r
+ str += '</nobr>';\r
+ str += '</div>';\r
+\r
+ if (treeNode.hasChilds()) {\r
+ if (state == 'open') {\r
+ str += '<div id="node' + treeNode.getID() + 'sub" style="display:block;">';\r
+ fireOpenEvent(treeNode);\r
+ // alert('openevent: ' + treeNode.getName());\r
+ }\r
+ else {\r
+ str += '<div id="node' + treeNode.getID() + 'sub" style="display:' + (showAllNodesOnStartup == true ? 'block;' : 'none;') + ';">';\r
+ }\r
+ var subgroupstr = '';\r
+ var newChar = '';\r
+\r
+ if (!lastNode) {\r
+ newChar = 'I';\r
+ }\r
+ else {\r
+ newChar = 'B';\r
+ }\r
+ for(var z=0;z<treeNode.getChildCount();z++) {\r
+ treeNode.childs[z].setLineString(linestring + newChar);\r
+ }\r
+ for(var z=0;z<treeNode.getChildCount();z++) {\r
+ subgroupstr += showNode(treeNode.childs[z],(z == (treeNode.getChildCount() -1)));\r
+ }\r
+ str += subgroupstr;\r
+ str += '</div>';\r
+ }\r
+ else {\r
+ str += '<div id="node' + treeNode.getID() + 'sub" style="display:none;">';\r
+ str += '</div>';\r
+ }\r
+ return str;\r
+}\r
+/*\r
+function mouseMove() {\r
+ if (dragging) {\r
+ alert('bob');\r
+ }\r
+}\r
+function mouseUp() {\r
+ if (dragging) {\r
+ alert('dropped on something!');\r
+ }\r
+}\r
+*/\r
+function startDrag(nodeID) {\r
+ if (!dragable) {\r
+ return;\r
+ }\r
+ draggedNodeID = nodeID;\r
+ \r
+ var srcObj = window.event.srcElement;\r
+ while(srcObj.tagName != 'DIV') {\r
+ srcObj = srcObj.parentElement;\r
+ }\r
+ floatDragElement = document.createElement('DIV');\r
+\r
+ floatDragElement.innerHTML = srcObj.innerHTML;\r
+ floatDragElement.childNodes[0].removeChild(floatDragElement.childNodes[0].childNodes[0]);\r
+ \r
+ document.body.appendChild(floatDragElement);\r
+ floatDragElement.style.zIndex = 100;\r
+ floatDragElement.style.position = 'absolute';\r
+ floatDragElement.style.filter='progid:DXImageTransform.Microsoft.Alpha(1,opacity=60);';\r
+}\r
+function findSpanChild(element) {\r
+ if (element.tagName == 'SPAN') {\r
+ return element;\r
+ }\r
+ else {\r
+ if (element.childNodes) {\r
+ for(var i=0;i<element.childNodes.length;i++) {\r
+ var value = findSpanChild(element.childNodes[i]);\r
+ if (value != false) {\r
+ return value;\r
+ }\r
+ }\r
+ return false;\r
+ }\r
+ }\r
+}\r
+function dragEnter(nodeID) {\r
+ if (!dragable) {\r
+ return;\r
+ }\r
+ lastDraggedOnNodeID = nodeID;\r
+ \r
+ if (colouredElement) {\r
+ findSpanChild(colouredElement).className = 'treetitle';\r
+ }\r
+ colouredElement = window.event.srcElement;\r
+ while(colouredElement.tagName != 'DIV') {\r
+ colouredElement = colouredElement.parentElement;\r
+ if (colouredElement.tagName == 'BODY') {\r
+ // Something gone seriously wrong.\r
+ alert('Drag failure, reached <BODY>!');\r
+ return;\r
+ }\r
+ } \r
+ findSpanChild(colouredElement).className = 'treetitleselectedfocused';\r
+}\r
+function dragLeave() {\r
+ if (!dragable) {\r
+ return;\r
+ }\r
+}\r
+function endDrag(nodeID) {\r
+ if (!dragable) {\r
+ return;\r
+ }\r
+ if (lastDraggedOnNodeID != null) {\r
+ fireMoveEvent(getTreeNode(lastDraggedOnNodeID),draggedNodeID,lastDraggedOnNodeID);\r
+ }\r
+}\r
+function dragProceed() {\r
+ if (!dragable) {\r
+ return;\r
+ }\r
+ var dragged = getTreeNode(draggedNodeID);\r
+ var newparent = getTreeNode(lastDraggedOnNodeID);\r
+\r
+ var oldparent = dragged.getParent();\r
+ \r
+ oldparent.removeChild(dragged);\r
+ newparent.addChild(dragged);\r
+ \r
+ refreshNode(oldparent);\r
+ refreshNode(newparent);\r
+ \r
+ _dragClean()\r
+}\r
+function dragCancel() {\r
+ if (!dragable) {\r
+ return;\r
+ }\r
+ _dragClean()\r
+}\r
+/**\r
+* Don't call this yourself.\r
+*/\r
+function _dragClean() {\r
+ if (!dragable) {\r
+ return;\r
+ }\r
+ if (colouredElement) {\r
+ findSpanChild(colouredElement).className = 'treetitle';\r
+ }\r
+ \r
+ floatDragElement.parentElement.removeChild(floatDragElement);\r
+ floatDragElement = null;\r
+ colouredElement = null;\r
+ draggedNodeID = null;\r
+ lastDraggedOnNodeID = null;\r
+}\r
+function dragMove() {\r
+ if (!dragable) {\r
+ return;\r
+ }\r
+ floatDragElement.style.top = window.event.clientY;\r
+ floatDragElement.style.left = window.event.clientX;\r
+}\r
+function editEnded() {\r
+ if (treeNodeEdited != null) {\r
+ // treeNodeEdited.getID();\r
+ var editTitle = document.getElementById('title' + treeNodeEdited.getID());\r
+ var input = editTitle.childNodes[0];\r
+ \r
+ var newValue = input.value;\r
+ \r
+ if (newValue == treeNodeEdited.getName()) {\r
+ editTitle.innerHTML = newValue;\r
+ treeNodeEdited = null;\r
+ return;\r
+ }\r
+ \r
+ fireEditEvent(treeNodeEdited,newValue);\r
+ \r
+ if (!editaborted) {\r
+ treeNodeEdited.setName(newValue);\r
+ editTitle.innerHTML = newValue;\r
+ }\r
+ \r
+ treeNodeEdited = null;\r
+ }\r
+}\r
+function selectNode(nodeID) {\r
+ var treeNode = getTreeNode(nodeID);\r
+\r
+ if (selectedNode != null) {\r
+ if (selectedNode == nodeID) {\r
+ if (treeNode.isEditable()) {\r
+ if (treeNodeEdited == treeNode) {\r
+ return;\r
+ }\r
+ treeNodeEdited = treeNode;\r
+ var editTitle = document.getElementById('title' + treeNode.getID());\r
+ editTitle.className = 'editednode';\r
+ \r
+\r
+ editTitle.innerHTML = '<input type="text" onKeypress="if (event.keyCode == 13) { this.onblur = null; editEnded(); }" name="editednode" class="editednodeinput">';\r
+ var input = editTitle.childNodes[0];\r
+ input.value = treeNode.getName();\r
+ input.focus();\r
+ input.select();\r
+ input.onblur = editEnded;\r
+ }\r
+ return;\r
+ }\r
+ if (treeNodeEdited != null) {\r
+ editEnded();\r
+ }\r
+ var oldNodeTitle = document.getElementById('title' + selectedNode);\r
+ oldNodeTitle.className = 'treetitle';\r
+ }\r
+ selectedNode = nodeID;\r
+ var nodetitle = document.getElementById('title' + selectedNode);\r
+ nodetitle.className = 'treetitleselectedfocused';\r
+ \r
+ if (treeNode.gotHandler()) {\r
+ eval(treeNode.getHandler() + '(getTreeNode(' + nodeID + '));');\r
+ }\r
+ else {\r
+ standardClick(treeNode);\r
+ }\r
+}\r
+function refreshNode(treeNode) {\r
+ var submenu = document.getElementById('node' + treeNode.getID() + 'sub');\r
+ var str = '';\r
+ for(var i=0;i<treeNode.getChildCount();i++) {\r
+ var parent = treeNode.getParent();\r
+ if (!parent) {\r
+ treeNode.childs[i].setLineString(treeNode.getLineString() + 'B');\r
+ }\r
+ else {\r
+ if (parent.childs[parent.childs.length - 1] == treeNode) {\r
+ treeNode.childs[i].setLineString(treeNode.getLineString() + 'B');\r
+ }\r
+ else {\r
+ treeNode.childs[i].setLineString(treeNode.getLineString() + 'I');\r
+ }\r
+ }\r
+ str += showNode(treeNode.childs[i],i == (treeNode.getChildCount() - 1));\r
+ }\r
+ var actionimage = document.getElementById('handler' + treeNode.getID());\r
+ if (treeNode.getChildCount() == 0) {\r
+ // TreeNode haven't got any children, make sure the right image is displayed.\r
+ if (actionimage.src.indexOf('last') == -1) {\r
+ actionimage.src = href + 'static/' + (showLines ? 't' : 'white') + '.gif';\r
+ }\r
+ else {\r
+ actionimage.src = href + 'static/' + (showLines ? 'lastnode' : 'white') + '.gif';\r
+ }\r
+ actionimage.onclick = null;\r
+ \r
+ // Close the submenu\r
+ if (submenu) {\r
+ submenu.style.display = 'none';\r
+ }\r
+ }\r
+ else {\r
+ // We have children, make sure to display the + and - icon.\r
+ if (actionimage.src.indexOf('plus') != -1) {\r
+ // The TreeNode have already got children, and displays them.\r
+ }\r
+ else if (actionimage.src.indexOf('minus') != -1) {\r
+ // The TreeNode have already got children, and displays them.\r
+ }\r
+ else {\r
+ if (actionimage.src.indexOf('last') == -1) {\r
+ actionimage.outerHTML = '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/' + (showLines ? 'plus' : 'plus_nolines') + '.gif" style="width:19px;height:20px;vertical-align:middle;" OnClick="handleNode(' + treeNode.getID() + ');">';\r
+ }\r
+ else {\r
+ actionimage.outerHTML = '<img id="handler' + treeNode.getID() + '" src="' + href + 'static/plus_last.gif" style="width:19px;height:20px;vertical-align:middle;" OnClick="handleNode(' + treeNode.getID() + ');">';\r
+ }\r
+ }\r
+ }\r
+ submenu.innerHTML = str;\r
+}\r
+function handleNode(nodeID) {\r
+ var treeNode = getTreeNode(nodeID); \r
+ if (!treeNode.hasChilds()) { // No reason to handle a node without childs.\r
+ return;\r
+ }\r
+ \r
+ var submenu = document.getElementById('node' + nodeID + 'sub');\r
+ \r
+ var iconimageholder = document.getElementById('iconimage' + nodeID);\r
+ var actionimage = document.getElementById('handler' + nodeID);\r
+\r
+ // This will be used if showRootNode is set to false.\r
+ var firstChildOfRoot = false;\r
+ if (actionimage.src.indexOf('_no_root') != -1) {\r
+ firstChildOfRoot = true;\r
+ }\r
+ \r
+ if (submenu.style.display == 'none') {\r
+ writeStates(nodeID,'open');\r
+ fireOpenEvent(treeNode);\r
+ submenu.style.display = 'block';\r
+\r
+ iconimageholder.src = treeNode.getOpenIcon();\r
+ \r
+ if (actionimage.src.indexOf('last') == -1) {\r
+ actionimage.src = href + 'static/' + ((firstChildOfRoot) ? 'minus_no_root' : (showLines ? 'minus' : 'minus_nolines')) + '.gif';\r
+ }\r
+ else {\r
+ actionimage.src = href + 'static/' + ((firstChildOfRoot) ? 'minus_last_no_root' : (showLines ? 'minus_last' : 'minus_nolines')) + '.gif';\r
+ }\r
+ }\r
+ else {\r
+ writeStates(nodeID,'closed');\r
+ submenu.style.display = 'none';\r
+ \r
+ iconimageholder.src = treeNode.getIcon();\r
+ \r
+ if (actionimage.src.indexOf('last') == -1) {\r
+ actionimage.src = href + 'static/' + ((firstChildOfRoot) ? 'plus_no_root' : (showLines ? 'plus' : 'plus_nolines')) + '.gif';\r
+ }\r
+ else {\r
+ actionimage.src = href + 'static/' + ((firstChildOfRoot) ? 'plus_last_no_root' : (showLines ? 'plus_last' : 'plus_nolines')) + '.gif';\r
+ }\r
+ }\r
+}\r
+function fireOpenEvent(treeNode) {\r
+ if (treeNode.gotOpenEventListeners()) {\r
+ for(var i=0;i<treeNode.openeventlisteners.length;i++) {\r
+ eval(treeNode.openeventlisteners[i] + '(' + treeNode.getID() + ');');\r
+ }\r
+ }\r
+}\r
+function fireEditEvent(treeNode,newVal) {\r
+ if (treeNode.gotEditEventListeners()) {\r
+ for(var i=0;i<treeNode.editeventlisteners.length;i++) {\r
+ eval(treeNode.editeventlisteners[i] + '(' + treeNode.getID() + ',\'' + escape(newVal) + '\');');\r
+ }\r
+ }\r
+}\r
+function fireMoveEvent(treeNode,draggedNodeID,droppedOnNodeID) {\r
+ if (treeNode.gotMoveEventListeners()) {\r
+ for(var i=0;i<treeNode.moveeventlisteners.length;i++) {\r
+ eval(treeNode.moveeventlisteners[i] + '(' + draggedNodeID + ',' + droppedOnNodeID + ');');\r
+ }\r
+ }\r
+}\r
+function blurSelection() {\r
+ if (selectedNode != null) {\r
+ var oldNodeTitle = document.getElementById('title' + selectedNode);\r
+ oldNodeTitle.className = 'treetitleselectedblured';\r
+ }\r
+}\r
+function focusSelection() {\r
+ if (selectedNode != null) {\r
+ var oldNodeTitle = document.getElementById('title' + selectedNode);\r
+ oldNodeTitle.className = 'treetitleselectedfocused';\r
+ }\r
+}\r
+function getCookieVal (offset) { \r
+ var endstr = document.cookie.indexOf (";",offset); \r
+ if (endstr == -1) {\r
+ endstr = document.cookie.length;\r
+ }\r
+ return unescape(document.cookie.substring(offset,endstr));\r
+}\r
+function getCookie (name) { \r
+ var arg = name + "=";\r
+ var alen = arg.length;\r
+ var clen = document.cookie.length;\r
+ var i = 0;\r
+ while (i < clen) {\r
+ var j = i + alen;\r
+ if (document.cookie.substring(i, j) == arg) {\r
+ return getCookieVal(j);\r
+ }\r
+ i = document.cookie.indexOf(" ", i) + 1;\r
+ if (i == 0) {\r
+ break;\r
+ }\r
+ }\r
+ return null;\r
+}\r
+function setCookie (name, value) { \r
+ var argv = setCookie.arguments; \r
+ var argc = setCookie.arguments.length; \r
+ var expires = (argc > 2) ? argv[2] : null; \r
+ var path = (argc > 3) ? argv[3] : null; \r
+ var domain = (argc > 4) ? argv[4] : null; \r
+ var secure = (argc > 5) ? argv[5] : false; \r
+ document.cookie = name + "=" + escape (value) + ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + ((path == null) ? "" : ("; path=" + path)) + ((domain == null) ? "" : ("; domain=" + domain)) + ((secure == true) ? "; secure" : "");\r
+}\r
+function expandNode() {\r
+ var state = getState(selectedNode);\r
+ if (state == 'open') {\r
+ var currentTreeNode = getTreeNode(selectedNode);\r
+ if (currentTreeNode.hasChilds()) {\r
+ selectNode(currentTreeNode.childs[0].getID());\r
+ }\r
+ }\r
+ else {\r
+ handleNode(selectedNode);\r
+ }\r
+}\r
+function subtractNode() {\r
+ var state = getState(selectedNode);\r
+ if (state == 'closed') {\r
+ var currentTreeNode = getTreeNode(selectedNode);\r
+ var parent = currentTreeNode.getParent();\r
+ if (parent != null && parent != rootNode) {\r
+ selectNode(parent.getID());\r
+ }\r
+ }\r
+ else {\r
+ handleNode(selectedNode);\r
+ }\r
+}\r
+function selectPrevNode() {\r
+ var currentTreeNode = getTreeNode(selectedNode);\r
+ if (currentTreeNode.prevSibling != null) {\r
+\r
+ var state = getState(currentTreeNode.prevSibling.getID());\r
+\r
+ if (state == 'open' && currentTreeNode.prevSibling.hasChilds()) {\r
+ // We have to find the last open child of the previoussiblings childs.\r
+ var current = currentTreeNode.prevSibling.childs[currentTreeNode.prevSibling.childs.length - 1];\r
+ var currentstate = 'open';\r
+ while (current.hasChilds() && (getState(current.getID()) == 'open')) {\r
+ current = current.childs[current.childs.length - 1];\r
+ }\r
+ selectNode(current.getID());\r
+ }\r
+ else {\r
+ selectNode(currentTreeNode.prevSibling.getID());\r
+ }\r
+ }\r
+ else {\r
+ if (currentTreeNode.getParent() != null && currentTreeNode.getParent() != rootNode) {\r
+ selectNode(currentTreeNode.getParent().getID());\r
+ }\r
+ }\r
+}\r
+function selectNextNode() {\r
+ var currentTreeNode = getTreeNode(selectedNode);\r
+\r
+ var state = getState(selectedNode);\r
+ if (state == 'open' && currentTreeNode.hasChilds()) {\r
+ selectNode(currentTreeNode.childs[0].getID());\r
+ } \r
+ else {\r
+ if (currentTreeNode.nextSibling != null) {\r
+ selectNode(currentTreeNode.nextSibling.getID());\r
+ }\r
+ else {\r
+ // Continue up the tree until we either hit null, or a parent which have a child.\r
+ var parent = currentTreeNode;\r
+ while ((parent = parent.getParent()) != rootNode) {\r
+ if (parent.nextSibling != null) {\r
+ selectNode(parent.nextSibling.getID());\r
+ break;\r
+ }\r
+ }\r
+ /*\r
+ if (currentTreeNode.getParent().nextSibling != null) {\r
+ selectNode(currentTreeNode.getParent().nextSibling.getID());\r
+ }\r
+ */\r
+ }\r
+ }\r
+}\r
+function keyDown(event) {\r
+ if (window.event) {\r
+ event = window.event;\r
+ }\r
+ if (event.keyCode == 38) { // Up\r
+ selectPrevNode();\r
+ return false;\r
+ }\r
+ else if (event.keyCode == 40) { // Down\r
+ selectNextNode();\r
+ return false;\r
+ }\r
+ else if (event.keyCode == 37) { // left\r
+ subtractNode();\r
+ return false;\r
+ }\r
+ else if (event.keyCode == 39) { // right\r
+ expandNode();\r
+ return false;\r
+ }\r
+}\r
+document.onkeydown = keyDown;\r
projects / citadel.git / blobdiff