Git-Mirrors/invidious
1
0
Fork 0
mirror of https://github.com/iv-org/invidious.git synced 2025-05-02 06:26:27 -04:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #2008 from syeopite/mobile-ui

Browse source 
Improve player controls for mobile devices
This commit is contained in:
TheFrenchGhosty 2021-05-13 10:33:47 +02:00 • committed by GitHub
commit 75e5b49c3a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 331 additions and 179 deletions
Download patch file Download diff file Expand all files Collapse all files

50
assets/js/player.js
View file

@ -14,6 +14,7 @@ var options = {
'durationDisplay',
'progressControl',
'remainingTimeDisplay',
'Spacer',
'captionsButton',
'qualitySelector',
'playbackRateMenuButton',
@ -73,6 +74,55 @@ if (location.pathname.startsWith('/embed/')) {
});
}
// Detect mobile users and initalize mobileUi for better UX
// Detection code taken from https://stackoverflow.com/a/20293441
function isMobile() {
try{ document.createEvent("TouchEvent"); return true; }
catch(e){ return false; }
}
if (isMobile()) {
player.mobileUi();
buttons = ["playToggle", "volumePanel", "captionsButton"];
if (video_data.params.quality !== 'dash') {
buttons.push("qualitySelector")
}
// Create new control bar object for operation buttons
const ControlBar = videojs.getComponent("controlBar");
let operations_bar = new ControlBar(player, {
children: [],
playbackRates: [0.25, 0.5, 0.75, 1.0, 1.25, 1.5, 1.75, 2.0]
});
buttons.slice(1).forEach(child => operations_bar.addChild(child))
// Remove operation buttons from primary control bar
primary_control_bar = player.getChild("controlBar");
buttons.forEach(child => primary_control_bar.removeChild(child));
operations_bar_element = operations_bar.el();
operations_bar_element.className += " mobile-operations-bar"
player.addChild(operations_bar)
// Playback menu doesn't work when its initalized outside of the primary control bar
playback_element = document.getElementsByClassName("vjs-playback-rate")[0]
operations_bar_element.append(playback_element)
// The share and http source selector element can't be fetched till the players ready.
player.one("playing", () => {
share_element = document.getElementsByClassName("vjs-share-control")[0]
operations_bar_element.append(share_element)
if (video_data.params.quality === 'dash') {
http_source_selector = document.getElementsByClassName("vjs-http-source-selector vjs-menu-button")[0]
operations_bar_element.append(http_source_selector)
}
})
}
player.on('error', function (event) {
if (player.error().code === 2 || player.error().code === 4) {
setTimeout(function (event) {