Skip to content

Instantly share code, notes, and snippets.

@green6erry
Last active October 13, 2019 13:36
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save green6erry/463b2bdc312b7fcf2f788c846c904642 to your computer and use it in GitHub Desktop.
Save green6erry/463b2bdc312b7fcf2f788c846c904642 to your computer and use it in GitHub Desktop.
For anyone using Thinkster.io that wants to be able to pause the video with the spacebar, paste this snippet in your Dev Tools console.
let videoHolder, videoPlayer, videoPlayerContainer, videoOverlay, videoPresent = true;
let setVariables = function() {
try {
videoHolder = document.querySelector('.video-holder');
videoPlayer = videoHolder.querySelector('video');
videoPlayerContainer = videoPlayer.parentElement;
videoOverlay = videoHolder.querySelector('.video-js.vjs-big-play-centered');
} catch(err){
console.log('no video on this page');
videoPresent = false;
}
};
// doesn't need to worry about on load right now,
// because someone pastes this into console (for now)
setVariables();
let isPlaying = function() { return (videoPlayerContainer.classList.contains('vjs-playing')); };
let togglePlay = function () {
if (isPlaying()) { videoPlayer.pause(); }
else { videoPlayer.play(); }
};
let getId = function(el){ return el.getAttribute('data-react-checksum');}
document.addEventListener("keydown", event => {
if ((event.isComposing || event.keyCode === 32) && videoPresent) {
// //stop window from scrolling down
event.preventDefault();
// check if video has changed
if (getId(videoHolder) != getId(document.querySelector('.video-holder'))) setVariables();
//if the video hasn't been started at all, trigger that
if (videoOverlay && videoOverlay.style.display != "none") videoOverlay.click();
// otherwise, use player controls
else if (videoHolder) togglePlay();
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment