Detox from Media

youtube-quotes.user.js

// ==UserScript==
// @name         YouTube Quote
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Replaces document body with a random quote from ZenQuotes API on YouTube pages
// @author       Nobody
// @match        *://www.youtube.com/*
// @grant        none
// @run-at       document-start
// ==/UserScript==

(function () {
  "use strict";

  // Create DOM elements for the quote instead of using innerHTML
  function createQuoteElements(quote, author) {
    // Create section
    const section = document.createElement('section');
    section.style.display = 'flex';
    section.style.width = '100%';
    section.style.height = '100vh';
    section.style.backgroundColor = '#fff1dc';
    section.style.flexDirection = 'column';
    section.style.alignItems = 'center';
    section.style.justifyContent = 'center';

    // Create container div
    const div = document.createElement('div');
    div.style.display = 'flex';
    div.style.maxWidth = '640px';
    div.style.width = '100%';
    div.style.flexDirection = 'column';
    div.style.gap = '24px';

    // Create quote paragraph
    const quoteParagraph = document.createElement('p');
    quoteParagraph.style.fontSize = '40px';
    quoteParagraph.style.margin = '0';
    quoteParagraph.style.fontStyle = 'italic';
    quoteParagraph.style.fontFamily = 'serif';
    quoteParagraph.textContent = '"' + quote + '"';


    // Create author paragraph
    const authorParagraph = document.createElement('p');
    authorParagraph.style.fontSize = '24px';
    authorParagraph.style.margin = '0';
    authorParagraph.style.fontStyle = 'normal';
    authorParagraph.style.fontFamily = 'serif';
    authorParagraph.textContent = author;

    // Assemble the elements
    div.appendChild(quoteParagraph);
    div.appendChild(authorParagraph);
    section.appendChild(div);

    return section;
  }

  // Function to clear and set up the document
  function setupDocument() {
    // Clear the document
    while (document.documentElement.firstChild) {
      document.documentElement.removeChild(document.documentElement.firstChild);
    }

    // Create new head and body
    const head = document.createElement('head');
    const title = document.createElement('title');
    title.textContent = 'Quote';

    const style = document.createElement('style');
    style.textContent = `
      body, html {
        margin: 0;
        padding: 0;
        height: 100%;
        width: 100%;
      }
    `;

    head.appendChild(title);
    head.appendChild(style);

    const body = document.createElement('body');

    // Add to document
    document.documentElement.appendChild(head);
    document.documentElement.appendChild(body);

    return body;
  }

  // Function to set a default quote
  function setDefaultQuote() {
    const body = setupDocument();
    const quoteElement = createQuoteElements(
      "Even the finest sword plunged into salt water will eventually rust.",
      "Sun Tzu"
    );
    body.appendChild(quoteElement);
  }

  // Use a CORS proxy to fetch the quote
  async function fetchQuoteWithProxy() {
    try {
      // Using a public CORS proxy service
      const proxyUrl = 'https://corsproxy.io/?';
      const targetUrl = 'https://zenquotes.io/api/random/';

      const response = await fetch(proxyUrl + encodeURIComponent(targetUrl));
      const data = await response.json();

      const quote = data[0].q;
      const author = data[0].a;

      const body = setupDocument();
      const quoteElement = createQuoteElements(quote, author);
      body.appendChild(quoteElement);
    } catch (error) {
      console.error("Error fetching quote:", error);
      setDefaultQuote();
    }
  }

  // Try to replace the content when DOM is ready
  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', fetchQuoteWithProxy);
  } else {
    fetchQuoteWithProxy();
  }

  // Also try after a short delay to ensure it works with YouTube's dynamic loading
  setTimeout(fetchQuoteWithProxy, 1000);
})();