Added support for extraction of feed URLs from the current page in the popup
This commit is contained in:
parent
67896b2380
commit
f065860edb
5 changed files with 63 additions and 12 deletions
|
|
@ -1,8 +1,8 @@
|
||||||
import browser from 'webextension-polyfill';
|
import browser from 'webextension-polyfill';
|
||||||
|
|
||||||
browser.webNavigation.onCompleted.addListener(
|
browser.webNavigation.onCompleted.addListener(
|
||||||
async (event: {tabId: string;}) => {
|
async (event: {tabId: string;}) => {
|
||||||
const { tabId } = event
|
const { tabId } = event
|
||||||
await browser.tabs.sendMessage(tabId, {type: 'renderFeed'})
|
await browser.tabs.sendMessage(tabId, {type: 'renderFeed'})
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
|
||||||
34
src/main.ts
34
src/main.ts
|
|
@ -136,10 +136,7 @@ const getFeedRoot = () => {
|
||||||
return root
|
return root
|
||||||
}
|
}
|
||||||
|
|
||||||
browser.runtime.onMessage.addListener(async (message: {type: Object}) => {
|
const renderFeed = () => {
|
||||||
if (message.type !== 'renderFeed')
|
|
||||||
return
|
|
||||||
|
|
||||||
const xmlDoc = getFeedRoot()
|
const xmlDoc = getFeedRoot()
|
||||||
if (!xmlDoc)
|
if (!xmlDoc)
|
||||||
// Not an RSS feed
|
// Not an RSS feed
|
||||||
|
|
@ -151,4 +148,33 @@ browser.runtime.onMessage.addListener(async (message: {type: Object}) => {
|
||||||
|
|
||||||
browser.storage.local.set(parseFeed(channel))
|
browser.storage.local.set(parseFeed(channel))
|
||||||
window.location.href = browser.runtime.getURL('viewer/index.html')
|
window.location.href = browser.runtime.getURL('viewer/index.html')
|
||||||
|
}
|
||||||
|
|
||||||
|
const extractFeedUrl = () => {
|
||||||
|
const links = Array.from(document.getElementsByTagName('link'))
|
||||||
|
.filter((link) =>
|
||||||
|
link.getAttribute('rel') === 'alternate' &&
|
||||||
|
link.getAttribute('type') === 'application/rss+xml'
|
||||||
|
)
|
||||||
|
|
||||||
|
if (!links.length)
|
||||||
|
return
|
||||||
|
|
||||||
|
let link = links[0].getAttribute('href') || ''
|
||||||
|
if (link.length && !link.match(/^https?:\/\//)) {
|
||||||
|
let port = window.location.port
|
||||||
|
if (port.length)
|
||||||
|
port = `:${port}`
|
||||||
|
link = `${window.location.protocol}//${window.location.hostname}${port}${link}`
|
||||||
|
}
|
||||||
|
|
||||||
|
return link.length ? link : null
|
||||||
|
}
|
||||||
|
|
||||||
|
browser.runtime.onMessage.addListener(async (message: {type: Object}) => {
|
||||||
|
if (message.type === 'renderFeed')
|
||||||
|
return renderFeed()
|
||||||
|
if (message.type === 'extractFeedUrl')
|
||||||
|
return extractFeedUrl()
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,14 +1,34 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="popup">
|
<div class="popup">
|
||||||
Nothing interesting here
|
<div v-if="feedUrl">
|
||||||
|
<a :href="feedUrl" target="_blank">Found a feed URL</a>
|
||||||
|
</div>
|
||||||
|
<div v-else>
|
||||||
|
No feed URLs found on this page
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script>
|
||||||
|
import browser from 'webextension-polyfill';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'Popup',
|
name: 'Popup',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
feedUrl: null,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
async mounted() {
|
||||||
|
const [tab] = await chrome.tabs.query({ active: true, currentWindow: true })
|
||||||
|
this.feedUrl = await browser.tabs.sendMessage(tab.id, {type: 'extractFeedUrl'})
|
||||||
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
.popup {
|
||||||
|
padding: 1em;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<title>Popup</title>
|
<title>RSS Viewer Popup</title>
|
||||||
</head>
|
</head>
|
||||||
<body style="min-width: 200px;">
|
<body style="min-width: 200px;">
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
|
|
|
||||||
|
|
@ -18,7 +18,8 @@
|
||||||
|
|
||||||
<main>
|
<main>
|
||||||
<div class="item" v-for="item, i in (feed.items || [])" :key="i">
|
<div class="item" v-for="item, i in (feed.items || [])" :key="i">
|
||||||
<div class="header" @click="expandedItems[i] = !expandedItems[i]">
|
<div class="header" :class="{expanded: expandedItems[i]}"
|
||||||
|
@click="expandedItems[i] = !expandedItems[i]">
|
||||||
<h2 v-if="item.title?.length">
|
<h2 v-if="item.title?.length">
|
||||||
<a :href="item.url" target="_blank" v-text="item.title" />
|
<a :href="item.url" target="_blank" v-text="item.title" />
|
||||||
</h2>
|
</h2>
|
||||||
|
|
@ -124,6 +125,10 @@ main {
|
||||||
padding: 0.5em;
|
padding: 0.5em;
|
||||||
border-radius: 1em;
|
border-radius: 1em;
|
||||||
|
|
||||||
|
&.expanded {
|
||||||
|
border-radius: 1em 1em 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background: #cff7cf;
|
background: #cff7cf;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue