Mercurial > addons > firefox-addons > feed-preview

annotate js/feed-preview.js @ 9:fcd65cf3f634

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Simplify the hint shown if there are no entries Always create the element and hide it with CSS if there are entries.
author Guido Berhoerster <guido+feed-preview@berhoerster.name>
date Tue, 27 Nov 2018 16:05:14 +0100
parents 5d7c13e998e9
children ff5e5e3eba32
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
6
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
1 /*
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
2 * Copyright (C) 2018 Guido Berhoerster <guido+feed-preview@berhoerster.name>
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
3 *
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
4 * This Source Code Form is subject to the terms of the Mozilla Public
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
5 * License, v. 2.0. If a copy of the MPL was not distributed with this
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
6 * file, You can obtain one at http://mozilla.org/MPL/2.0/.
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
7 */
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
8
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
9 'use strict';
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
10
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
11 export function renderFeedPreview(feedPreviewDocument, feed) {
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
12 // inject XSL stylesheet which transforms XHTML to HTML allowing the use of
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
13 // the HTML DOM
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
14 let xslFilename = browser.runtime.getURL('web_resources/xhtml-to-html.xsl');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
15 let xmlStylesheetNode =
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
16 feedPreviewDocument.createProcessingInstruction('xml-stylesheet',
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
17 `type="application/xslt+xml" href="${xslFilename}"`);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
18 feedPreviewDocument.firstChild.after(xmlStylesheetNode);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
19
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
20 feedPreviewDocument.querySelector('link[rel=stylesheet]').href =
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
21 browser.runtime.getURL('web_resources/style/feed-preview.css');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
22
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
23 feedPreviewDocument.querySelector('title').textContent = feed.title;
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
24 feedPreviewDocument.querySelector('#feed-title').textContent = feed.title;
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
25 feedPreviewDocument.querySelector('#feed-subtitle').textContent =
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
26 feed.subtitle;
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
27
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
28 if (typeof feed.logo !== 'undefined') {
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
29 let feedLogoTemplate =
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
30 feedPreviewDocument.querySelector('#feed-logo-template');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
31 let logoNode = feedPreviewDocument.importNode(feedLogoTemplate.content,
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
32 true);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
33 let imgElement = logoNode.querySelector('#feed-logo');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
34 imgElement.setAttribute('src', feed.logo.url);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
35 imgElement.setAttribute('alt', feed.logo.title);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
36 feedPreviewDocument.querySelector('#feed-header').prepend(logoNode);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
37 }
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
38
9
fcd65cf3f634 Simplify the hint shown if there are no entries
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents: 6
diff changeset
39 feedPreviewDocument.querySelector("#no-entries-hint").textContent =
fcd65cf3f634 Simplify the hint shown if there are no entries
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents: 6
diff changeset
40 browser.i18n.getMessage('noEntriesHint');
fcd65cf3f634 Simplify the hint shown if there are no entries
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents: 6
diff changeset
41
6
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
42 let entryTemplateElement =
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
43 feedPreviewDocument.querySelector('#entry-template');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
44 let entryTitleTemplateElement =
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
45 feedPreviewDocument.querySelector('#entry-title-template');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
46 let entryTitleLinkedTemplateElement =
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
47 feedPreviewDocument.querySelector('#entry-title-linked-template');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
48 let entryFileListTemplateElement =
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
49 feedPreviewDocument.querySelector('#entry-files-list-template');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
50 let entryFileTemplateElement =
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
51 feedPreviewDocument.querySelector('#entry-file-template');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
52 for (let entry of feed.entries) {
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
53 let entryNode =
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
54 feedPreviewDocument.importNode(entryTemplateElement.content,
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
55 true);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
56 let titleElement;
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
57 let titleNode;
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
58
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
59 if (typeof entry.link !== 'undefined') {
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
60 titleNode = feedPreviewDocument
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
61 .importNode(entryTitleLinkedTemplateElement.content, true);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
62 titleElement = titleNode.querySelector('.entry-link');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
63 titleElement.href = entry.link;
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
64 titleElement.title = entry.title;
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
65 } else {
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
66 titleNode = feedPreviewDocument
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
67 .importNode(entryTitleTemplateElement.content, true);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
68 titleElement = titleNode.querySelector('.entry-title');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
69 }
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
70 titleElement.textContent = entry.title;
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
71 entryNode.querySelector('.entry-header').prepend(titleNode);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
72
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
73 let timeElement = entryNode.querySelector('.entry-date > time');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
74 timeElement.textContent = entry.date.toLocaleString();
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
75
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
76 let contentElement = entryNode.querySelector('.entry-content');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
77 let contentDocument = new DOMParser().parseFromString(entry.content,
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
78 'text/html');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
79 let stylesheetElement = contentDocument.createElement('link');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
80 stylesheetElement.rel = 'stylesheet';
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
81 stylesheetElement.href =
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
82 browser.runtime.getURL('web_resources/style/entry-content.css');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
83 contentDocument.head.appendChild(stylesheetElement);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
84 contentElement.srcdoc = new XMLSerializer()
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
85 .serializeToString(contentDocument);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
86 contentElement.title = entry.title;
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
87
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
88 if (entry.files.length > 0) {
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
89 let fileListNode = feedPreviewDocument
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
90 .importNode(entryFileListTemplateElement.content, true);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
91 fileListNode.querySelector('.entry-files-title').textContent =
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
92 browser.i18n.getMessage('filesTitle');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
93 let fileListElement =
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
94 fileListNode.querySelector('.entry-files-list');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
95
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
96 for (let file of entry.files) {
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
97 let fileNode = feedPreviewDocument
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
98 .importNode(entryFileTemplateElement.content, true);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
99
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
100 let fileLinkElement =
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
101 fileNode.querySelector('.entry-file-link');
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
102 fileLinkElement.href = file.url;
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
103 fileLinkElement.title = file.filename;
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
104 fileLinkElement.textContent = file.filename;
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
105
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
106 fileNode.querySelector('.entry-file-info').textContent =
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
107 `(${file.type}, ${file.size} bytes)`;
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
108
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
109 fileListElement.appendChild(fileNode);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
110 }
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
111
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
112 entryNode.querySelector('.entry').append(fileListNode);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
113 }
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
114
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
115 feedPreviewDocument.body.append(entryNode);
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
116 }
5d7c13e998e9 Create feed previews using a stream filter
Guido Berhoerster <guido+feed-preview@berhoerster.name>
parents:
diff changeset
117 }