/******************************
*                             
*   Name:     bannerShow         
*   Author:   Aken li           
*   Date:     2008.07.28   
*   Modified: 2009.01.08
*   Blog:     www.kxbd.com      
*                             
******************************/
var bannerShow = Class.create();
bannerShow.prototype = {
	initialize:function(id,option){
		this.id = id;
		this.option = Object.extend({event:"click",dur:0.4,interval:5,type:0,className:'on',showNav:true,hasNav:false}, option || {});
		this.event = this.option.event;//鼠标事件
		this.dur = this.option.dur; //动画变化时间
		this.type = this.option.type; //动画变化类型
		this.interval = this.option.interval;//间隔时间
		this.intervarID;
		this.isShowNum = 0;//当前显示图片
		this.obj = $(id);
		this.nav = this.option.hasNav ? this.obj.down() : this.obj.insert({top:new Element('div')}).down();//导航
		this.mains = this.nav.next().childElements();//banners
		this.imgAllNum = this.mains.length;
		this.render();
		this.init();
	},

	init:function() {
		this.start();
		this.obj.observe('mouseover',this.stop.bind(this));
		this.obj.observe('mouseout',this.start.bind(this));
	},

	render:function() {
		this.renderNav();
		this.mains.each(function(o,i){
			if(i){
				o.hide();
			}
		});
	},
	
	renderNav:function(){
		if(!this.option.showNav) this.nav.hide();
		if(!this.hasNav){
			var bannerNavInner="<ul>";
			for (var i=1;i<=this.imgAllNum ;i++ ){
				bannerNavInner += "<li>"+i+"</li>";
			}
			bannerNavInner+="</ul>";
			this.nav.update(bannerNavInner);
		}
		this.navs = this.nav.down().childElements();
		this.navs.each(function(o,i){
			o.observe(this.event,this.changeBanner.bind(this,i,false,true));
		}.bind(this));
		this.navs[0].addClassName('on');
	},

	start:function() {
		if(!this.intervarID) {
			this.intervarID = new PeriodicalExecuter(this.changeBanner.bind(this,this.isShowNum,true,true), this.interval);
		}
	},

	stop:function() {
		if(this.intervarID){
			this.intervarID.stop();
			this.intervarID = 0;
		}
	},

	toggle:function() {
		this.intervarID?this.stop():this.start();
	},

	next:function() {
		this.stop();
		this.changeBanner(this.isShowNum,true,true);
		this.start();
	},

	prev:function() {
		this.stop();
		this.changeBanner(this.isShowNum,true,false);
		this.start();
	},

	setInterval:function(interval) {
		this.interval = interval;
		this.stop();
		this.start();
	},

	changeBanner:function(i,isAuto,isNext) {
		if (!isAuto && this.isShowNum==i){
			return;
		}
		this.navs[this.isShowNum].removeClassName(this.option.className);
		this.hideImg(this.mains[this.isShowNum],this.dur);
		isAuto ? (isNext?this.isShowNum++:this.isShowNum--) : this.isShowNum = i;
		if (this.isShowNum == this.imgAllNum){
			this.isShowNum = 0;
		}
		if (this.isShowNum < 0){
			this.isShowNum = this.imgAllNum-1;
		}
		this.navs[this.isShowNum].addClassName(this.option.className);
		this.showImg(this.mains[this.isShowNum],this.dur);
	},

	showImg:function(element,dur) {
		element.appear({duration: dur});
	},

	hideImg:function(element,dur) {
		//element.fade({duration: dur});
		element.hide();
	}
};