☰

YouTube Defaulter

Set default speed, quality, subtitles and volume globally or per channel

  1. // ==UserScript==
  2. // @name         YouTube Defaulter
  3. // @namespace    https://greasyfork.org/ru/users/901750-gooseob
  4. // @version      1.13.0
  5. // @description  Set default speed, quality, subtitles and volume globally or per channel
  6. // @author       GooseOb
  7. // @license      MIT
  8. // @match        https://www.youtube.com/*
  9. // @icon         https://www.google.com/s2/favicons?sz=64&domain=youtube.com
  10. // ==/UserScript==
  11.  
  12. (function(){// src/config/update.ts
  13. var update = (cfg) => {
  14.   let isUpdated = true;
  15.   switch (cfg._v) {
  16.     case 4:
  17.       if ("shortsToUsual" in cfg.flags) {
  18.         cfg.flags.shortsToRegular = cfg.flags.shortsToUsual;
  19.         delete cfg.flags.shortsToUsual;
  20.       } else {
  21.         isUpdated = false;
  22.       }
  23.       break;
  24.     case 2:
  25.       cfg.flags.standardMusicSpeed = false;
  26.       cfg._v = 3;
  27.     case 3:
  28.       cfg.global.quality = cfg.global.qualityMax;
  29.       delete cfg.global.qualityMax;
  30.       for (const key in cfg.channels) {
  31.         const currCfg = cfg.channels[key];
  32.         currCfg.quality = currCfg.qualityMax;
  33.         delete currCfg.qualityMax;
  34.       }
  35.       cfg._v = 4;
  36.   }
  37.   return isUpdated;
  38. };
  39. // src/config/value.ts
  40. var cfgLocalStorage = localStorage.YTDefaulter;
  41. var value = cfgLocalStorage ? JSON.parse(cfgLocalStorage) : {
  42.   _v: 4,
  43.   global: {},
  44.   channels: {},
  45.   flags: {
  46.     shortsToRegular: false,
  47.     newTab: false,
  48.     copySubs: false,
  49.     standardMusicSpeed: false,
  50.     enhancedBitrate: false
  51.   }
  52. };
  53.  
  54. // src/config/save.ts
  55. var saveLS = (newCfg) => {
  56.   saveLSRaw(JSON.stringify(newCfg));
  57. };
  58. var saveLSRaw = (raw) => {
  59.   localStorage.YTDefaulter = raw;
  60. };
  61. var save = (raw) => {
  62.   const newCfg = JSON.parse(raw);
  63.   if (typeof newCfg !== "object" || !newCfg._v) {
  64.     throw new Error("Invalid data");
  65.   }
  66.   if (update(newCfg)) {
  67.     saveLS(newCfg);
  68.   } else {
  69.     saveLSRaw(raw);
  70.   }
  71.   Object.assign(value, newCfg);
  72. };
  73. // src/config/prune.ts
  74. var prune = () => {
  75.   outer:
  76.     for (const key in value.channels) {
  77.       const channelCfg = value.channels[key];
  78.       if (channelCfg.subtitles)
  79.         continue;
  80.       for (const cfgKey in channelCfg) {
  81.         if (cfgKey !== "subtitles")
  82.           continue outer;
  83.       }
  84.       delete value.channels[key];
  85.     }
  86. };
  87. // src/utils/ref.ts
  88. var ref = (val) => ({ val });
  89.  
  90. // src/config/current-channel.ts
  91. var username = ref("");
  92. var channel = () => value.channels[username.val] ||= {};
  93. // src/listeners/click.ts
  94. var onClick = (e) => {
  95.   const { shortsToRegular, newTab } = value.flags;
  96.   if (shortsToRegular || newTab) {
  97.     let el = e.target;
  98.     if (el.tagName !== "A") {
  99.       el = el.closest("a");
  100.     }
  101.     if (el) {
  102.       const isShorts = el.href.includes("/shorts/");
  103.       if (shortsToRegular && isShorts) {
  104.         el.href = el.href.replace("shorts/", "watch?v=");
  105.       }
  106.       const isNormal = el.href.includes("/watch?v=");
  107.       if (newTab && (isShorts || isNormal)) {
  108.         el.target = "_blank";
  109.         e.stopPropagation();
  110.       }
  111.     }
  112.   }
  113. };
  114. // src/utils/$.ts
  115. var $ = (id) => document.getElementById(id);
  116. // src/utils/debounce.ts
  117. var debounce = (callback, delay) => {
  118.   let timeout;
  119.   return (...args) => {
  120.     clearTimeout(timeout);
  121.     timeout = window.setTimeout(() => {
  122.       callback(...args);
  123.     }, delay);
  124.   };
  125. };
  126. // src/utils/is-descendant-or-the-same.ts
  127. var isDescendantOrTheSame = (child, parents) => {
  128.   while (child !== null) {
  129.     if (parents.includes(child))
  130.       return true;
  131.     child = child.parentNode;
  132.   }
  133.   return false;
  134. };
  135. // src/utils/restore-focus-after.ts
  136. var restoreFocusAfter = (cb) => {
  137.   const el = document.activeElement;
  138.   cb();
  139.   el.focus();
  140. };
  141. // src/utils/until.ts
  142. var until = (getItem, check, timeout = 1e4, interval = 20) => new Promise((res, rej) => {
  143.   let item = getItem();
  144.   if (check(item))
  145.     return res(item);
  146.   const limit = timeout / interval;
  147.   let i = 0;
  148.   const id = setInterval(() => {
  149.     item = getItem();
  150.     if (check(item)) {
  151.       clearInterval(id);
  152.       res(item);
  153.     } else if (++i > limit) {
  154.       clearInterval(id);
  155.       rej(new Error(`Timeout: item ${getItem.name} wasn't found`));
  156.     }
  157.   }, interval);
  158. });
  159. var untilAppear = (getItem, msToWait) => until(getItem, Boolean, msToWait);
  160. // src/utils/find-in-node-list.ts
  161. var findInNodeList = (list, predicate) => {
  162.   for (const item of list) {
  163.     if (predicate(item))
  164.       return item;
  165.   }
  166.   return null;
  167. };
  168. // src/utils/get-el-creator.ts
  169. var getElCreator = (tag) => (props) => Object.assign(document.createElement(tag), props);
  170. // src/utils/delay.ts
  171. var delay = (ms) => new Promise((res) => setTimeout(res, ms));
  172. // src/element-getters.ts
  173. var plr = () => $("movie_player");
  174. var aboveTheFold = () => $("above-the-fold");
  175. var actionsBar = () => $("actions")?.querySelector("ytd-menu-renderer");
  176. var getPlrGetter = (plr2) => (selector) => () => plr2.querySelector(selector);
  177. var plrGetters = (plr2) => {
  178.   const get = getPlrGetter(plr2);
  179.   return {
  180.     ad: get(".ytp-ad-player-overlay"),
  181.     video: get(".html5-main-video"),
  182.     subtitlesBtn: get(".ytp-subtitles-button"),
  183.     muteBtn: get(".ytp-mute-button"),
  184.     menu: {
  185.       element: get(".ytp-settings-menu"),
  186.       btn: get(".ytp-settings-button")
  187.     }
  188.   };
  189. };
  190. var plrMenuItemsGetter = (menu) => () => menu.querySelectorAll('.ytp-menuitem[role="menuitem"]');
  191. var menuSubItems = (item) => item.querySelectorAll(".ytp-menuitem-label");
  192. var channelUsernameElementGetter = (aboveTheFold2) => () => aboveTheFold2.querySelector(".ytd-channel-name > a");
  193. var artistChannelBadge = (aboveTheFold2) => aboveTheFold2.querySelector(".badge-style-type-verified-artist");
  194. var videoPlr = () => document.querySelector(".html5-video-player");
  195. var videoPlrCaptions = (plr2) => plr2.querySelectorAll(".captions-text > span");
  196. var popupContainer = () => document.querySelector("ytd-popup-container");
  197.  
  198. // src/player/menu.ts
  199. var set = (getEl) => {
  200.   element ||= getEl.menu.element();
  201.   btn ||= getEl.menu.btn();
  202. };
  203. var element = null;
  204. var btn = null;
  205. var clickBtn = () => {
  206.   btn.click();
  207. };
  208. var isOpen = () => {
  209.   return element.style.display !== "none";
  210. };
  211. var setOpen = (bool) => {
  212.   if (bool !== isOpen())
  213.     btn.click();
  214. };
  215. var openItem = (item) => {
  216.   setOpen(true);
  217.   item.click();
  218.   return menuSubItems(element);
  219. };
  220. var settingItems = {
  221.   speed: null,
  222.   quality: null
  223. };
  224. var setSettingItems = (items) => {
  225.   const findIcon = (d) => findInNodeList(items, (el) => !!el.querySelector(`path[d="${d}"]`));
  226.   settingItems.speed = findIcon("M10,8v8l6-4L10,8L10,8z M6.3,5L5.7,4.2C7.2,3,9,2.2,11,2l0.1,1C9.3,3.2,7.7,3.9,6.3,5z            M5,6.3L4.2,5.7C3,7.2,2.2,9,2,11 l1,.1C3.2,9.3,3.9,7.7,5,6.3z            M5,17.7c-1.1-1.4-1.8-3.1-2-4.8L2,13c0.2,2,1,3.8,2.2,5.4L5,17.7z            M11.1,21c-1.8-0.2-3.4-0.9-4.8-2 l-0.6,.8C7.2,21,9,21.8,11,22L11.1,21z            M22,12c0-5.2-3.9-9.4-9-10l-0.1,1c4.6,.5,8.1,4.3,8.1,9s-3.5,8.5-8.1,9l0.1,1 C18.2,21.5,22,17.2,22,12z");
  227.   settingItems.quality = findIcon("M15,17h6v1h-6V17z M11,17H3v1h8v2h1v-2v-1v-2h-1V17z M14,8h1V6V5V3h-1v2H3v1h11V8z            M18,5v1h3V5H18z M6,14h1v-2v-1V9H6v2H3v1 h3V14z M10,12h11v-1H10V12z");
  228. };
  229. var findInItem = (name) => untilAppear(() => settingItems[name]).then((item) => (predicate) => {
  230.   const oldSubItems = new Set(menuSubItems(element));
  231.   return findInNodeList(openItem(item), (subItem) => !oldSubItems.has(subItem) && predicate(subItem));
  232. });
  233.  
  234. // src/player/plr.ts
  235. var setPlr = async (el) => {
  236.   const getEl = plrGetters(el);
  237.   await delay(1000);
  238.   await until(getEl.ad, (ad) => !ad, 200000);
  239.   video ||= getEl.video();
  240.   subtitlesBtn ||= getEl.subtitlesBtn();
  241.   muteBtn ||= getEl.muteBtn();
  242.   set(getEl);
  243.   restoreFocusAfter(clickBtn);
  244.   await delay(50);
  245.   restoreFocusAfter(clickBtn);
  246.   setSettingItems(await until(plrMenuItemsGetter(element), (arr) => !!arr.length));
  247.   if (!speedNormal)
  248.     findInItem("speed").then((findInSpeed) => {
  249.       restoreFocusAfter(() => {
  250.         speedNormal = findInSpeed((btn2) => !+btn2.textContent).textContent;
  251.       });
  252.     });
  253. };
  254. var isSpeed = (value3) => video.playbackRate === value3;
  255. var speedNormal = "";
  256. var video = null;
  257. var subtitlesBtn = null;
  258. var muteBtn = null;
  259. // src/logger.ts
  260. var err = (...msgs) => {
  261.   console.error("[YT-Defaulter]", ...msgs);
  262. };
  263. var outOfRange = (what) => {
  264.   err(what, "value is out of range");
  265. };
  266.  
  267. // src/player/value-setters.ts
  268. var comparators = {
  269.   quality: (target, current) => +target >= Number.parseInt(current) && (value.flags.enhancedBitrate || !current.toLowerCase().includes("premium")),
  270.   speed: (target, current) => target === current
  271. };
  272. var setYT = (settingName) => async (value3) => {
  273.   const isOpen2 = isOpen();
  274.   const compare = comparators[settingName];
  275.   const btn2 = (await findInItem(settingName))((btn3) => compare(value3, btn3.textContent));
  276.   if (btn2) {
  277.     btn2.click();
  278.   }
  279.   setOpen(isOpen2);
  280. };
  281. var valueSetters = {
  282.   speed: (value3) => {
  283.     setYT("speed")(isSpeed(+value3) ? speedNormal : value3);
  284.   },
  285.   customSpeed: (value3) => {
  286.     try {
  287.       video.playbackRate = isSpeed(+value3) ? 1 : +value3;
  288.     } catch {
  289.       outOfRange("Custom speed");
  290.     }
  291.   },
  292.   subtitles: (value3) => {
  293.     if (subtitlesBtn.ariaPressed !== value3.toString())
  294.       subtitlesBtn.click();
  295.   },
  296.   volume: (value3) => {
  297.     const num = +value3;
  298.     const isMuted = muteBtn.dataset.titleNoTooltip !== "Mute";
  299.     if (num === 0) {
  300.       if (!isMuted)
  301.         muteBtn.click();
  302.     } else {
  303.       if (isMuted)
  304.         muteBtn.click();
  305.       try {
  306.         video.volume = num / 100;
  307.       } catch {
  308.         outOfRange("Volume");
  309.       }
  310.     }
  311.   },
  312.   quality: setYT("quality")
  313. };
  314. // src/player/apply-settings.ts
  315. var applySettings = (settings) => {
  316.   if (!Number.isNaN(+settings.customSpeed)) {
  317.     valueSetters.customSpeed(settings.customSpeed);
  318.   }
  319.   delete settings.customSpeed;
  320.   restoreFocusAfter(() => {
  321.     for (const setting in settings) {
  322.       valueSetters[setting](settings[setting]);
  323.     }
  324.     setOpen(false);
  325.   });
  326. };
  327. // src/compute-settings.ts
  328. var computeSettings = (doUseNormalSpeed) => {
  329.   const channel2 = channel();
  330.   const settings = {
  331.     ...value.global,
  332.     ...channel2
  333.   };
  334.   if (doUseNormalSpeed) {
  335.     settings.speed = speedNormal;
  336.     delete settings.customSpeed;
  337.   } else if ("customSpeed" in channel2) {
  338.     delete settings.speed;
  339.   } else if ("speed" in channel2) {
  340.     delete settings.customSpeed;
  341.   } else if ("customSpeed" in settings) {
  342.     delete settings.speed;
  343.   }
  344.   return settings;
  345. };
  346.  
  347. // src/listeners/keyup.ts
  348. var onKeyup = (e) => {
  349.   if (e.code === "Enter") {
  350.     onClick(e);
  351.   } else if (e.ctrlKey && !e.shiftKey) {
  352.     if (value.flags.copySubs && e.code === "KeyC") {
  353.       const plr3 = videoPlr();
  354.       if (plr3?.classList.contains("ytp-fullscreen")) {
  355.         const text = Array.from(videoPlrCaptions(plr3), (line) => line.textContent).join(" ");
  356.         navigator.clipboard.writeText(text);
  357.       }
  358.     } else if (e.code === "Space") {
  359.       e.stopPropagation();
  360.       e.preventDefault();
  361.       const settings = computeSettings(false);
  362.       if (settings.speed) {
  363.         restoreFocusAfter(() => {
  364.           valueSetters.speed(settings.speed);
  365.         });
  366.       } else if (settings.customSpeed) {
  367.         valueSetters.customSpeed(settings.customSpeed);
  368.       }
  369.     }
  370.   }
  371. };
  372. // src/text.ts
  373. var translations = {
  374.   "be-BY": {
  375.     OPEN_SETTINGS: "Адкрыць дадатковыя налады",
  376.     SUBTITLES: "Субтытры",
  377.     SPEED: "Хуткасьць",
  378.     CUSTOM_SPEED: "Свая Хуткасьць",
  379.     CUSTOM_SPEED_HINT: 'Калі вызначана, будзе выкарыстоўвацца замест "Хуткасьць"',
  380.     QUALITY: "Якасьць",
  381.     VOLUME: "Гучнасьць, %",
  382.     GLOBAL: "Глябальна",
  383.     LOCAL: "Гэты Канал",
  384.     SHORTS: "Адкрываць shorts як звычайныя",
  385.     NEW_TAB: "Адкрываць відэа ў новай картцы",
  386.     COPY_SUBS: "Капіяваць субтытры ў поўнаэкранным, Ctrl+C",
  387.     STANDARD_MUSIC_SPEED: "Звычайная хуткасьць на каналах музыкаў",
  388.     ENHANCED_BITRATE: "Палепшаны бітрэйт (для карыстальнікаў Premium)",
  389.     SAVE: "Захаваць",
  390.     EXPORT: "Экспарт",
  391.     IMPORT: "Імпарт"
  392.   }
  393. };
  394. var text = {
  395.   OPEN_SETTINGS: "Open additional settings",
  396.   SUBTITLES: "Subtitles",
  397.   SPEED: "Speed",
  398.   CUSTOM_SPEED: "Custom Speed",
  399.   CUSTOM_SPEED_HINT: 'If defined, will be used instead of "Speed"',
  400.   QUALITY: "Quality",
  401.   VOLUME: "Volume, %",
  402.   GLOBAL: "Global",
  403.   LOCAL: "This Channel",
  404.   SHORTS: "Open shorts as regular videos",
  405.   NEW_TAB: "Open videos in new tab",
  406.   COPY_SUBS: "Copy subtitles by Ctrl+C in fullscreen mode",
  407.   STANDARD_MUSIC_SPEED: "Normal speed on artist channels",
  408.   ENHANCED_BITRATE: "Quality: Enhanced bitrate (for Premium users)",
  409.   SAVE: "Save",
  410.   DEFAULT: "-",
  411.   EXPORT: "Export",
  412.   IMPORT: "Import"
  413. };
  414.  
  415. // src/menu/controls.ts
  416. var updateValuesIn = (controls, cfgPart) => {
  417.   controls.speed.value = cfgPart.speed || text.DEFAULT;
  418.   controls.customSpeed.value = cfgPart.customSpeed || "";
  419.   controls.quality.value = cfgPart.quality || text.DEFAULT;
  420.   controls.volume.value = cfgPart.volume || "";
  421.   controls.subtitles.checked = cfgPart.subtitles || false;
  422. };
  423. var channelControls = () => ({
  424.   speed: null,
  425.   customSpeed: null,
  426.   quality: null,
  427.   volume: null,
  428.   subtitles: null
  429. });
  430. var sections = {
  431.   global: channelControls(),
  432.   thisChannel: channelControls()
  433. };
  434. var flags = {
  435.   shortsToRegular: {
  436.     elem: null,
  437.     id: "shorts",
  438.     text: text.SHORTS
  439.   },
  440.   newTab: {
  441.     elem: null,
  442.     id: "new-tab",
  443.     text: text.NEW_TAB
  444.   },
  445.   copySubs: {
  446.     elem: null,
  447.     id: "copy-subs",
  448.     text: text.COPY_SUBS
  449.   },
  450.   standardMusicSpeed: {
  451.     elem: null,
  452.     id: "standard-music-speed",
  453.     text: text.STANDARD_MUSIC_SPEED
  454.   },
  455.   enhancedBitrate: {
  456.     elem: null,
  457.     id: "enhanced-bitrate",
  458.     text: text.ENHANCED_BITRATE
  459.   }
  460. };
  461. var updateThisChannel = () => {
  462.   updateValuesIn(sections.thisChannel, channel());
  463. };
  464. var updateValues = (cfg) => {
  465.   updateValuesIn(sections.global, cfg.global);
  466.   updateThisChannel();
  467.   for (const key in cfg.flags) {
  468.     const flag = flags[key];
  469.     if (flag) {
  470.       flag.elem.checked = cfg.flags[key];
  471.     } else {
  472.       err("Unknown flag:", key);
  473.     }
  474.   }
  475. };
  476. // src/utils/with.ts
  477. var withHint = (hint, getItem) => [getItem(hint).item, hint.element];
  478. var withOnClick = (elem, listener) => {
  479.   elem.addEventListener("click", listener);
  480.   return elem;
  481. };
  482. var withListeners = (elem, listeners) => {
  483.   for (const key in listeners) {
  484.     elem.addEventListener(key, listeners[key]);
  485.   }
  486.   return elem;
  487. };
  488. var controlWith = (withFn) => (obj, ...args) => {
  489.   withFn(obj.elem, ...args);
  490.   return obj;
  491. };
  492. var withControlListeners = controlWith(withListeners);
  493.  
  494. // src/utils/element-creators.ts
  495. var div = getElCreator("div");
  496. var input = getElCreator("input");
  497. var checkbox = (props) => input({ type: "checkbox", ...props });
  498. var option = getElCreator("option");
  499. var _label = getElCreator("label");
  500. var labelEl = (forId, props) => {
  501.   const elem = _label(props);
  502.   elem.setAttribute("for", forId);
  503.   return elem;
  504. };
  505. var selectEl = getElCreator("select");
  506. var btnClass = "yt-spec-button-shape-next";
  507. var btnClassFocused = btnClass + "--focused";
  508. var _button = getElCreator("button");
  509. var button = (textContent, props) => withListeners(_button({
  510.   textContent,
  511.   className: `${btnClass} ${btnClass}--tonal ${btnClass}--mono ${btnClass}--size-m`,
  512.   ...props
  513. }), {
  514.   focus() {
  515.     this.classList.add(btnClassFocused);
  516.   },
  517.   blur() {
  518.     this.classList.remove(btnClassFocused);
  519.   }
  520. });
  521.  
  522. // src/hint.ts
  523. class Hint {
  524.   constructor(prefix) {
  525.     this.element = div();
  526.     this.element.className ||= "YTDef-setting-hint";
  527.     this.prefix = prefix;
  528.     this.hide();
  529.   }
  530.   hide() {
  531.     this.element.style.display = "none";
  532.   }
  533.   show(msg) {
  534.     this.element.style.display = "block";
  535.     this.element.textContent = this.prefix + msg;
  536.   }
  537.   prefix;
  538.   element;
  539. }
  540.  
  541. // src/menu/get-controls-creators.ts
  542. var getControlCreators = (getCreator) => ({
  543.   numericInput: getCreator((props) => input({ type: "number", ...props }), (elem) => ({
  544.     get: () => elem.value,
  545.     set: (value3) => {
  546.       elem.value = value3;
  547.     },
  548.     default: ""
  549.   })),
  550.   checkbox: getCreator(checkbox, (elem) => ({
  551.     get: () => elem.checked.toString(),
  552.     set: (value3) => {
  553.       elem.checked = value3 === "true";
  554.     },
  555.     default: text.DEFAULT
  556.   })),
  557.   select: getCreator(({
  558.     values,
  559.     getText
  560.   }) => {
  561.     const elem = selectEl({ value: text.DEFAULT });
  562.     elem.append(option({
  563.       value: text.DEFAULT,
  564.       textContent: text.DEFAULT
  565.     }), ...values.map((value3) => option({
  566.       value: value3,
  567.       textContent: getText(value3)
  568.     })));
  569.     return elem;
  570.   }, (elem) => ({
  571.     get: () => elem.value,
  572.     set: (value3) => {
  573.       elem.value = value3;
  574.     },
  575.     default: "false"
  576.   }))
  577. });
  578.  
  579. // src/menu/validate-volume.ts
  580. var validateVolume = (value3) => {
  581.   const num = +value3;
  582.   return num < 0 || num > 100 ? "out of range" : Number.isNaN(num) ? "not a number" : null;
  583. };
  584.  
  585. // src/menu/close.ts
  586. var close = () => {
  587.   element2.style.visibility = "hidden";
  588.   stopListening();
  589. };
  590. var listenForClose = () => {
  591.   document.addEventListener("click", onClick2);
  592.   document.addEventListener("keyup", onKeyUp);
  593. };
  594. var stopListening = () => {
  595.   document.removeEventListener("click", onClick2);
  596.   document.removeEventListener("keyup", onKeyUp);
  597. };
  598. var onClick2 = (e) => {
  599.   const el = e.target;
  600.   if (!isDescendantOrTheSame(el, [element2, btn2]))
  601.     close();
  602. };
  603. var onKeyUp = (e) => {
  604.   if (e.code === "Escape") {
  605.     close();
  606.     btn2.focus();
  607.   }
  608. };
  609.  
  610. // src/menu/value.ts
  611. var set2 = (el, btnEl) => {
  612.   element2 = el;
  613.   btn2 = btnEl;
  614. };
  615. var element2 = null;
  616. var btn2 = null;
  617. var isOpen2 = false;
  618. var menuWidth = 0;
  619. var adjustWidth = () => {
  620.   menuWidth = element2.getBoundingClientRect().width;
  621. };
  622. var firstFocusable = ref(null);
  623. var toggle = debounce(() => {
  624.   isOpen2 = !isOpen2;
  625.   if (isOpen2) {
  626.     fixPosition();
  627.     element2.style.visibility = "visible";
  628.     listenForClose();
  629.     firstFocusable.val.focus();
  630.   } else {
  631.     close();
  632.   }
  633. }, 100);
  634. var fixPosition = () => {
  635.   const { y, height, width, left } = btn2.getBoundingClientRect();
  636.   element2.style.top = y + height + 8 + "px";
  637.   element2.style.left = left + width - menuWidth + "px";
  638. };
  639.  
  640. // src/menu/section.ts
  641. var section = (sectionId, title, sectionCfg) => {
  642.   const control = getControlCreators((createElement, initVal) => (name, label, props) => {
  643.     const item = div();
  644.     const id = "YTDef-" + name + "-" + sectionId;
  645.     const elem = Object.assign(createElement(props), props, {
  646.       id,
  647.       name
  648.     });
  649.     elem.addEventListener("change", () => {
  650.       const value3 = val.get();
  651.       if (value3 === val.default) {
  652.         delete sectionCfg[name];
  653.       } else {
  654.         sectionCfg[name] = value3;
  655.       }
  656.     });
  657.     const val = initVal(elem);
  658.     const cfgValue = sectionCfg[name];
  659.     if (cfgValue) {
  660.       setTimeout(() => {
  661.         val.set(cfgValue.toString());
  662.       });
  663.     }
  664.     item.append(labelEl(id, { textContent: label }), elem);
  665.     sections[sectionId][name] = elem;
  666.     return { item, elem };
  667.   });
  668.   const speedSelect = control.select("speed", text.SPEED, {
  669.     values: ["2", "1.75", "1.5", "1.25", speedNormal, "0.75", "0.5", "0.25"],
  670.     getText: (val) => val
  671.   });
  672.   if (sectionId === "global")
  673.     firstFocusable.val = speedSelect.elem;
  674.   const sectionElement = div({ role: "group" });
  675.   sectionElement.setAttribute("aria-labelledby", sectionId);
  676.   sectionElement.append(getElCreator("span")({ textContent: title, id: sectionId }), speedSelect.item, ...withHint(new Hint(""), (hint) => withControlListeners(control.numericInput("customSpeed", text.CUSTOM_SPEED), {
  677.     blur: () => {
  678.       hint.hide();
  679.     },
  680.     focus: () => {
  681.       hint.show(text.CUSTOM_SPEED_HINT);
  682.     }
  683.   })), control.select("quality", text.QUALITY, {
  684.     values: [
  685.       "144",
  686.       "240",
  687.       "360",
  688.       "480",
  689.       "720",
  690.       "1080",
  691.       "1440",
  692.       "2160",
  693.       "4320"
  694.     ],
  695.     getText: (val) => val + "p"
  696.   }).item, ...withHint(new Hint("Warning: "), (hint) => withControlListeners(control.numericInput("volume", text.VOLUME, {
  697.     min: "0",
  698.     max: "100"
  699.   }), {
  700.     blur() {
  701.       const warning = validateVolume(this.value);
  702.       if (warning) {
  703.         hint.show(warning);
  704.       } else {
  705.         hint.hide();
  706.       }
  707.     }
  708.   })), control.checkbox("subtitles", text.SUBTITLES, checkbox()).item);
  709.   return sectionElement;
  710. };
  711.  
  712. // src/menu/settings-icon.ts
  713. var settingsIcon = () => {
  714.   const element3 = document.createElementNS("http://www.w3.org/2000/svg", "svg");
  715.   for (const [prop, value3] of [
  716.     ["viewBox", "0 0 24 24"],
  717.     ["width", "24"],
  718.     ["height", "24"],
  719.     ["fill", "var(--yt-spec-text-primary)"]
  720.   ]) {
  721.     element3.setAttribute(prop, value3);
  722.   }
  723.   element3.append($("settings"));
  724.   return element3;
  725. };
  726.  
  727. // src/menu/init.ts
  728. var init = () => {
  729.   const sections2 = div({ className: "YTDef-" + "sections" });
  730.   sections2.append(section("global", text.GLOBAL, value.global), section("thisChannel", text.LOCAL, channel()));
  731.   const controlStatus = div();
  732.   const updateControlStatus = (content) => {
  733.     controlStatus.textContent = `[${new Date().toLocaleTimeString()}] ${content}`;
  734.   };
  735.   const controlDiv = div({ className: "control-cont" });
  736.   controlDiv.append(withOnClick(button(text.SAVE), () => {
  737.     prune();
  738.     saveLS(value);
  739.     updateControlStatus(text.SAVE);
  740.   }), withOnClick(button(text.EXPORT), () => {
  741.     navigator.clipboard.writeText(localStorage.YTDefaulter).then(() => {
  742.       updateControlStatus(text.EXPORT);
  743.     });
  744.   }), withOnClick(button(text.IMPORT), () => {
  745.     navigator.clipboard.readText().then((raw) => {
  746.       save(raw);
  747.       updateValues(value);
  748.       return text.IMPORT;
  749.     }).catch((e) => text.IMPORT + ": " + e.message).then(updateControlStatus);
  750.   }));
  751.   set2(div({
  752.     id: "YTDef-menu"
  753.   }), withOnClick(button("", {
  754.     id: "YTDef-btn",
  755.     ariaLabel: text.OPEN_SETTINGS,
  756.     tabIndex: 0
  757.   }), toggle));
  758.   btn2.setAttribute("aria-controls", "YTDef-menu");
  759.   btn2.classList.add(btnClass + "--icon-button");
  760.   btn2.append(settingsIcon());
  761.   element2.append(sections2, ...Object.entries(flags).map(([flagName, flag]) => {
  762.     const cont = div({ className: "check-cont" });
  763.     const id = "YTDef-" + flag.id;
  764.     const elem = withOnClick(checkbox({
  765.       id,
  766.       checked: value.flags[flagName]
  767.     }), function() {
  768.       value.flags[flagName] = this.checked;
  769.     });
  770.     flag.elem = elem;
  771.     cont.append(labelEl(id, { textContent: flag.text }), elem);
  772.     return cont;
  773.   }), controlDiv, controlStatus);
  774.   element2.addEventListener("keyup", (e) => {
  775.     const el = e.target;
  776.     if (e.code === "Enter" && el.type === "checkbox")
  777.       el.checked = !el.checked;
  778.   });
  779.   untilAppear(actionsBar).then((actionsBar2) => {
  780.     actionsBar2.insertBefore(btn2, actionsBar2.lastChild);
  781.     popupContainer().append(element2);
  782.     adjustWidth();
  783.     sections2.style.maxWidth = sections2.offsetWidth + "px";
  784.   });
  785.   const listener = () => {
  786.     if (isOpen2)
  787.       fixPosition();
  788.   };
  789.   window.addEventListener("scroll", listener);
  790.   window.addEventListener("resize", listener);
  791. };
  792. // src/listeners/video-page.ts
  793. var onVideoPage = async () => {
  794.   const aboveTheFold2 = await untilAppear(aboveTheFold);
  795.   username.val = (await untilAppear(channelUsernameElementGetter(aboveTheFold2))).href || "";
  796.   untilAppear(plr).then(setPlr).then(() => {
  797.     const doNotChangeSpeed = value.flags.standardMusicSpeed && !!artistChannelBadge(aboveTheFold2);
  798.     applySettings(computeSettings(doNotChangeSpeed));
  799.     if (!element2) {
  800.       init();
  801.     }
  802.   });
  803.   if (element2) {
  804.     updateThisChannel();
  805.   }
  806. };
  807. // src/style.ts
  808. var m = "#" + "YTDef-menu";
  809. var d = " div";
  810. var i = " input";
  811. var s = " select";
  812. var bg = "var(--yt-spec-menu-background)";
  813. var underline = "border-bottom: 2px solid var(--yt-spec-text-primary);";
  814. var style = getElCreator("style")({
  815.   textContent: `
  816. #${"YTDef-btn"} {position: relative; margin-left: 8px}
  817. ${m} {
  818. display: flex;
  819. visibility: hidden;
  820. color: var(--yt-spec-text-primary);
  821. font-size: 14px;
  822. flex-direction: column;
  823. position: fixed;
  824. background: ${bg};
  825. border-radius: 2rem;
  826. padding: 1rem;
  827. text-align: center;
  828. box-shadow: 0px 4px 32px 0px var(--yt-spec-static-overlay-background-light);
  829. z-index: 2202
  830. }
  831. .control-cont > button {margin: .2rem}
  832. ${m + d} {display: flex; margin-bottom: 1rem}
  833. ${m + d + d} {
  834. flex-direction: column;
  835. margin: 0 2rem
  836. }
  837. ${m + d + d + d} {
  838. flex-direction: row;
  839. margin: 1rem 0
  840. }
  841. ${m + s}, ${m + i} {
  842. text-align: center;
  843. background: ${bg};
  844. border: none;
  845. ${underline}
  846. color: inherit;
  847. width: 5rem;
  848. padding: 0;
  849. margin-left: auto
  850. }
  851. ${m} .${"YTDef-setting-hint"} {margin: 0; text-align: end}
  852. ${m + i} {outline: none}
  853. ${m + d + d + d}:focus-within > label, ${m} .check-cont:focus-within > label {${underline}}
  854. ${m} .check-cont {padding: 0 1rem}
  855. ${m + s} {appearance: none; outline: none}
  856. ${m} label {margin-right: 1.5rem; white-space: nowrap}
  857. ${m + i}::-webkit-outer-spin-button,
  858. ${m + i}::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0}
  859. ${m + i}[type=number] {-moz-appearance: textfield}
  860. ${m + s}::-ms-expand {display: none}`
  861. });
  862.  
  863. // src/index.ts
  864. Object.assign(text, translations[document.documentElement.lang]);
  865. if (update(value)) {
  866.   saveLS(value);
  867. }
  868. window.addEventListener("yt-navigate-finish", ({ detail: { pageType } }) => {
  869.   if (pageType === "watch" || pageType === "live") {
  870.     setTimeout(onVideoPage, 1000);
  871.   }
  872. });
  873. document.addEventListener("click", onClick, { capture: true });
  874. document.addEventListener("keyup", onKeyup, { capture: true });
  875. document.head.append(style);
  876. })()