Skip to content

Instantly share code, notes, and snippets.

@GarrettS
Last active October 17, 2017 06:11
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 GarrettS/0510d95f04a33f4a9d969f8c088e77b8 to your computer and use it in GitHub Desktop.
Save GarrettS/0510d95f04a33f4a9d969f8c088e77b8 to your computer and use it in GitHub Desktop.
Updated for standalone Video Player and also Framed Tweet Media (Edit Tweet ID)
(
function(v,n) {
var doc = this.contentDocument || document;
if(!v) v = doc.querySelector("video");
if(!v) return;
var fbButtonsDiv = doc.getElementById("fbPhotoPageButtons");
var artistworksDiv = doc.getElementById("playlist0");
var artistworksMessageCaption = doc.getElementById("msg-expanded");
var vimeoAppendTo = document.querySelector(".player_outro_area");
if(artistworksMessageCaption) {
showArtistworksMessageCaption(artistworksMessageCaption);
}
n = doc.getElementById("watch-header")
|| doc.getElementById("player-focus-control")
|| fbButtonsDiv
|| artistworksDiv || artistworksMessageCaption
|| vimeoAppendTo
|| doc.body;
if(!n || n.querySelector("#speed-slider")) return;
if(fbButtonsDiv) {
fbButtonsDiv.style.position = "relative";
}
n = makeFieldset(n);
if(location.hostname == "twitter.com") {
positionForTwitter(n);
} else if(v.parentNode == document.body){
positionForStandalone(n);
v.style.width = "95%";
}
var speedSlider = makeSpeedSlider(v,n);
var pitchSlider = makePitchSlider(v,n);
var PRESERVES_PITCH = getPreservesPitch(v);
mutuallyExclude(pitchSlider, speedSlider, v);
v = n = null;
function mutuallyExclude(pitchSlider, speedSlider, v) {
pitchSlider.addEventListener("input", function(){
setPercentText(speedSlider, "-");
pitchSlider.parentNode.style.opacity = 1;
speedSlider.parentNode.style.opacity = .6;
});
speedSlider.addEventListener("input", function(){
pitchSlider.value = 1;
sliderInput(speedSlider, v);
speedSlider.parentNode.style.opacity = 1;
pitchSlider.parentNode.style.opacity = .6;
});
}
function makeVideoSlider(text, v) {
var label = doc.createElement("label");
label.style.cssText = "display:block;font-weight:bold";
label.innerHTML = text + " <input type=\"range\" value=1> . ";
var i = label.firstElementChild;
i.oninput= function(){ sliderInput(i, v) };
setTimeout(function(){ i.value = 1; i.oninput()}, 10);
return label;
}
function sliderInput(i, v) {
// Format to at most one decimal point of precision.
var data=(1000*(v.playbackRate=i.value)|0)/10+"%";
setPercentText(i, data);
}
function makeSpeedSlider(v,n,l,i) {
l = makeVideoSlider("Speed", v);
l.id="speed-slider";
i = l.firstElementChild;
i.min=.5;
i.step=.05;
i.max = 1;
n.insertBefore(l, n.firstChild);
i.addEventListener("input", function() {
v[PRESERVES_PITCH] = 1;
});
return i;
}
function makePitchSlider(v,n,l,i) {
l = makeVideoSlider("Pitch", v);
i = l.firstElementChild;
i.min=.7;
i.max=1.1;
i.value = 1;
i.step=.005;
n.insertBefore(l, n.firstChild);
i.addEventListener("input", function() {
v[PRESERVES_PITCH] = 0;
});
return i;
}
function makeFieldset() {
var fieldset = doc.createElement("fieldset");
fieldset.style.cssText =
"border: 3px groove #eee;background: #e3e3e3; padding: 3px";
var legend = doc.createElement("legend");
legend.textContent = "Pitch & Speed Controls";
legend.style.cssText = "background: inherit;"
fieldset.appendChild(legend);
n.insertBefore(fieldset, n.firstChild);
return fieldset;
}
function positionForTwitter(fieldset) {
fieldset.style.cssText +=
"position: absolute; top: -7px; left: -7px; z-index: 100;"
}
function positionForStandalone(fieldset) {
fieldset.style.cssText +=
"position: relative; top: -33px;";
}
function setPercentText(i, val) {
return i.nextSibling.data = val;
}
function getPreservesPitch(v){
return "preservesPitch" in v ? "preservesPitch" : "mozPreservesPitch" in v ?
"mozPreservesPitch" : "webkitPreservesPitch";
}
function showArtistworksMessageCaption(amc) {
amc.style.cssText = "display:block; bottom: 10px";
}
}
).call(window.player_tweet_846050337731624961);
javascript:(function(f,e){function m(a,b){var d=g.createElement("label");d.style.cssText="display:block;font-weight:bold";d.innerHTML=a+' <input type="range" value=1> . ';var c=d.firstElementChild;c.oninput=function(){n(c,b)};setTimeout(function(){c.value=1;c.oninput()},10);return d}function n(a,b){var d=(1E3*(b.playbackRate=a.value)|0)/10+"%";a.nextSibling.data=d}var g=this.contentDocument||document;f||(f=g.querySelector("video"));if(f){var h=g.getElementById("fbPhotoPageButtons"),k=g.getElementById("playlist0"),
l=g.getElementById("msg-expanded"),q=document.querySelector(".player_outro_area");l&&(l.style.cssText="display:block; bottom: 10px");if((e=g.getElementById("watch-header")||g.getElementById("player-focus-control")||h||k||l||q||g.body)&&!e.querySelector("#speed-slider")){h&&(h.style.position="relative");e=function(){var a=g.createElement("fieldset");a.style.cssText="border: 3px groove #eee;background: #e3e3e3; padding: 3px";var b=g.createElement("legend");b.textContent="Pitch & Speed Controls";b.style.cssText=
"background: inherit;";a.appendChild(b);e.insertBefore(a,e.firstChild);return a}(e);"twitter.com"==location.hostname?e.style.cssText+="position: absolute; top: -7px; left: -7px; z-index: 100;":f.parentNode==document.body&&(e.style.cssText+="position: relative; top: -33px;",f.style.width="95%");h=function(a,b,d,c){d=m("Speed",a);d.id="speed-slider";c=d.firstElementChild;c.min=.5;c.step=.05;c.max=1;b.insertBefore(d,b.firstChild);c.addEventListener("input",function(){a[p]=1});return c}(f,e);k=function(a,
b,d,c){d=m("Pitch",a);c=d.firstElementChild;c.min=.7;c.max=1.1;c.value=1;c.step=.005;b.insertBefore(d,b.firstChild);c.addEventListener("input",function(){a[p]=0});return c}(f,e);var p="preservesPitch"in f?"preservesPitch":"mozPreservesPitch"in f?"mozPreservesPitch":"webkitPreservesPitch";(function(a,b,d){a.addEventListener("input",function(){b.nextSibling.data="-";a.parentNode.style.opacity=1;b.parentNode.style.opacity=.6});b.addEventListener("input",function(){a.value=1;n(b,d);b.parentNode.style.opacity=
1;a.parentNode.style.opacity=.6})})(k,h,f);f=e=null}}}).call(window.player_tweet_846050337731624961);
@GarrettS
Copy link
Author

Updated for Vimeo.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment