Enhanced Invidious Player

Adds hotkeys and more to invidious player.

Dovrai installare un'estensione come Tampermonkey, Greasemonkey o Violentmonkey per installare questo script.

You will need to install an extension such as Tampermonkey to install this script.

Dovrai installare un'estensione come Tampermonkey o Violentmonkey per installare questo script.

Dovrai installare un'estensione come Tampermonkey o Userscripts per installare questo script.

Dovrai installare un'estensione come ad esempio Tampermonkey per installare questo script.

Dovrai installare un gestore di script utente per installare questo script.

(Ho già un gestore di script utente, lasciamelo installare!)

Dovrai installare un'estensione come ad esempio Stylus per installare questo stile.

Dovrai installare un'estensione come ad esempio Stylus per installare questo stile.

Dovrai installare un'estensione come ad esempio Stylus per installare questo stile.

Dovrai installare un'estensione per la gestione degli stili utente per installare questo stile.

Dovrai installare un'estensione per la gestione degli stili utente per installare questo stile.

Dovrai installare un'estensione per la gestione degli stili utente per installare questo stile.

(Ho già un gestore di stile utente, lasciamelo installare!)

// ==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()
}()