/*
 
	obj.smartList = smartListWithPager({
		dataUrl:"http://music.myspace.cn/jsi.php?act=search_friend&start={K:start}&count={K:count}&kw=",
		wrapper:document.getElementById("friendSelector_friendsWrapper"),
		getBottomPager:function(){return document.getElementById("friendSelector_bottomPager");},
		header:'<ul class="clearfix">',
		repeater:'<li id="{K:UserId}"><span class="userName" title="{K:DisplayName}">{K:DisplayName}</span><br /><img class="ok" src="http://xfiles.cdnmyspace.cn/dir/music/v1/img/k_ico_select.gif" alt="" /><img class="avatar" src="{K:Image}" alt="" /></li>',
		footer:'</ul><div id="friendSelector_bottomPager" class="cnViPager bottomPager"></div>',
		emptyView:'<ul class="clearfix"><div class="isNull">没有找到符合条件的好友！</div></ul>',
		pageSize:18
	}); 
 
 */

function smartListWithPager(aoConf){
    var obj = {};
    obj.data = {};
    obj.view = {};
    obj.ctrl = {};
    obj.dom = {};
    obj.event = {};    
    
    obj.view.header = aoConf.header || "";
    obj.view.repeater = aoConf.repeater || ""; 
    obj.view.footer = aoConf.footer || "";
	obj.view.empty = aoConf.emptyView || "";
    obj.ctrl.dataUrl = aoConf.dataUrl || "";
	obj.ctrl.pageSize = aoConf.pageSize || 10;
	obj.dom.wrapper = aoConf.wrapper;
	obj.dom.getTopPager = aoConf.getTopPager;
    obj.dom.getBottomPager = aoConf.getBottomPager;
    	
	obj.pager = pager_v2({
			wrapper:aoConf.pager,
			curPage:aoConf.curPage || 1,
			pageStep:aoConf.pageStep || 5			
		});
    obj.pager.event.clickLink = function(){
        obj.buildUI();
		return !1;
    }
	
    obj.getData = getData;
    obj.buildUI = buildUI;
    return obj;
    
    function getData(asUri,afCallback){
    	var loData = obj.data[asUri];
    	if(!loData){
			CNMS.loadJsonP(asUri,action);			
    	}else{
			obj.pager.ctrl.totalPage = Math.ceil(parseInt(loData.Total) / obj.ctrl.pageSize);
			afCallback(loData.List);
			if(obj.event.getData){
				obj.event.getData(loData);
			}			
    	}
		function action(aoResp){
			var loResp = aoResp;
			obj.data[asUri] = loResp;
			obj.pager.ctrl.totalPage = Math.ceil(parseInt(loResp.Total) / obj.ctrl.pageSize);
			afCallback(loResp.List);
			if(obj.event.getData){
				obj.event.getData(loResp);
			}
		}
    }

    function buildUI(){
		var liCurRecord = (obj.pager.ctrl.curPage-1) * obj.ctrl.pageSize;
		var lsUri = smartView(obj.ctrl.dataUrl,{start:liCurRecord,count:obj.ctrl.pageSize});
		obj.getData(lsUri,action);
	    function action(axData){
			var lxData = axData;
			if(obj.formateData){
				lxData = obj.formateData(axData);
			}		
	    	if(lxData.length < 1){				
	    		obj.dom.wrapper.innerHTML = obj.view.empty;
	    	}else{
	    		obj.dom.wrapper.innerHTML = [obj.view.header,smartView(obj.view.repeater,lxData),obj.view.footer].join("");	    	
		    	if(obj.dom.getTopPager){
		    		obj.pager.dom.wrapper = obj.dom.getTopPager();
		    		obj.pager.buildUI();	
		    	}
		    	if(obj.dom.getBottomPager){
		    		obj.pager.dom.wrapper = obj.dom.getBottomPager();
		    		obj.pager.buildUI();
		    	}			
			}
	    	  
	        if(obj.modifyUI){
	    		obj.modifyUI();
	    	}
	    	if(obj.event.buildUI){
	    		obj.event.buildUI();
	    	}			
	    }
    }    
	function smartView(asHTML, axData){
	    var lxLeft = asHTML.split("{K:");
	    var lxHTML = [];
	    if(!axData){
	    	return false;
	    }
		if(axData.constructor != Array){
			if(axData.constructor == Number){
				var liIndex = axData;
				axData = [];				
				axData[liIndex - 1] = {};
			}else{
				axData = [axData];	
			}
		}
	    for (var i = 0; axData && i < axData.length; i++) {
	        for (var j = 0; j < lxLeft.length; j++) {
	            var lsProp = lxLeft[j].substring(0, lxLeft[j].indexOf("}"));
	            if (lsProp != "") {
	            	if(lsProp == "k"){            		
	            		lxHTML[lxHTML.length] = i;
	                	lxHTML[lxHTML.length] = lxLeft[j].substring(lxLeft[j].indexOf("}") + 1);
	            	}else{
	            		lxHTML[lxHTML.length] = axData[i][lsProp];
	                	lxHTML[lxHTML.length] = lxLeft[j].substring(lxLeft[j].indexOf("}") + 1);
	            	}
	               
	            }
	            else {
	                lxHTML[lxHTML.length] = lxLeft[j];
	            }
	        }
	    }
	    return lxHTML.join("");
	}

	function pager_v2(aoConf){
	    var obj = {};
	    if(!aoConf){
	    	aoConf = {};
	    }
	    obj.dom = {wrapper:aoConf.wrapper};
	    obj.dom.getLinks = function(){
	    	return obj.dom.wrapper.getElementsByTagName("a");
	    }
	    obj.ctrl = {};
		obj.ctrl.curPage = aoConf.curPage || 1;
		obj.ctrl.totalPage = aoConf.totalPage || 20;
		obj.ctrl.pageStep = aoConf.pageStep || 5;
		obj.ctrl.href = aoConf.href || "?page=";
		
		obj.event = {};
		obj.event.clickLink = function(){
			obj.buildUI();
			return !1;
		};
		obj.event.buildUI = function(){
			obj.listen();
		};		
		obj.listen = listen;
		obj.buildUI = buildUI;
	    return obj;
	    

	    function listen(){	    
	    	var lxLinks = obj.dom.getLinks();
	        for (var i = 0; i < lxLinks.length; i++) {
	            var leA = lxLinks[i];
	            switch (leA.innerHTML) {
	                case "首页":
	                    leA.onclick = clickLinkHandler(leA, "first");
	                    break;
	                case "上一页":
	                    leA.onclick = clickLinkHandler(leA, "prev");
	                    break;
	                case "下一页":
	                    leA.onclick = clickLinkHandler(leA, "next");
	                    break;
	                case "末页":
	                    leA.onclick = clickLinkHandler(leA, "last");
	                    break;
	                default:
	                    leA.onclick = clickLinkHandler(leA, "mid");
	            }
	        }
		    function clickLinkHandler(aeA, asType){
		        return function(){
		            switch (asType) {
		                case "first":
		                    obj.ctrl.curPage = 1;
		                    break;
		                case "prev":
		                    --obj.ctrl.curPage;
		                    break;
		                case "mid":
		                    obj.ctrl.curPage = parseInt(aeA.getAttribute("title"))
		                    break;
		                case "next":
		                    ++obj.ctrl.curPage;
		                    break;
		                case "last":
		                    obj.ctrl.curPage = obj.ctrl.totalPage;
		                    break;
		            }
		            return obj.event.clickLink();
		        }
		    }
	    }
	    function buildUI(){
	        var liStart = obj.ctrl.curPage - Math.floor(obj.ctrl.pageStep / 2);
	        var liEnd = obj.ctrl.curPage + Math.floor((obj.ctrl.pageStep + 1) / 2) - 1;		
	        if (liStart >= 1) {
				if (liEnd > obj.ctrl.totalPage) {
	                liEnd = obj.ctrl.totalPage;
	                liStart = liEnd - obj.ctrl.pageStep + 1;
	                liStart = liStart > 0 ? liStart : 1;
	            }
	        }
	        else {
	            liStart = 1;
	            liEnd = liStart + obj.ctrl.pageStep - 1;
	            liEnd = liEnd <= obj.ctrl.totalPage ? liEnd : obj.ctrl.totalPage;
	        }
	        var lxHTML = [];
	        lxHTML.push(['<a href="' , obj.ctrl.href , '1' , '" title="',1,'">首页</a><span>|</span><a href="' , obj.ctrl.href , (obj.ctrl.curPage - 1) , '" title="',(obj.ctrl.curPage - 1),'">上一页</a>'].join(""));
	        lxHTML.push('<span>|</span>');
	        for (var i = liStart; i <= liEnd; i++) {
	            if (i == obj.ctrl.curPage) {
	                lxHTML.push('<label>' + i + '</label>');
	            }
	            else {
	                lxHTML.push(['<a href="' , obj.ctrl.href , i , '" title="', i ,'">' , i , '</a>'].join(""));
	            }
	            lxHTML.push('<span>|</span>');
	        }
	        lxHTML.push(['<a href="' , obj.ctrl.href , (obj.ctrl.curPage + 1) , '" title="',(obj.ctrl.curPage + 1),'">下一页</a><span>|</span><a href="' , obj.ctrl.href , obj.ctrl.totalPage , '" title="',obj.ctrl.totalPage,'">末页</a>'].join(""));
	        
	        if (obj.ctrl.curPage == 1) {
	            lxHTML.shift();
	        }
	        if (obj.ctrl.curPage == obj.ctrl.totalPage) {
	            lxHTML.pop();
	        }
			
	        obj.dom.wrapper.innerHTML = lxHTML.join("");
	        obj.event.buildUI();
	    }  
	}	  
}