From f389f88825958beb3d74cb0d50a118435b40652e Mon Sep 17 00:00:00 2001
From: Nicolai Ort <info@nicolai-ort.com>
Date: Sat, 25 Sep 2021 18:01:30 +0200
Subject: [PATCH] Extension users can now disable bot preview

---
 src/index.html | 22 ++++++++++++++++++++++
 src/main.js    |  4 +++-
 2 files changed, 25 insertions(+), 1 deletion(-)
diff --git a/src/index.html b/src/index.html
index d54eda9..80415e2 100644
--- a/src/index.html
+++ b/src/index.html
@@ -13,6 +13,19 @@
 		}
 	</style>
 </head>
+<style>
+	/* CHECKBOX TOGGLE SWITCH */
+	/* @apply rules for documentation, these do not work as inline style */
+	.toggle-checkbox:checked {
+	  @apply: right-0 border-green-400;
+	  right: 0;
+	  border-color: #68D391;
+	}
+	.toggle-checkbox:checked + .toggle-label {
+	  @apply: bg-green-400;
+	  background-color: #68D391;
+	}
+	</style>
 
 <body>
 	<div class="p-4 flex items-center justify-center bg-white">
@@ -69,6 +82,15 @@
 						placeholder="custom url" />
 				</div>
 			</div>
+			<div id="bot_container">
+				<div class="mt-1 flex rounded-md shadow-sm">
+					<label for="toggle" class="text-base text-gray-700 pr-2">Disable Preview:</label>
+					<div class="relative inline-block w-10 mr-2 align-middle select-none transition duration-200 ease-in">
+						<input type="checkbox" name="toggle" id="bot_toggle" class="toggle-checkbox absolute block w-6 h-6 rounded-full bg-white border-4 appearance-none cursor-pointer"/>
+						<label for="toggle" class="toggle-label block overflow-hidden h-6 rounded-full bg-gray-300 cursor-pointer"></label>
+					</div>
+				</div>
+			</div>
 			<div class="hidden" name="shorturl_container" id="shorturl_container">
 				<div class="inline-flex w-full" id="shorturl_copy" data-clipboard-target="#shorturl">
 					<p name="shorturl" id="shorturl" class:bg-green-200={copied}
diff --git a/src/main.js b/src/main.js
index c97c5a9..a3a90cb 100644
--- a/src/main.js
+++ b/src/main.js
@@ -25,7 +25,8 @@ document.getElementById("create").onclick = createUrl;
 function createUrl() {
     let shorturl = {
         target: document.getElementById("target").value,
-        shortcode: document.getElementById("shortcode").value
+        shortcode: document.getElementById("shortcode").value,
+        no_preview: document.getElementById("bot_toggle").value
     };
 
     if (shorturl.shortcode == "" | !shorturl.shortcode) {
@@ -49,6 +50,7 @@ function createUrl() {
                     document.getElementById("shorturl_container").className = "";
                     document.getElementById("target_container").className = "hidden";
                     document.getElementById("shortcode_container").className = "hidden";
+                    document.getElementById("bot_container").classList.add("hidden");
                     document.getElementById("create").classList.add("hidden");
                     document.getElementById("reset").classList.remove("hidden");
                 });
