YouTube Classic

Lightweight YouTube for Old PCs.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey, Greasemonkey alebo Violentmonkey.

Na inštaláciu tohto skriptu je potrebné nainštalovať rozšírenie, ako napríklad Tampermonkey.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey, % alebo Violentmonkey.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey alebo Userscripts.

Na inštaláciu tohto skriptu je potrebné nainštalovať rozšírenie, ako napríklad Tampermonkey.

Na inštaláciu tohto skriptu je potrebné nainštalovať rozšírenie správcu používateľských skriptov.

(Už mám správcu používateľských skriptov, nechajte ma ho nainštalovať!)

Advertisement:

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie, ako napríklad Stylus.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie, ako napríklad Stylus.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie, ako napríklad Stylus.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie správcu používateľských štýlov.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie správcu používateľských štýlov.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie správcu používateľských štýlov.

(Už mám správcu používateľských štýlov, nechajte ma ho nainštalovať!)

Advertisement:

// ==UserScript==
// @name         YouTube Classic
// @namespace    Violentmonkey Scripts
// @version      1.0
// @description  Lightweight YouTube for Old PCs.
// @author       smoochie
// @match        https://www.youtube.com/*
// @match        https://youtube.com/*
// @grant        GM_getValue
// @grant        GM_setValue
// @run-at       document-start
// @license      MIT
// ==/UserScript==

