
Ext.ns('Ext.gzj');
/************************************ 滑动组件（展示产品，友情链接等） *********************************************/
Ext.gzj.Carousel = Ext.extend(Ext.util.Observable, {
    interval: 1,                 //切换时间
    transitionDuration: 1.5,     //特效持续时间
    transitionEasing: 'easeOut', //特效效果
	transitionOpacity: 1,        //透明度
    itemSelector: 'img',         //项目选择符
	cls: '',                     //容器css样式
	fix: 0,                      //偏移量的补丁
	//组件的构造方法
    constructor: function(elId, config) {
        config = config || {};
        Ext.apply(this, config);
        Ext.gzj.Carousel.superclass.constructor.call(this, config);
        this.el = Ext.get(elId); //获取组件对象
        this.initMarkup();       //初始化组件        
		//滑动元素的个数大于0，并且滑动元素的总宽度大于组件的宽度时，初始化事件
        if(this.carouselSize > 0) {
			if(this.slideWidth>this.el.getWidth()+10){
				this.weizhi = [];
				for(var i=0; i<this.carouselSize; i++){
					this.weizhi[i]=this.els.item(i).getX();
				}
				this.initEvents();  //初始化事
			}
        }
    },
	//方法：初始化组件
    initMarkup: function() {
        var dh = Ext.DomHelper;
		this.index = 0;
		this.offset = 0;             //偏移量
        this.carouselSize = 0;       //滑动元素的个数
		//添加容器（用于装滚动的元素）
        this.el.slides = dh.append(this.el, { cls:this.cls }, true);      
        //将滚动的元素放入容器中,并设置容器大小等于所以滚动元素的宽度总和
		this.slideWidth = 10; 
		this.els=this.el.select(this.itemSelector);
		for(var i=0; i<this.els.getCount(); i++){
			this.els.item(i).appendTo(this.el.slides);
			this.carouselSize++;
			this.slideWidth=this.slideWidth+this.els.item(i).getWidth()+this.fix;
		}
		this.slideHeight = this.el.getHeight(true);
        this.el.slides.setStyle({
            width: this.slideWidth + 'px',
            height: this.slideHeight + 'px'
        });
        this.el.clip();
    },
	//方法：初始化事件
    initEvents: function() {
		//自动播放事件
		this.duration = this.transitionDuration;
		this.playing = false;
		this.playTask = this.playTask || {
			run: function() {
				this.sliding(1);
			},
			interval: this.interval*1000,
			scope: this
		};
		this.playTaskBuffer = this.playTaskBuffer || new Ext.util.DelayedTask(function() {
			Ext.TaskMgr.start(this.playTask);
		}, this);
		this.play();		
		//前一个按钮地事件
		if(this.preid){
			Ext.fly(this.preid).on('click', function(ev) {   //点击事件
				this.pause();
				this.prev();
			}, this);
			Ext.fly(this.preid).on('mouseleave', function(ev) {  //鼠标离开事件				
				this.play();
			}, this);
		}
		//后一个按钮的事件
		if(this.nextid){
			Ext.fly(this.nextid).on('click', function(ev) {   //点击事件
				this.pause();
				this.next();
			}, this);
			Ext.fly(this.nextid).on('mouseleave', function(ev) {   //鼠标离开事件
				this.play();
			}, this);
		}
    },
    //方法：播放
    play: function() {
		if(this.playing) return;
		this.transitionDuration = this.duration;        
		this.playTaskBuffer.delay(this.interval*1000);
		this.playing = true;
	},
	//方法：暂停
    pause: function() {
		if(!this.playing) return;
        Ext.TaskMgr.stop(this.playTask);
		this.playing = false;
    },
	//方法：前一个
    prev: function() {		
		this.prevTaskBuffer = this.prevTaskBuffer || new Ext.util.DelayedTask(function() {
			this.sliding(-1);
		}, this);
		this.transitionDuration=0.5;
		this.prevTaskBuffer.delay(this.transitionDuration*1000);
    },
    //方法：后一个
    next: function() {
        this.nextTaskBuffer = this.nextTaskBuffer || new Ext.util.DelayedTask(function() {
			this.sliding(1);
		}, this);
		this.transitionDuration=0.5;
		this.nextTaskBuffer.delay(this.transitionDuration*1000);
    },   
    //方法：滑动
    sliding: function(direct) {
		if(this.index>this.carouselSize-1){
			this.index=0;
		}
		if(this.index<0){
			this.index=this.carouselSize-1;
		}
		this.offset=this.els.item(this.index).getWidth()*direct;
		var lastX=0;
		for(var i=0, x=this.index; i<this.carouselSize; i++, x++){
			if(x>this.carouselSize-1){
				x=0;
			}			
			var offsets=this.weizhi[x]-this.offset-this.fix;			
			if(i==this.carouselSize-2){
				lastX=this.weizhi[x];
			}
			if(i==this.carouselSize-1){
				var temp=x-1;
				if(temp<0){
					temp=this.carouselSize-1;
				}
				if(direct==-1){
					offsets=this.weizhi[this.index]+this.offset;
				}else{
					offsets=lastX+this.els.item(temp).getWidth()-this.offset;
				}
				this.els.item(x).setX(offsets+this.offset);
			}
			this.weizhi[x]=offsets;
			this.els.item(x).syncFx().shift({
				x: offsets,
				easing: this.transitionEasing,
				duration: this.transitionDuration,
				opacity: this.transitionOpacity
			});				
		}
		this.index=this.index+direct;
    }
});
/************************************ flash组件 *********************************************/
Ext.gzj.JsFlash = Ext.extend(Ext.util.Observable, {
	interval: 5,                  //切换时间
    transitionDuration: 2,        //特效持续时间
    transitionEasing: 'easeOut',  //运动特效类型
    itemSelector: 'img',          //项目选择符
	texiaotype: false,            //规定特性类型
	//组件的构造方法
    constructor: function(elId, config) {
        config = config || {};
        Ext.apply(this, config);
        Ext.gzj.JsFlash.superclass.constructor.call(this, config);
		this.component = Ext.get(elId);      //获取组件对象
        this.initMarkup();       //初始化组件
		if(this.size > 1) {
			this.before = 0;
			this.index = 1;
			this.flashwarp.set({
				href: this.els.item(0).getAttribute('href')
			});
			this.numbers[0].radioClass('on');
			this.titlebar.dom.innerHTML=this.els.item(0).getAttribute('title');
			for(var i=0; i<this.size; i++){
				this.play(true);
			}
            this.initEvents();   //初始化事件
        }	
    },
	//方法：初始化组件
    initMarkup: function() {
        var dh = Ext.DomHelper;		
        this.size = 0;           //元素（可以是图片，或其他html元素）的个数
		this.els=this.component.select(this.itemSelector);
		this.size=this.els.getCount();
		this.numbers = [ ];
		this.containerWidth = this.component.getWidth();
		this.containerHeight = this.component.getHeight();
		//添加容器（用于装滚动的元素）
        this.container = dh.append(this.component, {}, true);
		this.container.setStyle({
			position: 'relative',
            width: this.containerWidth + 'px',
            height: this.containerHeight + 'px',
			overflow: 'hidden'
        });
		//给flash套上一个外壳
		this.flashwarp = dh.append(this.container, {
			tag: 'a',
			cls: 'flashwarp'
		}, this);
		this.flashwarp.setStyle({
			position: 'absolute',
			display: 'block',
            width: this.containerWidth + 'px',
            height: this.containerHeight + 'px'
        });
		//给flash添加标题栏
		this.titlebar = dh.append(this.container, {
			tag: 'p',
			cls: 'titlebar'
		}, this);
		this.titlebar.setStyle({
            opacity: 0.7
        });
		//给flash添加按钮栏
		this.numberbar = dh.append(this.container, {
			tag: 'p',
			cls: 'numberbar'
		}, this);
        //将滚动的元素放入容器中,并设置容器大小等于所以滚动元素的宽度总和		
		for(var i=0; i<this.size; i++){
			this.els.item(i).appendTo(this.container);
			this.els.item(i).position('absolute', this.size-i, 0, 0);
			this.numbers[i]=dh.append(this.numberbar, {
				tag: 'a',
				html: i+1,
				href: 'javascript:void(0)'
			}, this);
		} 
    },
	//方法：初始化事件
    initEvents: function() {
		//播放事件
        this.playTask = this.playTask || {
			run: function() {
				this.play();
			},
			interval: this.interval*1000,
			scope: this
		};
		//缓冲一段时间后，开始播放
		this.playTaskBuffer = this.playTaskBuffer || new Ext.util.DelayedTask(function() {
			Ext.TaskMgr.start(this.playTask);
		}, this);
		this.playTaskBuffer.delay(this.interval*1000);
		//点击按钮事件
		for(var i=0; i<this.size; i++){
			this.numbers[i].on('click', function(ev) {
				ev.preventDefault();
				ev.getTarget().blur();
				var eltarget=Ext.fly(ev.getTarget());
				if(eltarget.hasClass('on')) return;
				this.change(eltarget.dom.innerHTML);
			}, this);
		}
    },
	//方法：切换画面
    change: function(x) {
		Ext.TaskMgr.stop(this.playTask);
		this.index=x-1;
		Ext.TaskMgr.start(this.playTask);
	},
	//方法：控制自动播放
    play: function(initial) {
		if(this.before>this.size-1){   //对要退出元素的下标进行判断
			this.before=0;
		}
		if(this.index>this.size-1){    //对要进入元素的下标进行判断
			this.index=0;
		}
		//将要退出的元素设为最上层，要进入的元素设为第二层，其他元素设为下层		
		for(var i=0; i<this.size; i++){
			if(i==this.before){
				this.els.item(i).position('absolute',3,0,0);
				this.els.item(i).show();
				continue;
			}
			if(i==this.index){				
				this.els.item(i).position('absolute',2,0,0);
				this.els.item(i).show();
				continue;
			}
			this.els.item(i).position('absolute',1,0,0);
			this.els.item(i).hide();
		}
		var num=this.texiaotype;
		if(initial){
			num=0;
		}else if(!num){
			num=Math.round(Math.random()*7);
		}		
		this.exit(this.before, num);  //对要退出的元素进行操作
		this.enter(this.index, num);  //对要进入的元素进行操作
		this.before=this.index;
		this.index++;
    },
	//方法：换出时的特效
	exit: function(x,num) {
		switch (num) {
			case 1:
				this.els.item(x).stopFx().ghost('b',{
					easing: 'bounceOut',
					duration: this.transitionDuration
				});
				break;
			case 2:
				this.els.item(x).stopFx().ghost('tr',{
					easing: 'backBoth',
					duration: this.transitionDuration
				});
				break;					
			case 3:
				this.els.item(x).stopFx().slideOut('l',{
					easing: this.transitionEasing,
					duration: this.transitionDuration
				});
				break;
			case 4:
				this.els.item(x).stopFx().slideOut('r',{
					easing: this.transitionEasing,
					duration: this.transitionDuration
				});
				break;
			case 5:
				this.els.item(x).stopFx().slideOut('t',{
					easing: this.transitionEasing,
					duration: this.transitionDuration
				});
				break;
			case 6:
				this.els.item(x).stopFx().fadeOut({
					easing: this.transitionEasing,
					duration: 1
				});
				break;
			case 7:
				this.els.item(x).stopFx().switchOff({
					easing: this.transitionEasing,
					duration: 1
				});
				break;
			default:
				this.els.item(x).stopFx().fadeOut({
					easing: this.transitionEasing,
					duration: 1
				});
		}
	},
	//方法：换入时的特效
	enter: function(x,num) {
		switch (num) {
			case 1:			   
				this.els.item(x).stopFx().slideIn('t',{
					easing: 'bounceOut',
					duration: this.transitionDuration
				});
				break;
			case 2:
				this.els.item(x).stopFx().slideIn('tr',{
					easing: 'backOut',
					duration: this.transitionDuration
				});
				break;
			case 3:
				this.els.item(x).stopFx().slideIn('r',{
					easing: this.transitionEasing,
					duration: this.transitionDuration
				});
				break;
			case 4:
				this.els.item(x).stopFx().slideIn('l',{
					easing: this.transitionEasing,
					duration: this.transitionDuration
				});
				break;
			case 5:
				this.els.item(x).stopFx().slideIn('b',{
					easing: this.transitionEasing,
					duration: this.transitionDuration
				});
				break;
			default:
				this.els.item(x).stopFx().fadeIn({
					duration: this.transitionDuration
				});
		}
		this.numbers[x].radioClass('on');     //更改当前按钮样式
		this.flashwarp.set({                  //将外壳的链接地址设为进入元素的链接地址
			href: this.els.item(x).getAttribute('href')
		});
		this.titlebar.dom.innerHTML=this.els.item(x).getAttribute('title');  //更改当前标题
	}
});

/* 用途：鼠标指向产品大类时，展开产品小类,并将收缩其他已经展开的产品大类 */
function radioClass(dt) {
	var dl=dt.parentNode;
	if(dl.className=="show"){
		dl.className="";
		return;
	}
	var dllist=dl.parentNode.getElementsByTagName("DL");
	for(var x=0; x<dllist.length; x++) {
		dllist.item(x).className="";
	}
	dl.className="show";
}
/* 切换产品图片 */
function changeimg(img){
	document.getElementById("pic_title").childNodes.item(0).nodeValue=img.alt;
	document.getElementById("currentimg").src=img.src;
}
/* 切换菜单 */
function changemenu(menu_x){
	var menu_list=menu_x.parentNode.getElementsByTagName("A");
	var meuncontent_list=menu_x.parentNode.parentNode.getElementsByTagName("DL");
	var flag;
	for(var i=0; i<menu_list.length; i++){
		if(menu_list.item(i)==menu_x){
			flag=i;
		}
		menu_list.item(i).className="";
		meuncontent_list.item(i).style.display="none";
	}
	menu_x.className="on";
	meuncontent_list.item(flag).style.display="block";
}
