// JavaScript Document
$(document).ready(function(e) {	
	// account comment save data
	var insertfirstcomment = false;
	$(document).on("keydown", ".lightbox-account-comment", function(ev) {
		var keycode = (ev.keyCode ? ev.keyCode : ev.which);
		if (keycode == 13 && ev.shiftKey){
			
		} else if (keycode == 13) {
			if($.trim($(this).text()).length > 0) {
				var datasend = $.trim($(this).html().replace(/\n\r?/g, '<br>'));
				//ajax comment
				var photoid = $('.lightbox-lb-idimage-current').text();
				$.ajax({
					type: "POST",
					url: "acccommentphoto",
					data:{contentre: datasend, photore: photoid},
					success: function(response){
						// comment completed
						if(response.result == 'true') {
							var date = new Date();
							var html = '';
							html += '<div class="lightbox-friend-comment">';
								html += '<div class="lightbox-friend-avatar" style="background:url(' + $('.headerTinymanPhoto').attr('src') + ') no-repeat;"></div>';
								html += '<div class="noidungfriend">';
								html += '<div class="comment-deleted-commenphoto" iddelephoto="' + response.idcomphoto + '" title="Xóa">X</div>';
									html += '<div><a href="#" style="text-decoration:none; color:#06F;"><span>' + $('#name-account-loadinfo').text() + '</span></a>&nbsp;' + response.content + '<p style="color:#8C8C8C; font-size: 10px;">' + date.getFullYear() + '/' + (date.getMonth() + 1) + '/' +  date.getDate() + '</p></div>';
								html += '</div>';
							html += '</div>';
							
								
							if($('.account-comment-maincontents').height() < 400) {
								$('.account-comment-maincontents').append(html);
							}
							if ($('.account-comment-maincontents').height() >= 400){
								/**/
								setupScrollBar('account-comment-maincontents');
								insertfirstcomment = true;
							}
							if(insertfirstcomment == true) {
								var pane = $('.account-comment-maincontents');
								var api = pane.data('jsp');
								api.getContentPane().append(html);
								api.reinitialise();
								
								api.scrollToY(99999);
							}
							
							
							//setupScrollBar('account-comment-maincontents');
							//comment success
							$('.account-comment-maincontents').scrollTop(99999);
							$(".lightbox-account-comment").text('');
						} else {
							new Messi('Quá trình lưu trữ thông tin bình luận xảy ra xự cố, vui lòng thử lại sau!', {
								title: 'Bình Luận',
								modal: 	true, 
								titleClass: 'info', 
								buttons: [{
									id: 0, 
									label: 'Đóng', 
									val: 'X'
								}]
							});
						}
					}
					
				});
			}
		}
	});
	
	$(document).keydown(function(ev) { 
		var keycode = (ev.keyCode ? ev.keyCode : ev.which);
		if(keycode =='27'){ 
			$('.reveal-modal-bg').click();
			closelightboxshowimage();
		}
	});
	
	$(document).on("click", ".reveal-modal-bg", function(){
		closelightboxshowimage();
    });
	
	$(document).on("click", ".close-reveal-imageview", function(){
        closelightboxshowimage();
    });
	
	function closelightboxshowimage() {
		$(".reveal-modal-bg").hide();
        $("#showlightboximage").hide();
	}
	
	// next images
	$(document).on("click", ".lightbox-lb-next", function(){
		var idload = $(this).attr('id-load-next');
        alert("next");
    });
	
	// prev images
	$(document).on("click", ".lightbox-lb-prev", function(){
		var idload = $(this).attr('id-load-prev');
        alert("prev");
    });
	
	$('a[lightbox-loadimage-id]').live('click', function(e) {
		e.preventDefault();
		var idload = $(this).attr('lightbox-loadimage-id');
		resetimagelightbox();
		//load ajax 
		$.ajax({
			type: "POST",
			url: "getcommentphotoviewprofile",
			data:{idphotore: idload},
			dataType: "json",
			success: function(response){
				if(response != "null") {
					$('.lightbox-lb-idimage-current').text(idload);
					$('.reveal-modal-left').css({'background': '#eee url(' + response.photo.link +') no-repeat center', 'width': 750, 'height': 550, 'float': 'left', 'background-size': 'contain'});
					
					var html = '';
					html += '<div class="lightbox-showimage-info">' + response.photo.discription + '<p style="color:#8C8C8C; font-size: 10px;">' + response.photo.datecreate + '</p></div>';
					html += '<div class="">';
						html += '<a href="#" class="lightbox-linkphoto-like-comment" title="Thích" style="text-decoration:none; color:#06F;">Thích</a>'
					html += '</div>';
					html += '<div class="lightbox-imageview-commentmain" style="margin-top: 10px;">';
						html += '<div class="account-comment-maincontents">';
						//for load comment
						$.each(response.comments, function(entryIndex, entry){
							html += '<div class="lightbox-friend-comment">';
								html += '<div class="lightbox-friend-avatar" style="background:url(' + entry['account'].avatar + ') no-repeat;"></div>';
								html += '<div class="noidungfriend">';
								if($('#info-id-accountlogin-name').text() == entry['account'].email) {
									html += '<div class="comment-deleted-commenphoto" iddelephoto="' + entry['idcomphoto'] + '" title="Xóa">X</div>';
								} else if($('#info-id-accountlogin-name').text() == $('#info-id-account-name').text()) {
									html += '<div class="comment-deleted-commenphoto" iddelephoto="' + entry['idcomphoto'] + '" title="Xóa">X</div>';
								}
									html += '<div><a href="#" style="text-decoration:none; color:#06F;"><span>' + entry['account'].fullname + '</span></a>&nbsp;' + entry['content'] + '<p style="color:#8C8C8C; font-size: 10px;">' + entry['commentdate'] + '</p></div>';
								html += '</div>';
							html += '</div>';
						});
						// end comment
						html += '</div>';
					html += '<div class="lightbox-friend-comment"><div class="lightbox-friend-avatar" style="background:url(' + $('.headerTinymanPhoto').attr('src') + ') no-repeat; background-position: center; background-size: 100% auto;"></div><div class="lightbox-account-comment" contenteditable="true" spellcheck="false"></div></div></div>';
					
					$('.reveal-modal-right').html(html);
					//$('.account-comment-maincontents').scrollTop(99999);
					
					
					insertfirstcomment = false;
					
					if ($('.account-comment-maincontents').height() >= 400){
						setupScrollBar('account-comment-maincontents');
					}
					
					var pane = $('.account-comment-maincontents');
					var api = pane.data('jsp');
					api.scrollToY(99999);
				} else {
					$(".reveal-modal-bg").hide();
					$('#showlightboximage').hide();
					new Messi('Quá trình tải thông tin xảy ra xự cố, vui lòng thử lại sau !', {
						title: 'Tải Thông Tin',  
						modal: 	true, 
						titleClass: 'info', 
						buttons: [{
							id: 0, 
							label: 'Đóng', 
							val: 'X'
						}]
					});
				}
			}
		});
		
		return false;
	});
	
	function resetimagelightbox() {
		$('.reveal-modal-right').html('');
		// show light box
		$('#showlightboximage').css({'top': $(document).scrollTop() + 20}).show();
		$(".reveal-modal-bg").show();
	}
	
	//Scroll bar
	function setupScrollBar(selecter){
		$("." + selecter).jScrollPane({
			hideFocus: true,
			animateScroll: true,
			'showArrows': false
		});
		
		$(".jspDrag").hide();
		$(".jspScrollable").mouseenter(function(){
			$(this).find(".jspDrag").stop(true, true).fadeIn("slow");
		});
		
		$(".jspScrollable").mouseleave(function(){
			$(this).find(".jspDrag").stop(true, true).fadeOut("slow");
		});
	}
	
	
	//-------------------xoa comment photo-----------------------------
	$(document).on("click", ".comment-deleted-commenphoto", function(){
		elem = $(this);
		var idcommentphoto = elem.attr('iddelephoto');
		
		$.ajax({
			type: "POST",
			url: "ajaxdeletecommentphoto",
			data:{idcomphotore: idcommentphoto},
			success: function(response) {
				if(response == true) {
					elem.parent().parent().css({"background-color": "#FF9"}).fadeOut(300, function() {elem.hide();});
				} else {
					new Messi('Quá trình xóa bình luận hình ảnh xảy ra xự cố, vui lòng thử lại sau!', {
						title: 'Cập Nhật Bình Luận Ảnh',  
						modal: 	true, 
						titleClass: 'info', 
						buttons: [{
							id: 0, 
							label: 'Đóng', 
							val: 'X'
						}]
					});
				}
			}
		});
	});
	//----------------end xoa comment photo--------------------
});