do some refactoring of the camper news views

This commit is contained in:
Michael Q Larson
2015-03-03 19:55:04 -08:00
parent 2c375e8c61
commit d8b8373b70
12 changed files with 176 additions and 118 deletions

View File

@ -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()
});
});
};

View File

@ -6,6 +6,10 @@ var storySchema = new mongoose.Schema({
type: String,
unique: false
},
timePosted: {
type: Number,
default: 0
},
link: {
type: String,
unique: false

View File

@ -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

View File

@ -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

View File

@ -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": []
}

View File

@ -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

View File

@ -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("<div class='row text-left'>" +
"<div class='col-xs-3 col-sm-1 big-ion-up-arrow'>" +
"<i class='ion-arrow-up-b'></i>" +
"</div>" +
"<div class='col-xs-9 col-sm-11'>" +
"<a href='/stories/" + linkedName + "'>"
+ data[i].headline +
"</a>" +
"</div>" +
"</div>" +
"<div class='row text-left'>" +
"<div class='col-xs-3 col-sm-1'>" + rank + "</div>" +
"<div class='col-xs-9 col-sm-11'>" + data[i].author.username + "</div>" +
"</div>" +
"</li>");
$(li).appendTo($('#story-list'));
}
});

View File

@ -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

View File

@ -5,4 +5,4 @@ block content
.panel.panel-info
.panel-heading.text-center Camper News
.panel-body.hug-top
include ./posts
include ./stories

74
views/stories/show.jade Normal file
View File

@ -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 &nbsp;by&nbsp;
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

View File

@ -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("<div class='row text-left'>" +
"<div class='col-xs-3 col-sm-1'>" +
"<div class='row'>" +
"<div class='col-xs-12 big-ion-up-arrow'>" +
"<i class='ion-arrow-up-b'></i>" +
"</div>" +
"</div>" +
"<div class='story-up-votes'>" +
"<span>" + rank + "</span>" +
"</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].headline +
"</a>" +
"</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> " +
"</div>" +
"</div>" +
"</div>" +
"</div>" +
"</li>");
$(li).appendTo($('#story-list'));
}
});