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

get a running start on refactoring comment ui elements

Browse Source
This commit is contained in:
Michael Q Larson
2015-03-08 18:56:06 -07:00
parent 9475c2a899
commit 2f54153b16
3 changed files with 20 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
public/css/main.less
View File

@ -829,11 +829,6 @@ iframe.iphone {
width: 100%;
}
.comment-to-comment-formgroup {
width: 50%;
height: 35px;
}
.story-headline {
font-size: 20px;
}

19
views/stories/comments.jade
View File

@ -7,7 +7,6 @@
var sentinel = 0;
var renderComments = function renderComments(comments, containerSelector, level) {
var commentDetails;
var backgroundColorForCommentNestingLevel = level % 2 !== 0 ? 'odd' : 'even';
R.forEach(function displayComments(comment) {
$.ajax({
@ -61,13 +60,17 @@
var div = document.createElement('div');
var commentId = $(this).attr('id');
$(div).html(
"<div class='formgroup comment-to-comment-formgroup'>" +
"<text class='form-control' id='comment-to-comment-textarea' maxlength='140' autofocus></textarea>" +
'<span class="pull-left" id="textarea_feedback"></span>' +
"<button class='btn btn-small btn-primary pull-right' id='submit-comment-to-comment'>Submit</button>" +
'</div>' +
"</div>"
"<div class='formgroup comment-to-comment-formgroup'>" +
"<div class=col-xs-12" +
"<div class='input-group'>" +
"<input class='form-control' id='comment-to-comment-textarea' type='text' maxlength='140' autofocus />" +
"</div>" +
"</div>" +
"<span class='input-group-btn'>" +
"<button id='submit-comment-to-comment' class='btn btn-big btn-primary btn-responsive' type='button'>Send</button>" +
"</span>" +
"<span class='pull-left' id='textarea_feedback'></span>" +
"</div>"
)
.addClass('row')
.appendTo($(this).closest('.media-body-wrapper'));

10
views/stories/show.jade
View File

@ -41,10 +41,18 @@
input#comment-box.big-text-field.field-responsive.form-control(type='text', placeholder='Enter your reply', autofocus)
span.input-group-btn
button#comment-button.btn.btn-big.btn-primary.btn-responsive(type='button') Send
span.pull-left#textarea_feedback
script.
$('#reply-to-main-post').on('click', function() {
$('#initial-comment-submit').removeClass('hidden-element');
$(this).unbind('click');
$('.comment-to-comment-formgroup').empty();
});
var text_max = 140;
$('#textarea_feedback').html(text_max + ' characters remaining');
$('#comment-box').keyup(function () {
var text_length = $('#comment-box').val().length;
var text_remaining = text_max - text_length;
$('#textarea_feedback').html(text_remaining + ' characters remaining');
});
include ./comments