From cab8b2f29c371af2fb1b77a2bf44c589390e273a Mon Sep 17 00:00:00 2001
From: zishan <zishanza436@gmail.com>
Date: Fri, 31 Jul 2026 21:17:15 +0530
Subject: [PATCH] added a new feature, now the button can be dragg to any place
 we want, also made the image on the button non-draggable

---
 scripts/index.css |  9 +++++++
 scripts/index.js  | 62 +++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 71 insertions(+)

diff --git a/scripts/index.css b/scripts/index.css
index 545eefe..fc777f6 100644
--- a/scripts/index.css
+++ b/scripts/index.css
@@ -13,6 +13,15 @@
   justify-content: center;
   transition: all 0.3s ease;
 }
+.floating-button, .floating-button * {
+  -webkit-user-drag: none;
+  user-select: none;
+  -webkit-touch-callout: none;
+}
+
+.floating-button img {
+  pointer-events: none; /* let pointerdown/move pass straight to the button, not the img */
+}
 .button-image {
   width: 95%;
   height: 95%;
diff --git a/scripts/index.js b/scripts/index.js
index cf548b4..b3cdf51 100644
--- a/scripts/index.js
+++ b/scripts/index.js
@@ -122,3 +122,65 @@ new MutationObserver(()=> {
     updateCompanies(lastUrl);
   }}, 250)
 }).observe(document, {subtree: true, childList: true})
+
+// this function grabs that current location of the button and add some Event listeners to it 
+// if the button is dragged it increase or decrease dynamically the x,y coordinate of the button acc to the mouse current location
+
+function makeDraggable(button) {
+  let isDragging = false;
+  let startX = 0;
+  let startY = 0;
+  let x, y;
+  let rafId = null;
+
+  // Get the button's REAL current position on screen
+  const rect = button.getBoundingClientRect();
+  x = rect.left;
+  y = rect.top;
+
+  button.style.position = "fixed";
+  button.style.left = "0";
+  button.style.top = "0";
+  button.style.right = "auto";   // clear any CSS that was positioning it
+  button.style.bottom = "auto";
+  button.style.margin = "0";
+  button.style.transform = `translate3d(${x}px, ${y}px, 0)`;
+  button.style.touchAction = "none";
+  button.style.cursor = "grab";
+
+  function applyTransform() {
+    button.style.transform = `translate3d(${x}px, ${y}px, 0)`;
+    rafId = null;
+  }
+
+  function endDrag(e) {
+    if (!isDragging) return;
+    isDragging = false;
+    if (button.hasPointerCapture(e.pointerId)) {
+      button.releasePointerCapture(e.pointerId);
+    }
+    button.style.cursor = "grab";
+    document.body.style.userSelect = "";
+  }
+
+  button.addEventListener("pointerdown", (e) => {
+    isDragging = true;
+    button.setPointerCapture(e.pointerId);
+    startX = e.clientX - x;
+    startY = e.clientY - y;
+    button.style.cursor = "grabbing";
+    document.body.style.userSelect = "none";
+  });
+
+  button.addEventListener("pointermove", (e) => {
+    if (!isDragging) return;
+    x = e.clientX - startX;
+    y = e.clientY - startY;
+    if (rafId === null) rafId = requestAnimationFrame(applyTransform);
+  });
+
+  button.addEventListener("pointerup", endDrag);
+  button.addEventListener("pointercancel", endDrag); // handles interrupted drags (OS gestures, alt-tab, etc.)
+}
+
+makeDraggable(button);
\ No newline at end of file