Custom Native HTML5 Player with Shortcuts

Custom html5 player with shortcuts and v.redd.it videos with audio

Vieux : v0.5 - 2020-06-15 - Copypasta separate percentage variable is unnecessary here
Nouveau : v0.7 - 2020-07-07 - Unnecessary variable left over from alternative approach

  • --- /tmp/diffy20250923-3612961-yj0gf3 2025-09-23 21:41:49.193884931 +0000
  • +++ /tmp/diffy20250923-3612961-6juxlh 2025-09-23 21:41:49.193884931 +0000
  • @@ -1,7 +1,7 @@
  • -// ==UserScript==//
  • +// ==UserScript==
  • // @name Custom Native HTML5 Player with Shortcuts
  • // @namespace https://gist.github.com/narcolepticinsomniac
  • -// @version 0.5
  • +// @version 0.7
  • // @description Custom html5 player with shortcuts and v.redd.it videos with audio
  • // @author narcolepticinsomniac
  • // @include *
  • @@ -436,12 +436,13 @@
  • v.onloadeddata = () => {
  • const imagusVreddit = /v\.redd\.it/.test(v.src);
  • - if (!hasAudio(v) && !imagusVreddit) {
  • + const vHasAudio = hasAudio(v);
  • + if (!vHasAudio && !imagusVreddit) {
  • v.classList.add('muted');
  • volumeSlider.value = 0;
  • muteButton.classList.add('disabled');
  • volume.classList.add('disabled');
  • - } else if (hasAudio(v) && !imagusVreddit) {
  • + } else if (vHasAudio && !imagusVreddit) {
  • if (v.volume && !v.muted) v.classList.remove('muted');
  • volumeValues();
  • if (volume.classList.contains('disabled')) {
  • @@ -539,7 +540,11 @@
  • if (v.src !== '') {
  • if (/v\.redd\.it/.test(v.src)) {
  • const audioSrc = `${v.src.split('DASH')[0]}audio`;
  • - imagusAudio.src = audioSrc;
  • + fetch(audioSrc)
  • + .then(response => {
  • + imagusAudio.src = response.ok ? audioSrc :
  • + `${v.src.split('DASH')[0]}DASH_audio.mp4`;
  • + }).catch(error => console.log(error));
  • if (!imagusAudio.muted) {
  • muteTillSync = true;
  • imagusAudio.muted = true;
  • @@ -942,10 +947,10 @@
  • function compactControls() {
  • const width = v.clientWidth;
  • - width < 892 ? v.classList.add('compact') : v.classList.remove('compact');
  • - width < 412 ? v.classList.add('compact-2') : v.classList.remove('compact-2');
  • - width < 316 ? v.classList.add('compact-3') : v.classList.remove('compact-3');
  • - width < 246 ? v.classList.add('compact-4') : v.classList.remove('compact-4');
  • + width && width < 892 ? v.classList.add('compact') : v.classList.remove('compact');
  • + width && width < 412 ? v.classList.add('compact-2') : v.classList.remove('compact-2');
  • + width && width < 316 ? v.classList.add('compact-3') : v.classList.remove('compact-3');
  • + width && width < 246 ? v.classList.add('compact-4') : v.classList.remove('compact-4');
  • }
  • function imagusMouseDown(e) {
  • @@ -998,15 +1003,11 @@
  • }
  • function handleKeyDown(e) {
  • - if (e.altKey || e.metaKey) {
  • - return true; // Do not activate
  • - }
  • -
  • + if (e.altKey || e.metaKey) return true; // Do not activate
  • const func = keyFuncs[e.keyCode];
  • if (func) {
  • if ((func.length < 3 && e.shiftKey) ||
  • - (func.length < 4 && e.ctrlKey)) {
  • - return true; // Do not activate
  • - }
  • -
  • + (func.length < 4 && e.ctrlKey)) return true; // Do not activate
  • func(e.target, e.keyCode, e.shiftKey, e.ctrlKey);
  • e.preventDefault();
  • e.stopPropagation();