function TreeSkin()
{
    extend(this, Skin);
};

TreeSkin.prototype = new Skin();

TreeSkin.prototype.install = function(widget)
{
    var thiz = this;
    widget.getCellWidget = function(tree, node, selected, editing, update)
    {
        var cell        = null;
        var cells       = null;
        var ctrlIcon    = null;
        var icon        = null;
        
        if(!node.__cell)
        {
            cell = node.__cell = new Widget;
            cell.domContainer.innerHTML = "<table><tr valign='middle'><td height=\"16\" width=\"8\"></td><td height=\"16\" width=\"16\"></td><td style='padding:2 3 2 3'></td></tr></table>";
        } else
        {
            cell = node.__cell;
        }
        
        if(!update)
        {
            return node.__cell;
        }
        
        var appendImage = function(url, image, async, cell) {
            cell.innerHTML = "<img src=\"" + image.src + "\">";
        }
        
        cells = cell.domContainer.getElementsByTagName("td");
        
        if(node.isLeaf())
        {
            icon = thiz.getIcon(TreeSkin.LEAF_ICON, selected, false);
        }
        else
        {
            ctrlIcon = thiz.getIcon(TreeSkin.CONTROL_ICON, selected, node.isExpanded());
            icon = thiz.getIcon(TreeSkin.FOLDER_ICON, selected, node.isExpanded());
        }
        
        if(editing)
        {
            cells[2].innerHTML = "<input style=\"width:100%\" value=\"" + node.getUserObject() + "\">";
            
            cells[2].childNodes[0].select();
            
            cells[2].onfocusout = function()
            {
                tree.completeEdit(node);
            };
        } else
        {
            cells[2].innerHTML = "<nobr><label>" + node.getUserObject() + "</label></nobr>";
            cells[2].childNodes[0].className = (selected ? "tree-node-selected" : "tree-node");
        }
        
        if(!selected || editing)
        {
            cells[2].style.background = "none";
            cells[2].style.border = "none";
        }

        cells[2].onmousedown = getMethodPointer(this, function(tree, node) {
            if(tree.isSelected(node))
            {
                tree.editNode(node);
            } else
            {
                tree.selectNode(node);
            }
        }, tree, node);

        if(ctrlIcon)
        {
            var ctrlCell = icon ? cells[0] : cells[1];
            Toolkit.getImage(ctrlIcon, appendImage, ctrlCell);
            ctrlCell.style.cursor = "hand";
            ctrlCell.onmousedown = function()
            {
                tree.getTreeModel().setExpanded(node, !node.isExpanded());
            };
        }
       
        if(icon)
        {
            Toolkit.getImage(icon, appendImage, cells[1]);
        }

        cell.setPreferredSize({width:100, height:23});
                
        return cell;
    };
};

TreeSkin.prototype.uninstall = function(widget)
{
};

TreeSkin.prototype.getIcon = WebObject.ABSTRACT_METHOD;

TreeSkin.prototype.toString = function()
{
    return "TreeSkin [skin/tree]";
};

TreeSkin.LEAF_ICON = 0x01;
TreeSkin.CONTROL_ICON = 0x02;
TreeSkin.FOLDER_ICON = 0x03;

TreeSkin.prototype.addInterface(Skin);