/** 
 * PoiPanelSetup.js
 * 
 */

var Dom = YAHOO.util.Dom;
var Anim = YAHOO.util.Anim;
var Motion = YAHOO.util.Motion;
var Event = YAHOO.util.Event;
var DDM = YAHOO.util.DragDropMgr;

function initPoiPanel() {

	//** Init UI Component.
	PoiDetailApp.init();
	
	//** Init POI Detail app
	//PoiDetailApp.init();

	//** Init POI Map App.
	PoiMapApp.init();

	//** Init PoiScoreApp.
	PoiScoreApp.init();

	//** Init PoiCommentApp.
	PoiCommentApp.init();

	//** Init PoiPhotoApp.
	PoiPhotoApp.init();
	
	//** Init MapNearbyApp.
	new MapNearbyApp('poi_nearby', poiMap);

}

//**********************************************
//Init POI Map App
//**********************************************
var poiMap;

PoiMapApp = {
	init: function(){
		//** Init POI Map.
		poiMap = new UMap(Dom.get('poiMap'));
		poiMap.addControl(U_FULLZOOM_CONTROL);
		poiMap.addControl(U_TYPE_CONTROL);
	},
	
	move: function(poi){		
		var point = new ULatLng(poi.latitude, poi.longitude);
		var catIcon = new UIcon();
		var urlString=Dom.get('IsLoginUserForm').url.value;
		if (poi.buy) catIcon.image = '/wps/themes/html/iMove/img/urmap_shop.gif';
		if (poi.eat) catIcon.image = '/wps/themes/html/iMove/img/urmap_eat.gif';
		if (poi.live) catIcon.image = '/wps/themes/html/iMove/img/urmap_stay.gif';
		if (poi.travel) catIcon.image = '/wps/themes/html/iMove/img/urmap_play.gif';
		catIcon.iconWidth = 19;
		catIcon.iconHeight = 19;
		catIcon.iconAnchor = new UPoint(9, 9);
		catIcon.infoWindowAnchor = new UPoint(9, 0);
		var htmlString='<a href="'+urlString+'/POIDetail?POI='+poi.poiId+'">'+poi.introduction.substring(0, 20)+"..."+'</a>';
		var marker = new UMarker(point, catIcon, poi.display, htmlString);
		//var marker = new UMarker(point, catIcon, poi.display, poi.introduction.substring(0, 20)+'...');
		poiMap.addOverlay(marker);
		poiMap.centerAndZoom(point, 6);
	}
};


//**********************************************
//Poi Score App.
//**********************************************
var poiScore;

PoiScoreApp = {
	init: function() {
		
		//** Event Control.
		Event.on(Dom.getElementsByClassName('poi_scoreIcon'), 'click', function(e){
			var target = Event.getTarget(e);
			poiScore = target.id.substring(9);
			for (var i = 1; i <= 5; i++) {
				if (i <= poiScore) Dom.get('poi_score'+i).src = '/wps/themes/html/iMove/img/star_on.gif';
				else Dom.get('poi_score'+i).src = '/wps/themes/html/iMove/img/star_off.gif';
			}
			Dom.setStyle('poi_score_confirm_btn', 'display', '');
		});

		Event.on('poi_score_confirm_btn', 'click', this.addScore);
	},
	
	reset: function() {
		if (Dom.get('p_d_p_addScoreArea')) {
			Dom.setStyle('poi_score_confirm_btn', 'display', 'none');
			Dom.setStyle('poi_scoreWait', 'display', 'none');
			for (var i = 1; i <= 5; i++) Dom.get('poi_score'+i).src = '/wps/themes/html/iMove/img/star_off.gif';
			if (poi.isScored) {
				Dom.setStyle('p_d_p_addScoreArea', 'display', 'none');
				Dom.setStyle('poiAddScoreMsg', 'display', '');
			}
			else {
				Dom.setStyle('p_d_p_addScoreArea', 'display', '');
				Dom.setStyle('poiAddScoreMsg', 'display', 'none');
			}
		}
	},
	
	addScore: function() {
		Dom.setStyle('poi_score_confirm_btn', 'display', 'none');
		Dom.setStyle('poi_scoreWait', 'display', '');
		
		var postData = 'function=addScore&poiId=' + poi.poiId + '&score=' + poiScore;
		YAHOO.util.Connect.asyncRequest('POST', poiAjaxServlet, { success:PoiScoreApp.successHandler, failure:PoiScoreApp.failureHandler }, postData);
	},
	
	successHandler: function(o){
		if(o.responseText !== undefined){
			Dom.setStyle('p_d_p_addScoreArea', 'display', 'none');
			Dom.setStyle('poiAddScoreMsg', 'display', '');
			
			var newScore = ((poi.scoreAvg * poi.scoreCount) + parseInt(poiScore))/(poi.scoreCount + 1);
			Dom.get('p_d_p_scoreAvg').src = '/wps/themes/html/iMove/img/star_' + Math.round(newScore) + '.gif';
			Dom.get('p_d_p_scoreCount').innerHTML = parseInt(poi.scoreCount) + 1;
		}
		Dom.get('mymove_msg_text').innerHTML = '評分完成!';
		AlertMsgPanel.show();
	},

	failureHandler: function(o){
		alert('AJAX Connection Failure !!');
	}
};

