From 83f56e7ab5bcece68a3579545e2bdf891ef13802 Mon Sep 17 00:00:00 2001
From: Natty <natty.sh.git@gmail.com>
Date: Thu, 20 Jul 2023 01:52:39 +0200
Subject: [PATCH] Instance software autodetection

---
 create-circle.js | 58 ++++++++++++++++++++++++++++++++++++++++++------
 index.html       | 15 +++++++++----
 2 files changed, 62 insertions(+), 11 deletions(-)

diff --git a/create-circle.js b/create-circle.js
index 98d964f..62ac3df 100644
--- a/create-circle.js
+++ b/create-circle.js
@@ -148,6 +148,11 @@ class ApiClient {
      * return {Promise<FediUser[] | null>}
      */
     async getFavs(note) { throw new Error("Not implemented"); }
+
+    /**
+     * @return string
+     */
+    getClientName() { throw new Error("Not implemented"); }
 }
 
 class MastodonApiClient extends ApiClient {
@@ -254,6 +259,10 @@ class MastodonApiClient extends ApiClient {
             handle: parseHandle(user["acct"], note.instance)
         }));
     }
+
+    getClientName() {
+        return "mastodon";
+    }
 }
 
 class MisskeyApiClient extends ApiClient {
@@ -391,6 +400,10 @@ class MisskeyApiClient extends ApiClient {
             handle: parseHandle(reaction["user"]["username"], reaction["user"]["host"])
         }));
     }
+
+    getClientName() {
+        return "misskey";
+    }
 }
 
 /** @type Map<string, ApiClient> */
@@ -420,20 +433,51 @@ function parseHandle(fediHandle, fallbackInstance = "") {
  */
 
 async function circleMain() {
-    document.getElementById("btn_create").style.display = "none";
-
-    let fediHandle = document.getElementById("txt_mastodon_handle").value;
-
-    const selfUser = parseHandle(fediHandle);
-    const client = await ApiClient.getClient(selfUser.instance);
-
     let progress = document.getElementById("outInfo");
+
+    const generateBtn = document.getElementById("generateButton");
+
+    generateBtn.style.display = "none";
+
+    let fediHandle = document.getElementById("txt_mastodon_handle");
+    const selfUser = parseHandle(fediHandle.value);
+
+    let form = document.getElementById("generateForm");
+    let backend = form.backend;
+    for (const radio of backend) {
+        radio.disabled = true;
+    }
+
+    fediHandle.disabled = true;
+
+    let client;
+    switch (backend.value) {
+        case "mastodon":
+            client = new MastodonApiClient(selfUser.instance);
+            break;
+        case "misskey":
+            client = new MisskeyApiClient(selfUser.instance);
+            break;
+        default:
+            progress.innerText = "Detecting instance...";
+            client = await ApiClient.getClient(selfUser.instance);
+            backend.value = client.getClientName();
+            break;
+    }
+
     progress.innerText = "Fetching your user...";
 
     const user = await client.getUserIdFromHandle(selfUser);
 
     if (!user) {
         alert("Something went horribly wrong, couldn't fetch your user.");
+        fediHandle.disabled = false;
+        for (const radio of backend) {
+            radio.disabled = false;
+        }
+        generateBtn.style.display = "inline";
+        progress.innerText = "";
+
         return;
     }
 
diff --git a/index.html b/index.html
index 70a4553..d5d09dc 100644
--- a/index.html
+++ b/index.html
@@ -14,10 +14,17 @@
     <h1>Trötpty</h1>
     <h3><span style="text-decoration: line-through" aria-hidden="true">Mastodon</span> Fedi Circle Creator</h3>
     <!-- TODO Logo? -->
-    <input id="txt_mastodon_handle" type="text" onchange="document.getElementById('btn_create').style = 'display: inline;'; document.getElementById('btn_download').style = 'display: none;'" placeholder="@sonnenbrandi@mieke.club">
-    <br><br>
-    <!-- Buttons -->
-    <button id="btn_create" onclick="(async () => await circleMain())()">Generate circle</button>
+    <form id="generateForm" onsubmit="(async () => await circleMain())(); return false;">
+        <input id="txt_mastodon_handle" type="text" onchange="document.getElementById('btn_create').style = 'display: inline;'; document.getElementById('btn_download').style = 'display: none;'" placeholder="@sonnenbrandi@mieke.club">
+        <br><br>
+        <span>
+            <label><input type="radio" name="backend" value="detect" checked> Autodetect</label>
+            <label><input type="radio" name="backend" value="masto"> Mastodon API</label>
+            <label><input type="radio" name="backend" value="misskey"> Misskey API</label>
+        </span>
+        <br>
+        <button type="submit" id="generateButton">Generate circle</button>
+    </form>
     <span id="outInfo"></span>
     <a href="" id="btn_download" class="button" download="mastodon-circle.png" style="display: none;">DOWNLOAD (klappt wsl nicht)</a>
     <!-- <button id="btn_download" onClick="downloadImage()" style="display: none;">DOWNLOAD</button> -->