uutuu.Namespace("uutuu.App");

uutuu.App.FotologPicShow = uutuu.Class({
	name: "uutuu.App.FotologPicShow",
	construct: function() {
		this.flogData = [];
		this.comments = {};
		this.last_nids = [];
		this.c_index = 0;
		this.current_page = 1;
		this.gotoStart = false;
		this.showComplete = true;
		this.hidePopStatus = {};
		this.old_page_size = 0;
		this.options = {
			'paginationInfoUp' : null,
			'paginationBlockUp' : null,
			'viewModeImageElem' : null,
			'viewModeImages' : [],
			'viewModeEntry' : null,
			'current_mode' : 'medium',
			'loadingPhotos' : null,
			'flogdivs' : [],
			'paginationInfoDown' : null,
			'paginationBlockDown' : null,
			'showCommentsEntry' : null,
			'doCommentEntry'	: null,
			'largeModeTpl' : '',
			'smallModeTpl' : '',
			'page_size'	: 20,
			'defaultNickname' : 'Visitor',
			'commentBackBase' : '',
			'isme' : false,
			'advancedop' : false,
			'noGeotag' : '',
			'init_page' : 1,
			'isfeature' : false
		};
	},
	methods: {
		setOptions: function(options) {
			for (var key in options)
				this.options[key] = options[key];
		},
		run: function() {
			var obj = this;
			this.flogData = js_context.flogData;
			
			this.options.viewModeEntry.click(function(evt){
				evt.preventDefault();
				obj.changeViewMode();
			});
			
			this.options.showCommentsEntry.click(function(evt){
				evt.preventDefault();
				obj.showComments(false);
			});
			
			this.options.doCommentEntry.click(function(evt){
				evt.preventDefault();
				obj.showComments(true);
			});
			
			this.old_page_size = this.options.page_size;
			this.current_page = this.options.init_page;
			
			this.setPagination(this.current_page);
			
			if (this.options.isme || this.options.advancedop)
				this.setGeoEditable(0);
			this.setComments(0);
		},
		getIdxByNid: function(nid) {
			for (var i = 0; i < this.flogData.length; i++)
			{
				if (this.flogData[i].nid == nid)
					return i;
			}
			return -1;
		},
		setGeoEditable: function(offset) {
			var picshowObj = this;
			for (var i = offset; i < this.options.page_size; i++) {
				var container = $("#photoDiv_" + i);
				if (container.length == 0)
					break;
				var geoinfoDiv = $("#geoinfoDiv", container);
				
				geoinfoDiv.mouseover(function(){
					$(this).removeClass("editable_geoinfo").addClass("editable_geoinfo_hover");
				}).mouseout(function(){
					$(this).removeClass("editable_geoinfo_hover").addClass("editable_geoinfo");
				}).click(function(evt){
					evt.preventDefault();
					var tmpidx = parseInt($(this).attr("idx"));
					var dividx = tmpidx % picshowObj.options.page_size;
					var p = picshowObj.flogData[tmpidx];
					var editPanel = $("#geoEditPanel_" + dividx);
					if (editPanel.length == 0)
					{
						var html = uutuu.App.FotologPicShow.geoEditPanelTpl(dividx, p.nid);
						$(html).insertAfter(this);
						if (p.geoinfo && p.geoinfo.cur)
						{
							if (p.geoinfo.cur.tagname)
								$("#geotag_" + p.nid).val(p.geoinfo.cur.tagname);
							else
								$("#geotag_" + p.nid).val(p.geoinfo.cur.geoname);
						}
						
						$("#g_cancelbtn_" + p.nid).click(function(){
							var tmpidx = $(this).attr("idx");
							$("#geoEditPanel_" + tmpidx).hide();
							var container = $("#photoDiv_" + tmpidx);
							$("#geoinfoDiv", container).show();
							try {
								uutuu.App.Gmenu.CURRENT.hide();
							} catch(e) {
							}
						});
						
						$("#geotag_" + p.nid).ajaxSuggestion({
							source: js_context.base_url + "service/gtag/suggest/",
							scrollLimit: 10,
							onError: uutuu.App.FotologPicShow.onSuggestionError,
							onLoading: uutuu.App.FotologPicShow.onSuggestionLoading,
							onComplete: uutuu.App.FotologPicShow.onSuggestionComplete,
							onMatch:uutuu.callbacks.suggestion.onGeotagMatch,
							multiple: false,
							zIndex: 999,
							defaultOption: uutuu.callbacks.suggestion.newGeotagDefaultOption
						});
						
						$("#tagDesSelectPool_" + p.nid).remove();
						$("#gmenuEntry_" + p.nid).Gmenu({
							loadAddress : js_context.base_url + 'service/gtag/geolist/',
							selectType: 'tagname',
							targetItem: "#geotag_" + p.nid,
							location: ["bottom-right", "right-down", -20, 0],
							initAddress: js_context.base_url + 'service/gtag/initgmenu/',
							geo_uri: (p.geoinfo && p.geoinfo.cur && p.geoinfo.cur.geouri) ? p.geoinfo.cur.geouri : '',
							add: 1,
							index: p.nid
						});			
						
						$("#geotag_" + p.nid).click(function(){
							var geotag = $(this).val();
							var tmpnid = $(this).attr("nid");
							if (geotag == "")
							{
								$("#gmenuEntry_" + tmpnid).trigger("click");
							}
						}).keyup(function(){
							var geotag = $(this).val();
							if (geotag.length > 0)
							{
								try {
									uutuu.App.Gmenu.CURRENT.hide();
								} catch(e) {
								}
							}
						});
						
						$("#g_savebtn_" + p.nid).click(function(){
							var tmpnid = $(this).attr("nid");
							var pidx = picshowObj.getIdxByNid(tmpnid);
							var tmpidx = pidx % picshowObj.options.page_size;
							var geotag = $("#geotag_" + tmpnid).val();
							var container = $("#photoDiv_" + tmpidx);
							
							var p = picshowObj.flogData[pidx];
							var old = null;
							if (p.geoinfo)
								old = p.geoinfo;
							if (old && old.cur && old.cur.tagname && geotag == old.cur.tagname)
							{
								$("#geoEditPanel_" + tmpidx).hide();								
								$("#geoinfoDiv", container).show();
								return;
							}							
							
							$("#geoEditPanel_" + tmpidx).hide();
							if ($("#geosaving_" + tmpidx).length == 0)
							{
								var html = uutuu.App.FotologPicShow.geoSavingTpl(tmpidx, tmpnid);
								$(html).insertAfter($("#geoEditPanel_" + tmpidx));
							}
							else
							{
								$("#geosaving_" + tmpidx).show();
							}
							
							uutuu.util.jQueryAjaxHelper({
								url : js_context.base_url + 'service/photo/geo_update/',
								type: 'POST',
								dataType: 'json',
								data : {"nid":tmpnid,"geotag":geotag},
								success : function (data) {
									if (data.success)
									{
										data.nid = parseInt(data.nid);
										var pidx = picshowObj.getIdxByNid(data.nid);
										var tmpidx = pidx % picshowObj.options.page_size;
										var container = $("#photoDiv_" + tmpidx);
										var p = picshowObj.flogData[pidx];
										p.geoinfo = data.geoinfo;						
										
										var geoinfo = '';
										if (data.geoinfo.pc)
											geoinfo += '<a href="' + js_context.base_url + 'fotolog/' + data.geoinfo.pc.context + '">' + data.geoinfo.pc.geoname + '</a> ';
										if (data.geoinfo.city)
											geoinfo += '<a href="' + js_context.base_url + 'fotolog/' + data.geoinfo.city.context + '">' + data.geoinfo.city.geoname + '</a> ';
										if (data.geoinfo.cur && data.geoinfo.cur.geoname != "")
										{
											if (data.geoinfo.cur.context == '')
												geoinfo += '<span class="titlenote">' + data.geoinfo.cur.geoname + '</span>';
											else
												geoinfo += '<a href="' + js_context.base_url + 'fotolog/' + data.geoinfo.cur.context + '">' + data.geoinfo.cur.geoname + '</a> ';
										}
										
										if (geoinfo == "")
											geoinfo = '<span class="titlenote">' + picshowObj.resource("LABEL_GEOTAG") + '</span>' + picshowObj.options.noGeotag;
										else
											geoinfo = '<span class="titlenote">' + picshowObj.resource("LABEL_GEOTAG") + '</span>' + geoinfo;
										p.geoinfostr = geoinfo;
										p.geotag = geotag;
										
										$("#geoinfoTxt", container).html(geoinfo);
										$("#geotag_" + data.nid).val(geotag);
										$("#geoinfoDiv", container).show();
										$("#geosaving_" + tmpidx).hide();	
									}
									else
									{
										uutuu.UI.Dialog.alert(data.message);
									}
								}
							});
						});
					}
					
					$(this).hide();
					$("#geoEditPanel_" + dividx).show();
				});
			}
		},
		voteRankCallback: function(nid, rank_count, rank_score) {
			nid = parseInt(nid);
			rank_count = parseInt(rank_count);
			rank_score = parseInt(rank_score);
			var _inst = uutuu.App.FotologPicShow.getInstance();
			var tmpidx = _inst.getIdxByNid(nid);
			var p = _inst.flogData[tmpidx];
			p.rank_count = rank_count;
			p.rank_score = rank_score;
		},
		setComments: function(offset) {
			var picshowObj = this;
			var max = offset + this.options.page_size;
			if (max > this.flogData.length)
				max = this.flogData.length;
			if (this.options.current_mode == 'large')
			{				
				for (var i = offset; i < max; i++) {
					var p = this.flogData[i];
					var dividx = i % this.options.page_size;
					var container = $("#photoDiv_" + dividx);					
					var html = uutuu.App.FotologPicShow.commentTpl('large', p.nid, p.rank_count, p.comment_count);					
					$("#commentDiv", container).html(html);
					
					var percentScore = (p.rank_count == 0 || p.rank_score == 0) ? 60 : Math.round(p.rank_score * 20 / p.rank_count);
					$(".current-rating", container).css("width", percentScore + "%");
					$("#rankScorePanel", container).RankScore({nid:p.nid,voteOnStarClicked:true,callback:this.voteRankCallback});
				}
			}
			else
			{
				var nids = [];
				for (var i = offset; i < max; i++)
				{
					var p = this.flogData[i];
					if (typeof this.comments[p.nid] == "undefined")
					{
						if (p.comment_count == 0)
							this.comments[p.nid] = [];
						else
							nids.push(p.nid);
					}
				}
				
				if (nids.length == 0)
				{
					this.showMediumModeComments();
				}
				else
				{
					this.getComments(nids);
				}
			}
		},
		showMediumModeComments: function() {
			var offset = (this.current_page - 1) * this.options.page_size;
			var max = offset + this.options.page_size;
			if (max > this.flogData.length)
				max = this.flogData.length;
			for (var i = offset; i < max; i++)
			{
				var p = this.flogData[i];
				if (typeof this.comments[p.nid] == "undefined")
					break;
				var tmpidx = i % this.options.page_size;
				var container = $("#photoDiv_" + tmpidx);
				var html = uutuu.App.FotologPicShow.commentTpl('medium', p.nid, p.rank_count, p.comment_count);					$("#commentTd", container).html(html);
				var percentScore = (p.rank_count == 0 || p.rank_score == 0) ? 60 : Math.round(p.rank_score * 20 / p.rank_count);
				$(".current-rating", container).css("width", percentScore + "%");
				$("#rankScorePanel", container).RankScore({nid:p.nid,voteOnStarClicked:true,callback:this.voteRankCallback});
				
				this.setCommentDiv($("#picCommentDiv_" + p.nid), this.comments[p.nid], p.nid);
				this.setCommentBtn(p.nid);
			}
		},
		setCommentBtn: function (nid) {
			uutuu.util.log("debug", "begin setCommentBtn");
			var picshowObj = this;
			
			$("#commentbtn_" + nid).click(function(){
				var tmpnid = $(this).attr("nid");

				var formDiv = $("#commentPanel_" + tmpnid);				
				if (formDiv.html() == '')
				{
					var html = uutuu.App.FotologPicShow.commentFormTpl(tmpnid);
					formDiv.html(html);
					
					$("#emotions_menu_" + tmpnid).simpleMenu({
						toggleButton: "#emotions_menu_txt_" + tmpnid,
						menu: "#emotions_menu_list_" + tmpnid,
						cssClass: ["emotionsMenu", "emotionsMenu", "emotionsMenu"],
						imgList: [js_context.theme_url.get('imageV2/icon_spminemenunormal.gif', 'site'), js_context.theme_url.get('imageV2/icon_spminemenuover.gif', 'site'), js_context.theme_url.get('imageV2/icon_spminemenuover.gif', 'site')]
					});
					
					$("#emotionsTd_" + tmpnid + " a").click(function(ev) {
						var tmpnid = $(this).parent().attr("nid");
						var content = $("#comment_textarea_" + tmpnid).val();
						content += "[" + $(this).attr("href") + "]";
						$("#comment_textarea_" + tmpnid).val(content);
						ev.preventDefault();
					});
					
					$("#savebtn_c_" + tmpnid).click(function(){		
						var tmpnid = $(this).attr("nid");
						var nickname = $("#nickname_" + tmpnid).val();
						var comment = $("#comment_textarea_" + tmpnid).val();
						
						$("#comment_error_" + tmpnid).html('').hide();
						
						if (comment.length == "")
						{
							uutuu.UI.Dialog.alert(this.resource("INFO_NOCOMMENT_INPUT"));
							return false;
						}
						
						var commentData = {
							'nid'		: tmpnid,
							'nickname'	: nickname,
							'comment'	: comment
							};
					
						$("#commentPanel_" + tmpnid).hide();
						$("#commentInfo_" + tmpnid).show();
						$("#commentInfo_txt_" + tmpnid).html(picshowObj.resource("INFO_COMMENT_SAVING"));
						picshowObj.options.defaultNickname = nickname;
						$.ajax({
							url: js_context.base_url + "service/note/floatcomment/" + tmpnid + "/",
							type: 'POST',
							data: commentData,
							dataType: 'json',
							timeout: 180000,
							error: function(request, type, ex){},
							success: function(data){
								if (data.success)
								{
									var c = data.comment;
									picshowObj.comments[c.nid].unshift(c);
									picshowObj.setCommentDiv("#picCommentDiv_" + c.nid, picshowObj.comments[c.nid], c.nid);
									$("#comment_textarea_" + c.nid).val('');
									$("#commentInfo_" + c.nid).hide();
									$("#commentPanel_" + c.nid).hide();
									$("#commentContent_" + c.nid).show();
									var comment_count = parseInt($("#comment_count_" + c.nid).html());
									comment_count++;
									$("#comment_count_" + c.nid).html(comment_count);
									for (var i = 0; i < picshowObj.flogData.length; i++)
									{
										if (picshowObj.flogData[i].nid == c.nid)
										{
											picshowObj.flogData[i].comment_count = comment_count;
											break;
										}
									}
								}
								else
								{
									$("#commentInfo_" + tmpnid).hide();
									$("#commentPanel_" + tmpnid).show();
									$("#comment_error_" + tmpnid).html(data.message).show();
								}
					   		}
					   	});		
					});
					
					$("#cancelbtn_c_" + tmpnid).click(function(){
						var tmpnid = $(this).attr("nid");
						$("#commentContent_" + tmpnid).show();
						$("#commentPanel_" + tmpnid).hide();
						try {
							uutuu.App.Gmenu.CURRENT.hide();
						} catch(e) {
						}
					});
				}
				
				$("#commentContent_" + tmpnid).hide();
				formDiv.show();
				
				if (_login_uid > 0)
				{
					$("#nickname_panel_" + tmpnid).hide();
				}
				else
				{
					$("#nickname_panel_" + tmpnid).show();
					$("#nickname_" + tmpnid).val(picshowObj.options.defaultNickname);
				}
			});
			
			uutuu.util.log("debug", "end setCommentBtn");
		},
		setPic: function(offset) {
			var _inst = uutuu.App.FotologPicShow.getInstance();
			var total = _inst.flogData.length;
			offset = parseInt(offset);
			
			for (var i = 0; i < _inst.options.page_size; i++)
			{
				var container = $("#photoDiv_" + i);
				if (offset + i >= total)
				{
					container.hide();
				}
				else
				{
					var p = _inst.flogData[offset + i];					
					$("#imageTd", container).html('<a href="' + p.url + '" target="_blank"><img src="' + p.image + '" title="' + p.title + '" alt="' + p.alt + '" /></a>');
					$("#commentTd", container).html('').attr("nid", p.nid);
					
					if (_inst.options.isfeature)
						$("#authorDiv", container).html('拍摄者：<a href="' + p.puser.url + '" class="usernamelink" target="_blank">' + p.puser.nickname + '</a>');
					
					$("#bodyDiv", container).html(p.body);
					var geoinfoDiv = $("#geoinfoDiv", container);
					geoinfoDiv.attr("idx", offset + i).show();
					$("#geoEditPanel_" + i).remove();
					$("#geoinfoTxt", geoinfoDiv).html(p.geoinfostr);
					container.show();
				}
			}
			
			if (_inst.old_page_size < _inst.options.page_size)
			{
				if (_inst.options.isme || _inst.options.advancedop)
					_inst.setGeoEditable(_inst.old_page_size);
				_inst.old_page_size = _inst.options.page_size;
			}
			
			_inst.setComments(offset);
		},		
		getComments: function(nids) {
			uutuu.util.log("debug", "start getComments");
			var toget = [];
			for (var i = 0; i < nids.length; i++)
			{
				var nid = nids[i];
				if ((typeof this.comments[nid]) != "undefined")
					this.setCommentDiv("#picCommentDiv_" + nid, this.comments[nid], nid);
				else
					toget.push(nid);
			}
			this.last_nids = toget;
			if (toget.length == 0)
				return;
			var strnids = toget.join("#");
			var picshowObj = this;
			$.ajax({
				url: js_context.base_url + 'service/note/getcomments/',
				type: 'POST',
				data: "nids=" + strnids,
				dataType: 'json',
				timeout: 30000,
				error: function(request, type, ex){},
				success: function(data){
					if (data.success == true)
					{
						for (var key in data.comments)
						{
							picshowObj.comments[key] = data.comments[key];
						}
						uutuu.util.log("debug", "end getComments");
						
						picshowObj.showMediumModeComments();
					}
		   		}
		   	});
		},
		showFComment: function(c_index) {
			if (!this.showComplete)
				return false;
			this.hidePopStatus[c_index] = false;
			$("[name='orgcdiv']").css("display", "none");
			$("#orgcdiv_" + c_index).css("display", "");
		},
		hideFComment: function(c_index) {
			window.setTimeout(function() {
				if (uutuu.App.FotologPicShow.getInstance().hidePopStatus[c_index])
				{			
					$("#orgcdiv_" + c_index).hide();
				}
			}, 500);
		},
		setHideStatus: function(c_index, status) {
			this.hidePopStatus[c_index] = status;
			if (status)
			{
				this.hideFComment(c_index);
			}
		},
		commentCount: function(nid) {
			for (var i = 0; i < this.flogData.length; i++)
			{
				var flog = this.flogData[i];
				if (flog.nid == nid)
					return flog.comment_count;
			}
			return 0;
		},
		setCommentDiv: function(elem, content, nid) {
			if (content.length == 0)
			{
				$(elem).html('');
			}
			else
			{
				var str = '';
				for(var i = 0; i < content.length && i < 4; i++)
				{
					this.c_index ++;
					if (content[i].uid == 0 || content[i].uid == "")
						var user = '<span class="titlenote">' + content[i].name + '</span>';
					else
						var user = '<a class="usernamelink" href="' + js_context.base_url + 'member/' + content[i].uid + '/" target="_blank">' + content[i].name + '</a>';
					if (content[i].timestamp && content[i].timestamp != "")
						user += "<span class='titlenote'> | " + content[i].timestamp + "</span>";
					str += '';
					var strPop = '<div name="orgcdiv" id="orgcdiv_' + this.c_index + '" style="width:220px;overflow-x:hidden;display:none;position:absolute;background:#FFFFFF;border:3px #CCCCCC solid;z-index:999;padding:6px 6px;line-height:18px;*left:160px;" onmouseout="uutuu.App.FotologPicShow.getInstance().setHideStatus(' + this.c_index + ', true);" onmouseover="uutuu.App.FotologPicShow.getInstance().setHideStatus(' + this.c_index + ', false);"><div>' + user + '</div><div style="margin-top:5px;">' + content[i].commentorg + '</div></div>';
					str += '<div id="shortcdiv_' + this.c_index + '" style="width:160px;overflow-x:hidden;"><div onmouseover="uutuu.App.FotologPicShow.getInstance().showFComment(' + this.c_index + ');" onmouseout="uutuu.App.FotologPicShow.getInstance().setHideStatus(' + this.c_index + ', true);" style="float:left;">' + content[i].comment + '</div>' + strPop + '</div>';
					str += '<div class="dottedhline_undertone"/>';
				}
				if (this.commentCount(nid) > 4)
				{
					var nid = content[0].nid;
					str += '<div style="width:160px;overflow-x:hidden;text-align:right;"><a href="' + js_context.base_url + 'fotolog/photo/' + nid + '/#comment" target="_blank">' + this.resource("INFO_MORE_COMMENTS") + '</a></div><div class="dottedhline_undertone"/>';
				}
				$(elem).html(str).show();
			}
		},
		setCommentError: function(elem, content) {
			$(elem).html('<p>' + content + '</p><div class="dottedhline_undertone" />');
		},
		setFeatureDiv: function(nids) {
			try
			{
				$.ajax({
					url: js_context.base_url + 'service/flog/get_feature_fotologs/',
					type: 'POST',
					data: "nids=" + nids.join("|"),
					dataType: 'json',
					timeout: 30000,
					error: function(request, type, ex){},
					success: function(data){
						if (data.success)
						{
							var content = data.data;
							for (var pnid in content)
							{
								var feature = content[pnid];
								if (feature.length > 0)
								{
									var str = '';
									str += '<div class="dottedhline_undertone"/><p><img class="imgMid" src="' + js_context.theme_url.get('imageV2/icon_special.gif', 'site') + '"/> ' + uutuu.App.FotologPicShow.getInstance().resource("FEATURE_INFO") + ' <br />';
									for (var i = 0; i < feature.length && i < 2; i++)
									{
										str += '<div style="margin-left:21px;"><a href="' + js_context.base_url + 'fotolog/feature/detail/' + feature[i].nid + '/" target="_blank">' + feature[i].title + '</a></div>';
									}
									str += '</p>';
									$("#photoPerbelongto_" + pnid).css('display', '').html(str);
								}
							}
						}
			   		}
			   	});
			}
			catch(e)
			{
			}
		},
		setPageSize: function(size) {
			size = parseInt(size);
			if (this.options.page_size == size)
				return;
			if (this.options.page_size > size)
			{
				for (var i = size; i < this.options.page_size; i++)
				{
					$("#photoDiv_" + i).remove();
				}
			}
			else
			{
				for (var i = this.options.page_size; i < size; i++)
				{
					var container = document.createElement("div");
					container.id = "photoDiv_" + i;
					container.innerHTML = uutuu.App.FotologPicShow.photoContainer(this.options.current_mode);
					$(container).insertAfter($("#photoDiv_" + (i - 1)));
				}
			}
			
			this.old_page_size = this.options.page_size;
			this.options.page_size = size;
			uutuu.util.cookie('picshow_page_size', this.options.page_size, {expires: 365, path: js_context.base_url + 'fotolog/'});
			this.showPage(1);
		},
		setPagination: function(page) {
			page = parseInt(page);
			var _inst = uutuu.App.FotologPicShow.getInstance();
			var t = _inst.flogData.length;
			var start = (page - 1) * _inst.options.page_size;
			var pn = Math.ceil(t / _inst.options.page_size);
		
			var strPageSize = "<select obj='changePageSize' style='width:46px;'>";
			var pageSizeArr = [5,10,20,50];
			for (var i = 0; i < pageSizeArr.length; i++)
			{
				if (pageSizeArr[i] == _inst.options.page_size)
					strPageSize += "<option value='" + pageSizeArr[i] + "' selected>" + pageSizeArr[i] + "</option> ";
				else
					strPageSize += "<option value='" + pageSizeArr[i] + "'>" + pageSizeArr[i] + "</option> ";
			}
			strPageSize += "</select>";
		
			var paginationInfo = uutuu.App.FotologPicShow.printf(_inst.resource("INFO_PAGINATION"), [t, page, pn, strPageSize]);
			_inst.options.paginationInfoUp.html(paginationInfo);
			_inst.options.paginationInfoDown.html(paginationInfo);
		
			var obj = _inst;
			$("[obj='changePageSize']").each(function(){
				$(this).change(function(){
					obj.setPageSize($(this).val());
				});
			});
			
			if (t > _inst.options.page_size) {
				_inst.options.paginationBlockUp.show();
				_inst.options.paginationBlockDown.show();
				var ps = new uutuu.UI.PageSplitter($(".block_splitpageIndex"), {
					total: t,
					page_size: _inst.options.page_size,
					page_num_next: 3,
					images: [js_context.theme_url.get('imageV2/icon_indexrightarrowstart.gif', 'site'), js_context.theme_url.get('imageV2/icon_leftarrowgray2.gif', 'site'), js_context.theme_url.get('imageV2/icon_rightarrowgray2.gif', 'site'), js_context.theme_url.get('imageV2/icon_indexrightarrowend.gif', 'site')],
					gotoFn: _inst.onPaginationClick
					});
				ps.show(page);
			}
			else
			{
				_inst.options.paginationBlockUp.html('');
				_inst.options.paginationBlockDown.html('');
			}
		},
		onPaginationClick: function (page, caller) {
			var _inst = uutuu.App.FotologPicShow.getInstance();
			
			if (pageTracker)
			{
				pageTracker._trackPageview(_inst.options.commentBackBase + "page." + page + ".htm");
			}
			
			_inst.showPage(page, caller);
		},
		showPage: function(page, caller) {
			page = parseInt(page);
			uutuu.util.log("debug", "start showPage");
			var _inst = uutuu.App.FotologPicShow.getInstance();
			_inst.current_page = page;
			try {
				uutuu.App.Gmenu.CURRENT.hide();
			} catch(e) {
			}
			
			//{{{设置评论的返回地址
			$("#form_comment input[name='detail_url']").val(_inst.options.commentBackBase + "page." + page + ".htm");
			//}}}
			
			if (_inst.gotoStart)
				location.href = "#picListStart";
			else
				_inst.gotoStart = true;
			
			_inst.setPagination(page);
			
			var start = (page - 1) * _inst.options.page_size;
			window.setTimeout(function(){
				_inst.setPic(start);
			}, 10);			
		},
		showComments: function(docomment) {
			if (docomment)
			{
				$("#commentsDiv").show();
				location.href = "#comment";
				$("#comment_content").focus();
			}
			else
			{
				if ($("#commentsDiv").css("display") == "none")
				{
					$("#commentsDiv").show();
					$("#showCommentsEntry").html(this.resource("LABEL_HIDE_COMMENTS"));
				}
				else
				{
					$("#commentsDiv").hide();
					$("#showCommentsEntry").html(this.resource("LABEL_SHOW_COMMENTS"));
				}
			}
		}, 
		changeViewMode: function() {
			if (this.options.current_mode == 'medium')
			{
				this.options.current_mode = 'large';
			}
			else
			{
				this.options.current_mode = 'medium';
			}
			uutuu.util.cookie('picshow_pic_mode', this.options.current_mode, {expires: 365, path: js_context.base_url + 'fotolog/'});
			uutuu.UI.Dialog.message("正在刷新页面，请稍候……");
			location.reload();
		}
	},
	statics: {
		photoContainer: function(mode, isfeature) {
			var authorDivStr = '';
			if (isfeature)
				authorDivStr = '<div id="authorDiv" style="line-height:18px;margin-top:5px;" class="titlenote"></div>';
				
			if (mode == 'medium')
				return '<table width="621" border="0" cellspacing="0" cellpadding="0" class="photoPer"><tr><td width="440" valign="top" id="imageTd"></td><td valign="top" id="commentTd"></td></tr><tr><td><div class="photoPercontent"><div id="bodyDiv" style="line-height:18px;margin-bottom:5px;"></div><div id="geoinfoDiv" class="editable_geoinfo" style="margin-bottom:5px;"><div id="geoinfoTxt"></div><div class="titlenote editable_geoinfo_note">建议您准确填写照片的拍摄地，单击鼠标左键设置/修改照片拍摄地。</div></div>' + authorDivStr + '</div></td><td>&nbsp;</td></tr></table><div class="dottedhline_undertone">&nbsp;</div>';
			else
				return '<table width="621" border="0" cellspacing="0" cellpadding="0" class="photoPer"><tr><td id="imageTd" width="100%" valign="top" colspan="2"></td></tr><tr><td width="440" valign="top"><div class="photoPercontent"><div id="bodyDiv" style="line-height:18px;margin-bottom:5px;"></div><div id="geoinfoDiv" class="editable_geoinfo" style="margin-bottom:5px;"><div id="geoinfoTxt"></div><div class="titlenote editable_geoinfo_note">建议您准确填写照片的拍摄地，单击鼠标左键设置/修改照片拍摄地。</div></div>' + authorDivStr + '<div id="commentDiv" style="margin:5px 0px;"></div></div></td><td width="160" class="titlenote" align="right"></td></tr></table><div class="dottedhline_undertone">&nbsp;</div>';
		},
		geoEditPanelTpl: function(idx, nid) {
			return '<div id="geoEditPanel_' + idx + '" style="display:none;"><div class="titlenote" style="margin-top:5px;"><form id="' + nid + '"><div>拍摄地：<input type="text" name="geotag" id="geotag_' + nid + '" nid="' + nid + '" class="inputboard" style="width:150px;" />&nbsp;&nbsp;&nbsp;&nbsp;<a id="gmenuEntry_' + nid + '" href="javascript:void(0);">选择</a> <img id="suggestion_status_' + nid + '" width="16" height="16" src="' + js_context.theme_url.get('image/space.gif') + '" /> <span class="titlenote">例如：长海(中国,九寨沟)</span></div><div style="margin-top:5px;"><input id="g_savebtn_' + nid + '" idx="' + idx + '" nid="' + nid + '" type="button" value="保存" class="btn_checkshortNrw_mouseout" border="0" style="margin-right:10px;margin-left:48px;" /><input id="g_cancelbtn_' + nid + '" idx="' + idx + '" nid="' + nid + '" type="button" value="取消" class="btn_cancelshortNrw_mouseout" border="0" style="cursor:pointer;" /></div></form></div><div style="width:400px;background:#f5eae4 none repeat scroll 0 0;border:1px solid #ECCBBA;line-height:2em;padding:5px;margin-top:5px;color:#de2f02;">建议您填写准确的拍摄地，最好精确到某个景点，这样其它用户可以在浏览该景点时看到您拍摄的精彩照片，同时还可能被选为景点代表照片。</div></div>';
		},
		geoSavingTpl: function(idx, nid)
		{
			return '<div id="geosaving_' + idx + '" class="titlenote">正在保存照片拍摄地，请稍候……</div>';
		},
		commentTpl: function(mode, nid, rank_count, comment_count)
		{			
			if (mode == 'medium')
			{
				var rank_count_str = '';
				if (rank_count > 0)
					rank_count_str = '(' + rank_count + ')';
				return '<div class="photoPercomment">' + 
			          	  '<div id="rankScorePanel">' + 
				            '<div class="btn_promote_outer">' + 
				          	  '<div class="btn_promote_inner">' + 
				          		'<div class="titlenote btn_promote_txt" title="点击右边的星图标，给照片打分，1至5颗星分别代表1至5分。">推荐' + rank_count_str + '</div>' + 
				          		'<div class="btn_promote_splitter"></div>' + 
				          		'<div class="btn_promote_stars">' + 
							      '<ul class="star-rating">' + 
							        '<li class="current-rating" style="width:60%;">&nbsp;&nbsp;</li>' + 
							        '<li><a href="#" title="太差了" class="one-star">1</a></li>' + 
							        '<li><a href="#" title="不咋的" class="two-stars">2</a></li>' + 
							        '<li><a href="#" title="一般" class="three-stars">3</a></li>' + 
							        '<li><a href="#" title="不错" class="four-stars">4</a></li>' + 
							        '<li><a href="#" title="非常好" class="five-stars">5</a></li>' + 
							      '</ul>' + 
							    '</div>' + 
				          	  '</div>' + 
				          	'</div>' + 
				  		  '</div>' + 
				  		  '<div id="commentContent_' + nid + '">' + 
					  		  '<div class="dottedhline_undertone" style="*margin:0px;">&nbsp;</div>' + 
				              '<div align="left">' + 
				                '<input id="commentbtn_' + nid + '" nid="' + nid + '" type="button" class="btn_myfunc btn_script" value="我来说两句" border="0"  />' + 
				              '</div>' + 
				              '<div class="dottedhline_undertone">&nbsp;</div>' + 
				              '<p class="titlenotebd">对这张照片的评论(<span id="comment_count_' + nid + '">' + comment_count + '</span>)</p>' + 
				              '<div class="dottedhline_undertone">&nbsp;</div>' + 
				              '<div id="picCommentDiv_' + nid + '" style="position:relative;">' + 
				              '</div>' + 
			              '</div>' + 
			              '<div id="commentPanel_' + nid + '" style="display:none;">' + 
			              '</div>' + 
			              '<div id="commentInfo_' + nid + '" style="display:none;">' + 
					  		  '<div class="dottedhline_undertone">&nbsp;</div>' + 
				              '<div style="margin-top:5px;" id="commentInfo_txt_' + nid + '" class="titlenote"></div>' + 
				              '<div class="dottedhline_undertone"></div>' + 
			              '</div>' + 
			            '</div>';
			}
			else
			{
				var rank_count_str = '';
				if (rank_count > 0)
					rank_count_str = '(' + rank_count + ')';
				var comment_count_str = comment_count == 0 ? '0条评论' : '<a href="' + js_context.base_url + 'fotolog/photo/' + nid + '/#comment" target="_blank">' + comment_count + '条评论</a>';				
				return '<div id="rankScorePanel"><div class="btn_promote_outer"><div class="btn_promote_inner"><div class="titlenote btn_promote_txt">推荐' + rank_count_str + '</div><div class="btn_promote_splitter"></div><div class="btn_promote_stars"><ul class="star-rating"><li class="current-rating" style="width:60%;">&nbsp;&nbsp;</li><li><a href="#" title="太差了" class="one-star">1</a></li><li><a href="#" title="不咋的" class="two-stars">2</a></li><li><a href="#" title="一般" class="three-stars">3</a></li><li><a href="#" title="不错" class="four-stars">4</a></li><li><a href="#" title="非常好" class="five-stars">5</a></li></ul></div></div></div></div><div class="titlenote" style="margin-top:8px;">' + comment_count_str + '&nbsp;|&nbsp;<a href="' + js_context.base_url + 'fotolog/photo/' + nid + '/#comment" target="_blank">我要评论</a></div>';
			}
		},
		commentFormTpl: function(nid) {
			return '<div class="dottedhline_undertone">&nbsp;</div>' + 
		  		  '<div id="nickname_panel_' + nid + '">' + 
		  		  '<div class="titlenote" style="margin-top:5px;margin-bottom:5px;">昵称：</div>' + 
		  		  '<div style="margin-bottom:5px;">' + 
		  		  '<input type="text" name="nickname" id="nickname_' + nid + '" nid="' + nid + '" class="inputboard" value="" style="width:100px;" /></div>' + 
		  		  '</div>' + 
		  		  '<div class="titlenote" style="height:18px;margin-bottom:5px;">' + 
		  		  	'<div style="float:left;">内容：</div>' + 
		  		  	'<div style="float:right;margin-right:5px;">' + 
		  		  	  '<div class="emotionsMenu" id="emotions_menu_' + nid + '">' + 
						  '<div class="emotionsMenuTxt" id="emotions_menu_txt_' + nid + '"><a href="javascript:void(0);">插入表情</a> <img src="' + js_context.theme_url.get('imageV2/icon_spminemenunormal.gif') + '" style="vertical-align:middle;" /></div>' + 
						  '<div class="emotionsMenuList" id="emotions_menu_list_' + nid + '">' + 
						    '<div class="emotions_floater">' + 
						      '<div class="emotions_floater_inner">' + 
						        '<table border="0" cellpadding="0" cellspacing="0" id="emotions_tb_' + nid + '">' + 
						          '<tr>' + 
						            '<td valign="top" id="emotionsTd_' + nid + '" nid="' + nid + '" width="468">' + 
						            '<a href="em:001"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon001" title="微笑" alt="微笑" class="imgMid" /></a>' + 
						            '<a href="em:002"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon002" title="大笑" alt="大笑" class="imgMid" /></a>' + 
						            '<a href="em:003"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon003" title="呲牙" alt="呲牙" class="imgMid" /></a>' + 
						            '<a href="em:004"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon004" title="亲亲" alt="亲亲" class="imgMid" /></a>' + 
						            '<a href="em:005"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon005" title="得意" alt="得意" class="imgMid" /></a>' + 
						            '<a href="em:006"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon006" title="生病" alt="生病" class="imgMid" /></a>' + 
						            '<a href="em:007"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon007" title="吐啊" alt="吐啊" class="imgMid" /></a>' + 
						            '<a href="em:008"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon008" title="调皮" alt="调皮" class="imgMid" /></a>' + 
						            '<a href="em:009"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon009" title="叹息" alt="叹息" class="imgMid" /></a>' + 
						            '<a href="em:010"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon010" title="惊讶" alt="惊讶" class="imgMid" /></a>' + 
						            '<a href="em:012"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon012" title="感动" alt="感动" class="imgMid" /></a>' + 
						            '<a href="em:013"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon013" title="喜欢" alt="喜欢" class="imgMid" /></a>' + 
						            '<a href="em:014"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon014" title="口水" alt="口水" class="imgMid" /></a>' + 
						            '<a href="em:015"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon015" title="疑问" alt="疑问" class="imgMid" /></a>' + 
						            '<a href="em:016"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon016" title="汗哦" alt="汗哦" class="imgMid" /></a>' + 
						            '<a href="em:017"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon017" title="努力" alt="努力" class="imgMid" /></a>' + 
						            '<a href="em:018"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon018" title="生气" alt="生气" class="imgMid" /></a>' + 
						            '<a href="em:019"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon019" title="闭嘴" alt="闭嘴" class="imgMid" /></a>' + 
						            '<a href="em:021"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon021" title="一般" alt="一般" class="imgMid" /></a>' + 
						            '<a href="em:022"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon022" title="快乐" alt="快乐" class="imgMid" /></a>' + 
						            '<a href="em:023"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon023" title="睡觉" alt="睡觉" class="imgMid" /></a>' + 
						            '<a href="em:024"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_icon024" title="大哭" alt="大哭" class="imgMid" /></a>' + 
						            '<a href="em:z001"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style02 emotion_iconz001" title="喜欢顶你一下" alt="喜欢顶你一下" class="imgMid" /></a>' + 
						            '<a href="em:z002"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style02 emotion_iconz002" title="飘过～～" alt="飘过～～" class="imgMid" /></a>' + 
						            '<a href="em:z003"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style01 emotion_iconz003" title="oh my god" alt="oh my god" class="imgMid" /></a>' + 
						            '<a href="em:z004"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style02 emotion_iconz004" title="回火星去吧" alt="回火星去吧" class="imgMid" /></a>' + 
						            '<a href="em:z005"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style02 emotion_iconz005" title="好美的地方" alt="好美的地方" class="imgMid" /></a>' + 
						            '<a href="em:z006"><img src="' + js_context.theme_url.get('image/transparent.gif', 'common') + '" class="emotion_style02 emotion_iconz006" title="盼望楼主早日更新" alt="盼望楼主早日更新" class="imgMid" /></a>' + 
						            '</td>' + 
						          '</tr>' + 
						        '</table>' + 
						      '</div>' + 
						    '</div>' + 
						  '</div>' + 
						'</div>' + 
		  		  	'</div>' + 
		  		  '</div>' + 
	              '<textarea id="comment_textarea_' + nid + '" nid="' + nid + '" class="textareaboard" style="width:160px;height:120px;"></textarea>' + 
	              '<div class="titlenote" style="margin-top:5px;margin-bottom:5px;color:red;" id="comment_error_' + nid + '"></div>' + 
	              '<div style="margin-top:5px;"><input id="savebtn_c_' + nid + '" nid="' + nid + '" type="button" value="提交" class="btn_checkSN" border="0" style="margin-right:10px;" /><input id="cancelbtn_c_' + nid + '" nid="' + nid + '" type="button" value="取消" class="btn_cancelSN" border="0" style="cursor:pointer;" /></div>' + 
	              '<div class="dottedhline_undertone"></div>';
		},
		containChinese: function(str) {
			var re = /[\u4e00-\u9fa5]/i; 
			var r = str.match(re);
			if (r == null)
				return false;
			return true;
		},		
		simpleTemplate: function(tpl, data)	{
			var reg = /#=([a-zA-Z_][a-zA-Z0-9_]*)#/g;
			var str = tpl.replace(reg, function($0,$1){ 
			        return data[$1];
			      });
			return str;
		},
		onSuggestionError: function(sender,msg) {
			var idx = sender.target.id.substring(7);
			$("#suggestion_status_"+idx).css("background", "url(" + js_context.theme_url.get('imageUtop/error16x16.gif', 'site') + ")");
		},
		onSuggestionLoading: function(sender) {
			var idx = sender.target.id.substring(7);
			$("#suggestion_status_"+idx).css("background", "url(" + js_context.theme_url.get('imageUtop/spinner16x16.gif', 'site') + ")");
		},
		onSuggestionComplete: function(sender) {
			var idx = sender.target.id.substring(7);
			$("#suggestion_status_"+idx).css("background", "");
		},
		printf: function(str, replaces)
		{
			for (var i = 0; i < replaces.length; i++)
			{
				str = str.replace(/%s/, replaces[i]);
			}
			return str;
		},
		getInstance: function() {
			if (!this._ins)
				this._ins = new this();
			return this._ins;
		}
	}
});