git.squeep.com Git - websub-hub/blob - src/template/root-html.js

   1 'use strict';
   2
   3 const th = require('./template-helper');
   4
   5 function hAppSection(pageTitle) {
   6   return `      <section class="h-app hidden">
   7         <h2>h-app Information for IndieAuth Logins</h2>
   8         <img src="static/favicon.ico" class="u-logo">
   9         <a href="" class="u-url p-name">${pageTitle}</a>
  10         <p class="p-summary">
  11           This is a WebSub Hub service, facilitating content distribution.
  12           Authenticated users may view details of any syndications related to their profile.
  13         </p>
  14       </section>`;
  15 }
  16
  17 function aboutSection() {
  18   return `      <section class="about">
  19         <h2>What</h2>
  20         <p>
  21           This is a <a class="external" href="https://www.w3.org/TR/websub/">WebSub</a> Hub service.
  22         </p>
  23         <p>
  24           It facilitates the timely distribution of new content from publishers to subscribers.
  25         </p>
  26         <aside>
  27           The typical use-case is where the content is a blog or news feed, but any type of content may be syndicated.
  28         </aside>
  29       </section>`;
  30 }
  31
  32 function usageSection(isPublicHub, hubURL) {
  33   const usageContent = isPublicHub ? `      <h2>Public Hub</h2>
  34       <p>
  35         This hub is available as a public resource; any topic which lists it as a hub can be syndicated.
  36       </p>
  37       <p>
  38         To use this hub, your content needs to include some Link relations.
  39       </p>
  40       <div>
  41         <h3>For Any Content</h3>
  42         <ul>
  43           <li>
  44             The content must be served with a <code>Link</code> HTTP header indicating this service as the <code>hub</code> relation.
  45             <figure>
  46               <figcaption>Example:</figcaption>
  47               <code>
  48                 Link: &lt;${hubURL}&gt;; rel="hub"
  49               </code>
  50             </figure>
  51           </li>
  52           <li>
  53             The content must be served with a <code>Link</code> HTTP header indicating its own URL with the <code>self</code> relation.
  54             <figure>
  55               <figcaption>Example:</figcaption>
  56               <code>
  57                 Link: &lt;https://example.com/feed/&gt;; rel="self"
  58               </code>
  59             </figure>
  60           </li>
  61           <li>
  62             Ideally, these should be combined in one header.
  63             <figure>
  64               <figcaption>Example:</figcaption>
  65               <code>
  66                 Link: &lt;${hubURL}&gt;; rel="hub", &lt;https://example.com/feed/&gt;; rel="self"
  67               </code>
  68             </figure>
  69           </li>
  70         </ul>
  71       </div>
  72       <div>
  73         <h3>For Atom or RSS feeds</h3>
  74         <ul>
  75           <li>
  76             The feed must include a <code>link</code> element within the <code>http://www.w3.org/2005/Atom</code> namespace with the <code>hub</code> relation and this service as the <code>href</code> attribute.
  77             <figure>
  78               <figcaption>Example:</figcaption>
  79               <code>
  80                 &lt;link xmlns="http://www.w3.org/2005/Atom" href="${hubURL}" rel="hub"&gt;
  81               </code>
  82             </figure>
  83           </li>
  84           <li>
  85             The feed must include a <code>link</code> element within the <code>http://www.w3.org/2005/Atom</code> namespace with the <code>self</code> relation, its own URL as the <code>href</code> attribute, and its content-type as the <code>type</code> attribute.
  86             <figure>
  87               <figcaption>Example:</figcaption>
  88               <code>
  89                 &lt;link xmlns="http://www.w3.org/2005/Atom" href="https://example.com/blog/feed" rel="self" type="application/atom+xml"&gt;
  90               </code>
  91             </figure>
  92           </li>
  93         <ul>
  94       </div>
  95       <div>
  96         <h3>Publishing Updates</h3>
  97         To notify the Hub either of a new topic to syndicate, or that a topic&apos;s content has been updated and should be distributed to subscribers, send a <code>POST</code> request with Form Data (<code>application/x-www-form-urlencoded</code>):
  98         <ul>
  99           <li>
 100             <code>hub.mode</code> set to <code>publish</code>
 101           </li>
 102           <li>
 103             <code>hub.url</code> set to the <code>self</code> link relation of the content (this value may be set multiple times, to update more than one topic)
 104           </li>
 105         </ul>
 106         <figure>
 107           <figcaption>Example:</figcaption>
 108           <code>
 109             curl ${hubURL} -d'hub.mode=publish' -d'hub.url=https://example.com/blog_one/feed' -d'hub.url=https://example.com/blog_two/feed'
 110           </code>
 111         </figure>
 112       </div>`
 113     : `
 114       <h2>Private Hub</h2>
 115       <p>
 116         This hub only serves specific topics.
 117       </p>`;
 118   return `
 119       <section class="usage">
 120 ${usageContent}
 121       </section>`;
 122 }
 123
 124 function contactSection(contactHTML) {
 125   let section = '';
 126   if (contactHTML) {
 127     section = `      <section>
 128 ${contactHTML}
 129       </section>`;
 130   }
 131   return section;
 132 }
 133
 134 /**
 135  *
 136  * @param {Object} ctx
 137  * @param {Object} options
 138  * @param {Object} options.manager
 139  * @param {String} options.adminContactHTML
 140  * @param {String} options.manager.pageTitle
 141  * @param {String} options.manager.publicHub
 142  * @param {Object} options.dingus
 143  * @param {String} options.dingus.selfBaseUrl
 144  * @returns {String}
 145  */
 146 module.exports = (ctx, options) => {
 147   const pageTitle = options.manager.pageTitle;
 148   const isPublicHub = options.manager.publicHub;
 149   const contactHTML = options.adminContactHTML;
 150   const footerEntries = options.manager.footerEntries;
 151   const hubURL = options.dingus.selfBaseUrl || '<s>https://hub.example.com/</s>';
 152   const headElements = [];
 153   const navLinks = [{
 154     href: 'admin/',
 155     text: 'Admin',
 156   }];
 157   const mainContent = [
 158     aboutSection(),
 159     usageSection(isPublicHub, hubURL),
 160     contactSection(contactHTML),
 161     hAppSection(pageTitle),
 162   ];
 163   return th.htmlTemplate(ctx, 0, pageTitle, headElements, navLinks, mainContent, footerEntries,
 164   );
 165 };