/*
 * Needs the paginator js files.
 * Also you need some vars like these defined elsewhere for the code below to work:
 * 
	comment_count_header_name = '{{ COMMENTS_AJAX_COMMENT_COUNT_HEADER }}';
	page_count_header_name = '{{ COMMENTS_AJAX_PAGE_COUNT_HEADER }}';
	form_error_header_name = '{{ COMMENTS_AJAX_FORM_ERROR_HEADER }}';
	page_url = "{% url SpineTV.ajaxcomments.views.ajax_comments_list 'video.video' video.pk %}";
	form_target = "{% comment_form_target %}";
	current_page = '{{ comments_page }}';
	comment_max_length = '{{ COMMENT_MAX_LENGTH }}';
 * 
 */

function handler_noAction(evt) {
	alert('Your comment is too long');
	evt.cancelDefault();
	evt.stopImmediatePropagation();
	return false;
}


$(document).ready(function() {
	comments_list_selector = '.comments_list .comments_holder';
	
	// ajax paging for comment list:
	pagination_holder_selector = '.comments_pagination #content-holder';
	pageLinks_render(pagination_holder_selector, {selector: comments_list_selector, query_prefix: '?'}, current_page);
				
	// ajax posting for comment form:
	form = $('.comment_form form');
	form.submit(commentForm_onSubmit);
	form_submittable = true;
	
	// default name hint text
	name_field_selector = '.comment_form #id_name';
	$(name_field_selector).focus(function() {
		if (jQuery.trim($(this).val()) == 'anon') $(this).val('');
	}).blur(function() {
		if (jQuery.trim($(this).val()) == '') $(this).val('anon');
	}).blur();
	
	// char counter
    $('.comment_form #id_comment').after('<br/><div id="comment_char_count"></div>')
	$('.comment_form #id_comment').simplyCountable({
	    counter: '#comment_char_count',
	    countable: 'characters',
	    maxCount: comment_max_length,  
	    countDirection: 'down',
	    safeClass: 'safe',
	    overClass: 'over'
	}).bind('countable_Over', function() {
		form_submittable = false;
	}).bind('countable_Safe', function() {
		form_submittable = true;
	});
});


function commentForm_onSubmit(evt) {
	evt.preventDefault();
	if (form_submittable) {
		form.fadeTo('medium', 0, function() {
			form_submittable = false;
			xhr = $.ajax({  
		        type: "POST",  
		        data: form.serialize(),  
		        url: form_target,  
		        cache: false,  
		        dataType: "html",  
		        success: function(html, textStatus) {
		            form.get(0).reset();
		            $(name_field_selector).blur();
		            $('.comment_form #id_comment').trigger('keyup');
		            
		            $('.comment_message').empty().append(html); // may contain validation error msg
		            page_count = xhr.getResponseHeader(page_count_header_name);
		            var num_comments = xhr.getResponseHeader(comment_count_header_name);
		            var form_error = xhr.getResponseHeader(form_error_header_name);
		            if (!form_error) {
			            pagination_loadPage(comments_list_selector, '?', 1) // reload the latest comments
			            $('.comment_count').empty().append('('+num_comments+')');
			            pageLinks_render(pagination_holder_selector, {selector: comments_list_selector, query_prefix: '?'}, current_page);
			            document.location = '#comments';
		            } else {
		            	document.location = '#comment_message';
		            }
		        },  
		        error: function (XMLHttpRequest, textStatus, errorThrown) {
		            $('.comment_message').empty().append('<h3>Your comment was unable to be posted at this time. We apologise for the inconvenience.</h3>');  
	            	document.location = '#comment_message';
		        },
		        complete: function() {
		    		form_submittable = true;
					form.fadeTo('medium', 100);
		        }
		    });
		});
	}
  }