/*----------------------------------------\
|      Cross Browser Tree Viewer 1.0      |
|-----------------------------------------|
| Created by Keith Ohlfs - Pixelsight     |
|-----------------------------------------|
| This script is  provided as is  without |
| any warranty whatsoever. It may be used |
| free of charge for non commerical sites |
| For commerical use contact  the  author |
| of this script for further details.     |
|-----------------------------------------|
| Created 2002-02-10 | Updated 2002-02-21 |
\----------------------------------------*/


var UITreeHandler = {
	uniqueID : 0,
	rendered : 0,
	selected : 0,
	memory : 0,
	canselect : 1,
	previous : 0,
	delegate : 0,
	candrag : 0,
	dragger : 0,
	dragX : 0,
	dragY : 0,
	start : 0,
	realtime : 0,
	current : -1,
	all       : {},
	toggle    : function (oItem) { this.all[oItem.id.replace('-plus','')].toggle(); },
	toggle2    : function (oItem) { this.all[oItem.id.replace('-icon','')].toggle(); },
	focus     : function (oItem) { this.all[oItem.id.replace('-anchor','')].focus(); },
	url     : function (oItem) { return ("/keith/ui/images/" + oItem); },
	cookies   : new UICookie()
};




UITreeHandler.indexOfNext = function(str, start)
{
    var unmatch = 0;
    for (var a = start+1; a < str.length; a++) {
        if (str.charAt(a) == "[") unmatch++;
	else if (str.charAt(a) == "]") {
	    if (!unmatch) return a;
	    else unmatch--;
	}
    }
    return -1;
}

UITreeHandler.getSrcElement = function(e)
{
    e = (e) ? (e) : ((window.event) ? window.event : 0);
    if (!e) return;

    if (e.target) {
        o = (e.target.nodeType == 3) ? e.target.parentNode : e.target; 
    } else {
        o = e.srcElement;
    }
    return o;
}

UITreeHandler.md = function(e)
{
    if (!UITreeHandler.candrag) return true;

    o = UITreeHandler.getSrcElement(e);

    if ((o.id.substring(0,2) == 'i_') && (o.id.indexOf("icon") != -1)) {

       var str = o.src.toString();

	
        if (str.indexOf("/file.png") != -1) document.getElementById("dragimg").src = UITreeHandler.url('file.png');

	else document.getElementById("dragimg").src = UITreeHandler.url('foldericon.png');

        o = o.parentElement;

        UITreeHandler.start = UITreeHandler.root.find(o.id); 

	
	d = document.getElementById("dragger");
	UITreeHandler.dragger = document.getElementById("dragger").style;

	x2 = UITreeHandler.offsetLeft(d.parentElement);
	y2 = UITreeHandler.offsetTop(d.parentElement);
	UITreeHandler.dragX = event.offsetX + x2;

	UITreeHandler.dragY = event.offsetY + y2;

    }     
}
UITreeHandler.offsetLeft = function (e, parstr)
{
    parstr = parstr ? parstr : 0;
    var o = ((typeof e != 'object') ? document.getElementById(e) : e);
    if (!o) return;
    if (parstr && (o == parstr)) return 0;
    var l = o.offsetLeft;
    while (o.offsetParent) {
        if (parstr && (o.offsetParent == parstr)) return l;
	o = o.offsetParent;
	l += o.offsetLeft;
    }
    return l;
}

UITreeHandler.offsetTop = function (e, parstr)
{
    parstr = parstr ? parstr : 0;
    var o = ((typeof e != 'object') ? document.getElementById(e) : e);
    if (!o) return;
    if (parstr && (o == parstr)) return 0;
    var l = o.offsetTop;
    while (o.offsetParent) {
        if (parstr && (o.offsetParent == parstr)) return l;
	o = o.offsetParent;
	l += o.offsetTop;
    }
    return l;
}

