Mercurial > addons > firefox-addons > feed-preview
changeset 29:688d75e554e0
Add option to expand feed entries by default
author | Guido Berhoerster <guido+feed-preview@berhoerster.name> |
---|---|
date | Mon, 21 Jan 2019 15:15:59 +0100 |
parents | 104a1faebd43 |
children | b9dc94ce2eeb |
files | _locales/de/messages.json _locales/en/messages.json js/background.js js/feed-preview.js options/options.css options/options.html options/options.js |
diffstat | 7 files changed, 116 insertions(+), 18 deletions(-) [+] |
line wrap: on
line diff
--- a/_locales/de/messages.json Mon Jan 21 08:22:52 2019 +0100 +++ b/_locales/de/messages.json Mon Jan 21 15:15:59 2019 +0100 @@ -90,5 +90,13 @@ "missingPlaceholderError": { "message": "Bitte die URL zum Abonnieren von Feeds eingeben, die einen Platzhalter \"%s\" für die URL das Feeds enthält.", "description": "Error message if the placholder is missing from the subscription URL template." + }, + "feedPreviewTitle": { + "message": "Feed-Vorschau", + "description": "Title of the feed preview options." + }, + "feedPreviewExpandItemLabel": { + "message": "Feed-Einträge standardmäßig aufklappen", + "description": "Label of the checkbox for enabling feed entry expansion by default." } }
--- a/_locales/en/messages.json Mon Jan 21 08:22:52 2019 +0100 +++ b/_locales/en/messages.json Mon Jan 21 15:15:59 2019 +0100 @@ -90,5 +90,13 @@ "missingPlaceholderError": { "message": "Please enter a subscription URL which contains a placeholder \"%s\" for the feed URL.", "description": "Error message if the placholder is missing from the subscription URL template." + }, + "feedPreviewTitle": { + "message": "Feed Preview", + "description": "Title of the feed preview options." + }, + "feedPreviewExpandItemLabel": { + "message": "Expand feed entries by default", + "description": "Label of the checkbox for enabling feed entry expansion by default." } }
--- a/js/background.js Mon Jan 21 08:22:52 2019 +0100 +++ b/js/background.js Mon Jan 21 15:15:59 2019 +0100 @@ -57,6 +57,9 @@ var tabsFeedPreviews = new Map(); var fetchingFeedPreview = fetch('web_resources/feed-preview.xhtml') .then(response => response.text()); +var feedPreviewOptions = { + expandEntries: false +}; function parseContentType(header) { let contentType = { @@ -103,7 +106,8 @@ // render the preview document let feedPreviewDocument = new DOMParser() .parseFromString(await fetchingFeedPreview, 'text/html'); - renderFeedPreview(feedPreviewDocument, feed); + renderFeedPreview(feedPreviewDocument, feed, + feedPreviewOptions.expandEntries); return new XMLSerializer().serializeToString(feedPreviewDocument); } @@ -226,3 +230,20 @@ browser.storage.sync.set({feedReaders}); } }); + +browser.storage.sync.get('feedPreview').then(({feedPreview}) => { + if (typeof feedPreview !== 'undefined' && + feedPreview === Object(feedPreview)) { + feedPreviewOptions.expandEntries = !!feedPreview.expandEntries; + } +}); +browser.storage.onChanged.addListener((changes, areaName) => { + if (areaName !== 'sync' || typeof changes.feedPreview === 'undefined') { + return; + } + + let newValue = changes.feedPreview.newValue; + if (typeof newValue !== 'undefined' && newValue === Object(newValue)) { + feedPreviewOptions.expandEntries = !!newValue.expandEntries; + } +});
--- a/js/feed-preview.js Mon Jan 21 08:22:52 2019 +0100 +++ b/js/feed-preview.js Mon Jan 21 15:15:59 2019 +0100 @@ -8,7 +8,8 @@ 'use strict'; -export function renderFeedPreview(feedPreviewDocument, feed) { +export function renderFeedPreview(feedPreviewDocument, feed, + expandEntriesByDefault) { // inject XSL stylesheet which transforms XHTML to HTML allowing the use of // the HTML DOM let xslFilename = browser.runtime.getURL('web_resources/xhtml-to-html.xsl'); @@ -59,9 +60,10 @@ let entryNode = feedPreviewDocument.importNode(entryTemplateElement.content, true); + entryNode.querySelector('details.entry').open = expandEntriesByDefault; + let titleElement; let titleNode; - if (typeof entry.link !== 'undefined') { titleNode = feedPreviewDocument .importNode(entryTitleLinkedTemplateElement.content, true);
--- a/options/options.css Mon Jan 21 08:22:52 2019 +0100 +++ b/options/options.css Mon Jan 21 15:15:59 2019 +0100 @@ -35,6 +35,10 @@ font-weight: bold; } +h1 ~ h1 { + margin-top: 32px; +} + input[type="text"] { border-radius: 2px; font-size: 15px; @@ -42,6 +46,11 @@ min-height: 32px; } +input[type="checkbox"], +input[type="checkbox"] + label { + vertical-align: middle; +} + .browser-style > input[type=text] { border-color: var(--text-input-border-color); box-shadow: none;
--- a/options/options.html Mon Jan 21 08:22:52 2019 +0100 +++ b/options/options.html Mon Jan 21 15:15:59 2019 +0100 @@ -50,5 +50,11 @@ <button type="submit" name="add" class="browser-style"> </div> </form> + <h1 id="feed-preview-title"></h1> + <form id="feed-preview"> + <input type="checkbox" id="expand-entries" name="expand-entries"> + <label for="expand-entries"> + </label> + </form> </body> </html>
--- a/options/options.js Mon Jan 21 08:22:52 2019 +0100 +++ b/options/options.js Mon Jan 21 15:15:59 2019 +0100 @@ -18,6 +18,8 @@ document.querySelector('#feed-readers-title').textContent = browser.i18n.getMessage('feedReadersTitle'); + document.querySelector('#feed-preview-title').textContent = + browser.i18n.getMessage('feedPreviewTitle'); let feedReadersForm = document.forms['feed-readers']; feedReadersForm.elements['move-up'].textContent = @@ -46,6 +48,11 @@ browser.i18n.getMessage('feedReaderUrlTemplateCaption'); addFeedReaderForm.addEventListener('focusout', this); + let feedPreviewForm = document.forms['feed-preview']; + feedPreviewForm.elements['expand-entries'].labels[0].textContent = + browser.i18n.getMessage('feedPreviewExpandItemLabel'); + feedPreviewForm.addEventListener('change', this); + document.addEventListener('submit', this); this.initOptions(); @@ -58,6 +65,17 @@ this.updateFeedReaders(feedReaders); } + let {feedPreview: feedPreviewOptions} = + await browser.storage.sync.get('feedPreview'); + if (typeof feedPreviewOptions !== 'undefined' && + feedPreviewOptions === Object(feedPreviewOptions)) { + console.log('initialized feedPreviewOptions from storage', + feedPreviewOptions); + this.updateFeedPreviewOptions({ + expandEntries: !!feedPreviewOptions.expandEntries + }); + } + browser.storage.onChanged.addListener(this.onStorageChanged.bind(this)); } @@ -113,6 +131,11 @@ feedReadersForm.elements['buttons'].disabled = true; } + updateFeedPreviewOptions(feedPreviewOptions) { + document.forms['feed-preview'].elements['expand-entries'].checked = + feedPreviewOptions.expandEntries; + } + getFeedReaders() { let feedReaderInput = document.forms['feed-readers'].elements['feed-reader']; @@ -150,26 +173,42 @@ } onStorageChanged(changes, areaName) { - if (areaName !== 'sync' || typeof changes.feedReaders === 'undefined') { + if (areaName !== 'sync') { return; } - let feedReaders; - if (typeof changes.feedReaders.newValue !== 'undefined' && - Array.isArray(changes.feedReaders.newValue)) { - feedReaders = changes.feedReaders.newValue; - console.log('feedReaders changed to', feedReaders); - } else { - // list of feed readers was removed or set to nonsensical value - feedReaders = []; - console.log('feedReaders was removed'); + if (typeof changes.feedReaders !== 'undefined') { + let feedReaders; + if (typeof changes.feedReaders.newValue !== 'undefined' && + Array.isArray(changes.feedReaders.newValue)) { + feedReaders = changes.feedReaders.newValue; + console.log('feedReaders changed to', feedReaders); + } else { + // list of feed readers was removed or set to nonsensical value + feedReaders = []; + console.log('feedReaders was removed'); + } + if (this.selectedFeedReader >= feedReaders.length) { + // save selected feed reader is no longer valid + this.selectedFeedReader = -1; + } + this.updateFeedReaders(feedReaders); + this.selectFeedReader(); } - if (this.selectedFeedReader >= feedReaders.length) { - // save selected feed reader is no longer valid - this.selectedFeedReader = -1; + if (typeof changes.feedPreview !== 'undefined') { + let feedPreviewOptions; + let newValue = changes.feedPreview.newValue; + if (typeof newValue !== 'undefined' && + newValue === Object(newValue)) { + feedPreviewOptions = {expandEntries: !!newValue.expandEntries}; + } else { + // feed preview preferences were removed or set to nonsensical + // value + feedPreviewOptions = {expandEntries: false}; + console.log('feedPreview was removed'); + } + this.updateFeedPreviewOptions(feedPreviewOptions); } - this.updateFeedReaders(feedReaders); - this.selectFeedReader(); } handleEvent(ev) { @@ -238,6 +277,11 @@ console.log('set feedReaders to', feedReaders); document.forms['add-feed-reader'].reset(); + } else if (ev.type === 'change' && ev.target.id === 'expand-entries') { + console.log('expand entries by default:', ev.target.checked); + browser.storage.sync.set({ + feedPreview: {expandEntries: ev.target.checked} + }); } } }