☰

YouTube Volumer

Add minor adjustment volume editor to youtube. Change with Enter.

  1. // ==UserScript==
  2. // @name         YouTube Volumer
  3. // @namespace    me.nzws.us.yt_volumer
  4. // @version      1.0.0
  5. // @description  Add minor adjustment volume editor to youtube. Change with Enter.
  6. // @author       nzws
  7. // @match        https://www.youtube.com/*
  8. // @match        https://youtube.com/*
  9. // @grant        none
  10. // ==/UserScript==
  11.  
  12. function watcher() {
  13.     const video = document.querySelector('video');
  14.     const container = document.querySelector('#container.ytd-video-primary-info-renderer');
  15.     const volumer = document.getElementById('me_nzws_us_yt_volumer');
  16.     if (!container || volumer) return;
  17.  
  18.     const element = document.createElement('div');
  19.     element.id = 'me_nzws_us_yt_volumer';
  20.     element.style.marginBottom = '10px';
  21.  
  22.     const input = document.createElement('input');
  23.     input.type = 'number';
  24.     input.value = parseInt(video.volume * 100 * 10) / 10;
  25.     input.addEventListener('keypress', e => {
  26.         if (e.keyCode === 13) {
  27.             onChange(input.value);
  28.         }
  29.     });
  30.  
  31.     input.placeholder = 'Volume (0 ~ 100) / Change with Enter';
  32.     input.title = 'Volume (0 ~ 100) / Change with Enter';
  33.     input.style.width = '250px';
  34.     input.style.maxWidth = '100%';
  35.  
  36.     element.appendChild(input);
  37.  
  38.     container.insertBefore(element, container.firstChild);
  39. }
  40.  
  41. function onChange(value) {
  42.     const video = document.querySelector('video');
  43.     const volume = parseInt(value * 10) / 10 * 0.01;
  44.  
  45.     video.volume = volume;
  46. }
  47.  
  48. (function() {
  49.     setInterval(watcher, 1000);
  50. })();