☰

m.YouTube.com quality change buttons

Adds quality change buttons below the video (144p, 240p, 360p, 480p, 720p, 1080p)

目前為 2023-10-12 提交的版本，檢視 最新版本。

  1. // ==UserScript==
  2. // @name         m.YouTube.com quality change buttons
  3. // @namespace    m-youtube-com-quality-change-buttons
  4. // @version      1.2
  5. // @description  Adds quality change buttons below the video (144p, 240p, 360p, 480p, 720p, 1080p)
  6. // @author       hlorand.hu
  7. // @match        https://m.youtube.com/*
  8. // @icon         https://www.google.com/s2/favicons?sz=64&domain=tampermonkey.net
  9. // @grant        none
  10. // @license      https://creativecommons.org/licenses/by-nc-sa/4.0/
  11. // ==/UserScript==
  12.  
  13. // Screenshot: https://ibb.co/pyXQd4C
  14.  
  15. (function() {
  16.     //'use strict';
  17.  
  18.     function addbuttons(){
  19.         document.getElementById("qualitybuttons").innerHTML = "";
  20.  
  21.         var player = document.getElementById('movie_player');
  22.  
  23.         const qualities = ["tiny","small","medium","large","hd720","hd1080"];
  24.  
  25.         qualities.forEach((quality)=>{
  26.  
  27.             let button = document.createElement('button');
  28.             button.setAttribute("quality", quality);
  29.             let text = "";
  30.             switch( quality ){
  31.                 case 'tiny': text = '144p'; break;
  32.                 case 'small': text = '240p'; break;
  33.                 case 'medium': text = '360p'; break;
  34.                 case 'large': text = '480p'; break;
  35.                 case 'hd720': text = '720p'; break;
  36.                 case 'hd1080': text = '1080p'; break;
  37.             }
  38.             button.textContent = text;
  39.             button.className = "qualitybutton";
  40.  
  41.             button.style.margin = "5px";
  42.             button.style.padding = "5px";
  43.             button.style.backgroundColor = "green";
  44.             button.style.position = "relative";
  45.  
  46.             button.onclick = function() {
  47.                 player.setPlaybackQualityRange( this.getAttribute("quality") );
  48.  
  49.                 document.querySelectorAll(".qualitybutton").forEach((btn)=>{
  50.                     btn.style.backgroundColor = "green";
  51.                 });
  52.                 this.style.backgroundColor = "darkorange";
  53.             };
  54.  
  55.             let div = document.querySelector('.related-chips-slot-wrapper');
  56.             div.insertBefore(button, div.firstChild);
  57.  
  58.         }); // end qualities foreach
  59.  
  60.     } // end addbuttons
  61.  
  62.     window.addEventListener('load', function () {
  63.         setInterval(()=>{
  64.             if( document.getElementById("qualitybuttons") == undefined ){
  65.                 let parent = document.querySelector('.related-chips-slot-wrapper');
  66.                 let wrapper = document.createElement('div');
  67.                 wrapper.setAttribute("id","qualitybuttons");
  68.                 parent.insertBefore(wrapper, parent.firstChild);
  69.                 addbuttons();
  70.             }
  71.         }, 1000);
  72.     }); // end addEventListener
  73.  
  74. })();