Finalizing display issues for news release

controllers/resources.js

@@ -1,6 +1,8 @@
 var User = require('../models/User'),
     Challenge = require('./../models/Challenge'),
     Bonfire = require('./../models/Bonfire'),
+    Story = require('./../models/Story'),
+    Comment = require('./../models/Comment'),
     resources = require('./resources.json'),
     questions = resources.questions,
     steps = resources.steps,
@@ -11,7 +13,8 @@ var User = require('../models/User'),
     https = require('https'),
     debug = require('debug')('freecc:cntr:resources'),
     cheerio = require('cheerio'),
-    request = require('request');
+    request = require('request'),
+    R = require('ramda');
 
 /**
  * GET /
@@ -283,8 +286,47 @@ module.exports = {
                 }
             });
         })();
+    },
+    updateUserStoryPictures: function(userId, picture) {
+
+        var counter = 0,
+            foundStories,
+            foundComments;
+
+        Story.find({'author.userId': userId}, function(err, stories) {
+            if (err) {
+                throw err;
+            }
+            foundStories = stories;
+            counter++;
+            saveStoriesAndComments();
+        });
+        Comment.find({'author.userId': userId}, function(err, comments) {
+            if (err) {
+                throw err;
+            }
+            foundComments = comments;
+            counter++;
+            saveStoriesAndComments();
+        });
+
+        function saveStoriesAndComments() {
+            if (counter !== 2) {
+                return;
+            }
+            R.forEach(function(comment) {
+                comment.author.picture = picture;
+                comment.markModified('author');
+                comment.save();
+            }, foundComments);
+
+            R.forEach(function(story) {
+                story.author.picture = picture;
+                debug('This is a story', story);
+                debug(story.author.picture);
+                story.markModified('author');
+                story.save();
+            }, foundStories);
+        }
     }
 };
-
-
-

controllers/story.js

@@ -7,7 +7,8 @@ var R = require('ramda'),
     resources = require('./resources'),
     mongodb = require('mongodb'),
     MongoClient = mongodb.MongoClient,
-    secrets = require('../config/secrets');
+    secrets = require('../config/secrets'),
+    User = require('./../models/User');
 
 exports.hotJSON = function(req, res, next) {
     var story = Story.find({}).sort({'rank': -1, 'timePosted': -1});

controllers/user.js

@@ -7,7 +7,8 @@ var _ = require('lodash'),
     secrets = require('../config/secrets'),
     moment = require('moment'),
     Challenge = require('./../models/Challenge'),
-    debug = require('debug')('freecc:cntr:challenges');
+    debug = require('debug')('freecc:cntr:challenges')
+    resources = require('./resources');
 
 //TODO(Berks): Refactor to use module.exports = {} pattern.
 
@@ -314,7 +315,7 @@ exports.postUpdateProfile = function(req, res, next) {
           return next(err);
         }
         var user = req.user;
-        if (existingUsername && existingUsername.profile.username != user.profile.username) {
+        if (existingUsername && existingUsername.profile.username !== user.profile.username) {
           req.flash('errors', {
             msg: 'An account with that username already exists.'
           });
@@ -343,9 +344,12 @@ exports.postUpdateProfile = function(req, res, next) {
 
 
         user.save(function (err) {
-          if (err) return next(err);
+            if (err) {
-          req.flash('success', {msg: 'Profile information updated.'});
+                return next(err);
-          res.redirect('/account');
+            }
+            req.flash('success', {msg: 'Profile information updated.'});
+            res.redirect('/account');
+            resources.updateUserStoryPictures(user._id.toString(), user.profile.picture);
         });
       });
     });

models/Comment.js

@@ -30,3 +30,10 @@ var commentSchema = new mongoose.Schema({
 });
 
 module.exports = mongoose.model('Comment', commentSchema);
+
+/*
+ author: {
+ type: mongoose.Schema.Types.ObjectId,
+ ref: 'User'
+ },
+ */

models/Story.js

@@ -41,5 +41,18 @@ var storySchema = new mongoose.Schema({
     }
 });
 
+storySchema.pre('save', function(next) {
+    console.log('pre save test');
+    next();
+});
+
 module.exports = mongoose.model('Story', storySchema);
 
