Global Video Shortcuts Userscript

global-video-shortcuts-userscript.js

// ==UserScript==
// @name        Global Video Shortcuts
// @namespace   Violentmonkey Scripts
// @match       *://*/*
// @grant       none
// @version     1.0
// @author      -
// @description lets you step through videos on any site using youtube's keyboard shortcut design
// ==/UserScript==

let video = null;
let videoID = window.location.pathname;
const printDoc = ()=>console.info(`Video found by Global Video Shortcuts Userscript! Enablements:
  1. Position Memory (localStorage[${videoID}])
  2. User Controls:
    * left arrow - back 5 secs
    * right arrow - right 5 secs
    * spacebar - pause/play`);

function keyDownHandler(event) {
  if (!event) return;
  
  if (['INPUT', 'SELECT'].includes(event.target.tagName)) {
    return;
  }
   
  if (event.key === 'ArrowRight') {
    event.stopImmediatePropagation()
    video.currentTime = video.currentTime+5;
  } else if (event.key === 'ArrowLeft') {    
    event.stopImmediatePropagation()
    video.currentTime = video.currentTime-5;
  } else if (event.key === ' ') {    
    event.preventDefault();
    event.stopImmediatePropagation()
    video.paused ? video.play() : video.pause();
  }
}

window.addEventListener('load', (event) => {
  video = document.querySelector('video');
  if (video) {
    printDoc();
    
    document.addEventListener('keydown', keyDownHandler, true);

    document.addEventListener('timeupdate', ()=>{
        localStorage[videoID] = String(video.currentTime);
    }, true);

    let savedTime = localStorage[videoID];
    if (savedTime) {
      video.currentTime = parseInt(savedTime);
      video.play();
    }
  }
});