Adapt css for the new player design; Remove support for classic-ui

This commit is contained in:
Alexander Weidinger
2018-11-28 23:18:35 +01:00
parent 769011eff1
commit b7b43a11bc

View File

@@ -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();