From 1a855a6993c1b6ccbacedeccfc56993dfb6ad124 Mon Sep 17 00:00:00 2001
From: Ajay Ramachandran <dev@ajay.app>
Date: Thu, 29 Jul 2021 18:16:44 -0400
Subject: [PATCH] Add basic chat box when getting a warning

---
 public/_locales/en/messages.json |  3 +++
 public/content.css               | 10 ++++++++++
 src/background.ts                |  6 +-----
 src/content.ts                   |  8 ++++++--
 src/js-components/chat.ts        | 30 ++++++++++++++++++++++++++++++
 src/utils.ts                     | 13 +++++++++++++
 6 files changed, 63 insertions(+), 7 deletions(-)
 create mode 100644 src/js-components/chat.ts

diff --git a/public/_locales/en/messages.json b/public/_locales/en/messages.json
index 8a5a2b30..4a462055 100644
--- a/public/_locales/en/messages.json
+++ b/public/_locales/en/messages.json
@@ -675,5 +675,8 @@
     },
     "hideForever": {
         "message": "Hide forever"
+    },
+    "warningChatInfo": {
+        "message": "You got a warning and cannot submit segments temporarily. This means that we noticed you were making some common mistakes that are not malicious, and we just want to clarify the rules. You can also join this chat using discord.gg/SponsorBlock or matrix.to/#/+sponsor:ajay.app"
     }
 }
diff --git a/public/content.css b/public/content.css
index 70b74766..2238a2bd 100644
--- a/public/content.css
+++ b/public/content.css
@@ -121,6 +121,16 @@
 	margin-left: 5px;
 }
 
+.chatNotice {
+	min-width: 350px;
+	height: 70%;
+
+	position: absolute;
+	right: 5px;
+	bottom: 100px;
+	right: 10px;
+}
+
 .sponsorSkipNotice {
     min-width: 350px;
     background-color: rgba(28, 28, 28, 0.9);
diff --git a/src/background.ts b/src/background.ts
index e44dd28a..53f9d415 100644
--- a/src/background.ts
+++ b/src/background.ts
@@ -164,11 +164,7 @@ async function asyncRequestToServer(type: string, address: string, data = {}) {
 async function sendRequestToCustomServer(type: string, url: string, data = {}) {
     // If GET, convert JSON to parameters
     if (type.toLowerCase() === "get") {
-        for (const key in data) {
-            const seperator = url.includes("?") ? "&" : "?";
-            const value = (typeof(data[key]) === "string") ? data[key]: JSON.stringify(data[key]);
-            url += seperator + key + "=" + value;
-        }
+        url = utils.objectToURI(url, data, true);
 
         data = null;
     }
diff --git a/src/content.ts b/src/content.ts
index e0f0572e..dc7a3427 100644
--- a/src/content.ts
+++ b/src/content.ts
@@ -13,7 +13,7 @@ import SkipNotice from "./render/SkipNotice";
 import SkipNoticeComponent from "./components/SkipNoticeComponent";
 import SubmissionNotice from "./render/SubmissionNotice";
 import { Message, MessageResponse } from "./messageTypes";
-import GenericNotice from "./render/GenericNotice";
+import * as Chat from "./js-components/chat";
 
 // Hack to get the CSS loaded on permission-based sites (Invidious)
 utils.wait(() => Config.config !== null, 5000, 10).then(addCSS);
@@ -1567,7 +1567,11 @@ async function sendSubmitMessage() {
         playerButtons.submit.button.style.animation = "unset";
         playerButtons.submit.image.src = chrome.extension.getURL("icons/PlayerUploadFailedIconSponsorBlocker.svg");
 
-        alert(utils.getErrorMessage(response.status, response.responseText));
+        if (response.status === 403 && response.responseText.startsWith("Submission rejected due to a warning from a moderator.")) {
+            Chat.openWarningChat(response.responseText);
+        } else {
+            alert(utils.getErrorMessage(response.status, response.responseText));
+        }
     }
 }
 
diff --git a/src/js-components/chat.ts b/src/js-components/chat.ts
new file mode 100644
index 00000000..41725775
--- /dev/null
+++ b/src/js-components/chat.ts
@@ -0,0 +1,30 @@
+import Config from "../config";
+import Utils from "../utils";
+const utils = new Utils();
+
+export interface ChatConfig {
+    displayName: string,
+    composerInitialValue?: string,
+    customDescription?: string
+}
+
+export function openChat(config: ChatConfig): void {
+    const chat = document.createElement("iframe");
+    chat.src = "https://chat.sponsor.ajay.app/#" + utils.objectToURI("", config, false);
+    chat.classList.add("chatNotice");
+    chat.style.zIndex = "2000";
+
+    console.log(utils.objectToURI("", config, false))
+
+    const referenceNode = utils.findReferenceNode();
+    referenceNode.prepend(chat);
+}
+
+export async function openWarningChat(warningMessage: string): Promise<void> {
+    openChat({
+        displayName: await utils.getHash(Config.config.userID),
+        composerInitialValue: `I got a warning and want to know what I need to do to improve. ` +
+                              `Warning reason: ${warningMessage.match(/Warning reason: '(.+)'/)[1]}`,
+        customDescription: chrome.i18n.getMessage("warningChatInfo")
+    });
+}
\ No newline at end of file
diff --git a/src/utils.ts b/src/utils.ts
index e93782cd..ed83857b 100644
--- a/src/utils.ts
+++ b/src/utils.ts
@@ -415,6 +415,19 @@ export default class Utils {
         return referenceNode;
     }
 
+    objectToURI<T>(url: string, data: T, includeQuestionMark: boolean): string {
+        let counter = 0;
+        for (const key in data) {
+            const seperator = (url.includes("?") || counter > 0) ? "&" : (includeQuestionMark ? "?" : "");
+            const value = (typeof(data[key]) === "string") ? data[key] as unknown as string : JSON.stringify(data[key]);
+            url += seperator + encodeURIComponent(key) + "=" + encodeURIComponent(value);
+
+            counter++;
+        }
+
+        return url;
+    }
+
     getFormattedTime(seconds: number, precise?: boolean): string {
         const hours = Math.floor(seconds / 60 / 60);
         const minutes = Math.floor(seconds / 60) % 60;