--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/popup/feed-selection.js	Wed Oct 03 23:40:57 2018 +0200
@@ -0,0 +1,46 @@
+/*
+ * Copyright (C) 2018 Guido Berhoerster <guido+feed-preview@berhoerster.name>
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+'use strict';
+
+async function buildFeedSelection() {
+    let tabs = await browser.tabs.query({active: true, currentWindow: true});
+    let feeds = await browser.runtime.sendMessage(tabs[0].id);
+
+    let feedListElement = document.querySelector('.panel-section-list');
+    feedListElement.addEventListener('click', ev => {
+        // find selected list item element and open the feed in a new tab
+        for (let element = ev.target; element !== ev.currentTarget;
+                element = element.parentElement) {
+            if (element.classList.contains('panel-list-item')) {
+                browser.tabs.create({url: element.dataset.href});
+                break;
+            }
+        }
+        ev.preventDefault();
+    });
+
+    let templateElement = document.querySelector('#feed-item-template');
+    for (let feed of feeds) {
+        let feedNode = document.importNode(templateElement.content, true);
+        feedNode.querySelector('.panel-list-item').dataset.href = feed.href;
+
+        let prefix = (feed.type === 'application/atom+xml') ? 'Atom Feed' :
+                'RSS Feed';
+
+        let imgNode = feedNode.querySelector('.icon > img');
+        imgNode.src = browser.runtime.getURL('icons/feed-preview.svg');
+        imgNode.alt = prefix;
+
+        feedNode.querySelector('.text').textContent =
+                `${prefix}: ${feed.title}`;
+        feedListElement.appendChild(feedNode);
+    }
+}
+
+buildFeedSelection();