Youtube Music Video Remover

Removes the annoying video player on youtube music
当前为 2023-08-04 提交的版本，查看最新版本。
换行
// ==UserScript==
// @name         Youtube Music Video Remover
// @namespace    https://greasyfork.org
// @version      0.2
// @description  Removes the annoying video player on youtube music
// @author       Red & one other person
// @match        https://music.youtube.com/watch*
// @match        https://music.youtube.com/*
// @icon         https://music.youtube.com/favicon.ico
// @grant        none
// ==/UserScript==

let watchModActive = false;
let watchModSleepTime = 6000;
let watchModSleepStart = 0;
const watchModClicks = 3;

const backgroundColor = '#300606'
const textColor = '#202020'


let doneNonWatchStyles = false;
let doneWatchStyles = false;
function doNonWatchStyles() {
  if (doneNonWatchStyles) return;
  const element_list_background = document.querySelector("ytmusic-section-list-renderer");
  element_list_background.style.backgroundColor = backgroundColor;
  doneNonWatchStyles = true;
}

function doWatchStyles() {
  if (doneWatchStyles) return;
  doneWatchStyles = true;
}

function reset_watchModSleepStart(additionalTime = 0) {
  watchModSleepStart = Date.now() + additionalTime;
}

function updateWatchElement() {
  let watchElement = document.querySelector(".watch-element");
  let contentInfo = document.querySelector(".content-info-wrapper.ytmusic-player-bar");
  if (!watchElement) return;
  let clickCount = parseInt(watchElement.getAttribute('data-click-count'), 10);
  clickCount = isNaN(clickCount) ? 0 : clickCount;
  if (clickCount >= watchModClicks) return;
  if (!contentInfo) {
    setTimeout(updateWatchElement, 100);
    return;
  }
  watchElement.innerHTML = contentInfo.children[0].innerHTML;
  setTimeout(updateWatchElement, 5000);
}

function checkWatchElement() {
  let watchElement = document.querySelector(".watch-element");

  if (!watchElement) return;

  let currentTime = Date.now();
  let timeElapsed = currentTime - watchModSleepStart;

  if (timeElapsed >= watchModSleepTime) {
    watchElement.style.zIndex = 5;
    watchElement.style.opacity = '1';
    watchElement.setAttribute('data-click-count', '0');
    setTimeout(updateWatchElement, 100)
  } else {
    setTimeout(checkWatchElement, 100);
  }
}

function addWatch() {
  console.log('Adding watch mod...');
  watchModActive = true;
  setTimeout(doWatchStyles(), 100);

  let watchElement = document.createElement('div');
  watchElement.className = 'watch-element';
  watchElement.style.position = 'absolute';
  watchElement.style.top = '0';
  watchElement.style.left = '0';
  watchElement.style.width = '100%';
  watchElement.style.height = '100%';
  watchElement.style.backgroundColor = 'black';
  // Automatically set / reset to 0 depending on state
  // watchElement.style.zIndex = 5;
  watchElement.style.opacity = 0;
  watchElement.style.transition = 'opacity 1s ease';
  watchElement.style.color = textColor;
  watchElement.style.fontSize = 'xx-large';
  watchElement.style.textAlign = 'center';
  watchElement.style.justifyContent = 'center';
  watchElement.style.userSelect = 'none';
  watchElement.style.display = 'flex';
  watchElement.style.flexDirection = 'column';

  document.body.appendChild(watchElement);
  reset_watchModSleepStart(2000);
  // account for youtube music load time here
  setTimeout(checkWatchElement, 2000);

  watchElement.addEventListener('click', (event) => {
    let clickCount = parseInt(watchElement.getAttribute('data-click-count'), 10);
    clickCount = isNaN(clickCount) ? 0 : clickCount;
    clickCount++;
    watchElement.setAttribute('data-click-count', clickCount.toString());

    if (clickCount < watchModClicks)  {
      watchElement.innerHTML = `Press ${watchModClicks - clickCount} times to exit to YouTube Music UI`;
      event.stopPropagation();
    } else if (clickCount === watchModClicks) {
      watchElement.innerHTML = '';
      watchElement.style.opacity = 0;
      reset_watchModSleepStart();

      setTimeout(() => {
        watchElement.style.zIndex = 0;
      }, 1000)

      setTimeout(checkWatchElement, 1000);
    } else {
      reset_watchModSleepStart();
    }
  });
};

function removeWatch() {
  console.log('Removing watch mod...');
  watchModActive = false;
  let watchElement = document.querySelector(".watch-element");
  if (!watchElement) return;
  watchElement.remove();
  setTimeout(doNonWatchStyles(), 100);
}

function checkWatch() {
  if (window.location.pathname.endsWith('watch')) {
    switch (watchModActive) {
      case true:
        break;
      case false:
        addWatch();
        break;
    }
    return true;
  } else {
    switch (watchModActive) {
      case false:
        break;
      case true:
        removeWatch();
        break;
    }
    return false;
  }
}

(function() {
  'use strict';

  const elementToObserve = document.querySelector("#main-panel");
  const observer = new MutationObserver(function() {
    elementToObserve.remove();
  });

  observer.observe(elementToObserve, {subtree: true, childList: true});

  const element_sideBar = document.querySelector(".side-panel.modular.style-scope.ytmusic-player-page");
  element_sideBar.style.width = "100%";
  element_sideBar.style.margin = "0px";
  element_sideBar.style.maxWidth = "none";
  element_sideBar.style.backgroundColor = backgroundColor

  const element_navBar = document.querySelector("ytmusic-nav-bar");
  element_navBar.style.backgroundColor = backgroundColor;

  const element_player_background = document.querySelector("#player-page");
  element_player_background.style.backgroundColor = backgroundColor;

  const element_guide_background = document.querySelector("#guide-renderer");
  element_guide_background.style.backgroundColor = backgroundColor;

  const element_bottomBar = document.querySelector('ytmusic-player-bar');
  element_bottomBar.style.backgroundColor = backgroundColor

  //const element_sidePanel = document.querySelectorAll(".content.style-scope.ytmusic-player-page");
  //element_sidePanel.style.width = "100%";
  //element_sidePanel.style.padding = "0px";

  const watch = checkWatch();

  if (watch) {
    doWatchStyles();
  } else {
    doNonWatchStyles();
  }
})();




setInterval(checkWatch, 500);