+/*
+ author: {
+ userId: {
+ type: mongoose.Schema.Types.ObjectId,
+ ref: 'User'
+ }
+ },
+ */

public/css/main.less

@@ -192,6 +192,10 @@ ul {
   margin-top: -35px;
 }
 
+.negative-30 {
+  margin-top: -30px;
+}
+
 .negative-5 {
   margin-top: -5px;
 }
@@ -811,6 +815,14 @@ iframe.iphone {
   height: 50px;
 }
 
+.comment-wrapper {
+  position: relative;
+}
+
+.comment + .comment-wrapper {
+  left: 3%;
+}
+
 //uncomment this to see the dimensions of all elements outlined in red
 //* {
 //  border-color: red;

views/stories/comments.jade

@@ -25,35 +25,29 @@
                             var div = document.createElement('div');
                             $(div)
                                     .html(
-                                    "<div class='comment row col-xs-12'>" +
+                                        "<div class='comment row col-xs-12'>" +
-                                        "<div class='col-xs-1'>" +
+                                            "<div class='col-xs-1'>" +
-                                            "<img class='img-responsive' src=" + commentDetails.author.picture + "></img>" +
+                                                "<img class='img-news' src=" + commentDetails.author.picture + "></img>" +
-                                        "</div>" +
-                                        "<div class='col-xs-10'>" +
-                                            "<div class='row'>" +
-                                                "<div class='col-xs-12'>" +
-                                                    commentDetails.body +
-                                                "</div>" +
                                             "</div>" +
-                                            "<div class='row'>" +
+                                            "<div class='col-xs-10'>" +
-                                                "<h6>" +
+                                                "<div class='row'>" +
-                                                    "<div class='col-xs-12 negative-15'>" +
+                                                    "<div class='col-xs-12'>" +
-                                                        "commented " + moment(commentDetails.commentedOn).fromNow() + " by " +
+                                                        commentDetails.body +
-                                                        "<a href='/" + commentDetails.author.username + "'>@" + commentDetails.author.username + "</a>" +
                                                     "</div>" +
-                                                "</h6>" +
+                                                "</div>" +
-                                            "</div>" +
+                                                "<div>" +
-                                            "<div class='row negative-20'>" +
-                                                "<div class='col-xs-6 comment-a-comment'>" +
                                                     "<h6>" +
-                                                        "<a id='" + commentDetails._id + "'>Reply</a>" +
+                                                        "<div class='col-xs-12 negative-15 comment-a-comment'>" +
+                                                            "commented " + moment(commentDetails.commentedOn).fromNow() + " by " +
+                                                            "<a href='/" + commentDetails.author.username + "'>@" + commentDetails.author.username + "</a> · " +
+                                                            "<a id='" + commentDetails._id + "'>Reply</a>" +
+                                                        "</div>" +
                                                     "</h6>" +
                                                 "</div>" +
                                             "</div>" +
-                                        "</div>" +
+                                        "</div>"
-                                    "</div>"
+                                    )
-                            )
+                                    .addClass('comment-wrapper comment_' + commentDetails._id)
-                                    .addClass(offSetClass + ' row ' + rowClass + ' comment_' + commentDetails._id)
                                     .appendTo($(containerSelector));
 
                             sentinel += commentDetails.comments.length;
@@ -70,7 +64,7 @@
                                     var commentId = $(this).attr('id');
                                     $(div).html(
                                             "<div class='formgroup'>" +
-                                                "<textarea class='form-control' id='comment-to-comment-textarea'></textarea>" +
+                                                "<textarea class='form-control' id='comment-to-comment-textarea' maxlength='500' rows='5'></textarea>" +
                                                 "<button class='btn btn-small btn-primary' id='submit-comment-to-comment'>Submit</button>" +
                                             "</div>"
                                     )

views/stories/hot-stories.jade

@@ -1,3 +1,4 @@
+.spacer
 .col-xs-12
     #story-list.story-list
 

views/stories/new-stories.jade

@@ -1,10 +1,12 @@
-h3
+.spacer
-    ul#story-list.story-list
+.col-xs-12
+    #story-list.story-list
 
         script(src="https://cdn.jsdelivr.net/ramda/0.10.0/ramda.min.js")
         script.
