TikTok Larger Video + Mouse Volume Control

Makes the TikTok video take up more of the screen

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name         TikTok Larger Video + Mouse Volume Control
// @namespace    https://greasyfork.org/en/users/807108-jeremy-r
// @version      1.2
// @description  Makes the TikTok video take up more of the screen
// @author       JRem
// @require      https://cdn.jsdelivr.net/gh/mlcheng/js-toast@ebd3c889a1abaad615712485ce864d92aab4c7c0/toast.min.js
// @match        https://www.tiktok.com/*/video/*
// @grant        GM_addStyle
// @license      MIT
// ==/UserScript==

(function() {
    // Set to 0, if you want to keep the blur
    const removeBlur="1"
    // Set to 0, to disable toast msg's
    const enableToasts="1"

    // Toast Vars
    const options = {settings: {duration: 500,},style: {main: {background: "black",color: "white",width: "auto",'max-width': '10%',}}};

    function waitForElm(selector) {
        return new Promise(resolve => {
            if (document.querySelector(selector)) {
                return resolve(document.querySelector(selector));
            }

            const observer = new MutationObserver(mutations => {
                if (document.querySelector(selector)) {
                    resolve(document.querySelector(selector));
                    observer.disconnect();
                }
            });

            observer.observe(document.body, {
                childList: true,
                subtree: true
            });
        });
    }

    // Volume Control via mouse scroll
    // 1 Scroll = 5%
    var stepAmount = 5;

    function volChange(e){
        e.preventDefault()
        var video = document.querySelector('video')
        var curVol = video.volume;
        var direction = e.deltaY < 0;
        var actualChange = stepAmount / 100;
        if (direction) curVol += actualChange;
        else curVol -= actualChange;
        if (curVol > 1) curVol = 1;
        else if (curVol < 0) curVol = 0;
        video.volume = curVol;

        if (enableToasts==1) {iqwerty.toast.toast(Math.floor(100 * video.volume) +"%", options);}
    }

    document.querySelector('div[class*="-DivVideoContainer"]').addEventListener("wheel", volChange);


    waitForElm('div[class*="-DivVideoContainer"]').then((elm) => {
        console.log('Element Found, Starting Fullscreen');

        var cssClass = document.querySelector('div[class*="-DivVideoContainer"]').className.split(" ")
        var css = "."+cssClass[0]+", ."+cssClass[1]+" { height: 80vh !important; }";
        GM_addStyle(css);
        if (enableToasts==1) {iqwerty.toast.toast('Fullscreen added', options);}

        if (removeBlur==1) {
            var cssClass1 = document.querySelector('div[class*="-DivBlurBackground"]').className.split(" ")
            var css1 = "."+cssClass1[0]+", ."+cssClass1[1]+" { opacity: 0 !important; }";
            GM_addStyle(css1);
            if (enableToasts==1) {iqwerty.toast.toast('Blur Removed', options);}
        }
    });
})();