UITreeHandler.mm = function(e)
{
    var d;
    if (!UITreeHandler.candrag) return true;
    o = UITreeHandler.getSrcElement(e);

    if (UITreeHandler.dragger) {

	
	UITreeHandler.dragger.visibility = "visible";

	d = document.getElementById(UITreeHandler.root.id).parentElement.parentElement;
	
	UITreeHandler.dragger.pixelLeft = (event.clientX + d.scrollLeft) - UITreeHandler.dragX;

	UITreeHandler.dragger.pixelTop = ((event.clientY + d.scrollTop)) - UITreeHandler.dragY;

	posl = (event.clientX + d.scrollLeft) - UITreeHandler.dragX;

	post = ((event.clientY + d.scrollTop)) - UITreeHandler.dragY;

	if ((o.id.substring(0,2) == 'i_') && (o.id.indexOf("icon") != -1)) {

	    d = o.parentElement;

	    //window.status = o.id + " " + d.id + " " + posl + " " + post;
	} else {
	    d = UITreeHandler.root.locate(posl, post);
	}
	   

	if (d) {
	    
	    var foo = d;
	    var i = 1;
	    while (foo.parent && foo.parent.parent) {
		foo = foo.parent;
		if (foo == UITreeHandler.start) d = UITreeHandler.root;
		i++;
	    }
	    if (d == UITreeHandler.start) d = UITreeHandler.root;
	    if ((posl > (i*19 - 20)) && (posl < (i*19 + 20)) && (d != UITreeHandler.root) && d.position) {
		document.getElementById("positioner").style.pixelTop = d.position() - 2 + document.getElementById(UITreeHandler.root.id + "-shell").offsetTop;

		window.status = document.getElementById(UITreeHandler.root.id + "-shell").offsetTop;
		document.getElementById("positioner").style.pixelLeft = i*19 - 5;

		UITreeHandler.current = d.id.substring(2,d.id.length);
		document.getElementById("positioner").style.visibility = "visible";

	    } else {
		document.getElementById("positioner").style.visibility = "hidden";

		UITreeHandler.current = -1;
	    }
	} else {
	    document.getElementById("positioner").style.visibility = "hidden";

	    UITreeHandler.current = -1;
	}
	
    }

    return false;


}

UITreeHandler.nothing = function()
{
    ;
}

UITreeHandler.mu = function(e)
{
    if (!UITreeHandler.candrag) return true;
    
    o = UITreeHandler.getSrcElement(e);

    
    if (UITreeHandler.dragger) {
        UITreeHandler.dragger.visibility = "hidden";

        document.getElementById("positioner").style.visibility = "hidden";

        if (UITreeHandler.current != -1) {
	    var prev = UITreeHandler.start;
	    prev.remove(0);
	    var next = UITreeHandler.root.find("i_" + UITreeHandler.current);
	    var a = -1;
	    if (next && (p = next.parent)) {
	         for (a = 0; a < p.children.length; a++) {
		     if (p.children[a] == next) break;
		 }
            }
	    
	    if (a < p.children.length && (a >= 0)) {
	        window.status = "Add " + p.id + "-" + prev.id + " at " + a;
	        p.addAt(prev, a);
		UITreeHandler.root.setSelected(UITreeHandler.selected.id, 0);
	    }
	}
    }
    UITreeHandler.start = -1;
    UITreeHandler.current = -1;
    UITreeHandler.dragger = 0;
}
function UITreeItem(title, action, id)
{
    //if (!id || (!(id === undefined))) {
    if ((UITreeItem.arguments.length > 2)) {
        this.id = "i_" + id;
	if (id > UITreeHandler.uniqueID) UITreeHandler.uniqueID = id+1;
    } else this.id = "i_" + UITreeHandler.uniqueID++;
    
    if (UITreeHandler.all[this.id]) {
	this.id = "i_" + UITreeHandler.uniqueID++;
    }
    //if (link) this.link = "i_" + link;
    //else this.link = this.id;
    this.title = (title ? title : 0);
    this.action = (action ? action : 0);
    this.children = new Array();
    this.icon = 0;
    this.iconh = 0;
    this.parent = 0;
    this.open = 0;
    this.selected = 0;
    this.enabled = 1;
    UITreeHandler.all[this.id] = this;
    if (!UITreeHandler.root) UITreeHandler.root = this;
    return this;
}

