// ==UserScript==
// @name         YouTube Normal Thumbnails
// @namespace    http://greasyfork.org
// @version      0.5.4
// @description  Restores normal thumbnails size
// @author       NeoCortex
// @match        *://www.youtube.com/*
// @run-at       document-end
// @grant        none
// @downloadURL none
// ==/UserScript==

(function() {
    var storage = {
        oldValue: -1,
        target: document.querySelector('ytd-rich-grid-renderer'),
        detectTarget: function () {
            storage.target = document.querySelector('ytd-rich-grid-renderer');
            return storage.target;
        },
        observerConfig: {
            attributes: true,
            childList: false,
            subtree: false
        },
        styleFixer: () => {
            try {
                let prop = '--ytd-rich-grid-items-per-row',
                    perRow = +storage.target.style.getPropertyValue(prop);

                if (storage.oldValue == -1 || storage.oldValue == perRow) {
                    storage.oldValue = perRow;
                    perRow += 1;
                    storage.target.style.setProperty(prop, perRow);
                }
            } catch (e) {
                    console.warn(`[YouTube Normal Thumbnails] Cannot update thumbnails count: ${e}`)
            }
        },
        observerCallback: function (mutationsList, observer) {
            for (let mutation of mutationsList) {
                if (mutation.attributeName == 'style') {
                    storage.observer.disconnect();
                    storage.styleFixer();
                    storage.observer.observe(storage.target, storage.observerConfig);
                }
            }
        },
        installObserver: function () {
            storage.observer = new MutationObserver(storage.observerCallback);
            storage.observer.observe(storage.target, storage.observerConfig);

            var s = document.createElement('style');
            s.innerHTML = `
            ytd-rich-grid-video-renderer[mini-mode] #video-title.ytd-rich-grid-video-renderer {
			    font-size: 1.4rem;
			    font-weight: 500;
			    line-height: 1.6rem;
			}

			#avatar-link.ytd-rich-grid-video-renderer {
			    display: none !important;
			}
            `.trim();
            document.body.appendChild(s);
        }
    };

    if (storage.target == null) {
        var contentObserver = new MutationObserver((mutationsList, observer) => {
            for (let mutation of mutationsList) {
                mutation.addedNodes.forEach((node) => {
                    if (node.tagName == "YTD-RICH-GRID-RENDERER") {
                        contentObserver.disconnect();
                        storage.target = node;
                        storage.styleFixer();
                        storage.installObserver();
                    }
                });
            }
        });
        contentObserver.observe(document.getElementById('content'), {
            attributes: false,
            childList: true,
            subtree: true
        });
    } else {
        storage.styleFixer();
        storage.installObserver();
    }
})();