Add 'FtechWebring.client.js'

1 files changed, 79 insertions, 0 deletions

diff --git a/FtechWebring.client.js b/FtechWebring.client.js
new file mode 100644
index 0000000..162227e
--- /dev/null
+++ b/FtechWebring.client.js
@@ -0,0 +1,79 @@
+/**
+ * 
+ * This is a client-side implementation of Jae's Ftech webring.
+ * It depends on DOM elements, attempt to use it in headless
+ * environments such as NodeJS will result in a failure.
+ * 
+ */
+
+// Custom write function since document.write will get removed in Chrome
+document.write = (content) => {
+    document.body.innerHTML = document.body.innerHTML + content;
+}
+
+// CSS to make the magic happen
+document.write("<style>ftww-base {display: block;border-radius: 10px;background-color: rgba(11, 11, 11, .25);padding: 10px 20px;margin: 10px 0;color: white;}ftww-title {display: block;font-weight: bold;}ftww-description a {color: white !important;text-decoration: underline;}ftww-actions {display: block;opacity: .5;}ftww-actions a {color: white !important;text-decoration: none;}ftww-disabled {opacity: .5;color: white !important;text-decoration: none;cursor: not-allowed;}ftww-notice {border-top: 1px solid rgba(17, 17, 17, .5);display: block;margin-top: 5px;padding-top: 5px;font-size: small;text-align: center;}</style>");
+
+// Code that will be run after we get the data
+function _ftww_processData(raw) {
+    try {
+    sites = JSON.parse(raw)["members"];
+
+    // We find the index corresponding to this website
+    thisSite = null;
+    if (typeof location.hostname === "string") { // Checking if the required variable is defined
+        index = 0;
+        for (site of sites) {
+            if (site["name"] === location.hostname) {
+                thisSite = index;
+            }
+
+            index++;
+        }
+
+        if (thisSite !== null) { // We check if it has found the site in the list
+            next = null;
+            previous = null;
+            random = sites[Math.floor(Math.random() * sites.length)]["url"]; // This simply selects a random item from the $sites array
+
+            if (sites[thisSite - 1]) { // We check if there's a previous site in the list
+                previous = sites[thisSite - 1]["url"];
+            } else {
+                previous = sites[sites.length - 1]["url"]; // If this is the first site, roll out to the last one
+            }
+
+            if (sites[$thisSite + 1]) { // We check if there's a next site in the list
+                next = sites[thisSite + 1]["url"];
+            } else {
+                next = sites[0]["url"]; // If this is the last site, roll out to the first one
+            }
+
+            document.write("<ftww-base><ftww-title>Ftech webring</ftww-title><ftww-description>This is<a href=\""+sites[thisSite]["url"]+"\">"+sites[thisSite]["name"]+"</a>, owned by "+sites[thisSite]["owner"]+". This website is part of the Ftech webring.</ftww-description><ftww-actions>");
+
+            if (previous !== null) document.write("<a href=\""+previous+"\" target='_blank'>[Prev]</a>\n");
+            if (previous === null) document.write("<ftww-disabled>[You're on the first site]</ftww-disabled>\n");
+            if (next !== null) document.write("<a href=\""+next+"\" target='_blank'>[Next]</a>\n");
+            if (next === null) document.write("<ftww-disabled>[You're on the last site]</ftww-disabled>\n");
+            if (random !== null) document.write("<a href=\""+random+"\" target='_blank'>[Random]</a>\n");
+
+            document.write("</ftww-actions><ftww-notice>"+sites[thisSite]["owner"]+" is warning you that other websites on the webring have their own policies that may or may not be the same as the policies from "+sites[thisSite]["name"]+".</ftww-notice></ftww-base>");
+        } else {
+            // We display an error message
+            document.write("<ftww-base>The content that was supposed to appear here cannot be loaded due to an internal error. Please contact the website administrator.</ftww-base>");
+        }
+    } else {
+        // We display an error message
+        document.write("<ftww-base>The content that was supposed to appear here cannot be loaded due to an internal error. Please contact the website administrator.</ftww-base>");
+    }
+} catch (e) {
+    // We display an error message
+    document.write("<ftww-base>The content that was supposed to appear here cannot be loaded due to an internal error. Please contact the website administrator.</ftww-base>");
+}
+}
+
+// We fetch the API
+window.fetch("https://jae.fi/webring/members").then((a) => {
+    a.text().then((b) => {
+        _ftww_processData(b);
+    })
+})
\ No newline at end of file