caranmegil/mosaic-widgets
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update to include RSS reader

Browse Source
This commit is contained in:
William Moore 2023-06-12 07:49:05 -05:00
parent a9ade8948e
commit 768d262f34
4 changed files with 117 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
gulpfile.js
View File

@ -8,6 +8,9 @@ function replaceTemplate() {
.pipe(replace(/TEASENSE_URI/g, process.env.TEASENSE_URI)) .pipe(replace(/TEASENSE_URI/g, process.env.TEASENSE_URI))
.pipe(replace(/RAINFALL_URI/g, process.env.RAINFALL_URI)) .pipe(replace(/RAINFALL_URI/g, process.env.RAINFALL_URI))
.pipe(replace(/SPLORK_URI/g, process.env.SPLORK_URI)) .pipe(replace(/SPLORK_URI/g, process.env.SPLORK_URI))
.pipe(replace(/RSS_ORIGIN/g, process.env.RSS_ORIGIN))
.pipe(replace(/RSS_API_HOST/g, process.env.RSS_API_HOST))
.pipe(replace(/RSS_API_KEY/g, process.env.RSS_API_KEY))
.pipe(dest('./dist/js')); .pipe(dest('./dist/js'));
return src(['./dist/**/*.html']) return src(['./dist/**/*.html'])

9
public/rss.html Normal file
View File

@ -0,0 +1,9 @@
<html>
<head>
<meta http-equiv="refresh" content="3600">
<script type="module" src="./js/RSS.js"></script>
</head>
<body>
<lavender-rss></lavender-rss>
</body>
</html>

104
src/RSS.ts Normal file
View File

@ -0,0 +1,104 @@
import { LitElement, html, css } from 'lit';
import { customElement } from 'lit/decorators.js';
type RSSItem = {
title: string;
link: string | null;
}
@customElement('lavender-rss')
export class RSS extends LitElement {
rssItems: RSSItem[] = [];
rssTitle = '';
rssLink: string | null = null;
constructor() {
super();
this.pullValueFromBackend();
}
async pullValueFromBackend() {
const urlParams = new URLSearchParams(window.location.search);
const url = 'https://RSS_API_HOST/';
const options = {
method: 'POST',
headers: {
'content-type': 'application/json',
Origin: 'RSS_ORIGIN',
'X-Requested-With': 'RSS_ORIGIN',
'X-RapidAPI-Key': 'RSS_API_KEY',
'X-RapidAPI-Host': 'RSS_API_HOST'
},
body: JSON.stringify({
url: urlParams.get('rss'),
}),
};
try {
const response = await fetch(url, options);
const result = await response.text();
const rss = (new DOMParser()).parseFromString(result, 'text/xml');
console.log(rss);
const title = rss.getElementsByTagName('title')[0] ?? null;
const link = rss.getElementsByTagName('link')[0] ?? null;
this.rssTitle = title?.textContent ?? 'Undefined';
this.rssLink = link?.textContent ?? null;
const items = rss.getElementsByTagName('item');
const allItems: RSSItem[] = [];
for (let itemsI = 0; itemsI < items.length; itemsI++) {
const item = items.item(itemsI);
const itemTitle = item?.getElementsByTagName('title')[0] ?? null;
const itemLink = item?.getElementsByTagName('link')[0] ?? null;
allItems.push({
title: itemTitle?.textContent ?? 'Undefined',
link: itemLink?.textContent ?? null,
});
}
this.rssItems = allItems;
this.requestUpdate();
} catch (error) {
console.error(error);
}
// setTimeout(() => this.pullValueFromBackend(), 1000);
}
static override styles = [
css`
.gauge-body {
display: flex;
flex-direction: column;
justify-content: space-between;
align-content: space-between;
text-align: center;
}
.gauge-label {
font-weight: bold;
}
`
]
override render() {
return html`
<div class="gauge-body">
<div class="gauge-label">RSS Feed for ${this.rssTitle}${this.rssLink ? html`<a href="${this.rssLink}">link</a>` : ''}</div>
${this.rssItems.map(rssItem => html`
<div>
<div>${rssItem.link ? html`<a href="${rssItem.link}">${rssItem.title}</a>` : rssItem.title}</div>
</div>
`)}
</div>
`;
}
}
declare global {
interface HTMLElementTagNameMap {
'lavender-rss': RSS;
}
}

2
src/Rainfall.ts
View File

@ -19,7 +19,7 @@ export class Rainfall extends LitElement {
this.setValue(result); this.setValue(result);
setTimeout(() => this.pullValueFromBackend(), 5000); setTimeout(() => this.pullValueFromBackend(), 1000);
} }
setValue(newValue: number) { setValue(newValue: number) {