/**
* trs web 1.0 // 2012.04.28 // jquery 1.1.2+
* <http://www.magic0115.com>
* 
* @author    maigc < shao.guangqi@trs.com.cn>
*/
(function($){
	/**
	*	simple tab switch
	*	example $("[rel=itab]").tab('[rel=ipad]','content2_right2_1_1ulli1','content2_right2_1_1ulli2');
	*	@param padselector //jquery selector
	*	@currclass	//	css class
	*	@otherclass // css class
	**/ 	  
	$.fn.tab = function(padselector,currclass,otherclass,isclick){
		var tabs = $(this);
		tabs.css({cursor:'pointer'})
		var pads = $(padselector);
		pads.not(':eq(0)').hide();
		function over(){
			var currtab = $(this);
			var at = tabs.index(currtab);
			var curpad = pads.eq(at);
			currtab.removeclass(otherclass).addclass(currclass);
			tabs.not(currtab).removeclass(currclass).addclass(otherclass);
			curpad.show();
			pads.not(curpad).hide();
		}
		if(tabs.size() ==  pads.size() ){
			if(isclick){
				tabs.click(over);
			}else{
				tabs.hover(over,function(){});
			}
		}
	}
	
	
	
	/**
	*	then hover element and change it's style class
	*	example $('[rel=chnllist] li').hoverclass('content2_left1li1','content2_left1li2');
	*	@param overclass	//css class when over 
	*	@param outclass	//css class when out
	**/
	$.fn.hoverclass = function(overclass,outclass,onlyover){
		$(this).css({cursor:'pointer'});
		var curobjs = $(this);
		var both = !(onlyover || false); 
		
		both && $(this).hover(function(){
			var curobj = $(this);
			curobj.removeclass(outclass).addclass(overclass);
		},function(){
			var curobj = $(this);
			curobj.removeclass(overclass).addclass(outclass);
		});
		onlyover && $(this).hover(function(){
			var curobj = $(this);
			var otherobjs = curobjs.not(curobj);
			curobj.removeclass(outclass).addclass(overclass);
			otherobjs.removeclass(overclass).addclass(outclass);
		},function(){});
	};
	$.fn.link = function(selector){
		$(this).eq(0).data("linkobj",$(selector))
		return this;	
	}
	$.fn.cascadeclass = function(overclass,outclass,eventname){
		var linkobjs = $(this).eq(0).data("linkobj");
		if(linkobjs && eventname){
			var curobjs = $(this);
			curobjs[eventname](function(){
				var curobj = $(this);
				var at = curobjs.index(curobj);
				var curlinkobj = linkobjs.eq(at)
				var otherlinkobjs = linkobjs.not(curlinkobj);
				curlinkobj.removeclass(outclass).addclass(overclass);
				otherlinkobjs.removeclass(overclass).addclass(outclass);
			});
		}
	}
	
	
	/**
	*	then over element and change it's style class
	*	example $('[rel=chnllist] li').overclass('content2_left1li1','content2_left1li2');
	*	@param overclass	//css class when over 
	*	@param outclass	//css class when out
	**/
	$.fn.overclass = function(overclass,outclass){
		var allobjs = $(this);
		$(this).css({cursor:'pointer'});
		$(this).hover(function(){
			$(this).removeclass(outclass).addclass(overclass);
			allobjs.not(this).removeclass(overclass).addclass(outclass);
		},function(){ });
	};
	
	
	/**
	*	flash ??????
	*	example use it in web html
	*	@warn it's nested a flash file that you could find it in it's package ${root_path}images/flash01.swf 
	*	var pics = [],links = [],texts = [];
	*	<trs_documents id="chnlid" num=6 where="wcmdocument.attachpic=1">
	*		pics.push('<trs_appendix  field=_recurl mode=all index=0 upload=true/>');
	*		links.push('<trs_document field=_recurl target=_blank/>');
	*		texts.push('<trs_document field=doctitle autocolor=false autolink=false num=50/>');
	*	</trs_documents>
	*	$('[rel=imgflashcontainer]').switchimg(flashcfg);
	*		@param	cfg{{
	*		pics	: pics ,//pic url
	*		links	:	links ,//doc url
	*		texts	:	texts,//title
	*		focus_width 	: 242 , //pic width
	*		focus_height	:	145 ,//pic height
	*		text_height	: 25//title height
	*	}}
	**/
	$.fn.switchimg = function(cfg){
		//????????
		with(cfg){
			cfg.pics = (pics||[]).join('|');
			cfg.links= (links||[]).join('|');
			cfg.texts= (texts||[]).join('|');
			cfg.data = 'pics='+pics+'&links='+links+'&texts='+texts+'&borderwidth='+
				focus_width+'&borderheight='+focus_height+'&textheight='+text_height;
			cfg.swf_height	=	focus_height+text_height
		}
		var codebase = 'http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0';
		var pluginspage = 'http://www.macromedia.com/go/getflashplayer';
		var objflash = cfg.$root_path || './images/flash01.swf';
		var option = {
			codebase	: 'http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0',
			pluginspage	: pluginspage ,
			objflash	: objflash 
		};
		cfg = $.extend({},option,cfg);
		with(cfg){
			var picflashhtml = ['<object ',
					'classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="'+codebase+'" ',
					'width="'+ focus_width +'" height="'+ swf_height +'">',
					'<param name="allowscriptaccess" value="samedomain">',
					'<param name="movie" value="'+objflash+'">',
					'<param name="quality" value="high"><param name="bgcolor" value="#f0f0f0">',
					'<param name="menu" value="false"><param name=wmode value="opaque">',
					'<param name="flashvars" value="'+data+'">',
					'<embed src="'+objflash+'" wmode="opaque" ',
					'flashvars="'+data+'" menu="false" bgcolor="#f0f0f0" quality="high" width="',
						focus_width +'" height="'+ swf_height ,
					'allowscriptaccess="samedomain" ',
					'type="application/x-shockwave-flash" pluginspage="'+pluginspage+'" />',
			'</object>'];
		}
		var container = $(this);
		var picflash = $(picflashhtml.join(''));
		$('> img',container).replacewith(picflash);
		//$(picflashhtml.join('')).appendto(container);
	};
	/**
	*	delay execute a function
	*	example $.deplay(100,function(){console.info('hello')})
	*	@param int // int/ms  // time  1000ms = 1s
	*	@param callback	// function	//
	**/
	$.delay = function(int,callback){
		var env = this;
		env.callback = callback || new function();
		env.arg = array.prototype.slice.apply(arguments,[0,arguments.length]);
		env.timerid = window.settimeout(function(){
			env.callback();
		},int);
		return env.timerid;
	}
	/**
	*	stop delay function
	*	example	$.$stop([timerid])
	*	@param timerid	//int	
	**/
	$.$stop = function(timerid){
		var env = this;
		var timerid = timerid || env.timerid;
		window.cleartimeout(timerid);
	}
	/**
	*	when you execute $.$stop and you could execute $.start() start it
	*	example $.start()
	**/
	$.start = function(){
		var env = this;
		$.delay.apply(null,env.arg);
	}
	/**
	*	like switchimg and it's nested a style file(trs_web.css) and same html section
	*	@html section
	*	<div class="outfrm">
	*		<div class="mainimgfrm">
	*		<a href="<trs_documents id='??????' num='1'><trs_document field='_recurl'/></trs_documents>" target="_blank">
	*			<img src="<trs_documents id='??????' num='1'>
	*					<trs_appendix mode=pic index=0 field='_recurl' upload='true' />
	*					</trs_documents>" width="313" height="200" />	
	*		</a>			
	*		</div>
	*		<ul class="sequence">
	*			<!-- data	-->                
	*			<trs_documents id="??????" num="5"  where="wcmdocument.attachpic=1">
	*			<li class="num" img="<trs_appendix mode=pic index=0 field='_recurl' upload='true' />" 
	*				title="<trs_document field='doctitle' num=40 autolink=false autocolor=false />" 
	*				link="<trs_document field='_recurl'  />"><trs_rowno />
	*			</li>	
	*			</trs_documents>
	*		</ul>
	*		<span style="display:block;"><a href="#" name="title" target="_blank" class="title">???????</a></span>            
	*	</div> 
	*	@param var cfg = {
	*		img_w:313,	//show img width
	*		img_h:200,	//how img height
	*		intrl0 : 1000,	//change one img used
	*		isfit : false,	//auto fit image size
	*		delay : 3000	//the time between two img switch
	*	};
	*	example	$("div[class=outfrm]").scrollimg(cfg);
	**/
	$.fn.scrollimg = function(config){
		//defults options
		var defaults = {
			img_w:313,//?????????
			img_h:200,//?????????
			intrl0 : 1000,
			showfn : "fadein",
			hidefn : "fadeout",
			isfit : false,
			delay : 3000
		};
		var q = this;
		q.mainimgfrm = q.find("div[class=mainimgfrm]");//???
		q.img =  q.find("div[class=mainimgfrm] img");//???
		q.title =  q.find("a[name=title]");//???? 
		q.sequence = q.find("ul[class=sequence] li");//????????
		$.extend(q,config,defaults);
		
		with(q){
			q.sq1 = sequence.eq(0);//???????????????
			q.num = sequence.size();
			q.css({position:'relative',padding:'0px',margin:'0px'});
			q.width(img_w).height(img_h+27);
			q.mainimgfrm.width(img_w).height(img_h+2).css({'line-height':img_h+2+"px"});
			img.width(img_w).height(img_h);
			img.changeimg = function changeimg(sq,callback){//?????
				var call = callback || new function();
				with(q){
					img[hidefn](intrl0,function(){//???????????
						title.html(sq.attr("title"))//??i????
						title.attr("href",sq.attr("link"));//??i????
						title.attr("title",sq.attr("title"));//??i???
						img.attr("src",sq.attr("img"));//??i?????
						//console.info(sq.attr("img"));
						sequence.not(sq).removeclass("over");//???????
						sq.addclass("over");//???????
						if(isfit) img.fit(img_w,img_h,1000);//?????????
						img[showfn](intrl0,function(){call();});//???
					});
					return img;
				}
			}
			q.sequenceshow = function sequenceshow(at){//?????
				//if(!jquery.fx.off){}
					with(q){
						var _at = at || 0;
						++_at;
						//console.info("at:="+at);
						$.delay.apply(q,[delay,function(){
							img.changeimg(sequence.eq((_at%num)),function(){sequenceshow(_at)});
						}])
						//img.delay(delay).changeimg(sequence.eq((_at%num)),function(){sequenceshow(_at)});
					}
				
			}
			img.changeimg(q.sq1);
			if(sequence && sequence.size()<=1) return ;//??????????????
			
			//window.img = img;
			sequence.click(function(){//?????????
				jquery.fx.off=true;
				//cleartimeout(timeid);
				$.$stop.apply(q,[]);
				img.show();
				img.changeimg($(this));
				img.at = sequence.index(this);
				//console.info(at);
			}).hover(function(){//?????????,????????
				jquery.fx.off=true;
				$.$stop.apply(q,[]);
				img.show();
				img.changeimg($(this));
				img.at = sequence.index(this);
			},function(){
				jquery.fx.off=false;
				$.start.apply(q,[]);
				//q.sequenceshow(img.at);
			});
			q.sequenceshow();
		}
	};
		
})(jquery);