nodebb-plugin-link-preview 1.0.7 → 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/library.js +38 -2
  2. package/package.json +2 -2
  3. package/static/templates/admin/plugins/link-preview.tpl +61 -34
  4. package/static/templates/partials/link-preview/vimeo.tpl +1 -0
  5. package/static/templates/partials/link-preview/youtube.tpl +1 -0
package/library.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable no-await-in-loop */
1
2
  /* eslint-disable no-continue */
2
3
 
3
4
  'use strict';
@@ -50,17 +51,23 @@ async function process(content, opts) {
50
51
  const $ = load(content, null, false);
51
52
  for (const anchor of $('a')) {
52
53
  const $anchor = $(anchor);
54
+
55
+ // Skip if the anchor has link text, or has text on the same line.
53
56
  const url = $anchor.attr('href');
54
57
  const text = $anchor.text();
58
+ const hasSiblings = !!anchor.prev || !!anchor.next;
59
+ if (hasSiblings || url !== text) {
60
+ continue;
61
+ }
55
62
 
56
- if (url !== text) {
63
+ const special = await handleSpecialEmbed(url, $anchor);
64
+ if (special) {
57
65
  continue;
58
66
  }
59
67
 
60
68
  const cached = cache.get(`link-preview:${url}`);
61
69
  if (cached) {
62
70
  if (cached.contentType) {
63
- // eslint-disable-next-line no-await-in-loop
64
71
  $anchor.replaceWith($(await render(cached)));
65
72
  }
66
73
  continue;
@@ -156,6 +163,35 @@ async function render(preview) {
156
163
  return false;
157
164
  }
158
165
 
166
+ async function handleSpecialEmbed(url, $anchor) {
167
+ const { app } = require.main.require('./src/webserver');
168
+ const { hostname, searchParams, pathname } = new URL(url);
169
+ const { embedYoutube, embedVimeo } = await meta.settings.get('link-preview');
170
+
171
+ if (embedYoutube === 'on' && ['youtube.com', 'www.youtube.com', 'youtu.be'].some(x => hostname === x)) {
172
+ let video;
173
+ if (hostname === 'youtu.be') {
174
+ video = pathname.slice(1);
175
+ } else {
176
+ video = searchParams.get('v');
177
+ }
178
+ const html = await app.renderAsync('partials/link-preview/youtube', { video });
179
+ $anchor.replaceWith(html);
180
+
181
+ return true;
182
+ }
183
+
184
+ if (embedVimeo === 'on' && hostname === 'vimeo.com') {
185
+ const video = pathname.slice(1);
186
+ const html = await app.renderAsync('partials/link-preview/vimeo', { video });
187
+ $anchor.replaceWith(html);
188
+
189
+ return true;
190
+ }
191
+
192
+ return false;
193
+ }
194
+
159
195
  plugin.onParse = async (payload) => {
160
196
  if (typeof payload === 'string') { // raw
161
197
  payload = await process(payload, {});
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "nodebb-plugin-link-preview",
3
- "version": "1.0.7",
3
+ "version": "1.1.0",
4
4
  "description": "A starter kit for quickly creating NodeBB plugins",
5
5
  "main": "library.js",
6
6
  "repository": {
@@ -31,7 +31,7 @@
31
31
  },
32
32
  "readmeFilename": "README.md",
33
33
  "nbbpm": {
34
- "compatibility": "^3.0.0"
34
+ "compatibility": "^3.2.0"
35
35
  },
36
36
  "devDependencies": {
37
37
  "@commitlint/cli": "17.6.5",
package/static/templates/admin/plugins/link-preview.tpl CHANGED
@@ -1,36 +1,63 @@
1
- <form role="form" class="link-preview-settings">
2
- <div class="row mb-4">
3
- <div class="col-sm-2 col-12 settings-header">Media Types</div>
4
- <div class="col-sm-10 col-12">
5
- <p>
6
- If enabled, URLs of those types will be converted to preview boxes.
7
- </p>
8
-
9
- <div class="form-check form-switch mb-3">
10
- <input type="checkbox" class="form-check-input" id="embedHtml" name="embedHtml">
11
- <label for="embedHtml" class="form-check-label">Websites</label>
12
- </div>
13
-
14
- <div class="form-check form-switch mb-3">
15
- <input type="checkbox" class="form-check-input" id="embedImage" name="embedImage">
16
- <label for="embedImage" class="form-check-label">Images</label>
17
- </div>
18
-
19
- <div class="form-check form-switch mb-3">
20
- <input type="checkbox" class="form-check-input" id="embedAudio" name="embedAudio">
21
- <label for="embedAudio" class="form-check-label">Audio</label>
22
- </div>
23
-
24
- <div class="form-check form-switch mb-3">
25
- <input type="checkbox" class="form-check-input" id="embedVideo" name="embedVideo">
26
- <label for="embedVideo" class="form-check-label">Video</label>
27
- </div>
28
-
29
- <p class="help-text">
30
- Please note that the "audio" and "video" formats only apply if the URL is a direct link to the audio/video file. Links to video hosting sites (e.g. YouTube) would fall under the "websites" category.
31
- </p>
1
+ <div class="acp-page-container">
2
+ <!-- IMPORT admin/partials/settings/header.tpl -->
3
+
4
+ <div class="row m-0">
5
+ <div id="spy-container" class="col-12 col-md-8 px-0 mb-4" tabindex="0">
6
+ <form role="form" class="link-preview-settings">
7
+ <div class="mb-4">
8
+ <h5 class="fw-bold tracking-tight settings-header">Media Types</h5>
9
+
10
+ <p>
11
+ If enabled, URLs of those types will be converted to preview boxes.
12
+ </p>
13
+
14
+ <div class="form-check form-switch mb-3">
15
+ <input type="checkbox" class="form-check-input" id="embedHtml" name="embedHtml">
16
+ <label for="embedHtml" class="form-check-label">Websites</label>
17
+ </div>
18
+
19
+ <div class="form-check form-switch mb-3">
20
+ <input type="checkbox" class="form-check-input" id="embedImage" name="embedImage">
21
+ <label for="embedImage" class="form-check-label">Images</label>
22
+ </div>
23
+
24
+ <div class="form-check form-switch mb-3">
25
+ <input type="checkbox" class="form-check-input" id="embedAudio" name="embedAudio">
26
+ <label for="embedAudio" class="form-check-label">Audio</label>
27
+ </div>
28
+
29
+ <div class="form-check form-switch mb-3">
30
+ <input type="checkbox" class="form-check-input" id="embedVideo" name="embedVideo">
31
+ <label for="embedVideo" class="form-check-label">Video</label>
32
+ </div>
33
+
34
+ <p class="form-text">
35
+ Please note that the "audio" and "video" formats only apply if the URL is a direct link to the audio/video file.
36
+ Links to video hosting sites (e.g. YouTube) would fall under the "websites" category unless explicitly covered by a special embed type.
37
+ </p>
38
+ </div>
39
+
40
+ <div class="mb-4">
41
+ <h5 class="fw-bold tracking-tight settings-header">Special Embeds</h5>
42
+
43
+ <p>
44
+ The following rules allow for more interactive previews via pre-defined defaults.
45
+ If disabled, then they will be treated like a regular "website" media type.
46
+ </p>
47
+
48
+ <div class="form-check form-switch mb-3">
49
+ <input type="checkbox" class="form-check-input" id="embedYoutube" name="embedYoutube">
50
+ <label for="embedYoutube" class="form-check-label">YouTube</label>
51
+ </div>
52
+
53
+ <div class="form-check form-switch mb-3">
54
+ <input type="checkbox" class="form-check-input" id="embedVimeo" name="embedVimeo">
55
+ <label for="embedVimeo" class="form-check-label">Vimeo</label>
56
+ </div>
57
+ </div>
58
+ </form>
32
59
  </div>
33
- </div>
34
- </form>
35
60
 
36
- <!-- IMPORT admin/partials/save_button.tpl -->
61
+ <!-- IMPORT admin/partials/settings/toc.tpl -->
62
+ </div>
63
+ </div>
package/static/templates/partials/link-preview/vimeo.tpl ADDED
@@ -0,0 +1 @@
1
+ <iframe src="https://player.vimeo.com/video/{video}?h=65e20fad6f&title=0&byline=0&portrait=0" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
package/static/templates/partials/link-preview/youtube.tpl ADDED
@@ -0,0 +1 @@
1
+ <iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/{video}" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>