add crackstream fit to window and enable updates

2026-07-06 03:13:08 -04:00 · 2026-07-06 03:13:08 -04:00 · 260f951cf1
commit 260f951cf1
parent 563ad690c2
2 changed files with 165 additions and 34 deletions
--- a/scripts/javascript/cs-fit-to-window.user.js
+++ b/scripts/javascript/cs-fit-to-window.user.js
@ -0,0 +1,130 @@
+// ==UserScript==
+// @name         CrackStreams - Fit Video to Window
+// @namespace    https://git.okseby.com/okseby/crunchbang
+// @version      1.0
+// @description  Adds a button that expands the video player to fill the browser window (not real fullscreen)
+// @author       seby
+// @match        https://crackstreams.mx/stream/*
+// @match        https://footybite.ac/event/*
+// @updateURL    https://git.okseby.com/okseby/crunchbang/raw/branch/main/scripts/javascript/fit-to-window.user.js
+// @downloadURL  https://git.okseby.com/okseby/crunchbang/raw/branch/main/scripts/javascript/fit-to-window.user.js
+// @grant        none
+// @run-at       document-idle
+// ==/UserScript==
+
+(function () {
+  "use strict";
+
+  const PLAYER_SELECTOR = "#videoPlayer";
+  const BUTTON_ID = "fit-to-window-btn";
+
+  let isFitted = false;
+  let placeholder = null; // marks where the player used to live in the DOM
+  let originalStyle = null;
+
+  function getPlayer() {
+    return document.querySelector(PLAYER_SELECTOR);
+  }
+
+  function makeButton() {
+    const btn = document.createElement("button");
+    btn.id = BUTTON_ID;
+    btn.textContent = "Fit to Window";
+    Object.assign(btn.style, {
+      position: "fixed",
+      top: "10px",
+      right: "10px",
+      zIndex: "2147483647",
+      padding: "8px 14px",
+      fontSize: "14px",
+      fontWeight: "600",
+      color: "#fff",
+      background: "#2563eb",
+      border: "none",
+      borderRadius: "6px",
+      cursor: "pointer",
+      boxShadow: "0 2px 6px rgba(0,0,0,0.4)",
+      fontFamily: "system-ui, sans-serif",
+      opacity: "0.08",
+      transition: "opacity 0.2s ease",
+    });
+    btn.addEventListener("mouseenter", () => {
+      btn.style.opacity = "1";
+    });
+    btn.addEventListener("mouseleave", () => {
+      btn.style.opacity = "0.08";
+    });
+    btn.addEventListener("click", toggleFit);
+    document.body.appendChild(btn);
+    return btn;
+  }
+
+  function toggleFit() {
+    const player = getPlayer();
+    if (!player) return;
+
+    const btn = document.getElementById(BUTTON_ID);
+
+    if (!isFitted) {
+      // Save original position info so we can restore later
+      placeholder = document.createComment("fit-to-window-placeholder");
+      player.parentNode.insertBefore(placeholder, player);
+
+      originalStyle = player.getAttribute("style") || "";
+
+      Object.assign(player.style, {
+        position: "fixed",
+        top: "0",
+        left: "0",
+        width: "100vw",
+        height: "100vh",
+        margin: "0",
+        zIndex: "2147483646",
+        background: "#000",
+      });
+
+      // Make the iframe/video inside stretch fully too
+      const inner = player.querySelector("iframe, video");
+      if (inner) {
+        inner.style.width = "100%";
+        inner.style.height = "100%";
+      }
+
+      document.documentElement.style.overflow = "hidden";
+      document.body.style.overflow = "hidden";
+
+      isFitted = true;
+      if (btn) btn.textContent = "Exit Fit";
+    } else {
+      // Restore original style/position
+      if (originalStyle !== null) {
+        player.setAttribute("style", originalStyle);
+      } else {
+        player.removeAttribute("style");
+      }
+
+      if (placeholder && placeholder.parentNode) {
+        placeholder.parentNode.insertBefore(player, placeholder);
+        placeholder.remove();
+      }
+
+      document.documentElement.style.overflow = "";
+      document.body.style.overflow = "";
+
+      isFitted = false;
+      if (btn) btn.textContent = "Fit to Window";
+    }
+  }
+
+  function init() {
+    if (document.getElementById(BUTTON_ID)) return;
+    if (!getPlayer()) {
+      // Player might load slightly after DOM ready; retry briefly
+      setTimeout(init, 500);
+      return;
+    }
+    makeButton();
+  }
+
+  init();
+})();