Adapt css for the new player design; Remove support for classic-ui
This commit is contained in:
@@ -1,77 +1,70 @@
|
|||||||
// ==UserScript==
|
// ==UserScript==
|
||||||
// @name netflix-speed
|
// @name netflix-speed
|
||||||
// @version 0.7
|
// @version 0.8
|
||||||
// @include https://www.netflix.com/*
|
// @include https://www.netflix.com/*
|
||||||
// ==/UserScript==
|
// ==/UserScript==
|
||||||
|
|
||||||
function find_controls() {
|
function find_controls() {
|
||||||
return new Promise(function(resolve, reject) {
|
return new Promise(function(resolve, reject) {
|
||||||
var observer = new MutationObserver(function(mutationsList) {
|
var observer = new MutationObserver(function(mutationsList) {
|
||||||
mutationsList.forEach(function(mutation) {
|
mutationsList.forEach(function(mutation) {
|
||||||
var nodes = Array.from(mutation.addedNodes);
|
var nodes = Array.from(mutation.addedNodes);
|
||||||
for (var node of nodes) {
|
for (var node of nodes) {
|
||||||
/* classic ui - black bar at the bottom */
|
if (node.matches && node.matches('.AkiraPlayer') && (node.querySelector('.button-nfplayerNextEpisode') || node.querySelector('.button-nfplayerSubtitles'))) {
|
||||||
if (node.matches && node.matches('.classic-ui') && node.querySelector('.video-title')) {
|
var elem = node.querySelector('.button-nfplayerNextEpisode') || node.querySelector('.button-nfplayerSubtitles');
|
||||||
resolve(node.querySelector('.video-title').previousElementSibling);
|
resolve(elem.parentNode);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
/* modern ui - play/pause in the middle of the screen */
|
}
|
||||||
if (node.matches && node.matches('.AkiraPlayer') && (node.querySelector('.button-nfplayerNextEpisode') || node.querySelector('.button-nfplayerSubtitles'))) {
|
});
|
||||||
var elem = node.querySelector('.button-nfplayerNextEpisode') || node.querySelector('.button-nfplayerSubtitles');
|
|
||||||
resolve(elem.parentNode);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
observer.observe(document.documentElement, { childList: true, subtree: true });
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
observer.observe(document.documentElement, { childList: true, subtree: true });
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function inject_controls() {
|
function inject_controls() {
|
||||||
find_controls().then(function(controls) {
|
find_controls().then(function(controls) {
|
||||||
/* don't inject multiple times */
|
/* remove report a problem button */
|
||||||
if (document.querySelector('#speed-control'))
|
if (document.querySelector('div.ReportAProblemPopupContainer'))
|
||||||
return;
|
document.querySelector('div.ReportAProblemPopupContainer').remove();
|
||||||
|
|
||||||
/* create speed_control element */
|
/* don't inject multiple times */
|
||||||
var speed_control = document.createElement('select');
|
if (document.querySelector('#speed-control'))
|
||||||
speed_control.id = 'speed-control';
|
return;
|
||||||
speed_control.style.cssText = `
|
|
||||||
border-left: 1px solid #323232;
|
/* create speed_control element */
|
||||||
border-right: 1px solid #151515;
|
var speed_control = document.createElement('div');
|
||||||
border-top: none;
|
speed_control.innerHTML = `<select>
|
||||||
border-bottom: none;
|
<option value=0.5>0.5</option>
|
||||||
background: none;
|
|
||||||
-moz-appearance: none;
|
|
||||||
-webkit-appearance: none;
|
|
||||||
appearance: none;
|
|
||||||
min-width: 5em;
|
|
||||||
width: auto;
|
|
||||||
height: 100%;
|
|
||||||
font-size: 2.2em;
|
|
||||||
text-align: center;
|
|
||||||
cursor: pointer;
|
|
||||||
`;
|
|
||||||
speed_control.id = 'speed-control';
|
|
||||||
speed_control.onchange = function() {
|
|
||||||
document.querySelector('.VideoContainer video').playbackRate = this.value;
|
|
||||||
};
|
|
||||||
speed_control.innerHTML = `<option value=0.5>0.5</option>
|
|
||||||
<option value=0.75>0.75</option>
|
<option value=0.75>0.75</option>
|
||||||
<option value=1.0 selected="selected">Normal</option>
|
<option value=1.0 selected="selected">Normal</option>
|
||||||
<option value=1.25>1.25</option>
|
<option value=1.25>1.25</option>
|
||||||
<option value=1.5>1.5</option>
|
<option value=1.5>1.5</option>
|
||||||
<option value=1.75>1.75</option>
|
<option value=1.75>1.75</option>
|
||||||
<option value=2.0>2.0</option>`;
|
<option value=2.0>2.0</option>
|
||||||
|
</select>`;
|
||||||
|
speed_control.id = 'speed-control';
|
||||||
|
speed_control.style.cssText = `
|
||||||
|
padding: 0 0 1.68em 0;
|
||||||
|
margin: 0 1.5em;`;
|
||||||
|
speed_control.firstChild.style.cssText = `
|
||||||
|
-webkit-appearance: none;
|
||||||
|
background: none;
|
||||||
|
border: none;
|
||||||
|
font-size: 2.2em;
|
||||||
|
text-align: right;`;
|
||||||
|
speed_control.firstChild.onchange = function() {
|
||||||
|
document.querySelector('.VideoContainer video').playbackRate = this.value;
|
||||||
|
};
|
||||||
|
|
||||||
/* inject speed_control element */
|
/* inject speed_control element */
|
||||||
controls.after(speed_control);
|
controls.before(speed_control);
|
||||||
|
|
||||||
/* redo injection, in case of video change, ... */
|
/* redo injection, in case of video change, ... */
|
||||||
inject_controls();
|
inject_controls();
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/* initial run of injection */
|
||||||
inject_controls();
|
inject_controls();
|
||||||
|
|||||||
Reference in New Issue
Block a user