Move commenting UI code into an independent .js file

[jywarren]

This has been marked as a good candidate for becoming a first-timers-only issue like these, meaning that it's simple, self-contained, and with some extra formatting, could be a great entry point for a new contributor. If you're familiar enough with this code, please consider reformatting or reposting it as a first-timers-only issue, and then ping @publiclab/reviewers to get it labelled. Or, if this is not your first time, try to solve it yourself!

---

Our commenting code is quite long and is placed inline into the comments page. We should include it using a <script> tag, and move it into this folder with other JavaScript code:

https://github.com/publiclab/plots2/blob/f423719cc77948f0e2ceb27e1e0685115841a9a5/app/assets/javascripts/

Here's the segment that should be moved:

plots2/app/views/comments/_form.html.erb

Lines 80 to 118 in f423719

	$('#text-input').bind('keypress',function(e){
	if (e.ctrlKey && e.keyCode == 10) {
	$("#comment-form .btn-primary").click();
	}
	})
	$('#comment-form').bind('ajax:beforeSend', function(event){
	$("#text-input").prop('disabled',true)
	$("#comment-form .btn-primary").button('loading',true);
	});
	$('#comment-form').bind('ajax:success', function(e, data, status, xhr){
	$('#text-input').prop('disabled',false);
	$('#text-input').val('');
	$('#comments-container').append(xhr.responseText);
	$('#comment-count')[0].innerHTML = parseInt($('#comment-count')[0].innerHTML)+1;
	$("#comment-form .btn-primary").button('reset');
	$('#preview').hide();
	$('#text-input').show();
	$('#preview-btn').button('toggle');
	});
	$('#comment-form').bind('ajax:error', function(e,response){
	notyNotification('mint', 3000, 'success', 'topRight', 'Some error occured while adding comment');
	$('#comment-form .control-group').addClass('has-error')
	$('#comment-form .control-group .help-block ').remove()
	$('#comment-form .control-group').append('<span class="help-block ">Error: there was a problem.</span>')
	});
	})();
	function insertTitleSuggestionTemplate() {
	var element = $('#text-input');
	var currentText = $('#text-input').val().trim();
	var template = "\n[propose:title]Propose your title here[/propose]";
	if(currentText.length == 0)
	template = "[propose:title]Propose your title here[/propose]";
	var newText = currentText+template;
	element.val(newText);
	}

Once it's moved into /app/assets/javascripts/comment.js, we can re-include it with this line in the _form.html.erb template:

  <%= javascript_include_tag "comment.js" %>

We'd love help with this one!

[junhouse]

@jywarren I will claim this and work on it - let me know if someone has already claimed it!

[jywarren]

Please go ahead, thanks!!!

…

On Tue, Oct 30, 2018, 5:07 PM KyungJun Kim ***@***.*** wrote: @jywarren <https://github.com/jywarren> I will claim this and work on it - let me know if someone has already claimed it! — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#3831 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AABfJ1IKFq7v6jsEyrEuPg1UPSCJuHTMks5uqL9TgaJpZM4X_vZO> .

[junhouse]

@jywarren Thanks! I just passed all the tests and updated the code. Do I need to do anything at this point? I already did the pull-request. Please let me know what to do to move forward.