gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Nesting of comments in view, disabling comment form display button on button click

Browse Source
This commit is contained in:
Nathan Leniz
2015-03-07 01:57:09 +09:00
parent 53598a8e6f
commit 6910ed0aea
6 changed files with 168 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
app.js
View File

@ -303,17 +303,22 @@ app.get(
);
app.post(
'/stories/comment/submit',
'/stories/comment/',
storyController.commentSubmit
);
app.post(
'/stories/comment/:id/comment',
storyController.commentOnCommentSubmit
);
app.get(
'/stories/submit',
storyController.submitNew
);
app.post(
'/stories/submit',
'/stories/',
storyController.storySubmission
);

31
controllers/story.js
View File

@ -183,15 +183,36 @@ exports.commentSubmit = function(req, res, next) {
rank: 0,
upvotes: 0,
author: data.author,
comments: []
comments: [],
topLevel: true
});
commentSave(comment, Story, res);
};
exports.commentOnCommentSubmit = function(req, res, next) {
var idToFind = req.params.id;
debug('idToFind', idToFind);
var data = req.body.data;
var comment = new Comment({
associatedPost: data.associatedPost,
body: data.body,
rank: 0,
upvotes: 0,
author: data.author,
comments: [],
topLevel: false
});
commentSave(comment, Comment, res);
};
function commentSave(comment, Context, res) {
comment.save(function(err, data) {
if (err) {
return res.status(500);
}
debug('this is data from save', data);
Story.find({'_id': comment.associatedPost}, function(err, associatedStory) {
try {
Context.find({'_id': comment.associatedPost}, function (err, associatedStory) {
if (err) {
return res.status(500);
}
@ -206,5 +227,9 @@ exports.commentSubmit = function(req, res, next) {
});
}
});
} catch (e) {
// delete comment
return res.status(500);
}
});
};
}

4
models/Comment.js
View File

@ -22,6 +22,10 @@ var commentSchema = new mongoose.Schema({
comments: {
type: Array,
default: []
},
toplevel: {
type: Boolean,
default: false
}
});

4
public/js/main.js
View File

@ -158,7 +158,7 @@ $(document).ready(function() {
upVotedByUsername: user.profile.username
};
$('#story-submit').unbind('click');
$.post('/stories/submit',
$.post('/stories/',
{
data: {
link: link,
@ -192,7 +192,7 @@ $(document).ready(function() {
var data = $('#comment-box').val();
$('#comment-button').unbind('click');
$.post('/stories/comment/submit',
$.post('/stories/comment/',
{
data: {
associatedPost: storyId,

3
seed_data/comments.json
View File

@ -9,6 +9,7 @@
"picture": "https://thedrinkingtraveler.files.wordpress.com/2015/02/24127-funny-grumpy-cat-memesvery-bad-morning-meme-0rlh4r5c-wallpaper-1024x1024.jpg",
"id" : "ade671aa0756dc61bd485f45"
},
"comments": []
"comments": [],
"topLevel": true
}
]

75
views/stories/comments.jade
View File

@ -1,13 +1,15 @@
p.text-left
.text-left
div#comment-list.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;
var offSetClass = level ? 'col-xs-offset-' + level : '';
var rowClass = level ? 'col-xs-' + (12 - level) : 'col-xs-12';
R.forEach(function displayComments(comment) {
console.log('this is the comment id', comment);
$.ajax({
type: 'GET',
url: '/stories/comments/' + comment,
@ -19,12 +21,10 @@ p.text-left
}
},
success: function (data, textStatus, xhr) {
console.log(data);
commentDetails = data;
var div = document.createElement('div');
$(div)
.html("<p>" +
"<div class='row col-xs-12'>" +
.html(
"<div class='col-xs-2 text-center'>" +
"<div class='row'>" +
"<div class='col-xs-12'>" +
@ -56,30 +56,69 @@ p.text-left
"<button id='" + commentDetails._id + "'>This is the world's best button</button>" +
"</div>" +
"</div>" +
"</div>" +
"</div>" +
"</p>" +
"</div>")
.appendTo($('#comment-list'));
"</div>"
)
.addClass('comment row ' + offSetClass + ' ' + rowClass + ' comment_' + commentDetails._id)
.appendTo($(containerSelector));
sentinel += commentDetails.comments.length;
renderComments(commentDetails.comments, '.comment_' + commentDetails._id, ++level);
},
complete: function () {
sentinel++;
console.log(sentinel, comments.length);
if (sentinel < comments.length) {
return;
}
sentinel--;
if (!sentinel) {
console.log('Binding click handler');
$('.comment-a-comment').on('click', 'button', function () {
console.log('clicked');
console.log($(this));
});
$(this).attr('disabled', 'disabled');
console.log('Unbinding click handler');
var div = document.createElement('div');
var commentId = $(this).attr('id');
$(div).html(
"<textarea id='comment-to-comment-textarea'></textarea>" +
"<button id='submit-comment-to-comment'>Submit it sucka</button>"
)
.addClass('col-xs-6 col-xs-offset-3')
.appendTo($(this).closest('.comment'));
var submitCommentToCommentHandler = function submitCommentToCommentHandler() {
$('#submit-comment-to-comment').unbind('click');
$.post('/stories/comment/' + commentId + '/comment',
{
data: {
associatedPost: commentId,
body: $('#comment-to-comment-textarea').val(),
author: {
picture: user.profile.picture,
userId: user._id,
username: user.profile.username
}
}
})
.fail(function (xhr, textStatus, errorThrown) {
$('#submit-comment-to-comment').bind('click', submitCommentToCommentHandler);
})
.done(function (data, textStatus, xhr) {
//window.location = '/stories/' + JSON.parse(data).storyLink;
});
};
$('#submit-comment-to-comment').on('click', submitCommentToCommentHandler);
});//
}
}
})
}, comments);
}
sentinel += comments.length;
renderComments(comments, $('#comment-list'), 0);