From 74c9fe13e289fd028c42bcac10e5b4bfdc14fda2 Mon Sep 17 00:00:00 2001
From: MiepHD <63968466+MiepHD@users.noreply.github.com>
Date: Wed, 28 Dec 2022 10:23:11 +0100
Subject: [PATCH] Added option to change alignment of video-toggle

---
 plugins/video-toggle/button-switcher.css |  2 +-
 plugins/video-toggle/front.js            | 15 +++++++++++
 plugins/video-toggle/menu.js             | 32 ++++++++++++++++++++++++
 3 files changed, 48 insertions(+), 1 deletion(-)

diff --git a/plugins/video-toggle/button-switcher.css b/plugins/video-toggle/button-switcher.css
index 7d3de097..048d1b6a 100644
--- a/plugins/video-toggle/button-switcher.css
+++ b/plugins/video-toggle/button-switcher.css
@@ -22,7 +22,7 @@
     color: #fff;
     padding-right: 120px;
     position: absolute;
-    left: calc(50% - 120px);
+    left: var(--align);
 }
 
 .video-switch-button:before {
diff --git a/plugins/video-toggle/front.js b/plugins/video-toggle/front.js
index 9b6985eb..07f966c7 100644
--- a/plugins/video-toggle/front.js
+++ b/plugins/video-toggle/front.js
@@ -31,6 +31,21 @@ module.exports = (_options) => {
             document.addEventListener("apiLoaded", setup, { once: true, passive: true });
         }
     }
+    const mainpanel = document.querySelector("#main-panel");
+    switch (_options.align) {
+        case "right": {
+            mainpanel.style.setProperty("--align", "calc(100% - 240px)");
+            return;
+        }
+        case "middle": {
+            mainpanel.style.setProperty("--align", "calc(50% - 120px)");
+            return;
+        }
+        default:
+        case "left": {
+            mainpanel.style.setProperty("--align", "0px");
+        }
+    }
 };
 
 function setup(e) {
diff --git a/plugins/video-toggle/menu.js b/plugins/video-toggle/menu.js
index 2cf4be0a..059aa963 100644
--- a/plugins/video-toggle/menu.js
+++ b/plugins/video-toggle/menu.js
@@ -33,6 +33,38 @@ module.exports = (win, options) => [
             },
         ]
     },
+    {
+        label: "Alignment",
+        submenu: [
+            {
+                label: "Left",
+                type: "radio",
+                checked: options.align === 'left',
+                click: () => {
+                    options.align = 'left';
+                    setMenuOptions("video-toggle", options);
+                }
+            },
+            {
+                label: "Middle",
+                type: "radio",
+                checked: options.align === 'middle',
+                click: () => {
+                    options.align = 'middle';
+                    setMenuOptions("video-toggle", options);
+                }
+            },
+            {
+                label: "Right",
+                type: "radio",
+                checked: options.align === 'right',
+                click: () => {
+                    options.align = 'right';
+                    setMenuOptions("video-toggle", options);
+                }
+            },
+        ]
+    },
     {
         label: "Force Remove Video Tab",
         type: "checkbox",