UITreeItem.prototype.getPath = function(ar)
{
    if (!(p1 = UITreeHandler.selected)) return;
    if (!ar) return;
    
    if (UITreeHandler.selected == UITreeHandler.root) {
        ar[ar.length] = UITreeHandler.root.action;
	ar[ar.length] = UITreeHandler.root.title;
	return;
    }
    ar.length = 0;
    while (p2 = p1.parent) {
        ar[ar.length] = p2.action;
	ar[ar.length] = p2.title;
	p1 = p2;
    }
}

UITreeItem.prototype.get = function(val)
{
    var prev = 0;
    
    if (this.parent == 0) return 0;
    for (var a = 0; a < this.parent.children.length; a++) {
        if (this.parent.children[a] == this) {
	    if (val == 'prev') return prev;
	    else if ((val == 'next') && (a < (this.parent.children.length-1))) return this.parent.children[a+1];
	}
	prev = this.parent.children[a];
    }
    return 0;
}

UITreeItem.prototype.deselectAll = function() {
    if (this.selected) {
	document.getElementById(this.id ).style.backgroundColor = 'transparent';
	this.selected = 0;
    }
    this.deselectChildren();
}

UITreeItem.prototype.find = function(val) {
    if (this.id == val) return this;
    for (var i = 0; i < this.children.length; i++) {
	if (t = this.children[i].find(val)) return t;
    } 
    return 0;
}

UITreeItem.prototype.deselectChildren = function() {
    for (var i = 0; i < this.children.length; i++) {
	    this.children[i].deselectAll();
    } 
}

UITreeItem.prototype.locate = function(left, top) {
    
    var t = this.position();
    var i;
    var d;
    
    if (top > t && (top < (t + 16.0))) return this;
    for (i = 0; i < this.children.length; i++) {
        if (d = this.children[i].locate(left, top)) return d;
    } 
    return 0;
}

UITreeItem.prototype.position = function() {
    
    var closed = this;
    var p;
    var t;
    if (this.parent) {
	p = this.parent;
	while (p != UITreeHandler.root) {
	    if (p.open == 0) closed = p;
	    p = p.parent;
	} 
    }
    p = document.getElementById(closed.id);
    d = document.getElementById(UITreeHandler.root.id + "-shell");
    t = UITreeHandler.offsetTop(p,d);
    
    //window.status = t;
    return t - d.offsetParent.scrollTop;
    t = p.offsetTop;
    while (p.offsetParent) {
	p = p.offsetParent;
	t += p.offsetTop;
    }
    return t;
}

UITreeItem.prototype.positionArrow = function() {
    
     if (UITreeHandler.delegate) UITreeHandler.delegate(this.position());
}

UITreeItem.prototype.focus = function() {

    if (this.action && this.enabled && UITreeHandler.canselect) {
	if (UITreeHandler.selected) UITreeHandler.selected.deselectAll();
	UITreeHandler.previous = UITreeHandler.selected;
	UITreeHandler.selected = this;
	this.positionArrow();
	
	//w = document.getElementById(this.id).offsetWidth;
	//w2 = document.getElementById(UITreeHandler.root.id + "-shell").offsetWidth;
	//if (w2 > w) {
	//    document.getElementById(this.id).style.pixelWidth = w2;
	//}
	document.getElementById(this.id).style.backgroundColor = 'e4e4e4';
	this.selected = 1;
        document.getElementById(this.id + '-anchor').blur();
	UITreeHandler.cookies.setCookie(UITreeHandler.memory, UITreeHandler.root.getState());
    }
    
}

UITreeItem.prototype.setSelected = function(new_id, click, expand) {
    if (this.id == new_id) {
        this.focus();
        if (click) document.getElementById(this.id + '-anchor').click();
	return 1;
    } else { 
	for (var i = 0; i < this.children.length; i++) {
	    if (this.children[i].setSelected(new_id, click, expand)) {
	        if (!this.open && (expand && expand == '1')) this.expand();
	        return 1;
	    }
	}
    }
}

UITreeItem.prototype.childSelected = function() {
    for (var i = 0; i < this.children.length; i++) {
	if (this.children[i].selected) return 1;
	if (this.children[i].childSelected()) return 1;
    }
    return 0;
}

