/****************************************** 内容切换组件 **************************************************/
Ext.ns('Ext.gzj');
Ext.gzj.ContentChange = Ext.extend(Ext.util.Observable, {
    duration: 1,                  //特效持续时间
    easing: 'easeOut',            //运动特效类型
	events: 'mouseenter',         //响应事件
	texiaotype: 1,                //特效类型
    menusel: 'dt',                //菜单的选择符
	contentsel: 'dd',             //内容的选择符
	menucls: 'on',                //激活的菜单的样式
	//组件的构造方法
    constructor: function(menuid, contentid, config) {
        config = config || {};
        Ext.apply(this, config);
        Ext.gzj.ContentChange.superclass.constructor.call(this, config);
		this.menulist = Ext.get(menuid).select(this.menusel);            //获取菜单对象
		this.contentlist = Ext.get(contentid).select(this.contentsel);  //获取切换内容的对象
        this.initMarkup();       //初始化组件
    },
	//方法：初始化组件
    initMarkup: function() {
		this.size = this.menulist.getCount();
        var init=0;
		for(var i=0; i<this.size; i++){
			if(this.menulist.item(i).hasClass(this.menucls)) init = i;
			this.contentlist.item(i).setDisplayed(true);
			this.menulist.item(i).on(this.events, function(ev){
				ev.preventDefault();
				ev.getTarget().blur();
				var target=Ext.fly(ev.getTarget());
				if(target.hasClass(this.menucls)) return;
				var x=0;
				for(x; x<this.size; x++){
					if(this.menulist.item(x).dom==target.dom)break;
				}
				this.showmenu(x);
			}, this);
		}
		this.menulist.item(init).radioClass(this.menucls);
		this.showmenu(init);
    },
	//方法：展开菜单的内容
	showmenu: function(x) {
		if(x>this.size-1 || x<0)return;
		this.menulist.item(x).radioClass(this.menucls);
		for(var i=0; i<this.size; i++){
			this.contentlist.item(i).setStyle({ display:'none' });
		}
		this.contentlist.item(x).setStyle({ display:'' });
		switch (this.type) {
			case 1:
			    this.contentlist.item(x).stopFx().fadeIn({
					easing: this.easing,
					duration: this.duration
				});
				break;
			case 2:
				this.contentlist.item(x).stopFx().slideIn('t',{
					easing: this.easing,
					duration: this.duration
				});
				break;
			case 3:
				this.contentlist.item(x).stopFx().slideIn('l',{
					easing: this.easing,
					duration: this.duration
				});
				break;
			default:
				this.contentlist.item(x).stopFx().fadeIn({
					duration: 1
				});
		}
	}
});