V2.3 - Youtube-Theater-Fill-Window

script.js

/*
Youtube Theater Fill Window v2.4
A script to make the theater mode in youtube videos better and big enough to cover the window. - Youtube videolarında tiyatro modunu daha iyi ve pencereyi kaplayacak şekilde büyük hale getirmek için bir script. 
https://wolkanca.com/youtube-theater-mode-fix/
Volkan Yılmaz - wolkanca.com
*/

(function () {
    'use strict';
    let w = window,
        d = document,
        html = d.getElementsByTagName('html')[0],
        V = new URL(document.location).searchParams.get('v'),
        Tcount = 0;

    const tiyatro = function () {
        let V = new URL(d.location).searchParams.get('v'),
            ytdapp = d.getElementsByTagName('ytd-app')[0],
            ytdwatchflexy = d.getElementsByTagName('ytd-watch-flexy')[0],
            wide = cookieStore.get('wide'),
            F,
            T,
            D,
            S,
            L;

        const toggle = function (e) {
            if (e == '1') {
                html.classList.add('tiyatro');
                d.body.classList.add('no-scroll');
                ytdapp.setAttribute('scrolling', ''),
                    ytdapp.setAttribute('masthead-hidden', ''),
                    ytdapp.setAttribute(
                        'style',
                        '--ytd-app-fullerscreen-scrollbar-width: 17px; --ytd-masthead-height: 0px; --ytd-network-status-banner-display: none;'
                    );
                localStorage.setItem('theater', '1');
                w.dispatchEvent(new Event('resize'));
                //console.log('tiyatro');
            } else {
                if (!F) {
                    html.classList.remove('tiyatro');
                    d.body.classList.remove('no-scroll');
                    ytdapp.removeAttribute('scrolling', ''),
                        ytdapp.removeAttribute('masthead-hidden'),
                        ytdapp.removeAttribute('style');
                }
                localStorage.removeItem('theater');
                //console.log('tiyatro değil');
            }
        };

        if (V) {
            if (ytdwatchflexy.hasAttribute('fullscreen')) {
                F = true;
                T = false;
                D = false;
            } else if (ytdwatchflexy.hasAttribute('theater')) {
                F = false;
                T = true;
                D = false;
            } else if (ytdwatchflexy.hasAttribute('default-layout')) {
                F = false;
                T = false;
                D = true;
            }

            if (ytdwatchflexy.hasAttribute('flexy-large-window_')) {
                L = true;
                S = false;
            } else if (ytdwatchflexy.hasAttribute('flexy-small-window_')) {
                L = false;
                S = true;
            }
        }

        if (T && !F) {
            toggle('1');

            if (L) {
                html.classList.add('l');
            } else if (S) {
                html.classList.add('s');
            }
        } else {
            toggle('0');
            T = false;
        }

        cookieStore.addEventListener('change', ({ changed }) => {
            if (wide) {
                for (let { name, value } of changed) {
                    if (value === '1') {
                        if (!F) {
                            toggle('1');
                        } else {
                            html.classList.remove('tiyatro');
                        }
                    } else if (value === '0') {
                        toggle('0');
                    }
                }
            }
        });

        w.addEventListener('fullscreenchange', function (e) {
            if (d.fullscreenElement) {
                localStorage.setItem('fullscreen', '1');
            } else {
                localStorage.removeItem('fullscreen');

                if (localStorage.getItem('theater')) {
                    toggle('1');
                } else {
                    toggle('0');
                }
            }
        });

        ytdapp.addEventListener('scroll', function () {
            if (ytdapp.scrollTop == 0) {
                ytdapp.setAttribute('masthead-hidden', '');
            } else {
                ytdapp.removeAttribute('masthead-hidden', '');
            }
        });
    };

    if (d.readyState === 'loading') {
        d.addEventListener('DOMContentLoaded', tiyatro);
    } else {
        [w, d, html].map((e) =>
            w.addEventListener('yt-navigate-finish', tiyatro)
        );
    }
    let interval = setInterval(function () {
        Tcount += 1;
        if (Tcount > 0) {
            clearInterval(interval);
        }
        tiyatro();
    }, 2000);
})();

style.css

/*
Youtube Theater Fill Window v2.4
A script to make the theater mode in youtube videos better and big enough to cover the window. - Youtube videolarında tiyatro modunu daha iyi ve pencereyi kaplayacak şekilde büyük hale getirmek için bir script. 
https://wolkanca.com/youtube-theater-mode-fix/
Volkan Yılmaz - wolkanca.com
*/

:root,
html:not(:fullscreen) {
    scrollbar-width: thin;
}
html:not(:fullscreen).tiyatro {
    scrollbar-width: none;
    --ytd-toolbar-height: 0;
    --ytd-masthead-height: 0;
}
html:not(:fullscreen).tiyatro ytd-app {
    width: 100vw;
    min-width: 100vw;
    scrollbar-width: none;
    --ytd-masthead-height: 0 !important;
    --ytd-network-status-banner-display: none !important;
}
html:not(:fullscreen).tiyatro
    ytd-watch-flexy[full-bleed-player]
    #full-bleed-container.ytd-watch-flexy {
    max-height: 100%;
    height: 100vh;
    min-height: 100vh;
}
html:not(:fullscreen).tiyatro video {
    object-fit: cover;
    height: auto;
    width: 100%;
}
html:not(:fullscreen).tiyatro
    ytd-watch-flexy[fixed-panels]
    #panels-full-bleed-container.ytd-watch-flexy,
html:not(:fullscreen).tiyatro
    ytd-watch-flexy[fixed-panels]
    #chat.ytd-watch-flexy {
    display: none;
    visibility: hidden;
    clip-path: inset(100%);
    position: absolute;
    width: 0;
    height: 0;
}
html:not(:fullscreen).tiyatro
    ytd-watch-flexy[fixed-panels]
    #columns.ytd-watch-flexy {
    padding-right: 0;
}

https://github.com/wolkanca/Youtube-Theater-Fill-Window @wolkanca