UITreeItem.prototype.expand = function() {
    document.getElementById(this.id + '-icon').src = this.iconh ? this.iconh : UITreeHandler.url("openfoldericon.png");
    if (this.children.length) document.getElementById(this.id + '-cont').style.display = 'block'; 
    this.open = true;
    if (this != UITreeHandler.root)
    document.getElementById(this.id + '-plus').src = UITreeHandler.url((this.get('next') ? "Tminus" : "Lminus")  + ".png");
    UITreeHandler.cookies.setCookie(UITreeHandler.memory, UITreeHandler.root.getState());
}

UITreeItem.prototype.collapse = function() {
    if (this.childSelected()) {
	if (!this.action) return alert("You can't collapse the folder of the document you are viewing!");
	else {
	    this.focus();
            document.getElementById(this.id + '-anchor').click();
	}
    }
    document.getElementById(this.id + '-icon').src = this.icon ? this.icon : UITreeHandler.url("foldericon.png");
    if (this.children.length) {  document.getElementById(this.id + '-cont').style.display = 'none'; }
    this.open = false;
    if (this != UITreeHandler.root)
    document.getElementById(this.id + '-plus').src = UITreeHandler.url((this.get('next') ? "Tplus" : "Lplus")  + ".png");
    UITreeHandler.cookies.setCookie(UITreeHandler.memory, UITreeHandler.root.getState());
}

UITreeItem.prototype.setState = function(val) {
    var cnt = 0;
    var ccnt = 1;
    var v;
    var t;
    if (!val || (val.charAt(0) != '[')) return;
    cnt++;
    window.status = "set state " + val;
    while (cnt < val.length) {
	if (ccnt > this.children.length+1) return;
        v = val.charAt(cnt);
	if (v == '[') {
	    if (t = UITreeHandler.indexOfNext(val,cnt)) this.children[ccnt-2].setState(val.substring(cnt,t+1));
	    cnt = t+1;
	} else {
	    //if (ccnt >= this.children.length-1) return;
	    if (ccnt > this.children.length) return;
	    if (v == '0' || v == '2') this.children[ccnt-1].open = 0;
	    if (v == '1' || v == '3') this.children[ccnt-1].open = 1;
	    if (v > 1)  {
	        if (UITreeHandler.canselect) {
	           this.children[ccnt-1].selected = 1;
		   UITreeHandler.selected = this.children[ccnt-1];
		}
	    }

	    cnt++;
	    ccnt++;
	}
    }
    window.status = "done state " + val;
}

UITreeItem.prototype.getState = function() {
    var str = "[";
    for (var i = 0; i < this.children.length; i++) {
	if (this.children[i].selected) str += (this.children[i].open ? "3" : "2");
	else if (this.children[i].open) str += "1";
	else str += "0";
	if (this.children[i].children.length) str += this.children[i].getState();
    }
    str += "]";
    return str;
}

UITreeItem.prototype.toggle = function(item)
{
    if (this.children.length) {
	if (this.open) { this.collapse(); }
	else { this.expand(); }
	if (UITreeHandler.selected) UITreeHandler.selected.positionArrow();
    }
}

UITreeItem.prototype.selectedIndex = function()
{
    for (var a = 0; a < this.children.length; a++) if (this.children[a] == UITreeHandler.selected) return a;
    return -1;
}

UITreeItem.prototype.add = function(item)
{
    item.parent = this;
    this.children[this.children.length] = item;
    
    if (UITreeHandler.rendered) {
        this.open = 1;
	if (this.children.length == 1) {
	    document.getElementById(this.id + '-icon').src = this.iconh ? this.iconh : UITreeHandler.url("openfoldericon.png");
            document.getElementById(this.id + '-cont').style.display = 'block'; 
	}
	document.getElementById(this.id + '-cont').insertAdjacentHTML("beforeEnd", item.draw());
        this.indent(1);
    }
    return item;
}

