Twitch enhancer

twitch.script.js

// ==UserScript==
// @name         Twitch Script
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        *.twitch.tv/*
// @match        twitch.tv/*
// @match        https://twitch.tv/*
// @icon         https://t1.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=http://twitch.tv
// @grant        none
// ==/UserScript==

var lastLink = '';
setInterval(function(){
    if(document.querySelector("div.chat-input__buttons-container.tw-flex.tw-justify-content-between.tw-mg-t-1 > div:nth-child(1) > div > div > div > div.tw-full-height.tw-relative.tw-z-above > div > div > div > button")){
        document.querySelector("div.chat-input__buttons-container.tw-flex.tw-justify-content-between.tw-mg-t-1 > div:nth-child(1) > div > div > div > div.tw-full-height.tw-relative.tw-z-above > div > div > div > button").click()
    }
    let e = document.querySelector('.metadata-layout__support + div > div:nth-child(2)');
    if(e)
    {
        let text = e.innerHTML;
        let x = document.querySelector('#channelTime');
        if(x)x.innerHTML = text;
        else document.querySelector('body').insertAdjacentHTML('beforeend',`<div id="channelTime">${text}</div>`);
    }

}, 1000)
let lastLocation = '';
setInterval( ()=>{
    //Tooltip img
	let el = document.querySelector('.online-side-nav-channel-tooltip__body');
	if(el) {
		let user = document.querySelector('[data-test-selector="recommended-channel"]:hover') ||  document.querySelector('[data-test-selector="followed-channel"]:hover') ;
		if(user) {
			user = user.getAttribute('href').split('/')[1];
            if(!el.querySelector('img')) {
                const size = 235 + Math.floor(Math.random() * 13);
                el.querySelector('div>p').insertAdjacentHTML('afterBegin',`<img src="https://static-cdn.jtvnw.net/previews-ttv/live_user_${user}-440x${size}.jpg" data-ping="248" height="102" width="187">`);
                1 || el.querySelector('div>p').insertAdjacentHTML('afterBegin',`<iframe
    src="https://player.twitch.tv/?channel=${user}&muted=true&parent=www.twitch.tv&controls=false&quality=mobile"
    height="150"
    width="280"
    allowfullscreen="true">
</iframe>`);
            }
		}
	}
    // force THEATRE MODE
    if(window.location.href != lastLocation)
    {
        const el = document.querySelector('.persistent-player button[aria-label="Theatre Mode (alt+t)"]');
        if(el)
        {
            setTimeout( ()=>{
                el.click();
            },3500);
                lastLocation = window.location.href;
        }
    }
},200);
window.hovering = 0;
setTimeout( function() {
    let el = document.querySelector('#sideNav');
    el.onmouseenter = () => {
        window.hovering = 1;
        document.querySelector('nav[data-a-target]').style.zIndex = 999999
    };

    document.querySelector('nav[data-a-target]').onmouseenter = () => {
        window.hovering = 1;
    }
    el.onmouseleave = document.querySelector('nav[data-a-target]').onmouseleave = () => {
        window.hovering = 0;
        setTimeout( () => {
            if(window.hovering == 0)
            {
                document.querySelector('nav[data-a-target]').style.zIndex = 1
            }
        },700);
    }
}, 2000);

setInterval(()=>{
if(!document.getElementById('xCustomCSS'))
{
document.body.insertAdjacentHTML('afterend',`<style id="xCustomCSS" type="text/css" class="stylus">
.online-side-nav-channel-tooltip__body p {
    overflow: visible;
    text-overflow: unset;
    white-space: initial;
    -webkit-line-clamp: unset;
}
div#sideNav:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: transparent;
    z-index: 99999;
}

div#sideNav {
    position: relative;
}
div#sideNav:hover:hover .side-nav{
    display:block;
    z-index:99999999;
    position: fixed;

    top: 50px;
    padding-top: 0px;
}

.tw-flex.tw-flex-column .tw-flex.tw-flex-column.tw-flex-grow-0.tw-flex-shrink-1.tw-justify-content-start .tw-mg-l-1 > .tw-align-items-center.tw-flex.tw-justify-content-end> div:first-child
{
    position:fixed;
    left: 0px;
    z-index: 99999;
    bottom: 0px;
    filter: grayscale(0.4) opacity(0.5);
}
div#sideNav {
    margin-bottom: 110px;
    height: 50%;
}
div#sideNav:before {
    content: "";
    background: #1f1f23;
    z-index: -1;
    bottom: 0;
    top: 0;
    height: 100vh;
    position: absolute;
    width: 50px;
}
/* nav.top-nav.tw-flex-shrink-0 {
    z-index: 9999;
    opacity: 0;
    width: 82%;
}

nav.top-nav.tw-flex-shrink-0:hover {
    opacity: 1;
    width: 100%;
} */

:root {
    --zindex: 1;
}

nav.top-nav.tw-flex-shrink-0 {
    z-index: var(--zindex);
}

div#sideNav:hover {
    --zindex: 999999;
}

div#channelTime {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 99999;
    font-weight:bold;
	opacity:0.7;
	zoom:0.9;

    pointer-events: none;
}
div#channelTime b {
    display: inline-block;
}

div#channelTime b:first-child {
    padding: 0px 10px;
    color: var(--color-text-live)  !important;
}
body #channelTime >div >div >div:nth-child(2) {
    display: none !important;
    /* visibility: hidden; */
}

div.Layout-sc-nxg1ff-0.front-page-carousel.front-page-carousel--mischief {
	display:none;
}
.front-page-carousel
{
	display:none;
}
</style>`);
}},200);