5 minute readCreated on December 1, 2020
RSS Feed written in HTML + JavaScript

If you want to directly open the HTML file in your browser after saving, don't forget to set CORS_PROXY=""
<!doctype html>
-<html lang="en">
-<head>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>
-        RSS Feed
-    </title>
-    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
-</head>
-<body>
-
-<h1 align="center" class="display-1">RSS Feed</h1>
-<main>
-    <div class="container">
-    <div class="list-group pb-4" id="contents"></div>
-<div id="feed">
-</div></div>
-</main>
-
-<script src="https://gitcdn.xyz/repo/rbren/rss-parser/master/dist/rss-parser.js"></script>
-<script>
-
-const feeds = {
-    "BuzzFeed - India": {
-      "link":"https://www.buzzfeed.com/in.xml",
-      "summary":true
-    },
-    "New Yorker": {
-      "link":"http://www.newyorker.com/feed/news",
-    },
-    "Vox":{
-      "link":"https://www.vox.com/rss/index.xml",
-      "limit": 3
-    },
-    "r/Jokes":{
-      "link":"https://reddit.com/r/Jokes/hot/.rss?sort=hot",
-      "ignore": ["repost","discord"]
-    }
-}
-
-const config_extra = {
-"Responsive-Images": true,
-"direct-link": false,
-"show-date":false,
-"left-column":false,
-"defaults": {
-  "limit": 5,
-  "summary": true
-}
-}
-
-const CORS_PROXY = "https://cors-anywhere.herokuapp.com/"
-
-var contents_title = document.createElement("h2")
-contents_title.textContent = "Contents"
-contents_title.classList.add("pb-1")
-document.getElementById("contents").appendChild(contents_title)
-
-async function myfunc(key){
-
-  var count_lim = feeds[key]["limit"]
-  var count_lim = (count_lim === undefined) ? config_extra["defaults"]["limit"] : count_lim
-  
-  var show_summary = feeds[key]["summary"]
-  var show_summary = (show_summary === undefined) ? config_extra["defaults"]["summary"] : show_summary
-
-  var ignore_tags = feeds[key]["ignore"]
-  var ignore_tags = (ignore_tags === undefined) ? [] : ignore_tags
-
-  var contents = document.createElement("a")
-  contents.href = "#" + key
-  contents.classList.add("list-group-item","list-group-item-action")
-  contents.textContent = key
-  document.getElementById("contents").appendChild(contents)
-  var feed_div = document.createElement("div")
-  feed_div.id = key
-  feed_div.setAttribute("id", key);
-  var title = document.createElement("h2");
-  title.textContent = "From " + key;
-  title.classList.add("pb-1")
-  feed_div.appendChild(title)
-  document.getElementById("feed").appendChild(feed_div)
-  var parser = new RSSParser();
-  var countPosts = 0
-  parser.parseURL(CORS_PROXY + feeds[key]["link"], function(err, feed) {
-    if (err) throw err;
-    feed.items.forEach(function(entry) {
-      if (countPosts < count_lim) {
-
-      var skip = false
-      for(var i = 0; i < ignore_tags.length; i++) {
-        if (entry.title.includes(ignore_tags[i])){
-          var skip = true
-        } else if (entry.content.includes(ignore_tags[i])){
-          var skip = true
-        }
-      }
-
-      if (!skip) {
-
-      var node = document.createElement("div");
-      node.classList.add("card","mb-3");
-      var row = document.createElement("div")
-      row.classList.add("row","no-gutters")
-      
-      if (config_extra["left-column"]){
-      var left_col = document.createElement("div")
-      left_col.classList.add("col-md-2")
-      var left_col_body = document.createElement("div")
-      left_col_body.classList.add("card-body")
-      }
-      
-      var right_col = document.createElement("div")
-      if (config_extra["left-column"]){
-        right_col.classList.add("col-md-10")
-      }
-      var node_title = document.createElement("h5")
-      
-      node_title.classList.add("card-header")
-      node_title.innerHTML = entry.title
-      
-      node_body = document.createElement("div")
-      node_body.classList.add("card-body")
-      
-      node_content = document.createElement("p")
-      
-      if (show_summary){
-        node_content.innerHTML = entry.content
-      }
-      node_content.classList.add("card-text")
-      
-      if (config_extra["direct-link"]){
-      node_link = document.createElement("p")
-      node_link.classList.add("card-text")
-      node_link.innerHTML = "<b>Link:</b> <a href='" + entry.link +"'>Direct Link</a>"
-      if (config_extra["left-column"]){
-      left_col_body.appendChild(node_link)
-        } else {
-          node_content.appendChild(node_link)
-        }
-      }
-
-      if (config_extra["show-date"]){
-        node_date = document.createElement("p")
-        node_date.classList.add("card-text")
-        node_date.innerHTML = "<p><b>Date: </b>" + entry.pubDate + "</p>"
-        if (config_extra["left-column"]){
-        left_col_body.appendChild(node_date)
-          } else {
-            node_content.appendChild(node_date)
-          
-        }
-      }
-
-      node.appendChild(node_title)
-      
-      node_body.appendChild(node_content)
-      
-      right_col.appendChild(node_body)
-
-      if (config_extra["left-column"]){
-        left_col.appendChild(left_col_body)
-        row.appendChild(left_col)
-      }
-      
-      row.appendChild(right_col)
-
-      node.appendChild(row)
-
-      document.getElementById(key).appendChild(node)
-      countPosts+=1
-    }
-    }
-  })
-
-  if (config_extra["Responsive-Images"]){
-  var inputs = document.getElementsByTagName('img')
-      for(var i = 0; i < inputs.length; i++) {
-        inputs[i].classList.add("img-fluid")
-      }
-  }
-
-  })
-
-  return true
-}
-(async () => {
-for(var key in feeds) {
-  let result = await myfunc(key);
-}})();
-
-</script>
-<noscript>Uh Oh! Your browser does not support JavaScript or JavaScript is currently disabled. Please enable JavaScript or switch to a different browser.</noscript>
-</body></html>
-
Tagged with: