Uhhhhh

Signed-off-by: Sam Therapy <sam@samtherapy.net>

.drone.yml

@@ -3,19 +3,19 @@ type: docker
 name: default
 
 steps:
-- name: dependencies
-  image: node
-  commands:
-  - yarn
+  - name: dependencies
+    image: node
+    commands:
+      - yarn
 
-- name: lint
-  image: node
-  commands:
-  - yarn lint
-  depends: [dependencies]
+  - name: lint
+    image: node
+    commands:
+      - yarn lint:ci
+    depends: [dependencies]
 
-- name: test
-  image: node
-  commands: 
-   - yarn test
-  depends: [lint]
+  - name: test
+    image: node
+    commands:
+      - yarn test
+    depends: [lint]

.eslintignore

@@ -1 +1,2 @@
-src/public/infinite-scroll.js
+src/public/lib/infinite-scroll.pkgd.min.js
+.yarn/

.eslintrc.json

@@ -1,30 +1,19 @@
 {
-    "env": {
-        "browser": true,
-        "es2021": true,
-        "node": true
-    },
-    "extends": "eslint:recommended",
-    "parserOptions": {
-        "ecmaVersion": "latest",
-        "sourceType": "module"
-    },
-    "rules": {
-        "indent": [
-            "error",
-            4
-        ],
-        "linebreak-style": [
-            "error",
-            "unix"
-        ],
-        "quotes": [
-            "error",
-            "double"
-        ],
-        "semi": [
-            "error",
-            "always"
-        ]
-    }
+  "env": {
+    "browser": true,
+    "es2021": true,
+    "node": true
+  },
+  "parserOptions": {
+    "ecmaVersion": "latest",
+    "sourceType": "module"
+  },
+  "plugins": ["prettier"],
+  "rules": {
+    "linebreak-style": ["error", "unix"],
+    "quotes": ["error", "double"],
+    "semi": ["error", "always"],
+    "prettier/prettier": ["error", { "singleQuote": false }]
+  },
+  "extends": ["eslint:recommended", "plugin:prettier/recommended"]
 }

.gitignore

@@ -127,4 +127,6 @@ dist
 .yarn/unplugged
 .yarn/build-state.yml
 .yarn/install-state.gz
-.pnp.*
+.pnp.*
+
+.dccache

.prettierignore

@@ -0,0 +1,2 @@
+src/public/lib/infinite-scroll.pkgd.min.js
+.yarn/

README.md

@@ -9,7 +9,7 @@ https://www.fedifeed.com
 
 ## User guide
 
-The homepage has a tool for generating iframe code for you, with a sensible `sandbox` attribute.  The feeds fit comfortably in a 400px wide area.
+The homepage has a tool for generating iframe code for you, with a sensible `sandbox` attribute. The feeds fit comfortably in a 400px wide area.
 
 ## API
 
@@ -19,28 +19,29 @@ The homepage has a tool for generating iframe code for you, with a sensible `san
 
 > example: `/api/v1/feed?userurl=https%3A%2F%2Foctodon.social%2Fusers%2Ffenwick67&scale=90&theme=masto-light`
 
-Returns a html page which displays a feed for a user URL.  Note that URLs must be URI encoded (i.e. `encodeURIComponent('https://octodon.social/users/fenwick67')` ).
+Returns a html page which displays a feed for a user URL. Note that URLs must be URI encoded (i.e. `encodeURIComponent('https://octodon.social/users/fenwick67')` ).
 
 Querystring options:
 
-| option | required | description |
-| ------ | -------- | ----------- |
-| `userurl` | **\*** | Mastodon/Pleroma/Misskey account URL (usually `https://${instance}/users/${username}` for MastoAPI or `https://${instance}/@${username}` for Misskey) |
-| `instance` | **\*\***| Mastodon/Pleroma/Misskey instance URL (usually `https://${instance}`) |
-| `user` | **\*\*** | Mastodon/Pleroma/Misskey user ID (usually `${username}`) |
-| `feedurl` | no | a URL to a page of an ActivityPub post collection. Only used for pages beyond the first. |
-| `theme` | no | either `masto-dark`, `masto-light` or `masto-auto`, to select the UI theme (default is `masto-dark`). `auto` will appear masto-light unless the user sets up masto-dark mode on their device. |
-| `boosts` | no | whether to show boosts or not |
-| `replies` | no | whether to show replies or not |
-| `size` | no | the scale of the UI in percent. |
+| option     | required | description                                                                                                                                                                                   |
+| ---------- | -------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `userurl`  | **\***   | Mastodon/Pleroma/Misskey account URL (usually `https://${instance}/users/${username}` for MastoAPI or `https://${instance}/@${username}` for Misskey)                                         |
+| `instance` | **\*\*** | Mastodon/Pleroma/Misskey instance URL (usually `https://${instance}`)                                                                                                                         |
+| `user`     | **\*\*** | Mastodon/Pleroma/Misskey user ID (usually `${username}`)                                                                                                                                      |
+| `feedurl`  | no       | a URL to a page of an ActivityPub post collection. Only used for pages beyond the first.                                                                                                      |
+| `theme`    | no       | either `masto-dark`, `masto-light` or `masto-auto`, to select the UI theme (default is `masto-dark`). `auto` will appear masto-light unless the user sets up masto-dark mode on their device. |
+| `boosts`   | no       | whether to show boosts or not                                                                                                                                                                 |
+| `replies`  | no       | whether to show replies or not                                                                                                                                                                |
+| `size`     | no       | the scale of the UI in percent.                                                                                                                                                               |
 
 \* `userurl` is required if `instance` and `user` are not specified.\*\*\* \
 \*\* `instance` **and** `user` are required if `userurl` is not specified.\*\*\*
 
 \*\*\* **`userurl` and `instance`/`user` are mutually exclusive.**
+
 ## Server Installation
 
-This is a straightforward node project with zero databases or anything, you should just be able to run `yarn install` and then `yarn start` to get up and running.  Set your `PORT` environment variable to change the port it listens on.
+This is a straightforward node project with zero databases or anything, you should just be able to run `yarn install` and then `yarn start` to get up and running. Set your `PORT` environment variable to change the port it listens on.
 
 ## Improve me
 

index.js

@@ -0,0 +1,160 @@
+import Express from "express";
+// v2 api
+import convertv2 from "./lib/convert.js";
+import serveStatic from "serve-static";
+import cors from "cors";
+import errorPage from "./lib/errorPage.js";
+import morgan from "morgan";
+import { detector } from "megalodon";
+import helmet from "helmet";
+
+const app = Express();
+app.use(
+  helmet({
+    contentSecurityPolicy: false,
+    crossOriginEmbedderPolicy: false,
+    crossOriginResourcePolicy: false,
+  })
+);
+
+const logger = morgan(":method :url :status via :referrer - :response-time ms");
+
+app.use(
+  serveStatic("public", {
+    maxAge: "1d",
+  })
+);
+
+function doCache(res, durationSecs) {
+  res.set({
+    "Cache-Control": "max-age=" + durationSecs,
+  });
+}
+
+// this just redirects to the
+app.options("/api/feed", cors());
+app.get("/api/feed", cors(), logger, function (req, res) {
+  // get feed url
+  const feedUrl = req.query.url;
+  if (!feedUrl) {
+    res
+      .status(400)
+      .send(errorPage(400, "You need to specify a feed URL", null));
+    return;
+  }
+
+  const userUrl = feedUrl.replace(/\.atom.*/i, "");
+
+  const redirectUrl = "/api/v1/feed?";
+  const qs = ["userurl=" + encodeURIComponent(userUrl), "api=v1"];
+
+  ["size", "theme", "boosts", "replies"].forEach((key) => {
+    if (typeof req.query[key] != "undefined") {
+      qs.push(key + "=" + encodeURIComponent(req.query[key]));
+    }
+  });
+
+  res.redirect(redirectUrl + qs.join("&"));
+});
+
+app.options("/api/v1/feed", cors());
+app.get("/api/v1/feed", cors(), logger, async function (req, res) {
+  // get feed url
+  // userUrl
+  let type = req.query.instance_type;
+  let userUrl = req.query.userurl;
+  if (userUrl === "" || userUrl === undefined) {
+    const user = req.query.user;
+    const instance = req.query.instance;
+    if (type === "" || type === undefined) {
+      type = await detector(instance).catch(() => "");
+    }
+    if (type === "mastodon" || type === "pleroma")
+      userUrl = instance + "/users/" + user;
+    else if (type === "misskey") userUrl = instance + "/@" + user;
+    else {
+      res
+        .status(400)
+        .send(errorPage(400, "You need to specify a user URL", null));
+      return;
+    }
+  }
+
+  const feedUrl = req.query.feedurl;
+
+  const opts = {};
+  if (req.query.size) {
+    opts.size = req.query.size;
+  }
+  if (req.query.theme) {
+    opts.theme = req.query.theme;
+    if (opts.theme === "auto-auto") {
+      switch (type) {
+        case "mastodon":
+          opts.theme = "masto-auto";
+          break;
+        case "pleroma":
+          opts.theme = "pleroma";
+          break;
+        case "misskey":
+          opts.theme = "misskey-auto";
+          break;
+        default:
+          break;
+      }
+    } else if (opts.theme === "auto-light") {
+      switch (type) {
+        case "mastodon":
+          opts.theme = "masto-light";
+          break;
+        case "misskey":
+          opts.theme = "misskey-light";
+          break;
+        case "pleroma":
+          opts.theme = "pleroma-light";
+          break;
+        default:
+          break;
+      }
+    } else if (opts.theme === "auto-dark") {
+      switch (type) {
+        case "mastodon":
+          opts.theme = "masto-dark";
+          break;
+        case "misskey":
+          opts.theme = "misskey-dark";
+          break;
+        case "pleroma":
+          opts.theme = "pleroma-dark";
+          break;
+        default:
+          break;
+      }
+    }
+  }
+  if (req.query.header) opts.header = req.query.header.toLowerCase() === "true";
+  if (req.query.boosts) opts.boosts = req.query.boosts.toLowerCase() === "true";
+  if (req.query.replies)
+    opts.replies = req.query.replies.toLowerCase() === "true";
+  opts.instance_type = type;
+  opts.userUrl = userUrl;
+  opts.feedUrl = feedUrl;
+  opts.mastofeedUrl = req.url;
+
+  convertv2(opts)
+    .then((data) => {
+      doCache(res, 60 * 60);
+      res.status(200).send(data);
+    })
+    .catch((er) => {
+      res
+        .status(500)
+        .send(errorPage(500, null, { theme: opts.theme, size: opts.size }));
+      // TODO log the error
+      console.error(er, er.stack);
+    });
+});
+
+app.listen(process.env.PORT || 8000, "127.0.0.1", function () {
+  console.log("Server started, listening on " + (process.env.PORT || 8000));
+});

lib/convert.js

@@ -12,238 +12,258 @@ const hour = 3600000;
 
 // note: rejects on HTTP 4xx or 5xx
 async function apGet(url) {
-    
-    return new Promise(function(resolve,reject){
-
-        // fail early
-        if (!url){
-            reject(new Error("URL is invalid"));
-        }
-
-        got( {
-            url:url,
-            cache:map,
-            headers: {
-                "accept": "application/activity+json"
-            }
-        })
-            .then(response=>JSON.parse(response.body))
-            .then(resolve)
-            .catch(reject);
+  return new Promise(function (resolve, reject) {
+    // fail early
+    if (!url) {
+      reject(new Error("URL is invalid"));
+    }
 
-    });
-    
+    got({
+      url: url,
+      cache: map,
+      headers: {
+        accept: "application/activity+json",
+      },
+    })
+      .then((response) => JSON.parse(response.body))
+      .then(resolve)
+      .catch(reject);
+  });
 }
 
 // like Promise.all except returns null on error instead of failing all the promises
-async function promiseSome(proms){
-
-    function noRejectWrap(prom){
-        return new Promise(function(resolve){
-                
-            prom // it's already been called
-                .then(resolve)
-                .catch( ()=>{
-                // console.warn(e);// for debugging
-                    resolve(null);
-                });
-
+async function promiseSome(proms) {
+  function noRejectWrap(prom) {
+    return new Promise(function (resolve) {
+      prom // it's already been called
+        .then(resolve)
+        .catch(() => {
+          // console.warn(e);// for debugging
+          resolve(null);
         });
-    }
-
-    return await Promise.all(proms.map(noRejectWrap));
+    });
+  }
 
+  return await Promise.all(proms.map(noRejectWrap));
 }
 
 export default async function (opts) {
-    // let opts = opts;
+  // let opts = opts;
 
-    let feedUrl = opts.feedUrl;
-    let userUrl = opts.userUrl;
-    let isIndex = false;
+  let feedUrl = opts.feedUrl;
+  let userUrl = opts.userUrl;
+  let isIndex = false;
 
-    if (!userUrl) {
-        throw new Error("need user URL");
-    }
+  if (!userUrl) {
+    throw new Error("need user URL");
+  }
 
-    let user, feed;
-
-    // get user and feed in parallel if I have both URLs.
-    // can cache feed aggressively since it is a specific start and end.
-    if (userUrl && feedUrl){
-        [user, feed] = await Promise.all([ apGet(userUrl), apGet(feedUrl) ]);
-    }else{
-        // get user, then outbox, then feed
-    
-        user = await apGet(userUrl,24 * hour);
-        isIndex = true;
-        let outbox = await apGet(user.outbox, 1 * hour);
-        
-        // outbox.first can be a string for a URL, or an object with stuffs in it
-        if (typeof outbox.first == "object"){
-            feed = outbox.first;
-        } else {           
-            feed = await apGet(outbox.first, hour/6);// 10 mins. Because the base feed URL can get new toots quickly.
-        }
+  let user, feed;
+
+  // get user and feed in parallel if I have both URLs.
+  // can cache feed aggressively since it is a specific start and end.
+  if (userUrl && feedUrl) {
+    [user, feed] = await Promise.all([apGet(userUrl), apGet(feedUrl)]);
+  } else {
+    // get user, then outbox, then feed
 
+    user = await apGet(userUrl);
+    isIndex = true;
+    let outbox = await apGet(user.outbox);
+
+    // outbox.first can be a string for a URL, or an object with stuffs in it
+    if (typeof outbox.first == "object") {
+      feed = outbox.first;
+    } else {
+      feed = await apGet(outbox.first); 
     }
-    
-    let templateData = {
-        opts: opts,// from the request
-        meta: metaForUser(user),
-        items: await itemsForFeed(opts,user,feed),
-        nextPageLink: getNextPage(opts,user,feed),
-        isIndex: isIndex
-    };
+  }
 
-    return template(templateData);
+  let templateData = {
+    opts: opts, // from the request
+    meta: metaForUser(user),
+    items: await itemsForFeed(opts, user, feed),
+    nextPageLink: getNextPage(opts, user, feed),
+    isIndex: isIndex,
+  };
 
+  return template(templateData);
 }
 
 function metaForUser(user) {
-    return {
-        avatar: user.icon && user.icon.url?user.icon.url:null,
-        headerImage:user.image && user.image.url?user.image.url:null,
-        title: user.name||user.preferredUsername||null,
-        description: user.summary||null,
-        link:user.url||"#"
-    };
+  return {
+    avatar: user.icon && user.icon.url ? user.icon.url : null,
+    headerImage: user.image && user.image.url ? user.image.url : null,
+    title: user.name || user.preferredUsername || null,
+    description: user.summary || null,
+    link: user.url || "#",
+  };
 }
 
-async function itemsForFeed(opts,user,feed) {
-
-    let items = feed.orderedItems;
-    
-    if (opts.boosts){
-        // yes, I have to fetch all the fucking boosts for this whole feed apparently >:/
-        let boostData = [];
-        let boostUrls = feed.orderedItems.filter(i=>i.type=="Announce").map(i=>i.object);
-        // console.log(boostUrls);
-        boostData = await promiseSome(boostUrls.map(apGet));
-
-        // now get user data for each of those
-        let userData = await promiseSome(boostData.map(d=>d?d.attributedTo||"":null).map(apGet));
-
-        // put a ._userdata key on the item object if this is a boost
-        for (let i = 0; i < boostData.length; i ++){
-            if (userData[i] && boostData[i]){
-                boostData[i]._userdata = userData[i];
-            }
-        }
-
-        // some URLs may have failed but IDGAF
-
-        // console.log(boostData[0]);
-
-        boostData.forEach((boostToot)=>{
+async function itemsForFeed(opts, user, feed) {
+  let items = feed.orderedItems;
+
+  if (opts.boosts) {
+    // yes, I have to fetch all the fucking boosts for this whole feed apparently >:/
+    let boostData = [];
+    let boostUrls = feed.orderedItems
+      .filter((i) => i.type == "Announce")
+      .map((i) => i.object);
+    // console.log(boostUrls);
+    boostData = await promiseSome(boostUrls.map(apGet));
+
+    // now get user data for each of those
+    let userData = await promiseSome(
+      boostData.map((d) => (d ? d.attributedTo || "" : null)).map(apGet)
+    );
+
+    // put a ._userdata key on the item object if this is a boost
+    for (let i = 0; i < boostData.length; i++) {
+      if (userData[i] && boostData[i]) {
+        boostData[i]._userdata = userData[i];
+      }
+    }
 
-            if (!boostToot){// failed request
-                return;
-            }
-            
-            // inject in-place into items
+    // some URLs may have failed but IDGAF
 
-            let index = -1;
-            for (var i = 0; i < items.length; i ++){
-                if (items[i].object == boostToot.id){
-                    index = i;
-                    break;
-                }
-            }
+    // console.log(boostData[0]);
 
-            if (index == -1){
-                console.warn("warning: couldn't match boost to item: ",boostToot);
-                return;
-            }
+    boostData.forEach((boostToot) => {
+      if (!boostToot) {
+        // failed request
+        return;
+      }
 
-            boostToot.object = boostToot;// this lets the later stage parser access object without errors :)
-            items[i] = boostToot;
-        });
-    }
+      // inject in-place into items
 
+      let index = -1;
+      for (var i = 0; i < items.length; i++) {
+        if (items[i].object == boostToot.id) {
+          index = i;
+          break;
+        }
+      }
 
-    return items.filter((item)=>{
-        return typeof item.object == "object";// handle weird cases
-    }).map((item)=>{
+      if (index == -1) {
+        console.warn(`warning: couldn't match boost to item:  ${boostToot}`);
+        return;
+      }
 
-        let enclosures = (item.object.attachment||[]).filter((a)=>{
-            return a.type == "Document";
-        }).map((a)=>{
-            return {
-                name:a.name,
-                type:a.mediaType,
-                url:a.url
-            };
+      boostToot.object = boostToot; // this lets the later stage parser access object without errors :)
+      items[i] = boostToot;
+    });
+  }
+
+  return items
+    .filter((item) => {
+      return typeof item.object == "object"; // handle weird cases
+    })
+    .map((item) => {
+      let enclosures = (item.object.attachment || [])
+        .filter((a) => {
+          return a.type == "Document";
+        })
+        .map((a) => {
+          return {
+            name: a.name,
+            type: a.mediaType,
+            url: a.url,
+          };
         });
 
-        let op = item._userdata?item._userdata:user;
-
-        return {
-            isBoost:!!item._userdata,
-            title:item._userdata?user.preferredUsername+" shared a status by "+op.preferredUsername:"",
-            isReply:!!(item.object && item.object.inReplyTo),
-            hasCw:item.object.sensitive||false,
-            cw:item.object.summary,
-            content: item.object&&item.object.content?item.object.content:"",//TODO sanitize then render without entity escapes
-            atomHref:item.published?item.published.replace(/\W+/g,""):Math.random().toString().replace(".",""),// used for IDs
-            enclosures:enclosures,
-            stringDate:item.published?getTimeDisplay(Date.parse(item.published)):"",
-            permalink:item.object.id?item.object.id:"#",
-            author:{
-                uri:op.url,// link to author page
-                avatar:op.icon&&op.icon.url?op.icon.url:"",
-                displayName:op.name || op.preferredUsername,
-                fullName:op.preferredUsername+"@"+(new URL(op.url).hostname),
-            }
-        };
+      let op = item._userdata ? item._userdata : user;
+
+      return {
+        isBoost: !!item._userdata,
+        title: item._userdata
+          ? user.preferredUsername +
+            " shared a status by " +
+            op.preferredUsername
+          : "",
+        isReply: !!(item.object && item.object.inReplyTo),
+        hasCw: item.object.sensitive || false,
+        cw: item.object.summary,
+        content: item.object && item.object.content ? item.object.content : "", //TODO sanitize then render without entity escapes
+        atomHref: item.published
+          ? item.published.replace(/\W+/g, "")
+          : Math.random().toString().replace("./g", ""), // used for IDs
+        enclosures: enclosures,
+        stringDate: item.published
+          ? getTimeDisplay(Date.parse(item.published))
+          : "",
+        permalink: item.object.id ? item.object.id : "#",
+        author: {
+          uri: op.url, // link to author page
+          avatar: op.icon && op.icon.url ? op.icon.url : "",
+          displayName: op.name || op.preferredUsername,
+          fullName: op.preferredUsername + "@" + new URL(op.url).hostname,
+        },
+      };
     });
 }
 
-function getNextPage(opts,user,feed){
-    //based on  feed.next
-    if (!feed.next){return null;}
-    // take feed.next, uriencode it, then take user url, then take options.mastofeedUrl
-    //let base = opts.mastofeedUrl.slice(0,opts.mastofeedUrl.indexOf("?"));
-
-    let ret = "/api/v1/feed?userurl=" + encodeURIComponent(opts.userUrl) + "&feedurl=" +encodeURIComponent(feed.next) + "&instance_type=" + opts.instance_type;
-    
-    // add other params to the end
-    (["theme","header","size","boosts","replies"]).forEach((k)=>{
-        if (typeof opts[k] != "undefined"){
-            ret+=`&${k}=${ opts[k].toString() }`;
-        }
-    });
-    return ret;
+function getNextPage(opts, user, feed) {
+  //based on  feed.next
+  if (!feed.next) {
+    return null;
+  }
+  // take feed.next, uriencode it, then take user url, then take options.mastofeedUrl
+  //let base = opts.mastofeedUrl.slice(0,opts.mastofeedUrl.indexOf("?"));
+
+  let ret =
+    "/api/v1/feed?userurl=" +
+    encodeURIComponent(opts.userUrl) +
+    "&feedurl=" +
+    encodeURIComponent(feed.next) +
+    "&instance_type=" +
+    opts.instance_type;
+
+  // add other params to the end
+  ["theme", "header", "size", "boosts", "replies"].forEach((k) => {
+    if (typeof opts[k] != "undefined") {
+      ret += `&${k}=${opts[k].toString()}`;
+    }
+  });
+  return ret;
 }
 
-
 // utilities below
 
 function getTimeDisplay(d) {
-    // let d = d;
-    if (typeof d !== "object") {
-        d = new Date(d);
-    }
-    // convert to number
-    let dt = d.getTime();
-    let now = Date.now();
-
-    let delta = now - dt;
-
-    // over 6 days ago
-    if (delta > 1000 * 60 * 60 * 24 * 6) {
-        return isoDateToEnglish(d.toISOString());
-    } else {
-        return format(dt);
-    }
-
+  // let d = d;
+  if (typeof d !== "object") {
+    d = new Date(d);
+  }
+  // convert to number
+  let dt = d.getTime();
+  let now = Date.now();
+
+  let delta = now - dt;
+
+  // over 6 days ago
+  if (delta > 1000 * 60 * 60 * 24 * 6) {
+    return isoDateToEnglish(d.toISOString());
+  } else {
+    return format(dt);
+  }
 }
 
 function isoDateToEnglish(d) {
-
-    let dt = d.split(/[t-]/ig);
-    let months = ["January", "February", "March", "April", "May", "June",
-        "July", "August", "September", "October", "November", "December"];
-
-    return months[Number(dt[1]) - 1] + " " + dt[2] + ", " + dt[0];
+  let dt = d.split(/[t-]/gi);
+  let months = [
+    "January",
+    "February",
+    "March",
+    "April",
+    "May",
+    "June",
+    "July",
+    "August",
+    "September",
+    "October",
+    "November",
+    "December",
+  ];
+
+  return months[Number(dt[1]) - 1] + " " + dt[2] + ", " + dt[0];
 }

lib/errorPage.js

@@ -2,35 +2,34 @@ import { compile } from "ejs";
 import { readFileSync } from "fs";
 let template = compile(readFileSync("./lib/template.ejs", "utf8"));
 
-export default function(code,message,displayOptions){
+export default function (code, message, displayOptions) {
+  let msg;
+  // const displayOptions = displayOptions || {};
 
-    let msg;
-    // const displayOptions = displayOptions || {};
+  if (code == 500 && !message) {
+    msg =
+      "<p>Sorry, we are having trouble fetching posts for this user. Please try again later.</p><br><p>If the issue persists, <a href=`https://git.froth.zone/Sam/fedifeed/issues`>please open an issue on Gitea</a>, or message sam@froth.zone</p>";
+  } else {
+    msg = message || "";
+  }
 
-    if (code == 500 && !message){
-        msg = "<p>Sorry, we are having trouble fetching posts for this user. Please try again later.</p><br><p>If the issue persists, <a href=\"https://git.froth.zone/Sam/fedifeed/issues\">please open an issue on Gitea</a>, or message sam@froth.zone</p>";
-    }else{
-        msg = message||"";
-    }
+  let options = {
+    opts: {
+      header: true,
+      theme: displayOptions?.theme || null,
+      size: displayOptions?.size || null,
+    },
+    meta: {
+      title: code.toString(),
+      description: msg,
+      link: "#",
+      // avatar:'',
+      // headerImage:''
+    },
+    items: [],
+    nextPageLink: null,
+    isIndex: true,
+  };
 
-
-    let options = {
-        opts:{
-            header:true,
-            theme:displayOptions.theme||null,
-            size:displayOptions.size||null
-        },
-        meta:{
-            title:code.toString(),
-            description:msg,
-            link:"#"
-            // avatar:'',
-            // headerImage:''
-        },
-        items:[],
-        nextPageLink:null,
-        isIndex:true
-    };
-
-    return template(options);
-}
+  return template(options);
+}

lib/template.ejs

@@ -1,3 +1,4 @@
+<!DOCTYPE html>
 <html>
   <head>
 	<meta charset="UTF-8"></meta>
@@ -6,7 +7,7 @@
 
   <% if (opts.theme && opts.theme.toLowerCase() == 'masto-light'){ %>
   <link rel="stylesheet" href="/css/masto-light.css"></link>
-  <% } else if (opts.theme && opts.theme.toLowerCase() == 'auto'){ %>
+  <% } else if (opts.theme && opts.theme.toLowerCase() == 'masto-auto'){ %>
     <link rel="stylesheet" href="/css/masto-auto.css"></link>
   <% } else if (opts.theme && opts.theme.toLowerCase() == 'misskey-dark'){ %>
     <link rel="stylesheet" href="/css/misskey-dark.css"></link>
@@ -113,7 +114,7 @@
     <% } %>
 
     <% if ( isIndex ){ %>
-      <script src="/infinite-scroll.js"></script>
+      <script src="/lib/infinite-scroll.pkgd.min.js"></script>
       <script type="text/javascript">
 
         let lastPageLoaded = null;

package.json

@@ -1,26 +1,31 @@
-{
-  "dependencies": {
-    "cors": "^2.8.5",
-    "ejs": "^3.1.6",
-    "express": "^4.17.2",
-    "feedparser": "^2.2.10",
-    "got": "^12.0.1",
-    "megalodon": "^4.0.0",
-    "morgan": "^1.10.0",
-    "serve-static": "^1.14.2",
-    "timeago.js": "^4.0.2"
-  },
-  "main": "index.js",
-  "type": "module",
-  "license": "MIT",
-  "scripts": {
-    "start": "yarn build-styles && node src/index.js",
-    "build-styles": "node src/build-styles.js",
-    "lint": "eslint --ext .js src lib",
-    "test": "echo \"Error: no test specified\" && exit 0"
-  },
-  "devDependencies": {
-    "eslint": "8.15.0",
-    "node-sass": "7.0.1"
-  }
-}
+{
+  "dependencies": {
+    "cors": "2.8.5",
+    "ejs": "3.1.7",
+    "express": "4.18.1",
+    "feedparser": "2.2.10",
+    "got": "12.0.4",
+    "helmet": "5.0.2",
+    "megalodon": "4.0.1",
+    "morgan": "1.10.0",
+    "serve-static": "1.15.0",
+    "timeago.js": "4.0.2"
+  },
+  "main": "index.js",
+  "type": "module",
+  "license": "MIT",
+  "scripts": {
+    "start": "yarn node index.js",
+    "lint": "eslint --fix . && prettier --write .",
+    "lint:ci": "eslint  . && prettier . --check",
+    "test": "echo \"Error: no test specified\" && exit 0"
+  },
+  "devDependencies": {
+    "eslint": "8.15.0",
+    "eslint-config-prettier": "8.5.0",
+    "eslint-plugin-prettier": "4.0.0",
+    "prettier": "2.6.2",
+    "sass": "1.51.0"
+  },
+  "packageManager": "yarn@3.2.0"
+}

public/css/masto-auto.css

@@ -1,132 +1,162 @@
 html,
 body {
   background-color: #ffffff;
-  font-family: 'Roboto', roboto, Arial, sans-serif;
+  font-family: "Roboto", roboto, Arial, sans-serif;
   color: #282c37;
   font-weight: lighter;
   overflow-x: hidden;
   font-size: 100%;
-  word-break: break-word; }
+  word-break: break-word;
+}
 
 * {
   margin: 0;
-  padding: 0; }
+  padding: 0;
+}
 
 a,
 a * {
-  color: #2b90d9; }
+  color: #2b90d9;
+}
 
 .meta {
-  background-color: #ecf0f4; }
+  background-color: #ecf0f4;
+}
 
 .header {
   display: flex;
   background-size: cover;
   min-height: 8rem;
-  color: #282c37; }
-  .header .header-left, .header .header-right {
-    margin: 0; }
-  .header .header-left {
-    min-width: 8rem;
-    position: relative;
-    text-align: center;
-    background: rgba(255, 255, 255, 0.3); }
-    .header .header-left .avatar {
-      width: 6rem;
-      height: 6rem;
-      position: relative;
-      top: calc(50% - 3rem); }
-  .header .header-right {
-    flex-grow: 1;
-    font-size: 0.9rem;
-    padding: 0.9rem;
-    background: rgba(255, 255, 255, 0.85); }
-  .header .header-title {
-    font-size: 1.3rem; }
+  color: #282c37;
+}
+.header .header-left,
+.header .header-right {
+  margin: 0;
+}
+.header .header-left {
+  min-width: 8rem;
+  position: relative;
+  text-align: center;
+  background: rgba(255, 255, 255, 0.3);
+}
+.header .header-left .avatar {
+  width: 6rem;
+  height: 6rem;
+  position: relative;
+  top: calc(50% - 3rem);
+}
+.header .header-right {
+  flex-grow: 1;
+  font-size: 0.9rem;
+  padding: 0.9rem;
+  background: rgba(255, 255, 255, 0.85);
+}
+.header .header-title {
+  font-size: 1.3rem;
+}
 
 .item {
   padding: 1rem;
-  border-top: solid 1px #8494ab; }
+  border-top: solid 1px #8494ab;
+}
 
 .item-content,
 .cw,
 .title {
   font-size: 1.1rem;
-  font-weight: lighter; }
+  font-weight: lighter;
+}
 
-.item-content *, .cw {
+.item-content *,
+.cw {
   margin: 1rem 0;
-  line-height: 1.4rem; }
+  line-height: 1.4rem;
+}
 
 .item-title,
 .date,
 .author-fullname {
   color: #90a1ba;
-  font-size: 0.9rem; }
+  font-size: 0.9rem;
+}
 
 .date {
   margin: 1rem 0 0 0;
   text-decoration: none;
-  display: block; }
+  display: block;
+}
 
 .date:hover {
-  text-decoration: underline; }
+  text-decoration: underline;
+}
 
 .item-title {
-  margin-bottom: 0.7rem; }
+  margin-bottom: 0.7rem;
+}
 
 .author {
   display: flex;
-  margin-bottom: 1rem; }
+  margin-bottom: 1rem;
+}
 
 .author-info {
   margin: 0 1rem;
   display: flex;
   flex-direction: column;
-  justify-content: space-around; }
-  .author-info .author-displayname {
-    font-size: 1.2rem;
-    color: #282c37;
-    text-decoration: none;
-    display: block;
-    font-weight: bolder; }
+  justify-content: space-around;
+}
+.author-info .author-displayname {
+  font-size: 1.2rem;
+  color: #282c37;
+  text-decoration: none;
+  display: block;
+  font-weight: bolder;
+}
 
 .avatar {
   width: 3rem;
   height: 3rem;
   border: none;
-  border-radius: 10%; }
-  .avatar.circular {
-    border-radius: 100%; }
+  border-radius: 10%;
+}
+.avatar.circular {
+  border-radius: 100%;
+}
 
 .enclosures {
   padding: 0.5em 0;
   display: flex;
   flex-wrap: wrap;
   flex-direction: row;
-  overflow: hidden; }
+  overflow: hidden;
+}
 
 .enclosure {
   display: flex;
   flex: 1 1 auto;
   width: 50%;
   border: none;
-  max-height: 12rem; }
+  max-height: 12rem;
+}
 
 a.enclosure {
-  cursor: zoom-in; }
+  cursor: zoom-in;
+}
 
 .enclosure > * {
   flex: 1 1 auto;
   width: 100%;
   height: 100%;
-  object-fit: cover; }
+  object-fit: cover;
+}
 
 .meta .title {
-  font-weight: bold; }
+  font-weight: bold;
+}
 
 .hidden {
-  display: none; }
+  display: none;
+}
 
 .button {
   padding: 0.5rem 1rem;
@@ -140,145 +170,182 @@ a.enclosure {
   font-weight: 400;
   cursor: pointer;
   text-transform: uppercase;
-  user-select: none; }
+  user-select: none;
+}
 
 label.button {
   padding: 0.25rem 0.5rem;
   margin: 0.4rem;
   background: #8494ab;
   color: #ffffff;
-  font-size: 0.8rem; }
+  font-size: 0.8rem;
+}
 
-input[type=checkbox] {
+input[type="checkbox"] {
   position: absolute;
-  left: -9999px; }
+  left: -9999px;
+}
 
-input[type=checkbox]:checked ~ label::after {
-  content: " Less"; }
+input[type="checkbox"]:checked ~ label::after {
+  content: " Less";
+}
 
-input[type=checkbox]:not(:checked) ~ label::after {
-  content: " More"; }
+input[type="checkbox"]:not(:checked) ~ label::after {
+  content: " More";
+}
 
-input[type=checkbox]:not(:checked) ~ div {
-  display: none; }
+input[type="checkbox"]:not(:checked) ~ div {
+  display: none;
+}
 
 .item-content,
 .description,
 .title,
 html,
 body {
-  font-weight: normal; }
+  font-weight: normal;
+}
 
 @media (prefers-color-scheme: masto-dark) {
   html,
   body {
     background-color: #282c37;
-    font-family: 'Roboto', roboto, Arial, sans-serif;
+    font-family: "Roboto", roboto, Arial, sans-serif;
     color: #ffffff;
     font-weight: lighter;
     overflow-x: hidden;
     font-size: 100%;
-    word-break: break-word; }
+    word-break: break-word;
+  }
   * {
     margin: 0;
-    padding: 0; }
+    padding: 0;
+  }
   a,
   a * {
-    color: #2b90d9; }
+    color: #2b90d9;
+  }
   .meta {
-    background-color: #39404d; }
+    background-color: #39404d;
+  }
   .header {
     display: flex;
     background-size: cover;
     min-height: 8rem;
-    color: #ffffff; }
-    .header .header-left, .header .header-right {
-      margin: 0; }
-    .header .header-left {
-      min-width: 8rem;
-      position: relative;
-      text-align: center;
-      background: rgba(40, 44, 55, 0.3); }
-      .header .header-left .avatar {
-        width: 6rem;
-        height: 6rem;
-        position: relative;
-        top: calc(50% - 3rem); }
-    .header .header-right {
-      flex-grow: 1;
-      font-size: 0.9rem;
-      padding: 0.9rem;
-      background: rgba(40, 44, 55, 0.85); }
-    .header .header-title {
-      font-size: 1.3rem; }
+    color: #ffffff;
+  }
+  .header .header-left,
+  .header .header-right {
+    margin: 0;
+  }
+  .header .header-left {
+    min-width: 8rem;
+    position: relative;
+    text-align: center;
+    background: rgba(40, 44, 55, 0.3);
+  }
+  .header .header-left .avatar {
+    width: 6rem;
+    height: 6rem;
+    position: relative;
+    top: calc(50% - 3rem);
+  }
+  .header .header-right {
+    flex-grow: 1;
+    font-size: 0.9rem;
+    padding: 0.9rem;
+    background: rgba(40, 44, 55, 0.85);
+  }
+  .header .header-title {
+    font-size: 1.3rem;
+  }
   .item {
     padding: 1rem;
-    border-top: solid 1px #626d80; }
+    border-top: solid 1px #626d80;
+  }
   .item-content,
   .cw,
   .title {
     font-size: 1.1rem;
-    font-weight: lighter; }
-  .item-content *, .cw {
+    font-weight: lighter;
+  }
+  .item-content *,
+  .cw {
     margin: 1rem 0;
-    line-height: 1.4rem; }
+    line-height: 1.4rem;
+  }
   .item-title,
   .date,
   .author-fullname {
     color: #9baec8;
-    font-size: 0.9rem; }
+    font-size: 0.9rem;
+  }
   .date {
     margin: 1rem 0 0 0;
     text-decoration: none;
-    display: block; }
+    display: block;
+  }
   .date:hover {
-    text-decoration: underline; }
+    text-decoration: underline;
+  }
   .item-title {
-    margin-bottom: 0.7rem; }
+    margin-bottom: 0.7rem;
+  }
   .author {
     display: flex;
-    margin-bottom: 1rem; }
+    margin-bottom: 1rem;
+  }
   .author-info {
     margin: 0 1rem;
     display: flex;
     flex-direction: column;
-    justify-content: space-around; }
-    .author-info .author-displayname {
-      font-size: 1.2rem;
-      color: #ffffff;
-      text-decoration: none;
-      display: block;
-      font-weight: bolder; }
+    justify-content: space-around;
+  }
+  .author-info .author-displayname {
+    font-size: 1.2rem;
+    color: #ffffff;
+    text-decoration: none;
+    display: block;
+    font-weight: bolder;
+  }
   .avatar {
     width: 3rem;
     height: 3rem;
     border: none;
-    border-radius: 10%; }
-    .avatar.circular {
-      border-radius: 100%; }
+    border-radius: 10%;
+  }
+  .avatar.circular {
+    border-radius: 100%;
+  }
   .enclosures {
     padding: 0.5em 0;
     display: flex;
     flex-wrap: wrap;
     flex-direction: row;
-    overflow: hidden; }
+    overflow: hidden;
+  }
   .enclosure {
     display: flex;
     flex: 1 1 auto;
     width: 50%;
     border: none;
-    max-height: 12rem; }
+    max-height: 12rem;
+  }
   a.enclosure {
-    cursor: zoom-in; }
+    cursor: zoom-in;
+  }
   .enclosure > * {
     flex: 1 1 auto;
     width: 100%;
     height: 100%;
-    object-fit: cover; }
+    object-fit: cover;
+  }
   .meta .title {
-    font-weight: bold; }
+    font-weight: bold;
+  }
   .hidden {
-    display: none; }
+    display: none;
+  }
   .button {
     padding: 0.5rem 1rem;
     border: none;
@@ -291,19 +358,26 @@ body {
     font-weight: 400;
     cursor: pointer;
     text-transform: uppercase;
-    user-select: none; }
+    user-select: none;
+  }
   label.button {
     padding: 0.25rem 0.5rem;
     margin: 0.4rem;
     background: #626d80;
     color: #282c37;
-    font-size: 0.8rem; }
-  input[type=checkbox] {
+    font-size: 0.8rem;
+  }
+  input[type="checkbox"] {
     position: absolute;
-    left: -9999px; }
-  input[type=checkbox]:checked ~ label::after {
-    content: " Less"; }
-  input[type=checkbox]:not(:checked) ~ label::after {
-    content: " More"; }
-  input[type=checkbox]:not(:checked) ~ div {
-    display: none; } }
+    left: -9999px;
+  }
+  input[type="checkbox"]:checked ~ label::after {
+    content: " Less";
+  }
+  input[type="checkbox"]:not(:checked) ~ label::after {
+    content: " More";
+  }
+  input[type="checkbox"]:not(:checked) ~ div {
+    display: none;
+  }
+}

public/css/masto-dark.css

@@ -0,0 +1,199 @@
+html,
+body {
+  background-color: #282c37;
+  font-family: "Roboto", roboto, Arial, sans-serif;
+  color: #ffffff;
+  font-weight: lighter;
+  overflow-x: hidden;
+  font-size: 100%;
+  word-break: break-word;
+}
+
+* {
+  margin: 0;
+  padding: 0;
+}
+
+a,
+a * {
+  color: #2b90d9;
+}
+
+.meta {
+  background-color: #39404d;
+}
+
+.header {
+  display: flex;
+  background-size: cover;
+  min-height: 8rem;
+  color: #ffffff;
+}
+.header .header-left,
+.header .header-right {
+  margin: 0;
+}
+.header .header-left {
+  min-width: 8rem;
+  position: relative;
+  text-align: center;
+  background: rgba(40, 44, 55, 0.3);
+}
+.header .header-left .avatar {
+  width: 6rem;
+  height: 6rem;
+  position: relative;
+  top: calc(50% - 3rem);
+}
+.header .header-right {
+  flex-grow: 1;
+  font-size: 0.9rem;
+  padding: 0.9rem;
+  background: rgba(40, 44, 55, 0.85);
+}
+.header .header-title {
+  font-size: 1.3rem;
+}
+
+.item {
+  padding: 1rem;
+  border-top: solid 1px #626d80;
+}
+
+.item-content,