Insert render latest post into document

557aeb70 · Erick Hitter · 1fc35843 · 557aeb70 · 557aeb70 · 557aeb70
Verified Commit 557aeb70 authored Dec 25, 2016 by Erick Hitter
--- a/index.js
+++ b/index.js
@@ -25,11 +25,12 @@ app.get( '/', function( req, res ) {
    res.render( 'index', { data: { domains: domains } } );
 } );

-// Get some data
+// API requests require a domain
 app.get( '/api', function( req, res ) {
    res.status( 400 ).json( { error: 'Must specify a domain!' } );
 } );

+// Render the domain's latest post
 app.get( '/api/:domain', function( req, res ) {
    // For convenience
    var domain = req.params.domain;
@@ -61,6 +62,9 @@ app.get( '/api/:domain', function( req, res ) {
    } );
 } );

+// Allow access to scripts
+app.use( express.static( 'public' ) );
+
 // Listen on some random, unused port
 // App is meant to be fronted by nginx
 app.listen( 5060, function() {

--- a/public/css/main.css
+++ b/public/css/main.css
+.sharedaddy{ display: none; }
--- a/public/js/main.js
+++ b/public/js/main.js
+( function( $ ) {
+    $( 'div.site-container' ).each( function( i, site ) {
+        var container = $( this ),
+            domain    = container.data( 'domain' );
+
+        $.get( {
+            url: '/api/' + domain,
+            success: function( data, status ) {
+                $( '.latest-post', container ).html( data );
+            }
+        } );
+    } );
+
+} ) ( jQuery );
--- a/render/partials/post.handlebars
+++ b/render/partials/post.handlebars
-<h3><a href="{{data.post.link}}">{{data.post.title.rendered}}</a></h3>
+<h3><a href="{{data.post.link}}">{{{data.post.title.rendered}}}</a></h3>

 {{{data.post.excerpt.rendered}}}

-<p><a href="{{data.post.link}}">Read at {{data.domain}}&rarr;</a></p>
+<p><a href="{{data.post.link}}">Read at {{data.domain}} &rarr;</a></p>
--- a/render/partials/sites.handlebars
+++ b/render/partials/sites.handlebars
 {{#each data.domains}}
-    <div class="site-container" id="site-{{@key}}">
+    <div class="site-container" id="site-{{@key}}" data-domain="{{@key}}">
        <h2><a href="{{this}}">{{this}}</a></h2>
        <span class="latest-post">Loading&hellip;</span>
    </div>

--- a/render/templates/main.handlebars
+++ b/render/templates/main.handlebars
@@ -2,6 +2,10 @@
 <html>
    <head>
        <title>erick t. hitter's latest posts</title>
+
+        <script src="https://s2.e15r.co/wp-includes/js/jquery/jquery.js"></script>
+
+        <link rel="stylesheet" href="css/main.css" />
    </head>
    <body>
        {{{body}}}
@@ -10,6 +14,8 @@
            {{> sites}}
        </div>

+        <script src="js/main.js"></script>
+
        {{> analytics}}
    </body>
 </html>