// ==UserScript==
// @name            Youtube Collapse Sidebar
// @version         1.3.7
// @description     collapse youtube sidebar
// @namespace       https://greasyfork.org/users/821661
// @match           https://www.youtube.com/*
// @grant           GM_addStyle
// @grant           GM_setValue
// @grant           GM_getValue
// @grant           GM_registerMenuCommand
// @icon            https://cdn-icons-png.flaticon.com/512/7711/7711100.png
// @author          hdyzen
// @license         MIT
// ==/UserScript==
(function () {
('use strict');
let i = '!important';
let guideP = 'ytd-app[guide-persistent-and-visible]';
let guideM = 'ytd-app[mini-guide-visible]';
let useJS = GM_getValue('useJS', false);
const id = GM_registerMenuCommand(
'Using CSS',
() => {
GM_setValue('useJS', !useJS);
location.reload();
},
{
title: 'Use JS',
},
);
if (useJS) {
GM_registerMenuCommand(
'Using JS',
() => {
GM_setValue('useJS', !useJS);
location.reload();
},
{
title: 'Use CSS',
id: id,
},
);
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if (mutation.type === 'attributes' && mutation.target.hasAttribute('guide-persistent-and-visible')) {
console.log(mutation);
mutation.target.removeAttribute('guide-persistent-and-visible');
mutation.target.setAttribute('mini-guide-visible', '');
mutation.target.querySelector('[opened]').removeAttribute('opened');
observer.disconnect();
}
});
});
observer.observe(document.querySelector('ytd-app'), {
childList: true,
attributes: true,
});
}
if (!useJS) {
let style = GM_addStyle(`
@media only screen and (min-width: 1313px) {
/*== Persist Guide ==*/
${guideP} tp-yt-app-drawer {
display: none ${i};
}
${guideP} tp-yt-app-header {
left: 72px ${i};
}
${guideP} #channel-container {
max-height: 218px ${i};
}
${guideP} ytd-page-manager {
margin-left: var(--ytd-mini-guide-width) ${i};
}
${guideP} ytd-mini-guide-renderer {
display: unset ${i};
}
${guideP} ytd-playlist-header-renderer.ytd-browse {
left: var(--ytd-mini-guide-width) ${i};
}
/*== Mini Guide ==*/
${guideM} tp-yt-app-drawer {
display: unset ${i};
visibility: visible ${i};
}
${guideM} tp-yt-app-header {
left: 240px ${i};
}
${guideM} tp-yt-app-header + #contentContainer  {
padding-top: 485px ${i};
}
${guideM} #channel-container {
max-height: 230px ${i};
}
${guideM} ytd-page-manager {
margin-left: var(--app-drawer-width) ${i};
}
${guideM} ytd-mini-guide-renderer {
display: none ${i};
}
${guideM} #scrim.tp-yt-app-drawer {
opacity: 1 ${i};
}
${guideM} #contentContainer.tp-yt-app-drawer {
transform: translate3d(0, 0, 0) ${i};
}
${guideM} #contentContainer.tp-yt-app-drawer #header.ytd-app {
display: none ${i};
}
${guideM} ytd-playlist-header-renderer.ytd-browse {
left: var(--app-drawer-width) ${i};
}
}
`);
}
})();