// TreeView 構件1.0(JavaScript版)


// 使用步驟：
// # 在Html文檔中包含div：<div id="div1"></div>
// # 聲明代表樹的全局變量： var t;
// # 創建樹： t = new bscTreeView("div1", "t");
// # (可選)設定圖片目錄：t.imgPath = "treeimg/"; // 缺省同目錄
// # (可選)設定TreeView的Header： t.header = "<center><b>標題</b></center>";
// # (可選)設定TreeView的Footer： t.footer = "<center><b>腳注</b></center>";
// # (可選)設定TreeView顯示Table的其他屬性：t.style = "width='100%'";
// # (可選)設定縮進空格數：t.indent = 6; // 缺省3
// # 創建根節點：var a = t.addRootNode("根節點1", OpenedNode);
// # 創建子節點：var b = t.addSubNode(a, "子節點1", ClosedNode);
// # 創建葉節點：t.addLeafNode(b, "葉節點1", "http://www.263.net", "_blank"); 鏈接可以為空，target缺省為_self
// # 創建根級葉節點：t.addRootLeafNode("根級葉節點1", "http://www.263.net", "_blank");
// # (可選)定制節點圖片：b.nodeImg = "Web.gif";
// # (可選)控制節點是否自動換行：b.autoWrap = false; // 缺省true
// # (可選)節點是否能關閉：b.canClose = false; // 缺省true
// # (可選)圖片：t.imgOpen = "tt.gif";  imgClose  imgLeaf  imgLastLeaf
// # (可選)設置提示：a.hint = "the hint"; // 缺省節點名稱
// # (可選)顯示提示：a.showHint = true; // 缺省false
// # 繪制樹：t.drawTreeView();

// 常量
var Open_Image_Name  = "plus2.gif";
var Close_Image_Name = "minus2.gif";
var Leaf_Image_Name  = "leaf2.gif";
var LastLeaf_Image_Name = "leaf.gif";

var OpenedNode = 0;
var ClosedNode = 1;

// TreeView 對象
function bscTreeView(ADivName, AInstanceName){
        // property
        this.divName = ADivName;
        this.instName = AInstanceName;	// 實例名稱，必須是全局變量
        this.imgPath = "";
        this.indent = 3;				// 縮進(空格數)
        this.nodes = new Array();
        this.lastLeaf = null;			// 最后點擊的葉節點
        this.header = "";				// 頭
        this.footer = "";				// 尾
        this.style = "";				// table的屬性
        
        this.imgOpen = Open_Image_Name;
        this.imgClose = Close_Image_Name;
        this.imgLeaf = Leaf_Image_Name;
        this.imgLastLeaf = LastLeaf_Image_Name;
				
        // public method
        this.addRootNode = bscTreeView_addRootNode;
        this.addSubNode = bscTreeView_addSubNode;
        this.addRootLeafNode = bscTreeView_addRootLeafNode;
        this.addLeafNode = bscTreeView_addLeafNode;
        this.removeNode = bscTreeView_removeNode;
        this.drawTreeView = bscTreeView_drawTreeView;
        
        // private method
        this.newNode = bscTreeView_newNode;
        this.findNode = bscTreeView_findNode;
        this.write = bscTreeView_write;
        this.openNode = bscTreeView_openNode;
        this.closeNode = bscTreeView_closeNode;
        this.transform = bscTreeView_transform;
}

// 新增一個節點
function bscTreeView_newNode(ANodeName){
        var i = this.nodes.length;
        this.nodes[i] = new bscTreeNode(ANodeName);
        this.nodes[i].nodeId = i;
        this.nodes[i].treeView = this;
        return this.nodes[i];
}

// 添加根節點(可以有多個根節點)
function bscTreeView_addRootNode(ANodeName, ANodeState){
	return this.addSubNode(null, ANodeName, ANodeState);
}

// 添加子節點
function bscTreeView_addSubNode(AParentNode, ANodeName, ANodeState){
		var node = this.newNode(ANodeName);
		node.parent = AParentNode;
		if(node.parent == null){
			node.nodeLevel = 0;
		}
		else{
			node.nodeLevel = node.parent.nodeLevel + 1;
		}
		node.nodeState = ANodeState;

        if(node.parent != null){
			var i = node.parent.nodes.length;
			node.parent.nodes[i] = node;
        }

		return node;
}