UITreeItem.prototype.addAt = function(item, index)
{
    item.parent = this;
    if (index < 0 || index > this.children.length) {
        index = this.children.length;
        alert("index out of range!");
    }
    for (var a = this.children.length; a > index; a--) {
        this.children[a] = this.children[a-1];
    }
    this.children[index] = item;
    if (UITreeHandler.rendered) {
	this.open = 1;
	if (this.children.length == 1) {
	    document.getElementById(this.id + '-icon').src = this.iconh ? this.iconh : UITreeHandler.url("openfoldericon.png");
	    document.getElementById(this.id + '-cont').style.display = 'block'; 
	}
	if (index == 0 || (index == this.children.length - 1)) {
	    if (index == 0) 
	    document.getElementById(this.id + '-cont').insertAdjacentHTML("AfterBegin", item.draw());
	    else 
	    document.getElementById(this.id + '-cont').insertAdjacentHTML("beforeEnd", item.draw());
	} else {
	    prev = this.children[index-1];
	    document.getElementById(prev.id + '-cont').insertAdjacentHTML("AfterEnd", item.draw());
	}
        this.indent(1);
    }
    return item;
}

UITreeItem.prototype.remember = function(val)
{
    if (val) {
        UITreeHandler.memory = val;
    } else {
        UITreeHandler.memory = UITreeHandler.root.id;
    }
    window.status = "looking up memory";
    UITreeHandler.root.setState(UITreeHandler.cookies.getCookie(UITreeHandler.memory));
    window.status = "found memory";
}


UITreeItem.prototype.indent = function(recurse) {
	
	for (var i = this.children.length - 1; recurse && i >= 0 ; i--) {
	    this.children[i].indent(recurse);
	}
	
	var io = (this.get('next') ? "T" : "L");
	
	if (this != UITreeHandler.root) {
	document.getElementById(this.id + '-plus').src = UITreeHandler.url((this.children.length ? ((this.open) ? (io + "minus"):(io + "plus")) : io) + ".png");
        }
	var foo = this;
	var c = 0;
	while (foo.parent && foo.parent.parent) {
	    foo = foo.parent;
	    document.getElementById(this.id + '-ind-' + c).src = UITreeHandler.url(((foo.parent && (foo == foo.parent.children[foo.parent.children.length-1])) ? "blank" : "I") + ".png");
	    c++;
	}
	
	return 0;
}

UITreeItem.prototype.getLast = function() {
	if (this.children[this.children.length - 1].open) { return this.children[this.children.length - 1].getLast(); }
	else { return this.children[this.children.length - 1]; }
}

UITreeItem.prototype.getNext = function() {
    if (!this.parent) return UITreeHandler.root;
    for (var i = 0; i < this.parent.children.length; i++) {
	if (this == this.parent.children[i]) { break; }
    }
    if (++i == this.parent.children.length) { return this.parent.getNext(); }
    else { return this.parent.children[i]; }
}

UITreeItem.prototype.getPrev = function(b) {
    for (var i = 0; i < this.parent.children.length; i++) {
	if (this == this.parent.children[i]) { break; }
    }
    if (i == 0) { return this.parent; }
    else {
	if ((this.parent.children[--i].open) || (b && this.parent.children[i].children.length)) { return this.parent.children[i].getLast(); }
	else { return this.parent.children[i]; }
    } 
}


UITreeItem.prototype.remove = function(rmvchild) {
    if (!this.parent) return 0;
    var parent = this.parent;
    var real_prev = this.get('prev');
    var prev = this.getPrev(true);
    var next = this.getNext(true);
    if (rmvchild && UITreeHandler.rendered) this.getPrev().focus();
    this.removeMe(rmvchild);
    
    if (parent && parent.children.length == 0) {
	parent.open = false;
	if (UITreeHandler.rendered) {
	    document.getElementById(parent.id + '-icon').src = UITreeHandler.url("file.png");
	    document.getElementById(parent.id + '-plus').src = UITreeHandler.url((parent.get('next') ? "T" : "L") + ".png");
	    document.getElementById(parent.id + '-cont').style.display = 'none'; 
	}
    }

    if (real_prev && UITreeHandler.rendered) {
	real_prev.indent(1);
    }
    
    return;

}

UITreeItem.prototype.removeMe = function(rmvchild) {
    var i;
    var j;

    if (rmvchild) {
	for (i = this.children.length - 1; i >= 0; i--) {
	    this.children[i].removeMe(rmvchild);
	}
    }
    for (i = 0; i < this.parent.children.length; i++) {
	if (this.id == this.parent.children[i].id) {
	    for (j = i; j < this.parent.children.length-1; j++) {
		    this.parent.children[j] = this.parent.children[j+1]
	    }
	    this.parent.children.length = this.parent.children.length - 1;
	    break;
	}
    }
    if (rmvchild) UITreeHandler.all[this.id] = null;
    if (!UITreeHandler.rendered) return;
    
    if (document.getElementById(this.id)) {
	document.getElementById(this.id).innerHTML = "";
	d = document.getElementById(this.id + "-shell");
	d.style.display = "none";
	d.outerHTML = "";
	if (d.removeNode) d.removeNode(true);
    }

}

