From d8b8373b7036d552c0f7b43480624b6f77fbdd24 Mon Sep 17 00:00:00 2001 From: Michael Q Larson Date: Tue, 3 Mar 2015 19:55:04 -0800 Subject: [PATCH] do some refactoring of the camper news views --- controllers/story.js | 16 +++--- models/Story.js | 4 ++ public/css/main.less | 9 +++- public/js/application.js | 2 +- seed_data/stories.json | 49 ++++++++++-------- views/partials/navbar.jade | 2 +- views/post/posts.jade | 37 -------------- views/post/show.jade | 47 ----------------- views/{post => stories}/comments.jade | 0 views/{post => stories}/index.jade | 2 +- views/stories/show.jade | 74 +++++++++++++++++++++++++++ views/stories/stories.jade | 52 +++++++++++++++++++ 12 files changed, 176 insertions(+), 118 deletions(-) delete mode 100644 views/post/posts.jade delete mode 100644 views/post/show.jade rename views/{post => stories}/comments.jade (100%) rename views/{post => stories}/index.jade (86%) create mode 100644 views/stories/show.jade create mode 100644 views/stories/stories.jade diff --git a/controllers/story.js b/controllers/story.js index e32a81aba0..36ae133107 100644 --- a/controllers/story.js +++ b/controllers/story.js @@ -1,14 +1,11 @@ var R = require('ramda'), - debug = require('debug')('freecc:cntr:post'), + debug = require('debug')('freecc:cntr:story'), Story = require('./../models/Story'), Comment = require('./../models/Comment'), User = require('./../models/User'), + moment = require('../public/js/lib/moment/moment.js'), resources = require('./resources'); -/** - * Post Controller - */ - exports.json = function(req, res, next) { var story = Story.find({}).sort({'rank': -1}); story.exec(function(err, stories) { @@ -25,7 +22,7 @@ exports.index = function(req, res, next) { if (err) { throw err; } - res.render('post/index'); + res.render('stories/index'); }); }; @@ -55,16 +52,17 @@ exports.returnIndividualStory = function(req, res, next) { } debug('Story', story); - res.render('post/show', { + res.render('stories/show', { title: story.headline, - dashedName: story.link, + link: story.link, author: story.author, body: story.body, rank: story.rank, upVotes: story.upVotes, comments: story.comments, id: story._id, - user: req.user + user: req.user, + timeAgo: moment(story.timePosted).fromNow() }); }); }; diff --git a/models/Story.js b/models/Story.js index ba000b0a7d..79e41d774e 100644 --- a/models/Story.js +++ b/models/Story.js @@ -6,6 +6,10 @@ var storySchema = new mongoose.Schema({ type: String, unique: false }, + timePosted: { + type: Number, + default: 0 + }, link: { type: String, unique: false diff --git a/public/css/main.less b/public/css/main.less index d22fc4ea05..027540edec 100644 --- a/public/css/main.less +++ b/public/css/main.less @@ -719,7 +719,6 @@ iframe.iphone { -ms-transition: background .2s ease-in-out, border .2s ease-in-out; -o-transition: background .2s ease-in-out, border .2s ease-in-out; transition: background .2s ease-in-out, border .2s ease-in-out; - } .hamburger { @@ -751,6 +750,14 @@ iframe.iphone { .big-ion-up-arrow { font-size: 45px; margin-top: -10px; + text-align: center; + margin-bottom: -15px; +} + +.story-up-votes { + padding-top: 0px; + margin-left: -5px; + text-align: center; } //uncomment this to see the dimensions of all elements outlined in red diff --git a/public/js/application.js b/public/js/application.js index f792928b2b..eeebfa316b 100644 --- a/public/js/application.js +++ b/public/js/application.js @@ -15,5 +15,5 @@ //= require lib/jquery-2.1.1.min //= require lib/bootstrap.min -//= require lib/together/togetherjs +//= require lib/moment/moment //= require main diff --git a/seed_data/stories.json b/seed_data/stories.json index fd1a3a1c4f..ccaedb7bd7 100644 --- a/seed_data/stories.json +++ b/seed_data/stories.json @@ -5,36 +5,39 @@ "body": "cats love keyboards you know", "rank": 0, "upVotes": [], + "timePosted": 1425429660000, "author": { - "username": "terakilobyte", + "username": "testuser", "userId": "a2ad135e2aa27c14fc73ee11", - "picture": "https://www.google.com/search?q=cat+photo+google+images&tbm=isch&imgil=7dFgV4OZlJObjM%253A%253BDGoqtUgH7IKDWM%253Bhttp%25253A%25252F%25252Fwww.wired.co.uk%25252Fnews%25252Farchive%25252F2012-06%25252F26%25252Fgoogle-brain-recognises-cats&source=iu&pf=m&fir=7dFgV4OZlJObjM%253A%252CDGoqtUgH7IKDWM%252C_&usg=__yxi54C0GOssHCOLnh1StLAH7KNk%3D&biw=1920&bih=981&ved=0CDYQyjc&ei=n3n1VL6ENcHZoATjvYDABQ#imgrc=7dFgV4OZlJObjM%253A%3BDGoqtUgH7IKDWM%3Bhttp%253A%252F%252Fcdni.wired.co.uk%252F620x413%252Fs_v%252Fshutterstock_65735200.jpg%3Bhttp%253A%252F%252Fwww.wired.co.uk%252Fnews%252Farchive%252F2012-06%252F26%252Fgoogle-brain-recognises-cats%3B620%3B413" + "picture": "http://www.cutecatgifs.com/wp-content/uploads/2013/11/little_guy_sleeping_in_lap.gif" }, "comments": [] }, - { - "headline": "Cat sits on keyboard 1", - "link": "http://kotaku.com/5991046/why-cats-love-sitting-on-keyboards", - "body": "cats love keyboards you know", - "rank": 1, - "upVotes": [], - "author": { - "username": "terakilobyte", - "userId": "a2ad135e2aa27c14fc73ee22", - "picture": "https://www.google.com/search?q=cat+photo+google+images&tbm=isch&imgil=7dFgV4OZlJObjM%253A%253BDGoqtUgH7IKDWM%253Bhttp%25253A%25252F%25252Fwww.wired.co.uk%25252Fnews%25252Farchive%25252F2012-06%25252F26%25252Fgoogle-brain-recognises-cats&source=iu&pf=m&fir=7dFgV4OZlJObjM%253A%252CDGoqtUgH7IKDWM%252C_&usg=__yxi54C0GOssHCOLnh1StLAH7KNk%3D&biw=1920&bih=981&ved=0CDYQyjc&ei=n3n1VL6ENcHZoATjvYDABQ#imgrc=7dFgV4OZlJObjM%253A%3BDGoqtUgH7IKDWM%3Bhttp%253A%252F%252Fcdni.wired.co.uk%252F620x413%252Fs_v%252Fshutterstock_65735200.jpg%3Bhttp%253A%252F%252Fwww.wired.co.uk%252Fnews%252Farchive%252F2012-06%252F26%252Fgoogle-brain-recognises-cats%3B620%3B413" - }, - "comments": [] + { + "headline": "Cat sits on keyboard 1", + "link": "http://kotaku.com/5991046/why-cats-love-sitting-on-keyboards", + "body": "cats love keyboards you know", + "rank": 1, + "upVotes": [], + "timePosted": 1425429660000, + "author": { + "username": "testuser", + "userId": "a2ad135e2aa27c14fc73ee22", + "picture": "http://www.cutecatgifs.com/wp-content/uploads/2013/11/little_guy_sleeping_in_lap.gif" }, + "comments": [] + }, { "headline": "Cat sits on keyboard 3", "link": "http://kotaku.com/5991046/why-cats-love-sitting-on-keyboards", "body": "cats love keyboards you know", "rank": 3, "upVotes": [], + "timePosted": 1425429660000, "author": { - "username": "terakilobyte", + "username": "testuser", "userId": "a2ad135e2aa27c14fc73ee33", - "picture": "https://www.google.com/search?q=cat+photo+google+images&tbm=isch&imgil=7dFgV4OZlJObjM%253A%253BDGoqtUgH7IKDWM%253Bhttp%25253A%25252F%25252Fwww.wired.co.uk%25252Fnews%25252Farchive%25252F2012-06%25252F26%25252Fgoogle-brain-recognises-cats&source=iu&pf=m&fir=7dFgV4OZlJObjM%253A%252CDGoqtUgH7IKDWM%252C_&usg=__yxi54C0GOssHCOLnh1StLAH7KNk%3D&biw=1920&bih=981&ved=0CDYQyjc&ei=n3n1VL6ENcHZoATjvYDABQ#imgrc=7dFgV4OZlJObjM%253A%3BDGoqtUgH7IKDWM%3Bhttp%253A%252F%252Fcdni.wired.co.uk%252F620x413%252Fs_v%252Fshutterstock_65735200.jpg%3Bhttp%253A%252F%252Fwww.wired.co.uk%252Fnews%252Farchive%252F2012-06%252F26%252Fgoogle-brain-recognises-cats%3B620%3B413" + "picture": "http://www.cutecatgifs.com/wp-content/uploads/2013/11/little_guy_sleeping_in_lap.gif" }, "comments": [] }, @@ -44,12 +47,15 @@ "body": "ipsizzle dolizzle sit amet, ghetto adipiscing elit. Nullam fo shizzle velizzle, aliquet volutpizzle, suscipizzle shiz, gravida vizzle, arcu. Pellentesque izzle tortor. Sizzle doggy. Boom shackalack izzle dolizzle dapibizzle ass tempizzle tellivizzle. Ma nizzle we gonna chung shiz izzle tellivizzle. Vestibulum dizzle tortor. Pellentesque pimpin' rhoncus you son of a bizzle. In dizzle habitasse platea dictumst. Donec dapibizzle. Curabitizzle pot yippiyo, pretizzle da bomb, mattis izzle, da bomb vitae, nunc. Ass suscipizzle. Cool sempizzle bow wow wow sed purus.", "rank": 20, "upVotes": [], + "timePosted": 1425429660000, "author": { - "username": "terakilobyte", + "username": "testuser", "userId": "a2ad135e2aa27c14fc73ee44", - "picture": "https://www.google.com/search?q=cat+photo+google+images&tbm=isch&imgil=7dFgV4OZlJObjM%253A%253BDGoqtUgH7IKDWM%253Bhttp%25253A%25252F%25252Fwww.wired.co.uk%25252Fnews%25252Farchive%25252F2012-06%25252F26%25252Fgoogle-brain-recognises-cats&source=iu&pf=m&fir=7dFgV4OZlJObjM%253A%252CDGoqtUgH7IKDWM%252C_&usg=__yxi54C0GOssHCOLnh1StLAH7KNk%3D&biw=1920&bih=981&ved=0CDYQyjc&ei=n3n1VL6ENcHZoATjvYDABQ#imgrc=7dFgV4OZlJObjM%253A%3BDGoqtUgH7IKDWM%3Bhttp%253A%252F%252Fcdni.wired.co.uk%252F620x413%252Fs_v%252Fshutterstock_65735200.jpg%3Bhttp%253A%252F%252Fwww.wired.co.uk%252Fnews%252Farchive%252F2012-06%252F26%252Fgoogle-brain-recognises-cats%3B620%3B413" + "picture": "http://www.cutecatgifs.com/wp-content/uploads/2013/11/little_guy_sleeping_in_lap.gif" }, - "comments": ["54f61b0e43f0c2b90f162ec4"] + "comments": [ + "54f61b0e43f0c2b90f162ec4" + ] }, { "headline": "Cat sits on keyboard 2", @@ -57,10 +63,11 @@ "body": "cats love keyboards you know", "rank": 2, "upVotes": [], + "timePosted": 1425429660000, "author": { - "username": "terakilobyte", + "username": "testuser", "userId": "a2ad135e2aa27c14fc73ee55", - "picture": "https://www.google.com/search?q=cat+photo+google+images&tbm=isch&imgil=7dFgV4OZlJObjM%253A%253BDGoqtUgH7IKDWM%253Bhttp%25253A%25252F%25252Fwww.wired.co.uk%25252Fnews%25252Farchive%25252F2012-06%25252F26%25252Fgoogle-brain-recognises-cats&source=iu&pf=m&fir=7dFgV4OZlJObjM%253A%252CDGoqtUgH7IKDWM%252C_&usg=__yxi54C0GOssHCOLnh1StLAH7KNk%3D&biw=1920&bih=981&ved=0CDYQyjc&ei=n3n1VL6ENcHZoATjvYDABQ#imgrc=7dFgV4OZlJObjM%253A%3BDGoqtUgH7IKDWM%3Bhttp%253A%252F%252Fcdni.wired.co.uk%252F620x413%252Fs_v%252Fshutterstock_65735200.jpg%3Bhttp%253A%252F%252Fwww.wired.co.uk%252Fnews%252Farchive%252F2012-06%252F26%252Fgoogle-brain-recognises-cats%3B620%3B413" + "picture": "http://www.cutecatgifs.com/wp-content/uploads/2013/11/little_guy_sleeping_in_lap.gif" }, "comments": [] } diff --git a/views/partials/navbar.jade b/views/partials/navbar.jade index 221abeebf0..9c19b96b52 100644 --- a/views/partials/navbar.jade +++ b/views/partials/navbar.jade @@ -16,7 +16,7 @@ li a(href='/chat') Chat li - a(href='http://forum.freecodecamp.com' target='_blank') Forum + a(href='/stories') News li a(href='/bonfires') Bonfires if !user diff --git a/views/post/posts.jade b/views/post/posts.jade deleted file mode 100644 index 84ddbedb23..0000000000 --- a/views/post/posts.jade +++ /dev/null @@ -1,37 +0,0 @@ -h3 - ul#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, '-'); - } - $.ajax({ - url: '/stories/index', - type: 'GET' - }) - .success( - function(data) { - for (var i = 0; i < data.length; i++) { - var li = document.createElement('li'); - var linkedName = getLinkedName(data[i].headline); - var rank = data[i].rank; - - $(li).html("
" + - "
" + - "" + - "
" + - "" + - "
" + - "
" + - "
" + rank + "
" + - "
" + data[i].author.username + "
" + - "
" + - ""); - $(li).appendTo($('#story-list')); - } - }); \ No newline at end of file diff --git a/views/post/show.jade b/views/post/show.jade deleted file mode 100644 index 3ce14c3c13..0000000000 --- a/views/post/show.jade +++ /dev/null @@ -1,47 +0,0 @@ -extends ../layout -block content - script. - var challengeName = 'Camper News'; - var storyId = !{JSON.stringify(id)}; - var comments = !{JSON.stringify(comments)}; - var upVotes = !{JSON.stringify(upVotes)}; - - .jumbotron - .row - .col-xs-2(style='position: relative; top: 50%; -webkit-transform: translateY(50%); -ms-transform: translateY(50%);transform: translateY(50%);') - h3 - a#upvote - i.ion-arrow-up-b - .col-xs-10.text-center - h1= title - .row - .col-xs-2 - h3#storyRank= rank - - .col-xs-10.text-center - h3= body - .row.negative-35 - h3.col-xs-12.col-md-6.col-lg-5.text-center Comments - .row - .col-xs-12.col-md-6.col-lg-5 - textarea#comment-box.form-control(name="comment-box", rows=5) - if (user) - script. - var user = !{JSON.stringify(user)}; - $('#upvote').unbind('click'); - .row - .col-xs-12.col-md-7.col-lg-4.text-left - include ./comments - - - - - -// - title: story.headline, - dashedName: story.link, - author: story.author, - body: story.body, - rank: story.rank, - upVotes: story.upVotes, - comments: story.comments \ No newline at end of file diff --git a/views/post/comments.jade b/views/stories/comments.jade similarity index 100% rename from views/post/comments.jade rename to views/stories/comments.jade diff --git a/views/post/index.jade b/views/stories/index.jade similarity index 86% rename from views/post/index.jade rename to views/stories/index.jade index 6f4656f1d2..a155c1de1d 100644 --- a/views/post/index.jade +++ b/views/stories/index.jade @@ -5,4 +5,4 @@ block content .panel.panel-info .panel-heading.text-center Camper News .panel-body.hug-top - include ./posts \ No newline at end of file + include ./stories \ No newline at end of file diff --git a/views/stories/show.jade b/views/stories/show.jade new file mode 100644 index 0000000000..266568f304 --- /dev/null +++ b/views/stories/show.jade @@ -0,0 +1,74 @@ +extends ../layout +block content + script. + var challengeName = 'Camper News'; + var storyId = !{JSON.stringify(id)}; + var comments = !{JSON.stringify(comments)}; + var upVotes = !{JSON.stringify(upVotes)}; + + .panel.panel-info + .panel-heading.text-center Camper News + .panel-body + h3.row.text-left + .col-xs-3.col-sm-1 + .row + .col-xs-12.big-ion-up-arrow + i.ion-arrow-up-b + h3.story-up-votes + span= rank + .col-xs-2.col-sm-1 + img(src="#{author.picture}", class='img-responsive') + .col-xs-7.col-sm-10 + .row + .col-xs-12 + a(href="#{link}") + h3= title + .col-xs-12 + span Posted #{timeAgo} + span  by  + a(href="/" + author.username) + @#{author.username} + + + + + + + + + + + + // .col-xs-2(style='position: relative; top: 50%; -webkit-transform: translateY(50%); -ms-transform: translateY(50%);transform: translateY(50%);') + // h3 + // a#upvote + // i.ion-arrow-up-b + // .col-xs-10.text-center + // h1= title + // .row + // .col-xs-2 + // h3#storyRank= rank + // + // .col-xs-10.text-center + // h3= body + //.row.negative-35 + // h3.col-xs-12.col-md-6.col-lg-5.text-center Comments + //.row + // .col-xs-12.col-md-6.col-lg-5 + // textarea#comment-box.form-control(name="comment-box", rows=5) + //if (user) + // script. + // var user = !{JSON.stringify(user)}; + // $('#upvote').unbind('click'); + //.row + // .col-xs-12.col-md-7.col-lg-4.text-left + // include ./comments + +// + title: story.headline, + dashedName: story.link, + author: story.author, + body: story.body, + rank: story.rank, + upVotes: story.upVotes, + comments: story.comments \ No newline at end of file diff --git a/views/stories/stories.jade b/views/stories/stories.jade new file mode 100644 index 0000000000..0cb846a83c --- /dev/null +++ b/views/stories/stories.jade @@ -0,0 +1,52 @@ +h3 + ul#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, '-'); + } + $.ajax({ + url: '/stories/index', + type: 'GET' + }) + .success( + function(data) { + for (var i = 0; i < data.length; i++) { + var li = document.createElement('li'); + var linkedName = getLinkedName(data[i].headline); + var rank = data[i].rank; + + $(li).html("
" + + "
" + + "
" + + "
" + + "" + + "
" + + "
" + + "
" + + "" + rank + "" + + "
" + + "
" + + "
" + + "" + + "
" + + "
" + + "
" + + "" + + "
" + + "Posted " + + moment(data[i].timePosted).fromNow() + + " by @" + data[i].author.username + " " + + "
" + + "
" + + "
" + + "
" + + ""); + $(li).appendTo($('#story-list')); + } + }); \ No newline at end of file