(function () {
  'use strict';

  const _isTypeSupported = MediaSource.isTypeSupported.bind(MediaSource);
  MediaSource.isTypeSupported = function (type) {
    if (/vp9|vp09|av01|av1/i.test(type)) return false;
    return _isTypeSupported(type);
  };

  const CSS = `

    ytd-topbar-logo-renderer, a#logo { display: none !important; }


    ytd-searchbox { border: none !important; box-shadow: none !important; }
    ytd-searchbox input#search,
    ytd-searchbox #search-input input {
      background: #fff !important; color: #111 !important;
      border: 1px solid #aaa !important; border-right: none !important;
      border-radius: 0 !important; box-shadow: inset 0 1px 2px rgba(0,0,0,.12) !important;
    }
    ytd-searchbox input#search::placeholder { color: #888 !important; }
    ytd-searchbox #search-icon-legacy, #search-icon-legacy button {
      border: 1px solid #aaa !important; border-left: none !important;
      border-radius: 0 !important; box-shadow: none !important;
    }


    #guide-inner-content, ytd-guide-renderer #items, tp-yt-app-drawer #contentContainer {border-right: 1px solid #dedede !important;}
    ytd-guide-entry-renderer { border-radius: 0 !important; }
    ytd-guide-entry-renderer[active] yt-formatted-string {color: #C62828 !important;}


    ytd-rich-grid-renderer {
      --ytd-rich-grid-items-per-row: 4 !important;
      --ytd-rich-grid-slim-items-per-row: 4 !important;
      --ytd-rich-grid-posts-per-row: 4 !important;
    }
    ytd-rich-grid-renderer > #contents > ytd-rich-item-renderer {
      width: calc(25% - 16px) !important;
      max-width: calc(25% - 16px) !important;
      min-width: 0 !important;
    }


    ytd-rich-item-renderer, ytd-video-renderer,
    ytd-compact-video-renderer, ytd-rich-grid-media {
      border: none !important;
      box-shadow: none !important; transition: none !important; animation: none !important;
    }
    ytd-rich-item-renderer { margin: 4px 2px !important; }


    #video-title, a#video-title, h3 a#video-title,
    ytd-rich-grid-media #video-title, ytd-video-renderer #video-title,
    ytd-compact-video-renderer #video-title {
      color: #1155cc !important; font-weight: bold !important;
      font-size: 13px !important; text-decoration: none !important;
    }
    #video-title:hover { color: #cc0000 !important; text-decoration: underline !important; }


    #metadata-line span, ytd-video-meta-block, .ytd-video-meta-block,
    #metadata, ytd-rich-item-renderer ytd-video-meta-block {
      color: #666 !important; font-size: 11px !important;
    }


    ytd-channel-name a, #channel-name a, .ytd-channel-name a {
      color: #C62828 !important; text-decoration: none !important;
    }
    ytd-channel-name a:hover { color: #cc0000 !important; }


    h1.ytd-watch-metadata, ytd-watch-metadata h1 yt-formatted-string {
      font-size: 18px !important; font-weight: bold !important; color: #0f0f0f !important;
    }


    like-button-view-model button, dislike-button-view-model button,
    segmented-like-dislike-button-view-model button {
      border-radius: 0 !important;
    }


    #subscribe-button button, ytd-subscribe-button-renderer button {
      background: #cc0000 !important; color: #fff !important;
      border: none !important; border-radius: 0 !important;
      font-weight: bold !important; font-size: 13px !important; padding: 6px 14px !important;
    }
    #subscribe-button button:hover,
    ytd-subscribe-button-renderer button:hover { background: #aa0000 !important; }


    ytd-text-inline-expander, #description-inner,
    ytd-expandable-video-description-body-renderer {
      padding: 10px !important;
      font-size: 13px !important; border-radius: 0 !important;
    }


    ytd-compact-video-renderer {
      border-bottom: 1px solid #eee !important;
    }


    ytd-thumbnail-overlay-time-status-renderer span {
      background: rgba(0,0,0,.82) !important; color: #fff !important;
      font-size: 11px !important; border-radius: 0 !important;
    }


    ytd-comment-thread-renderer {
      border-bottom: 1px solid #eee !important;
    }
    ytd-comment-renderer #author-text a {
      color: #1155cc !important; font-weight: bold !important;
    }
    ytd-comment-renderer #content-text { color: #333 !important; font-size: 13px !important; }
    #comments { display: none !important; }


    #ytc-show-comments {
      display: block; margin: 12px 0 0;
      padding: 7px 16px; background: #f0f0f0; color: #333;
      border: 1px solid #ccc; border-radius: 0;
      font: 12px Arial, sans-serif; cursor: pointer;
    }
    #ytc-show-comments:hover { background: #e0e0e0; border-color: #999; }


    ytd-app *:not([class^="ytp-"]):not([class*=" ytp-"]) { border-radius: 0 !important; }


    .ytp-chrome-controls, .ytp-gradient-bottom, .ytp-gradient-top,
    .ytp-tooltip, .ytp-popup, .ytp-settings-menu, .ytp-panel,
    .ytp-ce-element, .ytp-button, .ytp-progress-bar-container,
    .ytp-volume-panel, .ytp-time-display, .ytp-menuitem,
    .ytp-cards-button, .ytp-subtitles-button, .ytp-settings-button,
    .ytp-miniplayer-button, .ytp-size-button,
    .ytp-play-button, .ytp-mute-button {
      border-radius: 12px !important;
    }


    #movie_player, .html5-video-player, .html5-main-video, video {
      border-radius: 0 !important;
    }


    ytd-reel-shelf-renderer, ytd-rich-shelf-renderer[is-shorts],
    ytd-shorts, [page-subtype="shorts"],
    ytd-guide-entry-renderer:has(a[href="/shorts"]),
    ytd-mini-guide-entry-renderer:has(a[href="/shorts"]),
    ytd-pivot-bar-item-renderer:has(a[href="/shorts"]),
    tp-yt-paper-tab:has(a[href="/shorts"]),
    ytd-rich-section-renderer:has(ytd-reel-shelf-renderer),
    ytd-rich-item-renderer:has(a[href*="/shorts/"]),
    ytd-video-renderer:has(a[href*="/shorts/"]),
    ytd-compact-video-renderer:has(a[href*="/shorts/"]),
    #endpoint[href="/shorts"],
    .ytp-ambilight-container, .ytp-ambilight, .ytp-ambilight-col,
    #cinematics, ytd-cinematics, ytd-cinematic-container,
    #chat, ytd-live-chat-frame, yt-live-chat-app, #chat-container,
    ytd-backstage-post-thread-renderer, ytd-backstage-post-renderer,
    ytd-rich-section-renderer:has(ytd-backstage-post-renderer),
    #sponsor-button, #super-thanks-button, ytd-merch-shelf-renderer,
    ytd-creator-heart-button-renderer,
    yt-button-shape[aria-label*="Sponsor"],
    yt-button-shape[aria-label*="Join"],
    yt-button-shape[aria-label*="Thanks"],
    yt-button-shape[aria-label*="Спонсор"],
    yt-button-shape[aria-label*="подяк"],
    ytd-video-preview, ytd-video-preview-loader, #preview, .ytd-video-preview,
    #mouseover-overlay, animated-thumbnail-overlay-view-model,
    .ytd-thumbnail-overlay-loading-preview-renderer,
    .ytp-inline-preview-ui,
    yt-chip-cloud-chip-renderer, ytd-feed-filter-chip-bar-renderer,
    ytd-guide-entry-renderer a[href="/feed/explore"],
    ytd-guide-entry-renderer a[href*="premium"],
    ytd-guide-entry-renderer a[href*="youtubepremium"],
    ytd-guide-entry-renderer a[title*="Music"],
    ytd-mini-guide-entry-renderer a[href="/feed/explore"],
    ytd-ghost-card-renderer, .ytd-ghost-card-renderer,
    yt-formatted-string emoji-span { display: none !important; }

    ytd-menu-popup-renderer tp-yt-paper-item { border-radius: 0 !important; }
  `;

  const style = document.createElement('style');
  style.textContent = CSS;
  const insertStyle = () => (document.head || document.documentElement).appendChild(style);
  document.head ? insertStyle() : document.addEventListener('DOMContentLoaded', insertStyle, { once: true });

  const REMOVE_SEL = [
    'ytd-reel-shelf-renderer', 'ytd-shorts', '[page-subtype="shorts"]',
    'ytd-rich-section-renderer:has(ytd-reel-shelf-renderer)',
    'ytd-rich-item-renderer:has(a[href*="/shorts/"])',
    'ytd-video-renderer:has(a[href*="/shorts/"])',
    'ytd-guide-entry-renderer:has(a[href="/shorts"])',
    'ytd-mini-guide-entry-renderer:has(a[href="/shorts"])',
    'ytd-pivot-bar-item-renderer:has(a[href="/shorts"])',
    'ytd-pivot-bar-item-renderer:has(a[href="/feed/you"])',
    'ytd-guide-entry-renderer:has(a[href="/feed/you"])',
    '#chat', 'ytd-live-chat-frame',
    '.ytp-ambilight-container', '#cinematics', 'ytd-cinematics',
    'ytd-backstage-post-thread-renderer', 'ytd-video-preview',
    '#sponsor-button', '#super-thanks-button',
  ].join(',');

  const hide = el => el.style.setProperty('display', 'none', 'important');

  let removeTimer = null;
  let commentsVisible = false;
  let commentBtnInjected = false;
  let feedLimitActive = false;

  function tick() {
    try { document.querySelectorAll(REMOVE_SEL).forEach(hide); } catch (_) {}
    disableAmbient();
    injectCommentBtn();
    enforceGrid();
    cleanSidebar();
    limitFeed();
  }

  const schedTick = () => { clearTimeout(removeTimer); removeTimer = setTimeout(tick, 200); };

  document.addEventListener('DOMContentLoaded', () => {
    new MutationObserver(schedTick).observe(document.body, { childList: true, subtree: true });
    tick();
  });

  function disableAmbient() {
    try {
      const p = document.getElementById('movie_player');
      if (p && typeof p.setAmbientMode === 'function') p.setAmbientMode(false);
    } catch (_) {}
    try {
      if (window.yt?.config_) {
        window.yt.config_['AMBIENT_MODE_ENABLED'] = false;
        window.yt.config_['CINEMATIC_ENABLED'] = false;
      }
    } catch (_) {}
  }


  function injectCommentBtn() {
    if (commentBtnInjected || !location.pathname.startsWith('/watch')) return;
    const comments = document.getElementById('comments');
    if (!comments || document.getElementById('ytc-show-comments')) return;
    const btn = document.createElement('button');
    btn.id = 'ytc-show-comments';
    btn.textContent = '▼ Show comments';
    btn.onclick = () => {
      commentsVisible = true;
      comments.style.setProperty('display', 'block', 'important');
      btn.remove();
    };
    comments.before(btn);
    commentBtnInjected = true;
  }


  function enforceGrid() {
    const grid = document.querySelector('ytd-rich-grid-renderer');
    if (!grid) return;
    grid.style.setProperty('--ytd-rich-grid-items-per-row', '4', 'important');
    grid.style.setProperty('--ytd-rich-grid-slim-items-per-row', '4', 'important');
    try { if (grid.hasAttribute('is-slim-media')) grid.removeAttribute('is-slim-media'); } catch (_) {}
  }


  const KEEP_HREFS = new Set(['/', '/feed/subscriptions', '/feed/library', '/feed/history']);

  function cleanSidebar() {
    document.querySelectorAll('ytd-guide-renderer ytd-guide-entry-renderer, ytd-guide-renderer ytd-guide-section-renderer').forEach(el => {
      if (el.tagName.toLowerCase() === 'ytd-guide-section-renderer') {
        if (!Array.from(el.querySelectorAll('a')).some(a => KEEP_HREFS.has(a.getAttribute('href')))) hide(el);
        return;
      }
      const href = el.querySelector('a')?.getAttribute('href') || '';
      if (KEEP_HREFS.has(href) || /^\/@|^\/channel\/|^\/user\//i.test(href)) return;
      const title = el.closest('ytd-guide-section-renderer')
        ?.querySelector('#guide-section-title, #section-title')?.textContent || '';
      if (/підписк|subscript/i.test(title)) return;
      hide(el);
    });

    document.querySelectorAll('ytd-mini-guide-renderer ytd-mini-guide-entry-renderer').forEach(el => {
      const href = el.querySelector('a')?.getAttribute('href') || '';
      if (!KEEP_HREFS.has(href)) hide(el);
    });
  }


  const MAX_ITEMS = 60;

  function limitFeed() {
    if (feedLimitActive) return;
    if (!location.pathname.startsWith('/') && !location.pathname.startsWith('/feed')) return;
    const grid = document.querySelector('ytd-rich-grid-renderer');
    if (!grid || grid.querySelectorAll('ytd-rich-item-renderer').length < MAX_ITEMS) return;
    feedLimitActive = true;
    grid.querySelectorAll('ytd-continuation-item-renderer').forEach(hide);
    if (document.getElementById('ytc-load-more')) return;
    const btn = document.createElement('button');
    btn.id = 'ytc-load-more';
    btn.textContent = '↓ Load more videos';
    Object.assign(btn.style, {
      display: 'block', margin: '20px auto', padding: '8px 24px',
      background: '#f0f0f0', color: '#333', border: '1px solid #ccc',
      borderRadius: '0', font: '13px Arial,sans-serif', cursor: 'pointer',
    });
    btn.onclick = () => {
      grid.querySelectorAll('ytd-continuation-item-renderer').forEach(el => el.style.removeProperty('display'));
      feedLimitActive = false;
      btn.remove();
    };
    grid.after(btn);
  }


  document.addEventListener('mouseover', e => {
    const thumb = e.target.closest('ytd-thumbnail');
    if (!thumb) return;
    const video = thumb.querySelector('video');
    if (video) { video.pause(); video.src = ''; video.load(); }

  }, true);


  window.addEventListener('yt-navigate-start', () => {
    commentBtnInjected = false;
    commentsVisible = false;
    feedLimitActive = false;
    document.getElementById('ytc-load-more')?.remove();
    document.getElementById('ytc-show-comments')?.remove();
  });

  window.addEventListener('yt-page-data-updated', schedTick);

  console.log('Youtube Classic Works');
})();