// ==UserScript==
// @name         YoutubeFixes
// @namespace    http://tampermonkey.net/
// @description  Fixes some YouTube annoyances.
// @version      1.0
// @author       Naboum
// @match        https://www.youtube.com/*
// @require      https://gist.github.com/raw/2625891/waitForKeyElements.js
// @require      https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js
// @require      https://code.jquery.com/ui/1.12.1/jquery-ui.js
// @require      https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js
// @grant        none
// ==/UserScript==

function cssElement(url) {
    var link = document.createElement("link");
    link.href = url;
    link.rel = "stylesheet";
    link.type = "text/css";
    return link;
}

$(document).ready(function() {
        if(!$('input[type="checkbox"]').prop("checked")){
            alert("Checkbox is not checked.");
            $('input[type="checkbox"]').click();
        }
    var currentState = getFirstState();

    waitForKeyElements ("ytd-guide-entry-renderer#expander-item.style-scope.ytd-guide-collapsible-entry-renderer", clickMore);
    waitForKeyElements ("div#create.style-scope.ytd-comments-header-renderer", manageFirstMargin);
    waitForKeyElements ("#sections > ytd-guide-section-renderer:nth-child(2) > h3", subscribingsListReady);

    // $(".ytp-miniplayer-scrim").click()
    // $(".ytp-miniplayer-button.ytp-button").click()

    $("button.ytp-size-button.ytp-button").click(function() {
        manageMargin(currentState);
        if (currentState === "1") currentState = "0";
        else if (currentState === "0") currentState = "1";
    });

    $("#guide-button").click(function() {
        if ($("app-drawer#guide")[0].hasAttribute("opened")) {
            setTimeout(function() {
                $("#input-subs-autocomplete").focus();
            }, 50);
        }
    });

    $("#endpoint.yt-simple-endpoint.style-scope.ytd-guide-entry-renderer").mouseup(function(e) {
        switch(e.which) {
            case 1: //left click
            case 2: //middle click
                $("#input-subs-autocomplete").val('').trigger('change');
                break;
            case 3: //right Click
                break;
        }
        return false;
    });

    function getFirstState() {
        var firstState = $.cookie("wide");
        if (typeof firstState === "undefined") {
            var buttonText = $("button.ytp-size-button.ytp-button").attr("title");
            if (buttonText === "Mode cinéma") return "0";
            else return "1";
        }
        else return firstState;
        return "undefined";
    }

    function manageFirstMargin() {
        if (currentState === "0") $("div#create.style-scope.ytd-comments-header-renderer").css("margin-right", "0px");
        else if (currentState === "1") $("div#create.style-scope.ytd-comments-header-renderer").css("margin-right", "22px");
    }

    function manageMargin(currentState) {
        if (currentState === "1") $("div#create.style-scope.ytd-comments-header-renderer").css("margin-right", "0px");
        else if (currentState === "0") $("div#create.style-scope.ytd-comments-header-renderer").css("margin-right", "22px");
    }

    function clickMore(jNode) {
        jNode.click();
    }

    function subscribingsListReady(jNode) {
        var html = `
            <class id="input-container">
                <span class="input-icon"></span>
                <input id="input-subs-autocomplete" type="search" placeholder="Search">
            </class>
        `;
        var style = `
            <style>
                /* Autocompletion input */
                #input-subs-autocomplete {
                    background: #444;
                    color: #d7d7d7;
                    border-radius: 5px;
                    border: 0;
                    margin: 2px 0px 10px 24px;
                    padding: 8px 10px 8px 35px;
                    width: 200px; /* or 57 with 200 in :focus */
                    -webkit-transition: all 0.5s ease 0s;
                    -moz-transition: all 0.5s ease 0s;
                    -o-transition: all 0.5s ease 0s;
                    transition: all 0.5s ease 0s;
                }
                #input-subs-autocomplete:focus {
                    outline: none;
                    background:#ccc;
                    color: #6a6f75;
                    /* width: 150px; */
                }
                #input-container {
                    position: relative;
                }
                .input-icon {
                    background: url(https://static.senscritique.com/img/layout/sprite.png?201710121789416) -128px -136px no-repeat;
                    height: 15px;
                    width: 15px;
                    left: 35px;
                    position: absolute;
                    margin-top: 10px;
                }
                .sub-hidden {
                    display: none;
                }
            </style>
        `;

        $("#sections > ytd-guide-section-renderer:nth-child(2) > h3").append(html);
        $("head").append(style);

        var subContainer = $("#sections > ytd-guide-section-renderer:nth-child(2) > #items");
        var subList = {};
        var arr1 = subContainer.children("ytd-guide-entry-renderer");
        var arr2 = subContainer.find("ytd-guide-collapsible-entry-renderer > #expanded > #expandable-items > ytd-guide-entry-renderer:not(:last-child)");
        var arr3 = $.merge(arr1, arr2);

        $.each(arr3, function(key, value) {
            var subName = $(value).find("#endpoint").attr("title");
            subList[subName] = $(value);
        });

        $("#input-subs-autocomplete").on("change paste keyup search", function() {
            var currentInputValue = $(this).val();
            currentInputValue = currentInputValue.normalize('NFD').replace(/[\u0300-\u036f]/g, "").toLowerCase();
            $.each(subList, function(key, value) {
                var sanitizedSubName = key.normalize('NFD').replace(/[\u0300-\u036f]/g, "").toLowerCase();
                var imgParent = $(value).find("yt-img-shadow");
                var imgElement = $(value).find("#img");
                $(value)[sanitizedSubName.indexOf(currentInputValue) > -1 ? 'show' : 'hide' ]();
                if($(value).is(":visible")) {
                    if($(imgParent).hasClass("empty")) {
                        $(imgParent).removeClass("empty");
                    }
                    if($(imgElement).attr("src") == null) {
                        $(imgElement).error(function() {
                            $(imgElement).attr("src", "");
                        }).attr("src", "");
                    }
                }
            });
        });
    }
});