UITreeItem.prototype.oldstyles = function()
{
return "<style>\n.tree-container {margin: 0px;padding: 0px;font: icon;white-space: nowrap;}\n.tree-item {font-family: Arial, san-serif;font-size:12px;font: icon;color: black;white-space: nowrap;}\n.tree-item a, .tree-item a:active, .tree-item a:hover {margin-left: 3px;padding: 1px 2px 1px 2px;}\n.tree-item a {color: black;text-decoration: none;}\n.tree-item a:hover {color: blue;text-decoration: underline;}\n.tree-item a:active {background: highlight;color: highlighttext;text-decoration: none;}\n.tree-item img {vertical-align: middle;border: 0px;}\n.tree-itemd {font-family: Arial, san-serif;font-size:12px;font: icon;color: gray;white-space: nowrap;}\n.tree-itemd a, .tree-itemd a:active, .tree-itemd a:hover {margin-left: 3px;padding: 1px 2px 1px 2px;}\n.tree-itemd a {color: gray;text-decoration: none;}\n.tree-itemd a:hover {color: blue;text-decoration: underline;}\n.tree-itemd a:active {background: highlight;color: highlighttext;text-decoration: none;}\n.tree-itemd img {vertical-align: middle;border: 0px;}\n.tree-icon {width: 16px;height: 16px;}\n</style>";
}


UITreeItem.prototype.styles = function()
{
return "<style>\n.tree-container {margin: 0px;padding: 0px;font: icon;white-space: nowrap;}\n.tree-item {font-family: Arial, san-serif;font-size:12px;font: icon;color: black;white-space: nowrap;}\n.tree-item a {color: black;text-decoration: none;}\n.tree-item a:hover {color: blue;text-decoration: underline;}\n.tree-item a:active {background: highlight;color: highlighttext;text-decoration: none;}\n.tree-item img {vertical-align: middle;border: 0px;}\n.tree-itemd {font-family: Arial, san-serif;font-size:12px;font: icon;color: gray;white-space: nowrap;}\n.tree-itemd a {color: gray;text-decoration: none;}\n.tree-itemd a:hover {color: blue;text-decoration: underline;}\n.tree-itemd a:active {background: highlight;color: highlighttext;text-decoration: none;}\n.tree-itemd img {vertical-align: middle;border: 0px;}\n.tree-icon {width: 16px;height: 16px;}\n</style>";
}

