From 3bdc11a9b2c78f2be8c11d28befce7328b6e5424 Mon Sep 17 00:00:00 2001 From: Mark Powers Date: Fri, 30 Dec 2022 13:58:20 -0600 Subject: Improve RSS preview --- popup/index.js | 191 +++++++++++++++++++++++++++++++++----------------------- popup/main.html | 7 ++- 2 files changed, 118 insertions(+), 80 deletions(-) (limited to 'popup') diff --git a/popup/index.js b/popup/index.js index c674f39..4944e9f 100644 --- a/popup/index.js +++ b/popup/index.js @@ -8,114 +8,149 @@ function subscribe_link(reader, feed_url){ } } +function insertElementsIntoRow(rowElement, elements){ + let tdElement = document.createElement("td") + elements.forEach( el => tdElement.append(el)) + rowElement.append(tdElement) +} + +function insertElementIntoRow(rowElement, element){ + let tdElement = document.createElement("td") + tdElement.append(element) + rowElement.append(tdElement) +} + +function wrapInDiv(element){ + let wrapperDiv = document.createElement("div") + wrapperDiv.append(element) + return wrapperDiv +} + +let itemMap = { + "updated": "pubDate", + "summary": "description", +} +function parseCollection(collection, entries){ + for(const child of collection){ + feedEntry = {"link": "", "title": "", "pubDate": "", "description": ""} + for(const c of child.children){ + if(c.tagName == "link" && c.getAttribute("href")){ + feedEntry["link"] = c.getAttribute("href") + } else { + feedEntry[c.tagName] = c.innerHTML + } + } + // Copy keys to normalized version + for(const key in itemMap){ + if(feedEntry[key]){ + feedEntry[itemMap[key]] = feedEntry[key] + } + } + entries.push(feedEntry) + } +} + +function previewOnclick(item){ + return function(){ + fetch(item.url) + .then( r => r.text() ) + .then(r => new window.DOMParser().parseFromString(r, "text/xml")) + .then(p => { + let entries = [] + parseCollection(p.getElementsByTagName("entry"), entries) + parseCollection(p.getElementsByTagName("item"), entries) + + let tableEl = document.createElement("table") + tableEl.classList.add("preview") + entries.forEach(entry => { + let trEl = document.createElement("tr") + tableEl.append(trEl) + + let titleEl = document.createElement("a") + titleEl.href = entry["link"] + titleEl.innerHTML = entry["title"] + + let wrapperDiv2 = document.createElement("div") + wrapperDiv2.innerText = entry["pubDate"] + + insertElementsIntoRow(trEl, [ + wrapInDiv(titleEl), wrapperDiv2 + ]) + + let td3El = document.createElement("td") + td3El.innerHTML = entry["description"] + trEl.append(td3El) + }) + feeds.append(tableEl) + }) + } +} + window.onload = async function () { let settings = await browser.storage.sync.get(["rb", "reader", "instance"]); base_reader = settings.instance; let base_rb = settings.rb; - let feeds = document.getElementById('feeds'); - feeds.innerText = "Loading..." + let feedsElement = document.getElementById('feeds'); + feedsElement.innerText = "Loading..." browser.tabs.query({ active: true, currentWindow: true }, function (tabs) { browser.tabs.sendMessage(tabs[0].id, {}).then( - function (feed_urls) { - feeds.innerText = "" + function (feeds) { + feedsElement.innerText = "" if(!base_rb) { let newSettingsLink = document.createElement("a") newSettingsLink["href"] = "/options.html" newSettingsLink.innerText = "RSS-bridge instance not set! Click here to open options."; let newDiv = document.createElement('div'); newDiv.append(newSettingsLink); - feeds.appendChild(newDiv); + feedsElement.appendChild(newDiv); let newP = document.createElement('p') - newP.innerText = `Found ${feed_urls.length} feeds` - feeds.append(newP) + newP.innerText = `Found ${feeds.length} feeds` + feedsElement.append(newP) return; } - feed_urls.forEach(item => { - let newLink = document.createElement('a'); - newLink["href"] = item.url - newLink.innerText = item.type; - + let table = document.createElement("table") + table.classList.add("feeds") + feedsElement.append(table) + feeds.forEach(feed => { + let newRow = document.createElement("tr") + table.append(newRow) - let newDiv = document.createElement('div'); - newDiv.append(newLink) + let newLink = document.createElement('a'); + newLink["href"] = feed.url + newLink.innerText = feed.name; + insertElementIntoRow(newRow, newLink) let previewLink = document.createElement('a'); - previewLink["onclick"] = function(){ - fetch(item.url) - .then( r => r.text() ) - .then(r => new window.DOMParser().parseFromString(r, "text/xml")) - .then(p => { - let channelTitle = "Items" - let description = undefined - let items = [] - let lastBuild = undefined - console.log(p.firstChild.children) - for(const channel of p.firstChild.children) { - //p.firstChild.children.forEach(channel => { - for(const child of channel.children) { - //channel.children.forEach(child => { - if(child.tagName == "title"){ - channelTitle = child.textContent - } else if (child.tagName == "lastBuildDate") { - lastBuild = child.textContent - } else if (child.tagName == "description") { - description = child.textContent - } else if (child.tagName == "item") { - item = {} - for(const c of child.children){ - //child.children.forEach(c => { - item[c.tagName] = c.innerHTML - } - items.push(item) - } - } - } - console.log(items) - let tableEl = document.createElement("table") - items.forEach(item => { - let trEl = document.createElement("tr") - tableEl.append(trEl) - - let tdEl = document.createElement("td") - - let titleEl = document.createElement("a") - titleEl.href = item["link"] - titleEl.innerText = item["title"] - let wrapperDiv = document.createElement("div") - wrapperDiv.append(titleEl) - let wrapperDiv2 = document.createElement("div") - wrapperDiv2.innerText = item["pubDate"] - tdEl.append(wrapperDiv) - tdEl.append(wrapperDiv2) - trEl.append(tdEl) - - let td3El = document.createElement("td") - td3El.innerHTML = item["description"] - trEl.append(td3El) - - }) - feeds.append(tableEl) - }) - } + previewLink["onclick"] = previewOnclick(feed) previewLink["href"] = "#" previewLink.innerText = "preview"; - newDiv.append(previewLink) + + let newPreviewData = document.createElement("td") + // Preview only works for XML feeds + if( + feed.type.toLowerCase().includes("rss") || + feed.type.toLowerCase().includes("xml") || + feed.type.toLowerCase().includes("atom") + ){ + newPreviewData.append(previewLink) + } + newRow.append(newPreviewData) if(base_reader){ let subLink = document.createElement('a'); - subLink["href"] = subscribe_link(settings.reader, item.url) + subLink["href"] = subscribe_link(settings.reader, feed.url) subLink.innerText = "subscribe"; - newDiv.append(subLink) + let newSubData = document.createElement("td") + newSubData.append(subLink) + newRow.append(newSubData) } - - feeds.append(newDiv) }) - if(feed_urls.length == 0) { + if(feeds.length == 0) { let newP = document.createElement('p') newP.innerText = "No feeds found" - feeds.append(newP) + feedsElement.append(newP) } }); }); diff --git a/popup/main.html b/popup/main.html index 81f8f06..6c57d10 100644 --- a/popup/main.html +++ b/popup/main.html @@ -6,12 +6,15 @@ div a { margin: 1em; } - table td a { + table.preview td a { margin: 0em; } - td { + table.preview td { border: 1px solid black; } + table.feeds tr td { + //border-bottom: 1px solid black; + } -- cgit v1.2.3