update dependencies and devDependencies
[websub-hub] / src / template / root-html.js
1 'use strict';
2
3 const th = require('./template-helper');
4
5 function hAppSection(pageTitle, logoUrl) {
6 return ` <section hidden class="h-app">
7 <h2>h-app Information for IndieAuth Logins</h2>
8 <img src="${logoUrl}" 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 navLinks = [{
153 href: 'admin/',
154 text: 'Admin',
155 }];
156 const htmlOptions = {
157 pageTitle,
158 logoUrl: options.manager.logoUrl,
159 footerEntries,
160 navLinks,
161 };
162 const content = [
163 aboutSection(),
164 usageSection(isPublicHub, hubURL),
165 contactSection(contactHTML),
166 hAppSection(pageTitle, options.manager.logoUrl),
167 ];
168 return th.htmlPage(0, ctx, htmlOptions, content);
169 };