Ultrawide Fix for Kick

Adjust video player to fit full width, accounting for sidebars on ultrawide monitors
当前为 2024-09-12 提交的版本，查看最新版本。
换行
// ==UserScript==
// @name         Ultrawide Fix for Kick
// @namespace    https://greasyfork.org/en/users/1200587-trilla-g
// @version      1.1
// @description  Adjust video player to fit full width, accounting for sidebars on ultrawide monitors
// @match        *://kick.com/*
// @grant        none
// @license      MIT
// @author       Trilla_G
// ==/UserScript==

(function() {
    'use strict';

    // Function to adjust the video element considering sidebars and center it
    let adjustVideoElement = () => {
        // Select the <video> element
        let videoElement = document.querySelector("video");

        if (videoElement) {
            // Sidebar dimensions
            let leftSidebarWidth = 256;  // Left sidebar width
            let rightSidebarWidth = 340;  // Right sidebar width
            let totalSidebarWidth = leftSidebarWidth + rightSidebarWidth;  // Total width of both sidebars
            let viewportWidth = window.innerWidth;  // Full viewport width
            let availableWidth = viewportWidth - totalSidebarWidth;

            // Set the video width and height
            videoElement.style.width = `${availableWidth}px`;
            videoElement.style.height = 'auto';  // Maintain aspect ratio
            videoElement.style.maxWidth = 'none'; // Remove any max-width constraints
            videoElement.style.maxHeight = '100vh'; // Fit to viewport height
            videoElement.style.objectFit = 'cover';  // Fill the screen, cropping if needed

            // Center the video element horizontally
            videoElement.style.position = 'fixed'; // Use fixed positioning
            videoElement.style.left = `${leftSidebarWidth}px`;  // Offset for the left sidebar
            videoElement.style.top = '0';  // Align with the top of the viewport
        }
    };

    // Run the adjustment periodically, in case the video is loaded dynamically
    let interval = setInterval(() => {
        adjustVideoElement();
    }, 500);

    // Stop the interval after 5 seconds (adjust as necessary)
    setTimeout(() => {
        clearInterval(interval);
    }, 5000);
})();