(function($){
	var $el=function(tag){return $(document.createElement(tag||'div'));};
	var Tab=function(){
		this.el=$el();
		this.el.css({
			'position':'absolute',
			'opacity':1,
			'background':'black',
			'height':48,
			'width':'25%',
			'bottom': '0px',
			'margin-bottom': '-48px',
			'border':'0px solid white',
			'border-bottom':'0px',
			'cursor':'pointer'
		});
		this.initComponent();
	};	
	
	$.extend(Tab.prototype,{
		initComponent:function(){
			var textIndent='0px';
			this.title=$el();
			with(this.title){
				css({
				'margin-top': '5px',
				'margin-left':'20px',
				'color': '#437DBF',
				'font-size': '14px',
				'font-weight': 'bold',
				'text-indent': textIndent
				});
			};
			
			this.des=$el();
			with(this.des){
				css({
				    'margin-top': '-3px',
				    'margin-left': '20px',
					'font-size':'12px',
					'color':'#437DBF',
					'text-indent':textIndent
				});	
			}
			this.el.append(this.title,this.des);
		},
		setTitle:function(title){
			this.title.html(title);	
		},
		setDes:function(des){
			this.des.html(des);	
		},
		css:function(){
			this.el.css.apply(this.el,arguments);	
			return this;
		},
		cssTitle:function(){
			this.title.css.apply(this.title,arguments);
			return this;
		},
		cssDes:function(){
			this.des.css.apply(this.des,arguments);
			return this;
		},
		appendTo:function(){
			return this.el.appendTo.apply(this.el,arguments);	
		},
		click:function(){
			return this.el.click.apply(this.el,arguments);
		},
		mouseover:function(){
			return this.el.mouseover.apply(this.el,arguments);
		},
		toggleColor:function(){
			this.css({
				'background-image':'url(images/bgout.jpg)'		 
			});	
			this.title.css({
				'color':'#666666'			   
			});
			this.des.css({
				'color':'#666666'			 
			});
		}
	});
	
	var isIE6=($.browser.msie&&$.browser.version)?true:false;
	var Arrow=function(direction){
		direction=direction||'left';
		this.el=$el();
		with(this.el){
			css({
				'background':isIE6?'':'url(images/'+direction+'.png) no-repeat center',
				'position':'absolute',
				'bottom':isIE6?'10px':'20px',
				'width':'8px',
				'height':'10px',
				'cursor':'pointer'
			});
			if(isIE6){
				css('filter','progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src="images/'+direction+'.png")');	
			}
			css(direction,'10px');
		}
	};
	
	$.extend(Arrow.prototype,{
		appendTo:function(){
			return this.el.appendTo.apply(this.el,arguments);	
		},
		click:function(){
			return this.el.click.apply(this.el,arguments);	
		}
	});
	
	$.fn.HengBao=function(cfg){
		var data=cfg.data,me=this,tabMgr=new Array();
		
		var methods={
			setImg:function(i){
				this.img.attr('src',data[i].src);
			},
			run:function(i){
				if(this.isRunning)return;
				this.isRunning=true;
				(function(){
					this.toggle();
					this.controller=setTimeout($.proxy(arguments.callee,this),5*1000);
				}).call(this);
			},
			updateTab:function(index){
				$.each(tabMgr,function(i,tab){
					if(i==index)
						tabMgr[i].toggleColor();
					else
						tabMgr[i].css('background-image','url('+data[i].bgImg+')').cssTitle('color','#437DBF').cssDes('color','#437DBF');
				});
			},
			toggle:function(){
				if(this.index==data.length)this.index=0;
				var index=this.index++,
					_src=data[index].src,
					_url=data[index].url;
				
				this.updateTab(index);
				if($.browser.msie){
					with(this.img.get(0)){
						filters.revealTrans.apply();
						filters.revealTrans.Transition=Math.floor(Math.random()*23);
						setAttribute('src',_src);
						onclick=function(){if(_url)window.open(_url);};
						filters.revealTrans.play();
					}
				}else{
					if(this.isToggleing)return;
					this.isToggleing=true;
					with(this.img){
						stop().fadeOut('fast',$.proxy(function(){
						    var me=this;
							this.img.attr('src',_src).fadeIn('fast',function(){
													me.isToggleing=false;
												});
						},this));	
						get(0).onclick=function(){if(_url)window.open(_url);};
					}	
				}
			}
		};
		
		$.extend(this,methods);
		
		this.index=0;
		this.isToggleing=false;
		this.el=$el();
		this.el.css({
			'width':cfg.width,
			'position':'relative',
			'height':cfg.height
		});
		this.img=$el('img');
		this.img.css({
			'postion':'absolute',
			'top':'0px',
			'left':'0px',
			'width':'100%',
			'height':'100%',
			'filter':'revealTrans(duration=2,transition=1)'
		});
		this.setImg(0);
		this.el.append(this.img);
		$(this).append(this.el);
		$.each(data,$.proxy(function(i,d){
			var tab=new Tab();
			tabMgr.push(tab);
			with(tab){
				css({'left':cfg.width/data.length*i,'background-image':'url('+d.bgImg+')'});
				setTitle(d.title);
				setDes(d.des);
				click((function(index){
					  return function(){
						  clearTimeout(me.controller);
						  me.isRunning=false;
						  me.index=index;
						  me.run();
					  };
				})(i));
				mouseover((function(index){
					  return function(){
						  clearTimeout(me.controller);
						  me.isRunning=false;
						  me.index=index;
						  me.run();
					  };
				})(i));
				appendTo(this.el);
			}
		},this));
		
		/*this.leftArr=new Arrow();
		this.rightArr=new Arrow('right');
		this.leftArr.appendTo(this.el);
		this.rightArr.appendTo(this.el);
		this.rightArr.click($.proxy(function(){
			  clearTimeout(this.controller);
			  this.isRunning=false;
			  this.run();
		},this));
		
		this.leftArr.click($.proxy(function(){
			  clearTimeout(this.controller);
			  this.isRunning=false;
			  if(this.index<2){
				 this.index=data.length-1+(this.index-2); 
			  }else{
			  	 this.index-=2;
			  }
			  this.run();
		},this));*/
		this.run();
	};	  
})(jQuery);