[youtube.com] Arrow buttons constant binding

The arrow buttons don't depend on slider/seekbar focus. Left/Right - always playback, Down/Up - always sound volume.

目前為 2019-12-20 提交的版本,檢視 最新版本

  1. // ==UserScript==
  2. // @name [youtube.com] Arrow buttons constant binding
  3. // @name:ru [youtube.com] Неизменные действия для клавиш стрелок
  4. // @description The arrow buttons don't depend on slider/seekbar focus. Left/Right - always playback, Down/Up - always sound volume.
  5. // @description:ru Клавиши стрелок не зависят от фокуса ползунков. Влево/Вправо - всегда перемотка, Вниз/Вверх - всегда громкость.
  6. // @namespace youtube.com/arrows.constant.binding
  7. // @author Zaytsev Artem
  8. // @version 0.0.1.3
  9. // @match https://*.youtube.com/*
  10. // ==/UserScript==
  11.  
  12. /*
  13. document.addEventListener('focusin', (event) => {
  14. console.log("GM-youtube-novf: Focusin: " + event.target.className);
  15. });
  16. */
  17.  
  18. //Sound volume panel.
  19. //console.log("GM-youtube-novf: Quering the .ytp-volume-panel...");
  20. //var q_vp = document.querySelector(".ytp-volume-panel");
  21. var q_vp = document.getElementsByClassName("ytp-volume-panel")[0];
  22. if (q_vp) {
  23. q_vp.addEventListener('focus', (event) => {
  24. //console.log("GM-youtube-novf: .ytp-volume-panel tried to get focus.");
  25. //event.target.focusout();
  26. //event.target.blur();
  27. //document.querySelector(".html5-video-player").focus({preventScroll:true});
  28. document.getElementsByClassName("html5-video-player")[0].focus({preventScroll:true});
  29. });
  30. console.log("GM-youtube-novf: .ytp-volume-panel element found.");
  31. window.setTimeout(function(){
  32. //console.log("GM-youtube-novf: Setting .ytp-volume-panel's tabindex to -1...");
  33. q_vp.setAttribute("tabindex", "-1");
  34. }, 3000)
  35. }
  36.  
  37. //Somehow the slider also wants to get the focus although it doesn't have a tabindex set.
  38. //var q_vsh = document.querySelector(".ytp-volume-slider-handle");
  39. var q_vsh = document.getElementsByClassName("ytp-volume-slider-handle")[0];
  40. if (q_vsh) {
  41. q_vsh.addEventListener('focus', (event) => {
  42. //console.log("GM-youtube-novf: .ytp-volume-slider-handle tried to get focus.");
  43. //document.querySelector(".html5-video-player").focus({preventScroll:true});
  44. document.getElementsByClassName("html5-video-player")[0].focus({preventScroll:true});
  45. });
  46. window.setTimeout(function(){
  47. //console.log("GM-youtube-novf: Setting .ytp-volume-slider-handle's tabindex to -1...");
  48. q_vsh.setAttribute("tabindex", "-1");
  49. }, 3000)
  50. }
  51.  
  52. //The player playback seekbar.
  53. //var q_pb = document.querySelector(".ytp-progress-bar");
  54. var q_pb = document.getElementsByClassName("ytp-progress-bar")[0];
  55. if (q_pb) {
  56. q_pb.addEventListener('focus', (event) => {
  57. //console.log("GM-youtube-novf: .ytp-progress-bar tried to get focus.");
  58. //document.querySelector(".html5-video-player").focus({preventScroll:true});
  59. document.getElementsByClassName("html5-video-player")[0].focus({preventScroll:true});
  60. });
  61. window.setTimeout(function(){
  62. //console.log("GM-youtube-novf: Setting .ytp-progress-bar's tabindex to -1...");
  63. q_pb.setAttribute("tabindex", "-1");
  64. }, 3000)
  65. }