4 <title>News River</title>
6 <link rel="stylesheet" href="/style.css">
7 <script src="https://unpkg.com/htmx.org@1.7.0"></script>
11 <div id="feed-pane" valign="top" hx-get="/accounts/{ACCOUNT_ID}/feeds" hx-trigger="load, newFeed from:body, every 900s" hx-target="#feed-list">
13 <div id="feed-list"></div>
15 <form hx-post="/accounts/{ACCOUNT_ID}/feeds" hx-includes="#auth-token">
16 <input type="url" name="link" placeholder="Link to RSS Feed">
17 <button type="submit" class="btn">Add</button>
21 <div id="list-pane"></div>
22 <div id="reading-pane"></div>
24 A project by <a href="https://xangelo.ca">xangelo</a> that is still in active <a href="https://git.xangelo.ca/?p=rss-reader.git;a=summary">development</a> (2022)
28 function $(sel, root, opts) {
29 const el = (root || document).querySelectorAll(sel);
30 if(opts && opts.array) {
31 return Array.from(el);
37 return Array.from(el);
41 function activeMarker(e) {
42 // clear sibling active class.
43 if(e.target.parentElement.tagName === 'LI') {
44 const parent = e.target.parentElement.parentElement;
45 $('a.active', parent, {array: true}).forEach(el => {
46 el.classList.remove('active');
50 e.target.classList.add('active');
53 $('body').addEventListener('click', e => {
54 const actions = e.target.getAttribute('data-actions');
55 if(actions && actions.split(' ').includes('activate')) {
58 if (e.target.classList.contains('unread') && e.target.getAttribute('data-feed-item-id') !== null) {
59 e.target.classList.remove('unread');
60 // ok it was unread.. so we should figure out the id that it belongs
61 // to and decr the counter for that!
62 const feedId = e.target.getAttribute('data-feed-id');
63 const el = $(`#feed-list a[data-feed-id="${feedId}"] .unread-count`);
65 if(el.innerHTML.length) {
66 let count = parseInt(el.innerHTML.split('(')[1].split(')')[0]);
70 el.parentElement.classList.remove('unread');
73 el.innerHTML = `(${count})`;