☰

YouTube Music Loop Toggle

Adds a checkbox bottom right, once enabled, it'll loop without it stopping

目前为 2024-08-24 提交的版本。查看 最新版本。

  1. // ==UserScript==
  2. // @name         YouTube Music Loop Toggle
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.3
  5. // @description  Adds a checkbox bottom right, once enabled, it'll loop without it stopping
  6. // @author       Emree.el on instagraaammmmmm :D
  7. // @match        https://music.youtube.com/*
  8. // @grant        none
  9. // @run-at       document-end
  10. // @license      MIT
  11. // ==/UserScript==
  12.  
  13. (function() {
  14.     'use strict';
  15.  
  16.     // Create and style the checkbox
  17.     const createCheckbox = () => {
  18.         const checkbox = document.createElement('input');
  19.         checkbox.type = 'checkbox';
  20.         checkbox.style.position = 'fixed';
  21.         checkbox.style.bottom = '100px'; // Further adjusted position
  22.         checkbox.style.right = '20px';
  23.         checkbox.style.zIndex = '1000';
  24.         checkbox.id = 'yt-loop-checkbox';
  25.         return checkbox;
  26.     };
  27.  
  28.     // Load the saved state from local storage
  29.     const loadState = () => {
  30.         const checkbox = document.getElementById('yt-loop-checkbox');
  31.         const savedState = localStorage.getItem('ytLoopState');
  32.         checkbox.checked = savedState === 'true';
  33.         return checkbox.checked;
  34.     };
  35.  
  36.     // Save the state to local storage
  37.     const saveState = (state) => {
  38.         localStorage.setItem('ytLoopState', state);
  39.     };
  40.  
  41.     // Handle the looping logic
  42.     const handleLoop = () => {
  43.         const checkbox = document.getElementById('yt-loop-checkbox');
  44.         const player = document.querySelector('video');
  45.  
  46.         if (player) {
  47.             player.loop = checkbox.checked;
  48.         }
  49.     };
  50.  
  51.     // Initialize script
  52.     const init = () => {
  53.         const checkbox = createCheckbox();
  54.         document.body.appendChild(checkbox);
  55.  
  56.         // Load and apply the saved state
  57.         const isLooping = loadState();
  58.         checkbox.checked = isLooping;
  59.         handleLoop();
  60.  
  61.         // Add event listener to handle checkbox changes
  62.         checkbox.addEventListener('change', (e) => {
  63.             const isChecked = e.target.checked;
  64.             saveState(isChecked);
  65.             handleLoop();
  66.         });
  67.  
  68.         // Observe changes to the video element to apply looping
  69.         const observer = new MutationObserver(() => {
  70.             handleLoop();
  71.         });
  72.  
  73.         observer.observe(document.body, { childList: true, subtree: true });
  74.     };
  75.  
  76.     // Wait for the page to fully load before initializing
  77.     window.addEventListener('load', init);
  78. })();