UITreeItem.prototype.draw_self = function()
{
    // ADD SOME BLANK SPACE AT THE FRONT
    var str = "<img src='" + UITreeHandler.url('spacer.gif') + "' width=4 height=4>";
    var timg = "";
    // ADD THE INDENTED GRAPHICS FOR ALL THE PARENT ITEMS
    var indent = "";
    var foo = this;
    var i = 0;
    while (foo.parent && foo.parent.parent) {
        foo = foo.parent;
        indent = "<img id='" + this.id + "-ind-" + i + "' src='" + UITreeHandler.url(((foo.parent && (foo == foo.parent.children[foo.parent.children.length-1])) ? "blank" : "I") + ".png") + "'>" + indent;
	i++;
    }
    str += indent;
    
    // THE IMMEDIATE PATH ICON T or L
    if (this != UITreeHandler.root)
    str += "<img id='" + this.id + "-plus' src='" + UITreeHandler.url((this.get('next') ? (this.children.length ? (this.open ? "Tminus" : "Tplus") : "T") : (this.children.length ? (this.open ? "Lminus" : "Lplus") : "L"))  + ".png") + "' onclick='UITreeHandler.toggle(this);' style='cursor:pointer;cursor:hand;'>";
    
    // THE FOLDER ICON
    timg += "<img id='" + this.id + "-icon' src='" + (this.icon ? this.icon : (UITreeHandler.url((this.children.length ? (this.open ? "openfoldericon" : "foldericon") : "file") + ".png"))) + "' ionclick='select(this);'";
    
    if (!UITreeHandler.candrag && !UITreeHandler.canselect && !this.action) { 
        timg += " onclick='UITreeHandler.toggle2(this);' style='cursor:pointer;cursor:hand;' ";
    } 
    
    timg += ">";
    
    if (UITreeHandler.candrag) {
        str += timg + "<font style='text-decoration:none;'>&nbsp;&nbsp;</font>";
    }
    // ADD THE ANCHOR IF THE ITEM IS AN ACTION
    //str += "&nbsp;&nbsp;";
    if (this.action && this.enabled) str += "<a href=\"" + (this.enabled ? this.action : "javascript:UITreeHandler.nothing();") + "\" id='" + this.id + "-anchor' onfocus='UITreeHandler.focus(this);' style='margin:0px;padding:0px;'>";
    if (!UITreeHandler.candrag) str += timg + "<font style='text-decoration:none;'>&nbsp;&nbsp;</font>";
    // AND THE LABEL
    var label = this.title;
    label = label.replace('<', '&lt;');
    label = label.replace('>', '&gt;');
   // str += "&nbsp;" + "<div id='" + this.id + "-text'>" + (label ? label : "") + "</div>";
    //if (!(this.action && this.enabled)) str += "&nbsp;&nbsp;";
    //str += "&nbsp;";
    str += (label ? label : "");   

    if (this.action && this.enabled) str += "</a>";
    return str;

}

UITreeItem.prototype.setEnabled = function(val)
{
    this.enabled = val;
    var i = document.getElementById(this.id);
    var str = (this.enabled ? "tree-item" : "tree-itemd");
    if (i) {
        i.className = str;
        i.innerHTML = this.draw_self();
    }
    //var i = document.getElementById(this.id + "-anchor");
    //if (i) i.href = this.enabled ? this.action : "javascript:UITreeHandler.nothing();";
}

UITreeItem.prototype.draw = function()
{
    // CREATE THE DIV FOR THE Tree
    window.status = "starting draw";
    var str = "<div id='" + this.id + "-shell' style='display:block; width:100%; '><div id='" + this.id + "' ondblclick='UITreeHandler.toggle(this);' class='tree-item" + (this.enabled ? "" : "d") + "'  style='" + (this.selected ? "background-color:e4e4e4;" : "") + " height:16; width:100%;'>";
    if (UITreeHandler.realtime) {document.write(str); str = "";}
    window.status = "drawing self";
    str += this.draw_self();
    if (UITreeHandler.realtime) {document.write(str); str = "";}
    //CLOSE OUT THE DIV
    str += "</div>";
    window.status = "drawing children";
    str += "<div id='" + this.id + "-cont' class='tree-container' style='display: " + ((this.open) ? 'block' : 'none') + ";  width=100%'>";
    if (UITreeHandler.realtime) {document.write(str); str = "";}
    for (var i = 0; i < this.children.length; i++) {
	str += this.children[i].draw();
	if (UITreeHandler.realtime) {document.write(str); str = "";}
    }
    str += "</div></div>";
    if (UITreeHandler.realtime) {document.write(str); str = "";}
    if ((this == UITreeHandler.root) && UITreeHandler.candrag) {
        str+= "<div id='dragger' style='position: absolute; visibility:hidden; width:16px; top: 0px; left:0px; height:16px; padding: 0px;'><img id='dragimg' src='" + UITreeHandler.url('file.png') + "' width=16 height=16></div><div id='positioner' style='position: absolute; visibility:hidden; width:10px; top: 0px; left:0px; height:5px; padding: 0px;'><!img id='posimg' src='" + UITreeHandler.url('position.gif') + "' width=10 height=5></div>";
        UITreeHandler.rendered = 1;
	if (UITreeHandler.realtime) {document.write(str); str = "";}
    }
    window.status = "done assembly";
    if (UITreeHandler.realtime) {document.write(str); str = "";}
    return str;
    
}

document.onmousedown = UITreeHandler.md;
document.onmousemove = UITreeHandler.mm;
document.onmouseup = UITreeHandler.mu;