165 lines
10 KiB
Plaintext
Executable File
165 lines
10 KiB
Plaintext
Executable File
.text-left
|
|
div#comment-list
|
|
|
|
script(src="https://cdn.jsdelivr.net/ramda/0.10.0/ramda.min.js")
|
|
script(src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment.min.js")
|
|
script.
|
|
var sentinel = 0;
|
|
var renderComments = function renderComments(comments, containerSelector, level) {
|
|
var commentDetails;
|
|
R.forEach(function displayComments(comment) {
|
|
|
|
$.ajax({
|
|
type: 'GET',
|
|
url: '/stories/comments/' + comment,
|
|
error: function (xhr, textStatus, errorThrown) {
|
|
commentDetails = {
|
|
error: true,
|
|
body: 'There seems to be a problem fetching this comment.'
|
|
}
|
|
},
|
|
success: function (data, textStatus, xhr) {
|
|
commentDetails = data;
|
|
var div = document.createElement('div');
|
|
var editButton = "";
|
|
// todo
|
|
if (commentDetails.author.username === DF105CFA89562196E702912B3818C6A5B46E80D262442FDF29976621E5AF0D23) {
|
|
if ((Date.now() - commentDetails.commentOn) < 600000){
|
|
editButton = "<a class='btn btn-no-shadow btn-primary btn-xs btn-primary-ghost edit-btn' id='" + commentDetails.id + "'>Edit</a> · ";
|
|
}
|
|
}
|
|
$(div)
|
|
.html(
|
|
'<div class="media media-news">' +
|
|
'<div class="media-left">' +
|
|
"<a href='/" + commentDetails.author.username + "'>" +
|
|
'<img class="media-object img-news" src="' + commentDetails.author.picture +'" alt="' + commentDetails.author.username + '">' +
|
|
'</a>' +
|
|
'</div>' +
|
|
'<div class="media-body comment_' + commentDetails.id + '">' +
|
|
'<div class="media-body-wrapper">' +
|
|
'<p>' + commentDetails.body + '</p>' +
|
|
'<h6>' +
|
|
'<div class="clearfix comment-a-comment negative-15">' +
|
|
"<a class='btn btn-no-shadow btn-primary btn-xs btn-primary-ghost' id='" + commentDetails.id + "'>Reply</a> · " +
|
|
editButton +
|
|
"commented " + moment(commentDetails.commentOn).fromNow() + " by " +
|
|
"<a href='/" + commentDetails.author.username + "'>@" + commentDetails.author.username + "</a>" +
|
|
'</div>' +
|
|
'</h6>' +
|
|
'</div>' +
|
|
'</div>' +
|
|
'</div>'
|
|
)
|
|
.addClass('comment-wrapper positive-10')
|
|
.appendTo($(containerSelector));
|
|
|
|
sentinel += commentDetails.comments.length;
|
|
|
|
renderComments(commentDetails.comments, '.comment_' + commentDetails.id, ++level);
|
|
|
|
},
|
|
complete: function () {
|
|
sentinel--;
|
|
if (!sentinel) {
|
|
$('.comment-a-comment').on('click', 'a', function() {
|
|
var editOrComment = 'comment';
|
|
if ($(this).hasClass("edit-btn")){
|
|
editOrComment = 'edit';
|
|
}
|
|
if (!isLoggedIn) {
|
|
window.location.href = '/signin';
|
|
return;
|
|
}
|
|
$(this).unbind('click');
|
|
$('.comment-to-comment-formgroup').empty();
|
|
$('#initial-comment-submit').addClass('hidden-element');
|
|
var div = document.createElement('div');
|
|
var commentId = $(this).attr('id');
|
|
$(div).html(
|
|
"<div class='formgroup comment-to-comment-formgroup control-label-story-submission'>" +
|
|
'<div class="col-xs-12">' +
|
|
"<div class='input-group'>" +
|
|
"<input class='form-control big-text-field field-responsive' id='comment-to-comment-textinput' type='text' maxlength='140' autofocus />" +
|
|
"<span class='input-group-btn'>" +
|
|
"<button id='submit-comment-to-" + editOrComment + "' class='btn btn-big btn-primary btn-responsive'>Send</button>" +
|
|
"</span>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<div id='textarea-comment-feedback'></div>" +
|
|
"</div>"
|
|
)
|
|
.addClass('row')
|
|
.appendTo($(this).closest('.media-body-wrapper'));
|
|
var text_max = 140;
|
|
$('#textarea-comment-feedback').html(text_max + ' characters remaining');
|
|
$('#comment-to-comment-textinput').keyup(function (e) {
|
|
if (e.which === 13 || e === 13) {
|
|
$('#submit-comment-to-comment').click();
|
|
$('#submit-comment-to-edit').click();
|
|
}
|
|
var text_length = $('#comment-to-comment-textinput').val().length;
|
|
var text_remaining = text_max - text_length;
|
|
$('#textarea-comment-feedback').html(text_remaining + ' characters remaining');
|
|
});
|
|
var submitCommentToCommentHandler = function submitCommentToCommentHandler() {
|
|
$('#submit-comment-to-comment').unbind('click');
|
|
$.post('/stories/comment/' + commentId + '/comment',
|
|
{
|
|
data: {
|
|
associatedPost: commentId,
|
|
originalStoryLink: originalStoryLink,
|
|
originalStoryAuthorEmail: originalStoryAuthorEmail,
|
|
body: $('#comment-to-comment-textinput').val(),
|
|
}
|
|
})
|
|
.fail(function (xhr, textStatus, errorThrown) {
|
|
$('#submit-comment-to-comment').bind('click', submitCommentToCommentHandler);
|
|
})
|
|
.done(function (data, textStatus, xhr) {
|
|
window.location.reload();
|
|
});
|
|
|
|
};
|
|
// todo
|
|
var submitCommentForEditToCommentHandler = function submitCommentForEditToCommentHandler() {
|
|
$('#submit-comment-to-edit').unbind('click');
|
|
|
|
$.ajax({
|
|
type: "PUT",
|
|
url: '/stories/comment/' + commentId + '/edit',
|
|
data: {
|
|
associatedPost: commentId,
|
|
originalStoryLink: originalStoryLink,
|
|
body: $('#comment-to-comment-textinput').val()
|
|
},
|
|
dataType: "json",
|
|
success: function (msg) {
|
|
window.location.reload();
|
|
},
|
|
error: function (err){
|
|
$('#submit-comment-to-edit').bind('click', submitCommentForEditToCommentHandler);
|
|
}
|
|
});
|
|
};
|
|
|
|
$('#submit-comment-to-edit').on('click', submitCommentForEditToCommentHandler)
|
|
$('#submit-comment-to-comment').on('click', submitCommentToCommentHandler);
|
|
});
|
|
}
|
|
}
|
|
})
|
|
|
|
|
|
}, comments);
|
|
}
|
|
sentinel += comments.length;
|
|
|
|
|
|
renderComments(comments, $('#comment-list'), 0);
|
|
|
|
|
|
|
|
|
|
|