Matrix: Setup bot, add PIN verification

PIN is verified but not used currently. Works a little different than
the others, you input your matrix user ID and then the PIN is sent to
you. The bot doesn't support E2EE, so the bot being the first one to
message ensures the chat is unencrypted.

ts/form.ts

@@ -1,6 +1,6 @@
 import { Modal } from "./modules/modal.js";
 import { notificationBox, whichAnimationEvent } from "./modules/common.js";
-import { _get, _post, toggleLoader, toDateString } from "./modules/common.js";
+import { _get, _post, toggleLoader, addLoader, removeLoader, toDateString } from "./modules/common.js";
 import { loadLangSelector } from "./modules/lang.js";
 
 interface formWindow extends Window {
@@ -9,6 +9,7 @@ interface formWindow extends Window {
     successModal: Modal;
     telegramModal: Modal;
     discordModal: Modal;
+    matrixModal: Modal;
     confirmationModal: Modal
     code: string;
     messages: { [key: string]: string };
@@ -20,6 +21,8 @@ interface formWindow extends Window {
     discordStartCommand: string;
     discordInviteLink: boolean;
     discordServerName: string;
+    matrixRequired: boolean;
+    matrixUserID: string;
     userExpiryEnabled: boolean;
     userExpiryMonths: number;
     userExpiryDays: number;
@@ -150,6 +153,69 @@ if (window.discordEnabled) {
     };
 }
 
+var matrixVerified = false;
+var matrixPIN = "";
+if (window.matrixEnabled) {
+    window.matrixModal = new Modal(document.getElementById("modal-matrix"), window.matrixRequired);
+    const matrixButton = document.getElementById("link-matrix") as HTMLSpanElement;
+    matrixButton.onclick = window.matrixModal.show;
+    const submitButton = document.getElementById("matrix-send") as HTMLSpanElement;
+    const input = document.getElementById("matrix-userid") as HTMLInputElement;
+    let userID = "";
+    submitButton.onclick = () => {
+        addLoader(submitButton);
+        if (userID == "") {
+            const send = {
+                user_id: input.value
+            };
+            _post("/invite/" + window.code + "/matrix/user", send, (req: XMLHttpRequest) => {
+                if (req.readyState == 4) {
+                    removeLoader(submitButton);
+                    userID = input.value;
+                    if (req.status != 200) {
+                        window.notifications.customError("errorUnknown", window.messages["errorUnknown"]);
+                        window.matrixModal.close();
+                        return;
+                    }
+                    submitButton.classList.add("~positive");
+                    submitButton.classList.remove("~info");
+                    setTimeout(() => {
+                        submitButton.classList.add("~info");
+                        submitButton.classList.remove("~positive");
+                    }, 2000);
+                    input.placeholder = "PIN";
+                    input.value = "";
+                }
+            });
+        } else {
+            _get("/invite/" + window.code + "/matrix/verified/" + userID + "/" + input.value, null, (req: XMLHttpRequest) => {
+                if (req.readyState == 4) {
+                    removeLoader(submitButton)
+                    const valid = req.response["success"] as boolean;
+                    if (valid) {
+                        window.matrixModal.close();
+                        window.notifications.customPositive("successVerified", "", window.messages["verified"]);
+                        matrixVerified = true;
+                        matrixPIN = input.value;
+                        matrixButton.classList.add("unfocused");
+                        document.getElementById("contact-via").classList.remove("unfocused");
+                        const radio = document.getElementById("contact-via-discord") as HTMLInputElement;
+                        radio.checked = true;
+                    } else {
+                        window.notifications.customError("errorInvalidPIN", window.messages["errorInvalidPIN"]);
+                        submitButton.classList.add("~critical");
+                        submitButton.classList.remove("~info");
+                        setTimeout(() => {
+                            submitButton.classList.add("~info");
+                            submitButton.classList.remove("~critical");
+                        }, 800);
+                    }
+                }
+            },);
+        }
+    };
+}
+
 if (window.confirmation) {
     window.confirmationModal = new Modal(document.getElementById("modal-confirmation"), true);
 }
@@ -229,6 +295,8 @@ interface sendDTO {
     telegram_contact?: boolean;
     discord_pin?: string;
     discord_contact?: boolean;
+    matrix_pin?: string;
+    matrix_contact?: boolean;
 }
 
 const create = (event: SubmitEvent) => {
@@ -254,6 +322,13 @@ const create = (event: SubmitEvent) => {
             send.discord_contact = true;
         }
     }
+    if (matrixVerified) {
+        send.matrix_pin = matrixPIN;
+        const radio = document.getElementById("contact-via-matrix") as HTMLInputElement;
+        if (radio.checked) {
+            send.matrix_contact = true;
+        }
+    }
     _post("/newUser", send, (req: XMLHttpRequest) => {
         if (req.readyState == 4) {
             let vals = req.response as respDTO;

ts/modules/common.ts

@@ -105,7 +105,11 @@ export class notificationBox implements NotificationBox {
     private _error = (message: string): HTMLElement => {
         const noti = document.createElement('aside');
         noti.classList.add("aside", "~critical", "!normal", "mt-half", "notification-error");
-        noti.innerHTML = `<strong>${window.lang.strings("error")}:</strong> ${message}`;
+        let error = "";
+        if (window.lang) {
+            error = window.lang.strings("error") + ":"
+        }
+        noti.innerHTML = `<strong>${error}</strong> ${message}`;
         const closeButton = document.createElement('span') as HTMLSpanElement;
         closeButton.classList.add("button", "~critical", "!low", "ml-1");
         closeButton.innerHTML = `<i class="icon ri-close-line"></i>`;

ts/typings/d.ts

@@ -22,6 +22,7 @@ declare interface Window {
     emailEnabled: boolean;
     telegramEnabled: boolean;
     discordEnabled: boolean;
+    matrixEnabled: boolean;
     ombiEnabled: boolean;
     usernameEnabled: boolean;
     token: string;