// 添加根級葉節點
function bscTreeView_addRootLeafNode(ANodeName, ANodeLink, ALinkTarget){
	return this.addLeafNode(null, ANodeName, ANodeLink, ALinkTarget);
}

// 添加葉節點
function bscTreeView_addLeafNode(AParentNode, ANodeName, ANodeLink, ALinkTarget){
		var node = this.newNode(ANodeName);
		node.parent = AParentNode;
		if(node.parent == null){
			node.nodeLevel = 0;
		}
		else{
			node.nodeLevel = node.parent.nodeLevel + 1;
		}
		node.nodeLink = ANodeLink;
		node.isLeaf = true;
        if(ALinkTarget != ""){
			node.linkTarget = ALinkTarget;
        }

        if(node.parent != null){
			var i = node.parent.nodes.length;
			node.parent.nodes[i] = node;
        }

		return node;
}

// 刪除節點
function bscTreeView_removeNode(ANodeId){
        var node = this.findNode(ANodeId);
        if(node == null) return;
        // treeview的node和parent的node指向同一個對象，所以只需修改一個即可
        node.isValid = false;
        this.drawTreeView();
}

// 查找節點
function bscTreeView_findNode(ANodeId){
        for(var i = 0; i < this.nodes.length; i++){
                if(this.nodes[i].nodeId == ANodeId){
                        if(this.nodes[i].isValid){
							return this.nodes[i];
						}
						else{
							return null;
						}
                }
        }
        return null;
}

//打開節點
function bscTreeView_openNode(ANodeId){
        var node = this.findNode(ANodeId);
        if(node == null) return;
        node.nodeState = 0;
        this.drawTreeView();
}

// 關閉節點
function bscTreeView_closeNode(ANodeId){
        var node = this.findNode(ANodeId);
        if(node == null) return;
        node.nodeState = 1;
        this.drawTreeView();
}

// 執行葉節點的功能
function bscTreeView_transform(ANodeId){
	var node = this.findNode(ANodeId);
    if(node == null) return;
    this.lastLeaf = node;
    var s = new String(node.nodeLink);
    if(s.indexOf("javascript:", 0) == 0){
		eval(node.nodeLink);
    }
    else if(node.linkTarget == "_self"){
	    document.location = node.nodeLink;
    }
    else if(node.linkTarget == "_blank"){
		open(node.nodeLink);
    }
    else if(node.linkTarget == "_parent"){
		eval("parent.location = \"" + node.nodeLink + "\"");
    }
    else if(node.linkTarget == "_top"){
		eval("top.location = \"" + node.nodeLink + "\"");
    }
    else{
		eval("parent." + node.linkTarget + ".location = \"" + node.nodeLink + "\"");
    }
    this.drawTreeView();
}

// 寫內容
function bscTreeView_write(AContent){
	if(document.all){
        document.all[this.divName].innerHTML = AContent;
    }
    else{
		var s = "document." + this.divName;
		eval(s + ".open();");
		eval(s + ".write(" + AContent + ");");
		eval(s + ".close();");
    }
}

// 繪制TreeView
function bscTreeView_drawTreeView(){
        var s = "<table border=0 cellspacing=0 " + this.style + ">";
        if(this.header != ""){
			s += "<tr><td onmouseover=\"javascript:mOvr(this,'#203663');\" onmouseout=\"javascript:mOut(this,'transparent');\" onclick=\"javascript:mClk(this);\">" + this.header + "</td></tr>";
        }
        for(var i = 0; i < this.nodes.length; i++){
                if(this.nodes[i].isRoot() && this.nodes[i].isValid){
                        s += this.nodes[i].drawNode();
                }
        }
        if(this.footer != ""){
			s += "<tr><td onmouseover=\"javascript:mOvr(this,'#203663');\" onmouseout=\"javascript:mOut(this,'transparent');\" onclick=\"javascript:mClk(this);\">" + this.footer + "</td></tr>";
        }
        s += "</table>";
        this.write(s);
}

