diff --git a/build-styles.js b/build-styles.js new file mode 100644 index 0000000..f1c43ac --- /dev/null +++ b/build-styles.js @@ -0,0 +1,22 @@ +// build the styles +var fs = require('fs'); +var sass = require('node-sass'); + +var staticDir = './static/' +var srcDir = './stylesrc/'; +var themes = ['light','dark']; + + +themes.forEach(function(s){ + var sassFile = srcDir+s+'.scss' + var cssFile = staticDir+s+'.css' + var result = sass.renderSync({ + data: fs.readFileSync(sassFile,'utf8'), + includePaths:[srcDir] + }); + + fs.writeFileSync(cssFile,result.css,'utf8') + +}); + +console.log('ok'); diff --git a/index.js b/index.js index 5e9816d..1f54147 100644 --- a/index.js +++ b/index.js @@ -44,7 +44,7 @@ app.get('/api/feed',function(req,res){ convert(req,opts,function(er,data){ if (er){ res.status(500); - res.send('error fetching or parsing feed'); + return res.send('Error fetching or parsing your feed.'); } res.status(200); res.send(data); diff --git a/lib/convert.js b/lib/convert.js index 5e713b4..8654186 100644 --- a/lib/convert.js +++ b/lib/convert.js @@ -3,12 +3,13 @@ var FeedParser = require('feedparser'); var ejs = require('ejs'); var fs = require('fs'); var template = ejs.compile(fs.readFileSync('./lib/template.ejs','utf8')); +var timeAgo = require('timeago.js'); function isArray(a){ - return (typeof a.length == 'number' && typeof a.forEach == 'function'); + return Array.isArray(a); } -// source the files +// accumulate a stream of XML into a html file module.exports = function(stream,opts,callback){ var callback = callback; @@ -23,7 +24,13 @@ module.exports = function(stream,opts,callback){ if (er) { return callback(er); } - callback(null,buildUp(data,opts)); + // try and build up + try{ + var result = buildUp(data,opts) + }catch(e){ + return callback(e); + } + return callback(null,result); }); } @@ -50,7 +57,7 @@ function breakDown(stream,callback){ // This is where the action is! var stream = this; // `this` is `feedparser`, which is a stream var items = []; - var item; + var item; while (item = stream.read()) { feedparser.items.push(item); @@ -69,64 +76,75 @@ function buildUp(jsonObj,opts){ // assign opts to the obj jsonObj.opts = opts||{}; - // add some links to the item for avatar et cetera + // iterate through the items jsonObj.items.forEach(function(item){ - // get date - item.stringDate = isoDateToEnglish(item.date); + // get date + item.stringDate = getTimeDisplay(item.date); - item.content = getH(item,'atom:content'); + item.content = getH(item,'atom:content'); - // get enclosures - item.enclosures = []; + // make anchor tags have the "_top" target + item.content = item.content.replace(/\<\s*a\s*/ig,' 1000*60*60*24*6){ + return isoDateToEnglish(d.toISOString()); + }else{ + return timeAgo().format(dt); + } + +} + +function isoDateToEnglish(d){ var dt = d.split(/[t\-]/ig); var months = [ "January", "February", "March", "April", "May", "June", diff --git a/lib/template.ejs b/lib/template.ejs index e548af2..2fd3553 100644 --- a/lib/template.ejs +++ b/lib/template.ejs @@ -45,14 +45,20 @@ <% if (item.enclosures.length > 0){ %>
- <% for (var i = 0; i < item.enclosures.length; i ++){ %> - - + <% for (var i = 0; i < item.enclosures.length; i ++){ var e = item.enclosures[i] %> + + <% if (e.type.indexOf('image') > -1){ %> + + <% }else if (e.type.indexOf('video') > -1){ %> + <% } %>
<% } %> -
<%- item.stringDate %>
+
<%= item.stringDate %>
<% }); %> diff --git a/package.json b/package.json index 5a4ef3e..c141d1a 100644 --- a/package.json +++ b/package.json @@ -3,12 +3,18 @@ "ejs": "^2.5.6", "express": "^4.15.2", "feedparser": "^2.2.0", - "pug": "^2.0.0-beta.12", "request": "^2.81.0", - "serve-static": "^1.12.2" + "serve-static": "^1.12.2", + "timeago.js": "^3.0.1" }, - "main":"index.js", - "scripts":{ - "start":"node index.js" + "main": "index.js", + "scripts": { + "start": "node index.js", + "build-styles": "node build-styles.js" + }, + "devDependencies": { + "metalsmith": "^2.3.0", + "metalsmith-sass": "^1.4.0", + "node-sass": "^4.5.2" } } diff --git a/static/dark.css b/static/dark.css index 4565c88..bcd6086 100644 --- a/static/dark.css +++ b/static/dark.css @@ -1,86 +1,94 @@ html, body { - background-color: #22272a; - font-family: Roboto, sans-serif; - color: #eee; + background-color: #282c37; + font-family: 'Roboto', roboto, Arial, sans-serif; + color: #ffffff; font-weight: lighter; overflow-x: hidden; - font-size: 100%; -} + font-size: 100%; } + * { margin: 0; - padding: 0; -} + padding: 0; } + a, a * { - color: #09c; -} + color: #2b90d9; } + .meta { padding: 1rem; - background-color: #292f32; -} + background-color: #39404d; } + .meta * { - line-height: 2rem; -} + line-height: 2rem; } + .item { padding: 1rem; - border-top: solid 2px #30373b; -} + border-top: solid 1px #626d80; } + .item-content, .description, .title { - font-size: 1.2rem; -} -.item-content { - max-width: 750px; -} -.item-content p { - margin: 0.5em 0; -} + font-size: 1.1rem; + font-weight: lighter; } + +.item-content * { + margin: 1rem 0; + line-height: 1.4rem; } + .item-title, .date, .author-fullname, .description { - color: #888888; - font-size: 0.9rem; -} + color: #9baec8; + font-size: 0.9rem; } + +.date { + margin: 1rem 0 0 0; } + .author { display: flex; - margin: 1rem 0; -} + margin: 1rem 0; } + .author-info { margin: 0 1rem; display: flex; flex-direction: column; - justify-content: space-around; -} -.author-info .author-displayname { - font-size: 1.2rem; - color: #eee; - text-decoration: none; - display: block; - font-weight: bolder; -} + justify-content: space-around; } + .author-info .author-displayname { + font-size: 1.2rem; + color: #ffffff; + text-decoration: none; + display: block; + font-weight: bolder; } + .avatar { width: 3rem; height: 3rem; border: none; - border-radius: 10%; -} + border-radius: 10%; } + .enclosures { padding: 0.5em 0; display: flex; + flex-wrap: wrap; flex-direction: row; - max-height: 12rem; - max-width: 42rem; - overflow: hidden; -} -.enclosure, -.enclosure > img { - flex: 0 1 1; + overflow: hidden; } + +.enclosure { + display: flex; + flex: 1 1 auto; + width: 50%; display: inline-block; border: none; cursor: zoom-in; - max-height: 12rem; - max-width: 42rem; -} + max-height: 12rem; } + +.enclosure > * { + flex: 1 1 auto; + width: 100%; + height: 100%; + object-fit: cover; } + +.meta .title { + font-weight: bold; } diff --git a/static/index.html b/static/index.html index 79aaf67..0fb2912 100644 --- a/static/index.html +++ b/static/index.html @@ -25,8 +25,7 @@

Live Preview:

- - +