window.onload = UserControlPanel;
function UserControlPanel(){
    InitUserPanel.call([document.getElementById(MainID),document.getElementById(SubID)]);
}
function InitUserPanel(){
		this[0].Choosed = false;
		this[0].IsRun = false;
		this[0].Child = this[0].getElementsByTagName("a");
		this[1].Child = this[1].getElementsByTagName("LI");
		RelateObject.call(this);
}
function RelateObject(){
	for(var i=0,j=this[0].Child.length;i<j;i++){
			this[0].Child[i].Parent = this[0];
			this[0].Child[i].Relate = this[1].Child[i];
			this[1].Child[i].Relate = this[0].Child[i];
			InitUserPanelList.call(this[1].Child[i]);
			this[0].Child[i].IsOpen = false;
			this[0].Child[i].onmouseover = UserControlOver;
	}
}
function UserControlOver(){
	if(this.Parent.Choosed != this.Relate && !this.Parent.IsRun)
		this.Relate.Open();
}
function InitUserPanelList(){
    this.MaxHeight = LineHeight;
    this.Speed = 0.05;
    this.Delay = 10;
    this.Open = function(){
        var oObj = this;
		this.InitOpen();
        this.setOpen = setInterval(function(){
            oObj.style.height = oObj.offsetHeight + oObj.MaxHeight * oObj.Speed + "px";
             if(oObj.offsetHeight >= oObj.MaxHeight)
                oObj.EndOpen();
        },this.Delay);
    }
	this.InitOpen = function(){
		this.Relate.Parent.IsRun = true;
		if(this.Relate.Parent.Choosed && this.Relate.Parent.Choosed.style.display == "block")
				this.Relate.Parent.Choosed.style.display = "none";
        this.ClearSetTime();
        this.style.display = "block";
		this.style.height = "1px";
	}
    this.EndOpen = function(){
        clearInterval(this.setOpen);
        this.style.height = this.MaxHeight + "px";
		this.Relate.Parent.Choosed = this;
		this.Relate.Parent.IsRun = false;
    }
    this.ClearSetTime = function(){
        if(this.setOpen)clearInterval(this.setOpen);
    }
}