181 lines
6.5 KiB
HTML
181 lines
6.5 KiB
HTML
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<title>Experimental RSS integrator: Delayed loading version</title>
|
|
<style>
|
|
table {
|
|
border: thin solid black;
|
|
}
|
|
td {
|
|
padding: 0.25em 0.5em;
|
|
}
|
|
</style>
|
|
<script
|
|
src="https://code.jquery.com/jquery-4.0.0.min.js"
|
|
integrity="sha256-OaVG6prZf4v69dPg6PhVattBXkcOWQB62pdZ3ORyrao="
|
|
crossorigin="anonymous"
|
|
></script>
|
|
<!--<script
|
|
src="https://www.w3.org/WAI/content-assets/wai-aria-practices/patterns/table/examples/js/sortable-table.js"
|
|
type="text/javascript"
|
|
></script>-->
|
|
<link href="/blog/css/structure.css" rel="stylesheet" type="text/css" />
|
|
<link
|
|
href="/blog/css/colour.adaptive.css"
|
|
rel="stylesheet"
|
|
type="text/css"
|
|
/>
|
|
</head>
|
|
<body>
|
|
<div id="main-container" class="container">
|
|
<div id="content" class="container">
|
|
<h1>Collected blogs from Gaza</h1>
|
|
</div>
|
|
</div>
|
|
<script type="text/javascript">
|
|
const accumulator = new Array();
|
|
|
|
const dateOptions = {
|
|
weekday: "long",
|
|
year: "numeric",
|
|
month: "long",
|
|
day: "numeric",
|
|
};
|
|
|
|
const feeds = [
|
|
// "https://www.journeyman.cc/blog/feed.xml",
|
|
"https://www.journeyman.cc/layan/feed.xml",
|
|
"https://www.journeyman.cc/voices-from-gaza/feed.xml",
|
|
];
|
|
|
|
var feedsRead = 0;
|
|
|
|
function sortByDate(a, b) {
|
|
// console.log(
|
|
// "Sorting: a: " +
|
|
// typeof a.date +
|
|
// ", " +
|
|
// a.date +
|
|
// "; " +
|
|
// typeof b.date +
|
|
// ", " +
|
|
// b.date,
|
|
// );
|
|
const r = a.date - b.date;
|
|
|
|
// console.log("\t<== ", r);
|
|
|
|
return r;
|
|
}
|
|
|
|
function display(target) {
|
|
console.log("display() called");
|
|
var x = accumulator[0];
|
|
accumulator.sort(sortByDate);
|
|
var y = accumulator.sort(sortByDate)[0];
|
|
console.log(
|
|
"x = " + JSON.stringify(x) + "; y = " + JSON.stringify(y),
|
|
);
|
|
|
|
for (record of accumulator.sort(sortByDate).reverse()) {
|
|
// console.log("Adding post '" + record.title + "'");
|
|
$(target).append(
|
|
'<h2><a href="' +
|
|
record.link +
|
|
'">' +
|
|
record.title +
|
|
"</a></h2>" +
|
|
"<p><author>" +
|
|
record.author +
|
|
"</author> on " +
|
|
record.dateString +
|
|
"</p>" +
|
|
"<p>" +
|
|
record.description +
|
|
"</p>" +
|
|
'<p><a href="' +
|
|
record.link +
|
|
'">Read more...</a></p>' +
|
|
"<hr>",
|
|
);
|
|
}
|
|
}
|
|
|
|
function getRSSFeed(feed) {
|
|
console.log("Fetching data from: " + feed);
|
|
$.ajax(feed, {
|
|
accepts: {
|
|
xml: "application/rss+xml",
|
|
},
|
|
|
|
dataType: "xml",
|
|
|
|
success: function (data) {
|
|
const channel = $(data).find("channel").first();
|
|
$(data)
|
|
.find("item")
|
|
.each(function (i, element) {
|
|
const el = $(this);
|
|
const dt = Date.parse(
|
|
el.find("pubDate").text(),
|
|
);
|
|
|
|
const record = {
|
|
date: dt,
|
|
dateString: new Date(dt).toLocaleDateString(
|
|
undefined,
|
|
dateOptions,
|
|
),
|
|
link: el.find("link").text(),
|
|
title: el.find("title").text(),
|
|
author: el.find("author").text(),
|
|
description: el.find("description").text(),
|
|
blogLink: channel
|
|
.find("link")
|
|
.first()
|
|
.text(),
|
|
blogTitle: channel
|
|
.find("title")
|
|
.first()
|
|
.text(),
|
|
};
|
|
|
|
// console.log(
|
|
// "Assembled record " +
|
|
// JSON.stringify(record),
|
|
// );
|
|
accumulator.push(record);
|
|
return true;
|
|
});
|
|
feedsRead++;
|
|
console.log(
|
|
"Read " + feedsRead + " of " + feeds.length,
|
|
);
|
|
|
|
if (feedsRead == feeds.length) {
|
|
display("#content");
|
|
}
|
|
},
|
|
});
|
|
}
|
|
|
|
for (const f of feeds) {
|
|
getRSSFeed(f);
|
|
}
|
|
|
|
const delay = (ms) => new Promise((res) => setTimeout(res, ms));
|
|
|
|
// const sortTable = async () => {
|
|
// await delay(10000);
|
|
// console.log("Waited 10s");
|
|
// display("#posts");
|
|
// };
|
|
|
|
// window.onload = (event) => {
|
|
// console.log("page is fully loaded");
|
|
// console.log(JSON.stringify(accumulator));
|
|
// sortTable();
|
|
// };
|
|
</script>
|
|
</body>
|
|
</html>
|