Remove yt volumebar focus

Sets focus to video element after using volume bar, so that left/right arrow keys can be used for video seeking instead of volume change

이 스크립트를 설치하려면 Tampermonkey, Greasemonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램을 설치해야 합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Userscripts와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 유저 스크립트 관리자 확장 프로그램이 필요합니다.

(이미 유저 스크립트 관리자가 설치되어 있습니다. 설치를 진행합니다!)

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

(이미 유저 스타일 관리자가 설치되어 있습니다. 설치를 진행합니다!)

// ==UserScript==
// @name     Remove yt volumebar focus
// @description Sets focus to video element after using volume bar, so that left/right arrow keys can be used for video seeking instead of volume change
// @license MIT
// @version  1.30
// @grant    none
// @match    https://www.youtube.com/*
// @namespace https://greasyfork.org/users/847699
// ==/UserScript==

const getVideoElem = () => document.querySelector("video.html5-main-video");
const elementToObserve = document.querySelector("body");

const observer = new MutationObserver(function(mutations_list) {
	mutations_list.forEach(function(mutation) {
		mutation.addedNodes.forEach(function(added_node) {
			if(added_node.id == 'movie_player') {
                const volumeArea = document.querySelector(".ytp-volume-area");
                const videoProgressBar = document.querySelector(".ytp-progress-bar-container");

                volumeArea.addEventListener("click", (_) => {
                    setTimeout(() => {
                        getVideoElem().focus();
                    }, 50);
                });
                videoProgressBar.addEventListener("click", (_) => {
                    setTimeout(() => {
                        getVideoElem().focus();
                    }, 50);
                });

				observer.disconnect();
			}
		});
	});
});

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