XuetangX Keyboard Shortcut

增加学堂在线视频对快捷键的支持。

目前为 2020-08-11 提交的版本,查看 最新版本

  1. // ==UserScript==
  2. // @name XuetangX Keyboard Shortcut
  3. // @namespace https://raineggplant.com/
  4. // @version 0.0.2
  5. // @description 增加学堂在线视频对快捷键的支持。
  6. // @author RainEggplant
  7. // @match *://next.xuetangx.com/*
  8. // @homepageURL https://github.com/RainEggplant/xuetangx-keyboard-shortcut
  9. // ==/UserScript==
  10.  
  11. (function () {
  12. "use strict";
  13. const DEBUG = false;
  14.  
  15. const videoSelector = "video";
  16. const wrapperSelector = "#qa-video-wrap";
  17. const timeStep = 10;
  18.  
  19. const observer = new MutationObserver((mutation) => {
  20. const wrapper = document.querySelector(wrapperSelector);
  21. if (wrapper) {
  22. observer.disconnect();
  23. wrapper.setAttribute("tabindex", "-1");
  24. wrapper.addEventListener("keydown", keyboard_shortcut);
  25. }
  26. });
  27.  
  28. // Start waiting for wrapper element
  29. observer.observe(document.body, {
  30. childList: true,
  31. subtree: true,
  32. attributes: false,
  33. characterData: false,
  34. });
  35.  
  36. function keyboard_shortcut(e) {
  37. if (DEBUG) console.log(e.keyCode);
  38. const video = document.querySelector(videoSelector);
  39. let time;
  40. let volume;
  41. switch (e.keyCode) {
  42. case 32: // Space
  43. e.preventDefault();
  44. if (video.paused) video.play();
  45. else video.pause();
  46. break;
  47. case 37: // Arrow Left
  48. e.preventDefault();
  49. time = video.currentTime - timeStep;
  50. video.currentTime = time > 0 ? time : 0;
  51. break;
  52. case 39: // Arrow Right
  53. e.preventDefault();
  54. time = video.currentTime + timeStep;
  55. video.currentTime = time < video.duration ? time : video.duration;
  56. break;
  57. }
  58. }
  59. })();