From f367a0310ee89edceeca5ed8feeca5a0af9a2858 Mon Sep 17 00:00:00 2001
From: Nathan Leniz <terakilobyte@gmail.com>
Date: Sun, 8 Mar 2015 16:50:51 +0900
Subject: [PATCH] Finalizing display issues for news release

---
 controllers/resources.js       | 50 +++++++++++++++++++++++++---
 controllers/story.js           |  3 +-
 controllers/user.js            | 14 +++++---
 models/Comment.js              |  9 +++++-
 models/Story.js                | 13 ++++++++
 public/css/main.less           | 12 +++++++
 views/stories/comments.jade    | 42 +++++++++++-------------
 views/stories/hot-stories.jade |  1 +
 views/stories/new-stories.jade | 59 ++++++++++++++++++----------------
 views/stories/show.jade        | 20 +++++++++---
 10 files changed, 156 insertions(+), 67 deletions(-)

diff --git a/controllers/resources.js b/controllers/resources.js
index cf716d4d34..b47a273158 100644
--- a/controllers/resources.js
+++ b/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);
+        }
     }
 };
-
-
-
diff --git a/controllers/story.js b/controllers/story.js
index 5bbca93aad..b3eab98834 100644
--- a/controllers/story.js
+++ b/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});
diff --git a/controllers/user.js b/controllers/user.js
index c7947d53a9..c0da54bf47 100644
--- a/controllers/user.js
+++ b/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);
-          req.flash('success', {msg: 'Profile information updated.'});
-          res.redirect('/account');
+            if (err) {
+                return next(err);
+            }
+            req.flash('success', {msg: 'Profile information updated.'});
+            res.redirect('/account');
+            resources.updateUserStoryPictures(user._id.toString(), user.profile.picture);
         });
       });
     });
diff --git a/models/Comment.js b/models/Comment.js
index 8af4aaefcf..89d1804654 100644
--- a/models/Comment.js
+++ b/models/Comment.js
@@ -29,4 +29,11 @@ var commentSchema = new mongoose.Schema({
     }
 });
 
-module.exports = mongoose.model('Comment', commentSchema);
\ No newline at end of file
+module.exports = mongoose.model('Comment', commentSchema);
+
+/*
+ author: {
+ type: mongoose.Schema.Types.ObjectId,
+ ref: 'User'
+ },
+ */
\ No newline at end of file
diff --git a/models/Story.js b/models/Story.js
index 902ff2c893..76d95471a5 100644
--- a/models/Story.js
+++ b/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'
+ }
+ },
+ */
diff --git a/public/css/main.less b/public/css/main.less
index b3e4ad7bb4..c12a897789 100644
--- a/public/css/main.less
+++ b/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;
diff --git a/views/stories/comments.jade b/views/stories/comments.jade
index f916e041a5..b85cd7e7e0 100644
--- a/views/stories/comments.jade
+++ b/views/stories/comments.jade
@@ -25,35 +25,29 @@
                             var div = document.createElement('div');
                             $(div)
                                     .html(
-                                    "<div class='comment row col-xs-12'>" +
-                                        "<div class='col-xs-1'>" +
-                                            "<img class='img-responsive' src=" + commentDetails.author.picture + "></img>" +
-                                        "</div>" +
-                                        "<div class='col-xs-10'>" +
-                                            "<div class='row'>" +
-                                                "<div class='col-xs-12'>" +
-                                                    commentDetails.body +
-                                                "</div>" +
+                                        "<div class='comment row col-xs-12'>" +
+                                            "<div class='col-xs-1'>" +
+                                                "<img class='img-news' src=" + commentDetails.author.picture + "></img>" +
                                             "</div>" +
-                                            "<div class='row'>" +
-                                                "<h6>" +
-                                                    "<div class='col-xs-12 negative-15'>" +
-                                                        "commented " + moment(commentDetails.commentedOn).fromNow() + " by " +
-                                                        "<a href='/" + commentDetails.author.username + "'>@" + commentDetails.author.username + "</a>" +
+                                            "<div class='col-xs-10'>" +
+                                                "<div class='row'>" +
+                                                    "<div class='col-xs-12'>" +
+                                                        commentDetails.body +
                                                     "</div>" +
-                                                "</h6>" +
-                                            "</div>" +
-                                            "<div class='row negative-20'>" +
-                                                "<div class='col-xs-6 comment-a-comment'>" +
+                                                "</div>" +
+                                                "<div>" +
                                                     "<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>"
-                            )
-                                    .addClass(offSetClass + ' row ' + rowClass + ' comment_' + commentDetails._id)
+                                        "</div>"
+                                    )
+                                    .addClass('comment-wrapper 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>"
                                     )
diff --git a/views/stories/hot-stories.jade b/views/stories/hot-stories.jade
index 501bb25d5c..9949b3deb6 100644
--- a/views/stories/hot-stories.jade
+++ b/views/stories/hot-stories.jade
@@ -1,3 +1,4 @@
+.spacer
 .col-xs-12
     #story-list.story-list
 
diff --git a/views/stories/new-stories.jade b/views/stories/new-stories.jade
index bf3f2c022e..93b9b25e58 100644
--- a/views/stories/new-stories.jade
+++ b/views/stories/new-stories.jade
@@ -1,10 +1,12 @@
-h3
-    ul#story-list.story-list
+.spacer
+.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-3 col-sm-1'>" +
-                                   "<div class='positive-5'>" +
-                                        "<span>" + rank + "</span>" +
+                                "<div class='col-xs-12 text-left'>" +
+                                    "<div class='col-xs-1 col-sm-1 positive-5'>" +
+                                        (i + 1) +
                                     "</div>" +
-                                "</div>" +
-                                "<div class='col-xs-2 col-sm-1'>" +
-                                    "<img src='" + data[i].author.picture + "' class='img-responsive'/>" +
-                                "</div>" +
-                                "<div class='col-xs-7 col-sm-10'>" +
-                                    "<div class='row'>" +
-                                        "<div class='col-xs-12'>" +
-                                            "<a href='/stories/" + linkedName + "'>"
-                                            + data[i].storyLink +
-                                            "</a>" +
+                                    "<div class='col-xs-2 col-sm-1'>" +
+                                        "<img src='" + data[i].author.picture + "' class='img-news'/>" +
+                                    "</div>" +
+                                    "<div class='col-xs-9 col-sm-10'>" +
+                                        "<div class='row'>" +
+                                            "<div class='col-xs-12'>" +
+                                                "<a href='/stories/" + linkedName + "'>"
+                                                    + data[i].storyLink +
+                                                "</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>"
-                            )
-                            $(li).appendTo($('#story-list'));
+                                "</div>"
+                            );
+                            $(div).addClass('story-list')
+                            $(div).appendTo($('#story-list'));
                         }
                     });
\ No newline at end of file
diff --git a/views/stories/show.jade b/views/stories/show.jade
index 59764476c1..0d1d20cf08 100644
--- a/views/stories/show.jade
+++ b/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 &nbsp;by&nbsp;
-                            a(href="/" + author.username) @#{author.username}
+                            a(href="/" + author.username)
+                            |  @#{author.username}
+                            |  &nbsp;·&nbsp;
+                            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