YouTube Classic

Lightweight YouTube for Old PCs.

Tendrás que instalar una extensión para tu navegador como Tampermonkey, Greasemonkey o Violentmonkey si quieres utilizar este script.

You will need to install an extension such as Tampermonkey to install this script.

Tendrás que instalar una extensión como Tampermonkey o Violentmonkey para instalar este script.

Necesitarás instalar una extensión como Tampermonkey o Userscripts para instalar este script.

Tendrás que instalar una extensión como Tampermonkey antes de poder instalar este script.

Necesitarás instalar una extensión para administrar scripts de usuario si quieres instalar este script.

(Ya tengo un administrador de scripts de usuario, déjame instalarlo)

Advertisement:

Tendrás que instalar una extensión como Stylus antes de poder instalar este script.

Tendrás que instalar una extensión como Stylus antes de poder instalar este script.

Tendrás que instalar una extensión como Stylus antes de poder instalar este script.

Para poder instalar esto tendrás que instalar primero una extensión de estilos de usuario.

Para poder instalar esto tendrás que instalar primero una extensión de estilos de usuario.

Para poder instalar esto tendrás que instalar primero una extensión de estilos de usuario.

(Ya tengo un administrador de estilos de usuario, déjame instalarlo)

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');
})();