Add public/main.js

public/main.js

@@ -0,0 +1,57 @@
+var base = "https://shelter.amy.rip/";
+var options = { headers: { "Accept": "application/json" } };
+
+fetch(base, options).then(r => r.json()).then(r => {
+  r.filter(i => i.is_dir).forEach(e => {
+    const card = document.createElement('div');
+    card.className = 'card d-inline border-primary m-1';
+    card.style.width = '20rem';
+
+    const cardHeader = document.createElement('div');
+    cardHeader.className = 'card-header';
+
+    const title = document.createElement('h4');
+    title.className = 'card-title';
+    cardHeader.appendChild(title);
+
+    const cardBody = document.createElement('div');
+    cardBody.className = 'card-body';
+    cardBody.style.height = "5rem";
+
+    const text = document.createElement('p');
+    text.className = 'card-text';
+
+    const cardFooter = document.createElement('div');
+    cardFooter.className = 'card-footer py-3';
+
+    const download = document.createElement('button');
+    download.className = 'btn btn-primary';
+    download.textContent = " Download";
+
+    download.addEventListener("click", () => {
+      navigator.clipboard.writeText(base + e.url.substr(2)).then(function () {
+        alert('Plugin link copied to clipboard!');
+      }, function (err) {
+        console.error('Async: Could not copy text: ', err);
+      });
+    })
+
+    const icon = document.createElement('i');
+    icon.className = 'bi-download';
+    download.prepend(icon);
+
+    cardFooter.appendChild(download);
+
+    cardBody.appendChild(text);
+    card.appendChild(cardHeader);
+    card.appendChild(cardBody);
+    card.appendChild(cardFooter);
+
+    fetch(base + e.url + "plugin.json").then(r => r.json()).then(r => {
+      title.textContent = r.name;
+      text.textContent = r.description;
+    })
+
+    document.querySelector(".container").appendChild(card);
+  });
+})