Enhanced Invidious Player

Adds hotkeys and more to invidious player.

Du musst eine Erweiterung wie Tampermonkey, Greasemonkey oder Violentmonkey installieren, um dieses Skript zu installieren.

Um dieses Skript zu installieren, müssen Sie eine Erweiterung wie Tampermonkey oder Violentmonkey installieren.

Um dieses Skript zu installieren, müssen Sie eine Erweiterung wie Tampermonkey oder Violentmonkey installieren.

Um dieses Skript zu installieren, müssen Sie eine Erweiterung wie Tampermonkey oder Userscripts installieren.

Um dieses Skript zu installieren, müssen Sie eine Erweiterung wie Tampermonkey installieren.

Sie müssten eine Skript Manager Erweiterung installieren damit sie dieses Skript installieren können

(Ich habe schon ein Skript Manager, Lass mich es installieren!)

Um dieses Design zu installieren, müssen Sie eine Erweiterung wie Stylus installieren.

Um dieses Design zu installieren, müssen Sie eine Erweiterung wie Stylus installieren.

Um dieses Design zu installieren, müssen Sie eine Erweiterung wie Stylus installieren.

Um diesen Stil zu installieren, müssen Sie eine Erweiterung für den Benutzerstil Verwaltung installieren.

Um diesen Stil zu installieren, müssen Sie eine Erweiterung für den Benutzerstil Verwaltung installieren.

Um diesen Stil zu installieren, müssen Sie eine Erweiterung für den Benutzerstil Verwaltung installieren.

(Ich habe bereits einen Benutzerstil Verwaltung, ich möchte ihn installieren!)

// ==UserScript==
// @name Enhanced Invidious Player
// @version 1.4.0
// @author NotYou
// @description Adds hotkeys and more to invidious player.
// @icon data:image/png;base64,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
// @namespace -
// @match *://inv.nadeko.net/watch*
// @match *://yewtu.be/watch*
// @match *://invidious.nerdvpn.de/watch*
// @match *://invidious.f5.si/watch*
// @match *://inv.nadekonw7plitnjuawu6ytjsl7jlglk2t6pyq6eftptmiv3dvqndwvyd.onion/watch*
// @match *://nadekoohummkxncchcsylr3eku36ze4waq4kdrhcqupckc3pe5qq.b32.i2p/watch*
// @license GPL-3.0-or-later
// @run-at document-end
// @grant none
// ==/UserScript==

!function() {
    class Keybinds {
        constructor(element) {
            this.element = element
            this.keybinds = []

            this.element.addEventListener('keydown', ev => {
                this.keybinds.forEach(keybind => {
                    const confimationCallback = keybind[0]
                    const keybindCallback = keybind[1]

                    if (confimationCallback(ev)) {
                        keybindCallback(element, ev)
                    }
                })
            })
        }

        bind(confimationCallback, keybindCallback) {
            this.keybinds.push([confimationCallback, keybindCallback])

            return this
        }
    }

    class Constants {
        static VOLUME_STEP = 0.021
        static SKIP_STEP = 15
    }

    class Main {
        static setupKeybinds($video, $contents) {
            const keybinds = new Keybinds($video)
            .bind(ev => ev.code === 'KeyR', video => {
                video.loop = video.loop ? false : true
            })
            .bind(ev => ev.code === 'KeyT', video => {
                $contents.style.width = $contents.style.width === '' ? '100%' : ''
            })
            .bind(ev => ev.code === 'KeyC', (video, ev) => {
                let data = ''

                if (ev.ctrlKey) {
                    data = video.currentSrc
                } else {
                    data = JSON.parse(document.querySelector('#player_data').textContent).title
                }

                navigator.clipboard.writeText(data)
            })
            .bind(ev => ev.code === 'ArrowRight', (video, ev) => {
                if (ev.ctrlKey) {
                    if (video.currentTime + Constants.SKIP_STEP < video.duration) {
                        video.currentTime += Constants.SKIP_STEP
                    } else {
                        video.currentTime = video.duration
                    }
                }
            })
            .bind(ev => ev.code === 'ArrowLeft', (video, ev) => {
                if (ev.ctrlKey) {
                    if (video.currentTime - Constants.SKIP_STEP > 0) {
                        video.currentTime -= Constants.SKIP_STEP
                    } else {
                        video.currentTime = 0
                    }
                }
            })
            .bind(ev => ev.code === 'Numpad0' || ev.code === 'Numpad1', video => {
                video.playbackRate = 1
            })
            .bind(ev => ev.code === 'Numpad2', video => {
                video.playbackRate = 2
            })
            .bind(ev => ev.code === 'Numpad3', video => {
                video.playbackRate = 2.5
            })
            .bind(ev => ev.code === 'Numpad4', video => {
                video.playbackRate = 3
            })

            const scriptsDisabled = Boolean(document.querySelector('#player'))

            if (scriptsDisabled) {
                const $player = document.querySelector('#player')

                keybinds.bind(ev => ev.code === 'KeyM', video => {
                    video.muted = video.muted ? true : false
                }).bind(ev => ev.code === 'KeyF', () => {
                    if ($player.requestFullscreen) {
                        $player.requestFullscreen()
                    } else if ($player.webkitRequestFullscreen) {
                        $player.webkitRequestFullscreen()
                    } else if ($player.msRequestFullscreen) {
                        $player.msRequestFullscreen()
                    }
                })
            }
        }

        static setupMouseControls($video) {
            const isFullscreenEnabled = () => document.fullscreenElement !== null

            $video.addEventListener('mouseenter', () => {
                if (isFullscreenEnabled()) {
                    return
                }

                $video.focus()
                document.documentElement.style.overflow = 'hidden'
            })

            $video.addEventListener('mouseleave', () => {
                if (isFullscreenEnabled()) {
                    return
                }

                document.documentElement.style.overflow = ''
            })

            $video.addEventListener('blur', () => {
                document.documentElement.style.overflow = ''
            })

            $video.addEventListener('wheel', ev => {
                const wentDown = ev.deltaY >= 0

                if (wentDown) {
                    if ($video.volume - Constants.VOLUME_STEP <= 0) {
                        $video.volume = 0
                    } else {
                        $video.volume -= Constants.VOLUME_STEP
                    }
                } else {
                    if ($video.muted) {
                        $video.muted = false
                    }

                    if ($video.volume + Constants.VOLUME_STEP >= 1) {
                        $video.volume = 1
                    } else {
                        $video.volume += Constants.VOLUME_STEP
                    }
                }
            })
        }

        static init() {
            const $video = document.querySelector('video')
            const $contents = $video.parentNode.parentNode.parentNode

            this.setupKeybinds($video, $contents)
            this.setupMouseControls($video)
        }
    }

    Main.init()
}()