+
             var getLinkedName = function getLinkedName(name) {
-                return name.toLowerCase().replace(/\s/g, '-');
+                return name.trim().toLowerCase().replace(/\s/g, '-');
             }
             $.ajax({
                 url: '/stories/recentStories',
@@ -13,37 +15,38 @@ h3
                     .success(
                     function(data) {
                         for (var i = 0; i < data.length; i++) {
-                            var li  = document.createElement('li');
+                            var div  = document.createElement('div');
                             var linkedName = getLinkedName(data[i].storyLink);
                             var rank = data[i].rank;
 
-                            $(li)
+                            $(div)
                             .html(
-                            "<div class='row text-left'>" +
+                                "<div class='col-xs-12 text-left'>" +
-                                "<div class='col-xs-3 col-sm-1'>" +
+                                    "<div class='col-xs-1 col-sm-1 positive-5'>" +
-                                   "<div class='positive-5'>" +
+                                        (i + 1) +
-                                        "<span>" + rank + "</span>" +
                                     "</div>" +
-                                "</div>" +
+                                    "<div class='col-xs-2 col-sm-1'>" +
-                                "<div class='col-xs-2 col-sm-1'>" +
+                                        "<img src='" + data[i].author.picture + "' class='img-news'/>" +
-                                    "<img src='" + data[i].author.picture + "' class='img-responsive'/>" +
+                                    "</div>" +
-                                "</div>" +
+                                    "<div class='col-xs-9 col-sm-10'>" +
-                                "<div class='col-xs-7 col-sm-10'>" +
+                                        "<div class='row'>" +
-                                    "<div class='row'>" +
+                                            "<div class='col-xs-12'>" +
-                                        "<div class='col-xs-12'>" +
+                                                "<a href='/stories/" + linkedName + "'>"
-                                            "<a href='/stories/" + linkedName + "'>"
+                                                    + data[i].storyLink +
-                                            + data[i].storyLink +
+                                                "</a>" +
-                                            "</a>" +
+                                            "</div>" +
+                                            "<div class='col-xs-12'>" +
+                                                "<span>" +
+                                                    rank + " points, posted " +
+                                                    moment(data[i].timePosted).fromNow() +
+                                                    " by <a href='/" + data[i].author.username + "'>@" + data[i].author.username + "</a> " +
+                                                "</span>" +
+                                            "</div>" +
                                         "</div>" +
-                                    "<div class='col-xs-12'>" +
-                                        "<span>Posted " +
-                                            moment(data[i].timePosted).fromNow() +
-                                            " by <a href='/" + data[i].author.username + "'>@" + data[i].author.username + "</a> " +
-                                        "</span" +
                                     "</div>" +
-                                "</div>" +
+                                "</div>"
-                            "</div>"
+                            );
-                            )
+                            $(div).addClass('story-list')
-                            $(li).appendTo($('#story-list'));
+                            $(div).appendTo($('#story-list'));
                         }
                     });

views/stories/show.jade

@@ -17,7 +17,7 @@
                     h3.story-up-votes
                         span#storyRank= rank
             .col-xs-2.col-sm-1
-                img(src="#{author.picture}", class='img-responsive')
+                img(src="#{author.picture}", class='img-news')
             .col-xs-7.col-sm-10
                 .col-xs-12.negative-28
                     a(href="#{link}")
@@ -26,17 +26,29 @@
                     .col-xs-12.negative-15
                         span Posted #{timeAgo}
                         span  by 
-                            a(href="/" + author.username) @#{author.username}
+                            a(href="/" + author.username)
+                            |  @#{author.username}
+                            |   · 
+                            a#reply-to-main-post Reply
             .col-xs-10.col-xs-offset-1
                 p= description
+    .col-xs-12#reply-area
 
-    form.form-horizontal.control-label-story-submission
+
+
+    .hidden-element#initial-comment-submit
+        form.form-horizontal.control-label-story-submission
         .col-xs-12
             .form-group
-                h3.row.col-xs-12
+                h3.row
                     textarea#comment-box.form-control(name="comment-box", rows=5)
                 h3.row.text-center
                     .col-xs-6.col-xs-offset-3
                         button.btn.btn-block.btn-primary#comment-button Comment
 
+    script.
+        $('#reply-to-main-post').on('click', function() {
+            $('#initial-comment-submit').removeClass('hidden-element');
+            $(this).unbind('click');
+        });
     include ./comments