factionswapper

/**
 * @author longxiao.fq
 * @date 2011 02 12
 * FactionSwapper 帮派插件组件
 */
;(function(){
	TShop.add('mods~FactionSwapper',function(){
		
		TShop.mods.FactionSwapper=function(){
			var S = KISSY, DOM = S.DOM, doc = document, el , overTime=5000,__callback, elNode = "#J_ShopBangPaiWidget";
			/*
			 * Config 配置信息
			 */
				var _Config={
						jsonp:'js/test32.php',
						attached:{
							callback:'TShop.mods.FactionSwapper.Callback'
						}
					};
				
					/*
					 * StoreData - 初始化Swapper对象时进行sever端信息的获取，并过滤处理数据，储存并为渲染提供接口
					 * 
					 * jsonp约定格式：
					 * status : 正常输出内容返回success(Data不为空)，否则都返回fail+errormsg(Data为空)
					 * 
					 * ?({
					 * "respond":{"status":"success|fail",errormsg:"如果失败，返回错误信息"},
					 * "data":{
					 *    "activity":[{
					 *       "type":"activity", //后期可能加入 SecKill， group purchase等
					 *       "url":"此活动的直接链接", //返回完整URL或者片段
					 *       "imgurl":"活动图片url",
					 *       "title":"标题",
					 *       "remaintime":"毫秒" //自己根据秒数折算
					 *       "applynum":"56",//报名人数
					 *     }],
					 *    "invitation":[{
					 *    	"title":"帖子标题",
					 *      "url":"帖子地址URL",
					 *      "type":"vote|normal", //投票|普通贴
					 *      "author":"作者",
					 *      "status":"1578/1213",
					 *      "time":"2010-12-11"
					 *    }],
					 *    "publishURL":"#",
					 *	  "joinURL":"#",
					 *	  "moreURL":"#"
					 * }
					 * })
					 * 
					 * */
				
					var _StoreData={
						/*取得jsonp数据*/	
						getData:function(){
						/*如果规定时间jsonp未返回正确的callback，则按照超时处理5000毫秒*/
							var T=setTimeout(function(){
								
								FactionSwapper.Callback=function(){}; //清除回调
								
								_DrawView.loadingBarDraw('数据加载超时,<a href="#" onclick="FactionSwapper.reload();return false;">请重试</a>'); //加载loading条
								
								S.log('访问jsonp地址超时:超时时间'+overTime,'warn');
								
							},overTime);
							S.getScript(_Config.jsonp,function(){
								clearTimeout(T);
							});
						},
						/*保存当前数据展示模式*/
						respond:null,
						/*储存活动异步数据与对应非异步数据*/
						activityData:{},
						/*储存帖子列表异步数据与对应非异步数据*/
						invitationData:{},
						footBarData:{},
						/*初始化StoreData对象*/
						init:function(Data){
							S.log('返回的jsonp对象','info');
							S.log(Data,'dir');
							_StoreData.respond=Data.respond;
							bacthInit={
								//成功状态	
								success:function(){
									var detailData=Data.data;
									
									_StoreData.activityData=detailData.activity;
									
									_StoreData.invitationData=detailData.invitation;
									
									_StoreData.footBarData={
										publishURL:detailData.publishURL,
										joinURL:detailData.joinURL,
										moreURL:detailData.moreURL
									}
									return 'success';
								},
								//有错的状态
								fail:function(){
									_DrawView.loadingBarDraw(Data.respond.errormsg);
									return 'fail';
								}
							};
							return bacthInit[_StoreData.respond.status]();
						}
					};
					
					/*
					 * DrawView 进行绘制对应的展示区域HTML模版，并负责将StoreData中的数据进行充填
					 */
					var _DrawView={
						/*模版数据转换操作*/
						putOutHtml:function(data,Strhtml,type){
							var self=this,
								returnStr="";
							S.each(data,function(obj,j){
								
								if(j==data.length-1) Strhtml=Strhtml.replace('{last}','class="last"');
								
								if(obj.hasOwnProperty('remaintime')) obj.remaintime=self.timeShift(obj.remaintime);

								S.mix(obj,self[type][obj.type]);
								
								returnStr+=S.substitute(Strhtml, obj);
							});
							S.log(DOM.create(returnStr));
							return DOM.create(returnStr);
						},
						/*活动模版*/
						timeShift:function(date){
							/*date 为毫秒数 var date=1297961039550-1297760948344;*/
							var returnStr;
							var timeObj={
								day:date/(1000*60*60*24),
								hour:date/(1000*60*60),
								min:date/(1000*60),
								sec:date/1000
							}
							var Cnunit={
								day:'天',
								hour:'小时',
								min:'分',
								sec:'秒'
							}
							
							for(var i in timeObj){
								var temp=parseInt(timeObj[i]);
								if(temp!=0){
									returnStr = "<em>"+temp+"</em>"+Cnunit[i];
									break;
								}
							}
							return returnStr;
						},
						activityType:{
							activity:{name:'活动',action:'立即参加'},
							SecKill:{name:'秒杀',action:'立即秒杀'}
						},
						activityDraw:function(data){
							var	self=this,
								Strhtml='<dl {last}>'+
								    		'<dt>'+
								    			'<div class="pic">'+
									    			'<a href="{url}" target="_blank"><img src="{imgurl}" alt="{title}" title="{title}"></a>'+
													'<span>{name}</span>'+
												'</div>'+
											'</dt>'+
											'<dd class="title"><a href="{url}">{title}</a></dd>'+
											'<dd>活动结束：还剩 {remaintime}</dd>'+
											'<dd>报名人数：<em>{applynum}</em> 人</dd>'+
											'<dd class="last"><a href="{url}" class="button">{action}</a></dd>'+
								    	'</dl>';
							
							el.appendChild(self.putOutHtml(data,Strhtml,'activityType'));
						},
						/*帖子模版*/
						invitationType:{
							vote:{cls:'vote'},
							normal:{cls:'invitation'}
						},
						invitationDraw:function(data){
							var self=this,
								Strhtml='<li {last}>'+
											'<i class="{cls}"></i><a href="{url}" class="title">{title}</a>'+
											'<a href="{url}" class="author">{author}</a>'+
											'<em class="examine">{status}</em>'+
											'<em class="time">{time}</em>'+
										'</li>';
							var UL=DOM.create('<ul>');
							
							UL.className="newlists";
							UL.appendChild(self.putOutHtml(data,Strhtml,'invitationType'));
							el.appendChild(UL);
						},
						/*footbar模版*/
						footBarDraw:function(data){
							var Strhtml='<div class="foot-bar">'+
									'<a href="{publishURL}" target="_blank" class="button">发表新帖</a>'+
									'<a href="{joinURL}" target="_blank" class="button">加入帮派</a>'+
									'<a href="{moreURL}" target="_blank" class="button more">查看更多&gt;</a>'+
								'</div>';
							
							var footbar=DOM.create(S.substitute(Strhtml, data));
							S.log(footbar);
							el.appendChild(footbar);
						},
						/*loading bar*/
						loadingBarDraw:function(msg){
							
							DOM.addClass(el,'bangpai-load');
							
							el.innerHTML="";
							
							el.appendChild(DOM.create(msg));
						},
						init:function(){
							var self=this;
							el.innerHTML="";
							DOM.removeClass(el,'bangpai-load');
							self.activityDraw(_StoreData.activityData);
							self.invitationDraw(_StoreData.invitationData);
							self.footBarDraw(_StoreData.footBarData);
						}
					};

					
					/* 
					 * 对外公开方法
					 * version 1.0.1
					 */
					
					return{
						
						version: '1.0.1',
						/*
						 * 重新加载数据，在error情况下使用，允许外部调用
						 */
						
						reload:function(){
							FactionSwapper.Callback=__callback;
							
							_StoreData.getData();
						},
						
						Callback:function(Data){
							//当前状态
							var Status=_StoreData.init(Data);
							
							if(Status=='fail'){
								S.log('当前为fail状态，只输出loadingbar和errormsg','warn');
								return; 
							}
							
							S.log('当前为success状态,数据已经保存至_StoreData','info');
							
							_DrawView.init();
							
							S.log('HTML模版填充输出完成','info');
						},
						/*
						 * 提供外部初始化
						 */
						init:function(cfg){
							var self=this;
							
							cfg = cfg || {};
							
							el=DOM.get(elNode); //获取钩子
							
							if(!el) return S.log('Swapper初始化失败','warn'); //不存在钩子，中断组件
							
							cfg['groupId']=DOM.attr(elNode,'data-groupID'); //指定绑定帮派ID
							
							cfg=S.mix(cfg,_Config.attached);
							
							_Config.jsonp=_Config.jsonp + "?" + S.param(cfg);
							
							S.log('请求jsonp地址为'+_Config.jsonp,'info');
							
							__callback=self.Callback;
							
							_StoreData.getData(); //开始获取数据
							
						}
					};
		}();
	});
})();