// TreeNode 對象
function bscTreeNode(ANodeName){
        // 屬性
        this.nodeId;				// 在本樹中的唯一編號
        this.nodeLevel;				// 層次(根節點為0)
        this.nodeName = ANodeName;	// 節點名稱
        this.nodeState = OpenedNode;// 節點狀態(0打開 1關閉)
        this.nodeImg = "";			// 節點圖片名稱
        this.nodeLink = "";			// 鏈接(只有葉節點有)
        this.linkTarget = "_self";	// 鏈接目標
        this.treeView;				// 樹對象
        this.parent;				// 父節點
        this.nodes = new Array();	// 子節點數組
        this.isLeaf = false;		// 是否葉節點
        this.autoWrap = false;		// 超出是否自動折行
        this.canClose = true;		// 是否能關閉
        this.isValid = true;		// 是否有效
        this.hint = this.nodeName;  // 提示
        this.showHint = true;		// 是否顯示提示

        this.drawNode = bscTreeNode_drawNode;
        this.isRoot = bscTreeNode_isRoot;
        this.isOpened = bscTreeNode_isOpened;
}
			
function bscTreeNode_drawNode(){
        if(!this.isValid) return "";

        var strSpace = "";
		var strImgSrc = "";
		var strLink = "";
		var strTitle = this.nodeName;
        // 空格
        for(var i = 0; i < this.nodeLevel; i++){
                for(var k = 0; k < this.treeView.indent; k++){
					strSpace += "&nbsp;";
                }
        }
		// 節點
        // 葉節點
        if(this.isLeaf){
                strImgSrc = this.treeView.imgLeaf;
                if(this == this.treeView.lastLeaf){
					strImgSrc = this.treeView.imgLastLeaf;
                }
                if(this.nodeImg != ""){
					strImgSrc = this.nodeImg;
                }
                // 有鏈接
                if(this.nodeLink != ""){
					strLink = "javascript:" + this.treeView.instName + ".transform(" + this.nodeId + ")";
                }
        }
        // 普通節點
        else{
                // 節點是打開狀態
                if(this.isOpened()){
                        strImgSrc = this.treeView.imgClose;
		                if(this.nodeImg != ""){
							strImgSrc = this.nodeImg;
		                }
                        // 可以關閉的節點
                        if(this.canClose){
							strLink = "javascript:" + this.treeView.instName + ".closeNode(" + this.nodeId + ")";
                        }
                }
                // 節點是關閉狀態
                else{
                        strImgSrc = this.treeView.imgOpen;
		                if(this.nodeImg != ""){
							strImgSrc = this.nodeImg;
		                }
		                strLink = "javascript:" + this.treeView.instName + ".openNode(" + this.nodeId + ")";
                }
        }
                
        // 調整
        strImgSrc = this.treeView.imgPath + strImgSrc;
        if(strLink == ""){
			strLink = "javascript:void(null)";
        }
        
        var result = "<tr><td onmouseover=\"javascript:mOvr(this,'#203663');\" onmouseout=\"javascript:mOut(this,'transparent');\" onclick=\"javascript:mClk(this);\"><table width='100%' border=0><tr>";
        // 空格
        if(strSpace != ""){
			result += "<td width=1>" + strSpace + "</td>";
        }
        // 圖片
		result += "<td width=1 valign='top'>" + "<a href='" + strLink + "'>" + "<img border=0 src='" + strImgSrc + "'></a></td>";
		// 文本
		var strIsWrap = "nowrap";
		if(this.autoWrap){
			strIsWrap = "";
		}
		var strHint = "";
		if(this.showHint){
			strHint = " title=" + this.hint;
		}
		result += "<td " + strIsWrap + ">" + "<a href='" + strLink + "' " + strHint + ">" + strTitle + "</a></td>";

        result += "</tr></table></td></tr>";
        
        // 子節點
        if(this.isOpened()){
                for(var k = 0; k < this.nodes.length; k++){
                        result += this.nodes[k].drawNode();
                }
        }
        // 返回
        return result;
}
			
function bscTreeNode_isRoot(){
        return this.nodeLevel == 0;
}
			
function bscTreeNode_isOpened(){
        return this.nodeState == 0;
}