Last active
December 31, 2017 05:47
-
-
Save bmwalters/e22ac991618e2123d7b05dc7e559259e to your computer and use it in GitHub Desktop.
Re-enable the context menu on videos in the Vimeo embedded player
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// ==UserScript== | |
// @name Vimeo Embed Playback Rate Control | |
// @namespace zerf | |
// @match *://player.vimeo.com/* | |
// @grant none | |
// @run-at document-end | |
// ==/UserScript== | |
const log = (...args) => console.log("[ZERFVIMEO]", ...args) | |
const tryToAddSpeedButtonToMenu = function() { | |
const menu = document.querySelector(".vp-menubar .vp-menu") | |
if (!menu) { | |
setTimeout(tryToAddSpeedButtonToMenu, 500) | |
return | |
} | |
// add speed button to gear menu | |
const btn = document.createElement("p") | |
btn.innerText = "⚡" | |
btn.addEventListener("click", () => { | |
if (menu.classList.contains("vp-menu-invisible")) { return } | |
let speed = prompt("enter new playback speed") | |
if (speed && Number(speed)) { | |
document.querySelector("video").playbackRate = speed | |
} | |
}) | |
btn.style.fontSize = "16pt" | |
btn.style.width = "100%" | |
btn.style.textAlign = "center" | |
btn.style.margin = "0" | |
menu.querySelector(".vp-panel-items").appendChild(btn) | |
log("Added speed button to menu successfully") | |
} | |
tryToAddSpeedButtonToMenu() | |
// allow context menu on video itself | |
const old = Element.prototype.addEventListener | |
Element.prototype.addEventListener = function(...args) { | |
if (args[0].toLowerCase() == "contextmenu") { | |
log("blocked contextmenu event for", this, ":", ...args) | |
return | |
} | |
return old.apply(this, args) | |
} | |
const tryToHideEventBlockingElements = function() { | |
// when the video is played, the preview becomes inactive so we're fine to axe it | |
const inactivePreview = document.querySelector(".vp-preview.vp-preview-invisible") | |
if (!inactivePreview) { | |
setTimeout(tryToHideEventBlockingElements, 500) | |
return | |
} | |
// allow context menu on video itself by removing elements that are in the way | |
const dotTarget = document.querySelector(".target") | |
dotTarget.parentElement.removeChild(dotTarget) | |
inactivePreview.parentElement.removeChild(inactivePreview) | |
log("Hid event-blocking elements successfully") | |
} | |
tryToHideEventBlockingElements() |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment