/*//. the new javascript ajax blog explorer. .//*/

var bUserBlog = {

	userID:1,
	
	listConstruct: null,
	listCurPage: 1,
	listPageCount: 10,
	listPerPage: 10,

	init: function(uid,element,remote) {
		var prefix = this.listConstruct = bCommon.jqid(element,false);
		var container = jQuery(bCommon.jqid(element,true)).get(0);
		var div;
		var binder;
		
		if(!container) return;
		
		this.userID = uid;
		
		if((remote & 1) == 1) {
			div = document.createElement('div');
			div.className = prefix + '-remote';
			container.appendChild(div);
		}

		binder = div = document.createElement('div');
		div.id = prefix + '-binder';
		container.appendChild(div);
		
		div = document.createElement('div');
		div.className = prefix + '-page';
		binder.appendChild(div);

		if((remote & 2) == 2) {
			div = document.createElement('div');
			div.className = prefix + '-remote';
			container.appendChild(div);
		}
		
		this.getList(1);

		return;
	},
	
	getList: function(step) {
		jQuery.get(
			'/ai/user-blog-list.api/' + getTime(),
			{ 'user':this.userID, 'page':this.listCurPage, 'limit':this.listPerPage },
			function(json){ bUserBlog.getListRecv(json,step); },'json'		
		);
	},
	
	getListRecv: function(json,step) {
	
		var a;
		var html = '';
		var div;

		this.listPageCount = json.pageCount;

		//. building the post list.
		jQuery(json.list).each(function(){
			html += '<div class="blog-box blog-box' + ((a % 2)?(2):(1)) + '">'+
				'<h3><a href="' + this.url + '">'+this.title + '</a></h3> '+
				'<p>' + this.summary + '</p>'+
				'<div class="post-stat">'+
				'<div class="lfloat">' + this.date + ' (' + this.timeAgo + ')'+
					' &bull; ' + this.comments + ' comment' + ((this.comments == 1)?(''):('s')) + '</div>'+
				'<div class="rfloat"><a href="' + this.url + '">Read More...</a></div>'+
				'</div>'+
				'</div>';					
		});
		
		div = document.createElement('div');
		div.className = bUserBlog.listConstruct + '-page';
		jQuery(div).html('<ul>' + html + '</ul>').css({'display':'none'});
		
		var binder = 'div#' + this.listConstruct + '-binder';
		var pageclass = 'div.' + this.listConstruct + '-page';  			
		
		jQuery(binder).append(div);

		/*//. animation block. .//*/
		//. (1) first slide the currently visible page off the binder viewport.				
		jQuery(binder + ' ' + pageclass + ':visible')
		.hide('slide',{'direction':((step > 0)?('left'):('right'))},500)
		.queue(function(){
			jQuery(this).remove();
			
			//. (2) slide resize the binder to accomdate the current page size.
//			jQuery(binder)
//			.animate({'height':jQuery(binder + ' ' + pageclass + ':hidden').height()},200)
//			.queue(function(){
			
				//. (3) then slide the new page into view.
				jQuery(binder + ' ' + pageclass + ':hidden')
				.show('slide',{'direction':((step > 0)?('right'):('left'))},500);							
//			});
		});
		/*//. end animation .//*/
		
		this.updateListRemote();
		
		return;
	},
	
	updateListRemote: function() {

		var html = '';

		//. the left floating slider controls.
		html = '<div style="float:left"><img src="/style/blogster/gfx/arrow-first' + ((this.listCurPage == 1)?('-off'):('')) +
			'.png" alt="|&laquo;" onclick="javascript:bUserBlog.iterListPage(-1,1);" /> ' +
			'<img src="/style/blogster/gfx/arrow-back' + ((this.listCurPage == 1)?('-off'):('')) +
			'.png" alt="&laquo;" onclick="javascript:bUserBlog.iterListPage(-1,0);" />'+				
			'Page ' + this.listCurPage + ' of ' + this.listPageCount +			
			'<img src="/style/blogster/gfx/arrow' + ((this.listCurPage == this.listPageCount)?('-off'):('')) +
			'.png" alt="&raquo;" onclick="javascript:bUserBlog.iterListPage(1,0);" />' +
			'<img src="/style/blogster/gfx/arrow-last' + ((this.listCurPage == this.listPageCount)?('-off'):('')) +
			'.png" alt="&raquo;|" onclick="javascript:bUserBlog.iterListPage(1,1);" /></div>';
		//. end left


		
		//. the right floating jump panel.	
		var jumper = '';		
		var jstart = this.listCurPage - 3;
		var jstop = this.listCurPage + 3;
		
		if(jstart < 1) jstart = 1;
		if(jstop > this.listPageCount) jstop = this.listPageCount;
		
		for(var a = jstart; a <= jstop; a++) {
			if(a == this.listCurPage) jumper += ' <span class="pagenum curpage">' + a + '</span> ';
			else jumper += ' <span class="pagenum">' + a + '</span> ';
		}
		
		html += '<div style="float:right;">'+
			'&nbsp;<input type="button" class="pagejumpstart" value="Jump..." />'+
			'<input style="display:none;" class="pagejump" type="text" value="' + this.listCurPage + '" size="3" />'+
			'</div>';
		html += '<div style="float:right;">' + jumper + '</div>';
		//. end right floating jump contorl.
		
		
		html += '<div style="clear:both;"></div>';
		
		jQuery('div.' + this.listConstruct + '-remote')
			.html(html)
			.find('img')
			.css({'cursor':'pointer'});

		jQuery('div.' + this.listConstruct + '-remote')
			.find('span.pagenum')
			.css({'cursor':'pointer'})
			.click(function(){ bUserBlog.iterListPage(jQuery.trim(jQuery(this).text()),2); });

		jQuery('div.' + this.listConstruct + '-remote')
			.find('input.pagejumpstart')
			.click(function(){ jQuery('input.pagejumpstart:first').hide(); jQuery('input.pagejump:first').show().focus().select(); });

		jQuery('div.' + this.listConstruct + '-remote')
			.find('input.pagejump')
			.keypress(function(e){ if(e.keyCode == 13) bUserBlog.iterListPage(jQuery.trim(jQuery(this).val()),2); });
			
		return;	
	},
	
	iterListPage: function(step,full) {
		step = parseInt(step);
		
		//. stop if on the first or last page depending on which way
		//. we are going. good so we don't have to decide which signals
		//. to connect all the time depending on current circumstances.
		if(this.listCurPage == 1 && step < 0) return;
		else if(this.listCurPage == this.listPageCount && step > 0) return;
		
		if(full == 0) {
			this.listCurPage += step;
		} else if(full == 1) {
			if(step == -1) this.listCurPage = 1;
			else if(step == 1) this.listCurPage = this.listPageCount;
		} else if(full == 2) {
			if(step > this.listPageCount) return;
			if(step < 1) return;
			
			this.listCurPage = step;
		}
		
		this.getList(step);
		
		return;
	}
	
	

};