Shing/Venue channel feed integration (sidebar/home)

app/controllers/home.js

@@ -24,6 +24,8 @@ class HomeController extends SiteController {
     dtp.app.use('/', router);
 
     router.use(this.dtp.services.gabTV.channelMiddleware());
+    router.use(this.dtp.services.venue.channelMiddleware());
+
     router.use(async (req, res, next) => {
       res.locals.currentView = 'home';
       return next();

app/services/venue.js

@@ -0,0 +1,66 @@
+// venue.js
+// Copyright (C) 2022 Digital Telepresence, LLC
+// License: Apache-2.0
+
+'use strict';
+
+const fetch = require('node-fetch'); // jshint ignore:line
+
+const CACHE_DURATION = 60 * 5;
+
+const { SiteService, SiteError } = require('../../lib/site-lib');
+
+class VenueService extends SiteService {
+
+  constructor (dtp) {
+    super(dtp, module.exports);
+  }
+
+  channelMiddleware ( ) {
+    return async (req, res, next) => {
+      try {
+        if (!res.locals.site || !res.locals.site.shingChannelSlug) {
+          return next();
+        }
+        res.locals.shingChannelFeed = await this.getChannelFeed(res.locals.site.shingChannelSlug, { allowCache: true });
+        return next();
+      } catch (error) {
+        this.log.error('failed to populate Shing.tv channel feed', { error });
+        return next();
+      }
+    };
+  }
+
+  async getChannelFeed (channelSlug, options) {
+    const { cache: cacheService } = this.dtp.services;
+    const cacheKey = `venue:ch:${channelSlug}`;
+
+    options = Object.assign({
+      allowCache: true,
+    }, options);
+
+    let json;
+    if (options.allowCache) {
+      json = await cacheService.getObject(cacheKey);
+      if (json) {
+        return json;
+      }
+    }
+
+    const response = await fetch(`https://shing.tv/channel/${channelSlug}/feed/json`);
+    if (!response.ok) {
+      throw new SiteError(500, 'Failed to fetch Shing channel feed');
+    }
+    json = await response.json();
+
+    await cacheService.setObjectEx(cacheKey, CACHE_DURATION, json);
+
+    return json;
+  }
+}
+
+module.exports = {
+  slug: 'venue',
+  name: 'venue',
+  create: (dtp) => { return new VenueService(dtp); },
+};

app/views/author/index.pug

@@ -36,10 +36,10 @@ block content
         div(class="uk-width-1-1 uk-width-2-3@m")
           +renderSectionTitle('Recent Comments', { url: '/author/comments', title: 'See All', label: 'SEE ALL' })
 
-          ul.uk-list.uk-list-divider
-            each comment in comments
-              li
-                .uk-tile.uk-tile-default.uk-padding-small.uk-padding-remove-horizontal
+          .uk-tile.uk-tile-default.uk-tile-small
+            ul#post-comment-list.uk-list.uk-list-divider.uk-list-large
+              each comment in comments
+                li
                   .uk-margin
                     a(href=`/post/${comment.resource.slug}`).uk-display-block.uk-link-reset
                       +renderPostSummary(comment.resource)

app/views/components/navbar.pug

@@ -16,15 +16,17 @@ nav(uk-navbar).uk-navbar-container.uk-position-fixed.uk-position-top
       li(class={ 'uk-active': currentView === 'home' })
         a(href="/", title= "Home")
           +renderButtonIcon('fa-home', 'Home')
-      li(class={ 'uk-active': currentView === 'chat' })
-        a(href="/chat", title= "chat")
-          +renderButtonIcon('fa-comment-alt', 'Chat')
+
+      if user
+        li(class={ 'uk-active': currentView === 'chat' })
+          a(href="/chat", title= "chat")
+            +renderButtonIcon('fa-comment-alt', 'Chat')
 
       if site.shingWidgetKey && site.shingChannelSlug
         li(class={ 'uk-active': currentView === 'venue' })
           a(href="/venue", title= "Live")
             span
-              img(src="https://shing.tv/img/icon/shing.tv/icon-32x32.png")
+              i.fas.fa-tv
             span(class="uk-visible@m").uk-margin-small-left Live
 
       each menuItem in mainMenu

app/views/components/off-canvas.pug

@@ -23,7 +23,7 @@ mixin renderMenuItem (iconClass, label)
       if site.shingWidgetKey
         li(class={ "uk-active": (currentView === 'venue') })
           a(href='/venue').uk-display-block
-            +renderMenuItem('fa-home', 'Watch Live')
+            +renderMenuItem('fa-tv', 'Watch Live')
 
       each menuItem in mainMenu
         li(class={ 'uk-active': (pageSlug === menuItem.slug) })

app/views/components/page-sidebar.pug

@@ -13,13 +13,37 @@ mixin renderSidebarEpisode(episode)
       .uk-text-small Posted: #{moment(episode.date_modified).format("MMM DD YYYY HH:MM a")}
 
 mixin renderPageSidebar ( )
+  //-
+  //- Announcements
+  //-
   if Array.isArray(announcements) && (announcements.length > 0)
     ul.uk-list.uk-margin
       each announcement in announcements
         li
           +renderAnnouncement(announcement)
 
-  //- Gab TV 3 Most Recent Episodes
+  //-
+  //- Shing.tv Channel Integration
+  //-
+  if shingChannelFeed && Array.isArray(shingChannelFeed.items) && (shingChannelFeed.items.length > 0)
+    .uk-margin
+      +renderSectionTitle(shingChannelFeed.title, {
+        label: 'Tune In',
+        title: shingChannelFeed.title,
+        url: '/venue',
+      })
+      ul.uk-list
+        each item in shingChannelFeed.items.slice(0, 3)
+          li
+            a(href= item.url).uk-display-block
+              .uk-card.uk-card-default.uk-card-small
+                img(src= item.image.url).responsive
+                .uk-card-body
+                  .uk-text-bold.uk-text-truncate= item.title
+                  .uk-text-small!= item.summary
+  //-
+  //- Gab TV channel integration
+  //-
   if gabTvChannel
     .uk-margin
       +renderSectionTitle('Gab TV', {
@@ -32,7 +56,9 @@ mixin renderPageSidebar ( )
           li
             +renderSidebarEpisode(episode)
 
+  //-
   //- Newsletter Signup
+  //-
   div(uk-sticky={ offset: 60, bottom: '#dtp-content-grid' }, style="z-index: initial;").uk-margin
     +renderSectionTitle('Mailing List')
     form(method="post", action="/newsletter", onsubmit="return dtp.app.submitForm(event, 'Subscribe to newsletter');").uk-form

app/views/venue/embed.pug

@@ -1,5 +1,6 @@
 extends ../layouts/main
 block content
 
-  - var shingBaseUrl = (process.env.NODE_ENV === 'production') ? 'https://shing.tv' : 'http://localhost:3333';
+  //- - var shingBaseUrl = (process.env.NODE_ENV === 'production') ? 'https://shing.tv' : 'http://localhost:3333';
+  - var shingBaseUrl = 'https://shing.tv';
   iframe(src= `${shingBaseUrl}/channel/${site.shingChannelSlug}/embed/venue?k=${site.shingWidgetKey}`, style="width: 100%; height: 720px;", allowfullscreen)