youtube_playlist_cleaner.user.js

// ==UserScript==
// @name         youtube playlist cleaner
// @namespace    http://tampermonkey.net/
// @version      0.2
// @description  add a filter button to filter out watched videos
// @author       GlacJAY <[email protected]>
// @match        https://www.youtube.com/playlist?list=*
// @grant        none
// ==/UserScript==

(function() {
  'use strict';

  const sleep = async function(ms) {
    await new Promise(resolve => setTimeout(resolve, ms));
  };

  const button = document.createElement('button');
  button.innerHTML = 'filter';
  button.style.cssText = 'position: fixed; bottom: 20px; right: 20px;';
  document.body.appendChild(button);

  button.addEventListener('click', async function() {
    const listElement = document.querySelector('ytd-playlist-video-list-renderer');
    const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
    window.scrollTo(0, listElement.scrollHeight);
    await sleep(500);
    window.scrollTo(0, scrollTop);
    await sleep(500);

    try {
      const listSelector = 'div#contents.ytd-playlist-video-list-renderer';
      const contentsElement = document.querySelector(listSelector);
      const childNodes = [...contentsElement.childNodes];
      const indices = childNodes.map((_, i) => i + 1);
      for (const index of indices.reverse()) {
        const element = childNodes[index - 1];
        const progress = document.querySelector(`${listSelector} :nth-child(${index}) div#progress`);
        if (progress && progress.style.width === '100%') {
          contentsElement.removeChild(element);
          continue;
        }
        const linkElement = document.querySelector(`${listSelector} :nth-child(${index}) a.ytd-playlist-video-renderer`);
        if (linkElement) {
          linkElement.href = linkElement.href.replace(/&.*$/, '');
          linkElement.target = '_blank';
        }
      }
    } catch (error) {
      console.warn('error:', error);
    }
  });
})();