☰

YouTube Hide UI on Arrow Keys, Show on Mouse Move

Ok tuşları UI'yi açmasın ama mouse hareketinde görünsün (tüm .ytp- elemanları otomatik algılanır)

As of 2025-02-15. See the latest version.

// ==UserScript==
// @name         YouTube Hide UI on Arrow Keys, Show on Mouse Move
// @version      1.8
// @namespace    https://github.com/KaanAlper/youtube-ui-hide
// @license      GPL-3.0
// @description  Ok tuşları UI'yi açmasın ama mouse hareketinde görünsün (tüm .ytp- elemanları otomatik algılanır)
// @author       Kaan Alper Karaaslan
// @match        http://*.youtube.com/*
// @match        http://youtube.com/*
// @match        https://*.youtube.com/*
// @match        https://youtube.com/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    let elements = document.querySelectorAll(`
        .ytp-doubletap-tooltip,
        .ytp-chrome-bottom,
        .ytp-gradient-bottom,
        .ytp-title-text,
        .ytp-share-button,
        .ytp-right-controls,
        .ytp-watch-later-button,
        .ytp-doubletap-ui-legacy
    `);
    let hideTimeout;
    let cursorTimeout;

    let hideUI = () => {
        //document.querySelectorAll('[class^="ytp-"]').forEach(el => {
        elements.forEach(el => {
            el.style.opacity = '0';
            el.style.pointerEvents = 'none';
        });
    };
    let hideCursor = () => {
        document.body.style.cursor = 'none';
    };

    let showUI = () => {
        //document.querySelectorAll('[class^="ytp-"]').forEach(el =>
        elements.forEach(el => {
            el.style.opacity = '1';
            el.style.pointerEvents = 'auto';
        });
    };

    document.addEventListener('keydown', function(event) {
        if (['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'F'].includes(event.key)) {
            clearTimeout(hideTimeout);
            clearTimeout(cursorTimeout);
            setTimeout(hideUI, 100); // 100ms sonra UI tamamen gizle
            setTimeout(hideCursor, 2000);
        }
    });

    document.addEventListener('mousemove', function() {
        document.body.style.cursor = 'auto';
        clearTimeout(hideTimeout);
        clearTimeout(cursorTimeout);
        showUI();
        hideTimeout = setTimeout(hideUI, 2000); // 2 saniye sonra tekrar gizle
        cursorTimeout =setTimeout(hideCursor, 2000);
    });

})();