//**********************************************
//POI Comment App.
//**********************************************

PoiCommentApp = {
	init: function() {
	
		//** Event Control.
		Event.on('poi_com_sent_btn', 'click', this.addComment);
		Event.on('poi_com_cancel_btn', 'click', function(){
			Dom.get('poi_com_content').value = '';
		});
	},

	fillList: function(comments) {
		
		Dom.get('poi_comment_list').innerHTML = '';
		
		if (comments) {
			for (var i = 0; i < comments.length; i++) {
				PoiCommentApp.appendBrick(comments[i]);
			}
		}
	},

	appendBrick: function(comment) {
		if (comment.status == 2) return false;
		
		var baseEl = document.createElement('div');
		baseEl.className = 'm_sub_dis_list';

		var leftEl = document.createElement('div');
		leftEl.className = 'm_sub_dis_list_left';
		var imgEl = document.createElement('img');
		var authorIconSrc = '/wps/themes/html/iMove/img/mem_icon.gif';
		if (comment.memberData.photoFile) {
			authorIconSrc = GetFileServlet + '?ACTION=VIEWCALBUM&FILENAME=' + comment.memberData.photoFile.fileName + '&SOURCEDIR=' + comment.memberData.photoFile.destDir;
		}
		imgEl.src = authorIconSrc;
		imgEl.width = '60';
		imgEl.height = '60';
		leftEl.appendChild(imgEl);

		var rightEl = document.createElement('div');
		rightEl.className = 'm_sub_dis_list_right';
		//** compose author info.
		var infoEl = document.createElement('p');
		var memberEl = document.createElement('b');
		memberEl.className = 'm_red_text3';
		Dom.setStyle(memberEl, 'margin-right', '5px');
		memberEl.innerHTML = comment.memberData.accountId;
		var fontEl = document.createElement('font');
		fontEl.color = '#C97050';
		var timeEl = document.createTextNode('於' + comment.createdTime.substring(0, 19) + ' 回應:');
		fontEl.appendChild(timeEl);
		infoEl.appendChild(memberEl);
		infoEl.appendChild(fontEl);
		//** compose content.
		var contentEl = document.createElement('p');
		contentEl.innerHTML = comment.content;
		//** compose right block
		rightEl.appendChild(infoEl);
		rightEl.appendChild(contentEl);

		baseEl.appendChild(leftEl);
		baseEl.appendChild(rightEl);

		Dom.get('poi_comment_list').appendChild(baseEl);
	},

	reset: function() {
		
		if (Dom.get('m_sub_message_container'))	{
			Dom.get('poi_com_textarea').innerHTML = '<textarea id=poi_com_content cols=70 rows=2></textarea>';
			Dom.setStyle('poi_com_sent_btn', 'display', '');
			Dom.setStyle('poi_com_cancel_btn', 'display', '');
			Dom.setStyle('poi_commentWait', 'display', 'none');
		}
	},

	addComment: function() {
		Dom.setStyle('poi_com_sent_btn', 'display', 'none');
		Dom.setStyle('poi_com_cancel_btn', 'display', 'none');
		Dom.setStyle('poi_commentWait', 'display', '');

		var content = Dom.get('poi_com_content').value;
		if (content.length < 10) {
			Dom.get('mymove_msg_text').innerHTML = '請輸入超過10字!';
			AlertMsgPanel.show();
			PoiCommentApp.reset();
			Dom.get('poi_com_content').value = content;
			return false;
		}
		if (content.length > 300) {
			Dom.get('mymove_msg_text').innerHTML = '請輸入少於300字!';
			AlertMsgPanel.show();
			PoiCommentApp.reset();
			Dom.get('poi_com_content').value = content;
			return false;
		}
		
		content = content.replace(/[&]/g,'＆').replace(/[*]/g,'＊').replace(/[(]/g,'（').replace(/[)]/g,'）').replace(/[_]/g,'＿').replace(/[+]/g,'＋').replace(/[-]/g,'－');
		var postData = 'function=addComment&poiId=' + poi.poiId + '&content=' + encodeURI(content);
		YAHOO.util.Connect.asyncRequest('POST', poiAjaxServlet, { success:PoiCommentApp.successHandler, failure:PoiCommentApp.failureHandler }, postData);
	},
	
	successHandler: function(o){
		Dom.get('mymove_msg_text').innerHTML = '新增回應完成!';
		AlertMsgPanel.show();
		PoiCommentApp.reset();
		if(o.responseText !== undefined){
			var json = eval('(' + o.responseText + ')');
			PoiCommentApp.fillList(json.comments);
		}
	},

	failureHandler: function(o){
		alert('AJAX Connection Failure !!');
	}
};

//**********************************************
//POI Photo App
//**********************************************
var poiPhotos;
var poiPhotosPerPage = 3;
var poiPhotosAllPage = 1;
var poiPhotosNavPage = 1;

var s_poiPhotosPerPage = 2;
var s_poiPhotosAllPage = 1;
var s_poiPhotosNavPage = 1;

PoiPhotoApp = {
	init: function() {
		//** Event Control.
		Event.on('p_d_p_titleImg', 'click', function(){
			poiPhotoPanel.show();
			Dom.setStyle('poi_viewer_container_c', 'z-index', Dom.getStyle('poi_s_container_c', 'z-index') + 10);
		});

		Event.on('p_p_p_nav_previous', 'click', function(){
			if (poiPhotosNavPage == 1) {
				alert('已到第一頁!');
				return false;
			}
			PoiPhotoApp.movePage(poiPhotosNavPage - 1);
		});

		Event.on('p_p_p_nav_next', 'click', function(){
			if (poiPhotosNavPage == poiPhotosAllPage) {
				alert('已到最後一頁!');
				return false;
			}
			PoiPhotoApp.movePage(poiPhotosNavPage + 1);
		});

		Event.on(Dom.getElementsByClassName('p_p_p_chgImg'), 'click', function(e){
			var target = YAHOO.util.Event.getTarget(e);
			var brickSeq = parseInt(target.id.substring(12));
			var photoIdx = (poiPhotosNavPage - 1) * poiPhotosPerPage + brickSeq;
			Dom.get('p_p_p_showCurrentPhoto').src = GetFileServlet + '?ACTION=VIEWC&FILENAME=' + poiPhotos[photoIdx].picName + '&SOURCEDIR=' + poiPhotos[photoIdx].picDest;
			Dom.get('p_p_p_showCurrentIntro').innerHTML = poiPhotos[photoIdx].picDes;
		});

		Event.on('poi_morephoto_left', 'click', function(){
			if (s_poiPhotosNavPage == 1) {
				alert('已到第一頁!');
				return false;
			}
			PoiPhotoApp.s_movePage(s_poiPhotosNavPage - 1);
		});

		Event.on('poi_morephoto_right', 'click', function(){
			
			if (s_poiPhotosNavPage == s_poiPhotosAllPage) {
				alert('已到最後一頁!');
				return false;
			}
			PoiPhotoApp.s_movePage(s_poiPhotosNavPage + 1);
		});

		Event.on(Dom.getElementsByClassName('poi_p_s_zoom_img'), 'click', function(e){
			var target = YAHOO.util.Event.getTarget(e);
			var brickSeq = parseInt(target.id.substring(11));
			var photoIdx = (s_poiPhotosNavPage - 1) * s_poiPhotosPerPage + brickSeq;
			Dom.get('p_p_p_showCurrentPhoto').src = GetFileServlet + '?ACTION=VIEWC&FILENAME=' + poiPhotos[photoIdx].picName + '&SOURCEDIR=' + poiPhotos[photoIdx].picDest;
			Dom.get('p_p_p_showCurrentIntro').innerHTML = poiPhotos[photoIdx].picDes;

			//** Change NAV Photo Bar.
			PoiPhotoApp.movePage(parseInt(photoIdx/poiPhotosPerPage) + 1);
			poiPhotoPanel.show();
		});

	},

	load: function(poi) {

		poiPhotos = poi.poiPicmsts;

		var photosCount = poiPhotos.length;

		if ((photosCount%poiPhotosPerPage) == 0) poiPhotosAllPage = photosCount/poiPhotosPerPage;
		else poiPhotosAllPage = parseInt(photosCount/poiPhotosPerPage) + 1;
		
		Dom.get('poi_m_view_title_left').innerHTML = poi.display;

		Dom.setStyle('p_p_p_showCurrentPhoto', 'visibility', '');
		Dom.get('p_p_p_showCurrentPhoto').src = GetFileServlet + '?ACTION=VIEWC&FILENAME=' + poiPhotos[0].picName + '&SOURCEDIR=' + poiPhotos[0].picDest;
		Dom.get('p_p_p_showCurrentIntro').innerHTML = poiPhotos[0].picDes;

		PoiPhotoApp.movePage(1);

		//** for small photo icon slider.
		if ((photosCount%s_poiPhotosPerPage) == 0) s_poiPhotosAllPage = photosCount/s_poiPhotosPerPage;
		else s_poiPhotosAllPage = parseInt(photosCount/s_poiPhotosPerPage) + 1;

		PoiPhotoApp.s_movePage(1);
	},
	
	movePage: function(page) {

		poiPhotosNavPage = page;

		var startIdx = (page - 1) * poiPhotosPerPage;
		var brickIdx = 0;
		for (var i = startIdx; i < startIdx + poiPhotosPerPage; i++) {
			Dom.setStyle('p_p_p_navPhoto' + brickIdx, 'display', 'none');
			if (i < poiPhotos.length) {
				Dom.get('p_p_p_navImg' + brickIdx).src = GetFileServlet + '?ACTION=VIEWM&FILENAME=' + poiPhotos[i].picName + '&SOURCEDIR=' + poiPhotos[i].picDest;
				Dom.setStyle('p_p_p_navPhoto' + brickIdx, 'display', '');
			}
			brickIdx++;
		}

	},

	s_movePage: function(page) {
		s_poiPhotosNavPage = page;		
		var startIdx = (page - 1) * s_poiPhotosPerPage;
		var brickIdx = 0;		
		for (var i = startIdx; i < startIdx + s_poiPhotosPerPage; i++) {
			Dom.setStyle('poi_p_s_img' + brickIdx, 'display', 'none');
			if (i < poiPhotos.length) {
				Dom.get('poi_p_s_img' + brickIdx).src = GetFileServlet + '?ACTION=VIEWM&FILENAME=' + poiPhotos[i].picName + '&SOURCEDIR=' + poiPhotos[i].picDest;
				Dom.setStyle('poi_p_s_img' + brickIdx, 'display', '');
			}
			brickIdx++;
		}
		
		//for (var i = startIdx; i < startIdx + s_poiPhotosPerPage; i++) {
		//	Dom.setStyle(Dom.get('poi_p_s_img' + brickIdx).parentNode, 'visibility', 'hidden');
		//	if (i < poiPhotos.length) {
		//		Dom.get('poi_p_s_img' + brickIdx).src = GetFileServlet + '?ACTION=VIEWM&FILENAME=' + poiPhotos[i].picName + '&SOURCEDIR=' + poiPhotos[i].picDest;
		//		Dom.setStyle(Dom.get('poi_p_s_img' + brickIdx).parentNode, 'visibility', '');
		//	}
		//	brickIdx++;
		//}

	},

	reset: function() {
		Dom.get('poi_m_view_title_left').innerHTML = '目前無關連相簿';
		Dom.setStyle('p_p_p_showCurrentPhoto', 'visibility', 'hidden');
		Dom.get('p_p_p_showCurrentIntro').innerHTML = '';
		Dom.setStyle('p_p_p_navPhoto0', 'display', 'none');
		Dom.setStyle('p_p_p_navPhoto1', 'display', 'none');
		Dom.setStyle('p_p_p_navPhoto2', 'display', 'none');
		poiPhotosAllPage = 1;
		poiPhotosNavPage = 1;

		Dom.setStyle(Dom.get('poi_p_s_img0').parentNode, 'visibility', 'hidden');
		Dom.setStyle(Dom.get('poi_p_s_img1').parentNode, 'visibility', 'hidden');
		s_poiPhotosAllPage = 1;
		s_poiPhotosNavPage = 1;
	}
	
};

YAHOO.util.Event.onDOMReady(initPoiPanel);