TeamPiped-mirror/Piped
1
0
Fork 0
mirror of https://github.com/TeamPiped/Piped.git synced 2024-08-14 23:57:27 +00:00
Code Issues Projects Releases Packages Wiki Activity

Add auto play for videos as a preference.

Browse source
This commit is contained in:
FireMasterK 2021-05-06 23:00:02 +05:30
parent fcd14d3fcb
commit 5ceda9fd62
No known key found for this signature in database
GPG key ID: 8DFF5DD33E93DB58
2 changed files with 159 additions and 156 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

39
src/components/Player.vue
View file

@ -1,12 +1,7 @@
<template> <template>
<div class="uk-container-expand"> <div class="uk-container-expand">
<div data-shaka-player-container ref="container"> <div data-shaka-player-container ref="container">
<video <video data-shaka-player :autoplay="shouldAutoPlay" style="width: 100%; height: 100%" ref="videoEl"></video>
data-shaka-player
autoplay
style="width: 100%; height: 100%"
ref="videoEl"
></video>
</div> </div>
</div> </div>
</template> </template>
@ -21,6 +16,12 @@ export default {
sponsors: Object, sponsors: Object,
selectedAutoPlay: Boolean, selectedAutoPlay: Boolean,
}, },
computed: {
shouldAutoPlay: () => {
const value = localStorage.getItem("playerAutoPlay");
return value === null || value === "true";
},
},
methods: { methods: {
loadVideo() { loadVideo() {
const videoEl = this.$refs.videoEl; const videoEl = this.$refs.videoEl;
@ -38,13 +39,13 @@ export default {
const dash = require("@/utils/DashUtils.js").default.generate_dash_file_from_formats( const dash = require("@/utils/DashUtils.js").default.generate_dash_file_from_formats(
streams, streams,
this.video.duration this.video.duration,
); );
if (noPrevPlayer) if (noPrevPlayer)
shaka shaka
.then((shaka) => shaka.default) .then(shaka => shaka.default)
.then((shaka) => { .then(shaka => {
this.shaka = shaka; this.shaka = shaka;
shaka.polyfill.installAll(); shaka.polyfill.installAll();
@ -60,7 +61,7 @@ export default {
videoEl.addEventListener("timeupdate", () => { videoEl.addEventListener("timeupdate", () => {
if (this.sponsors && this.sponsors.segments) { if (this.sponsors && this.sponsors.segments) {
const time = videoEl.currentTime; const time = videoEl.currentTime;
this.sponsors.segments.map((segment) => { this.sponsors.segments.map(segment => {
if (!segment.skipped) { if (!segment.skipped) {
const end = segment.segment[1]; const end = segment.segment[1];
if (time >= segment.segment[0] && time < end) { if (time >= segment.segment[0] && time < end) {
@ -87,24 +88,20 @@ export default {
//TODO: Add sponsors on seekbar: https://github.com/ajayyy/SponsorBlock/blob/e39de9fd852adb9196e0358ed827ad38d9933e29/src/js-components/previewBar.ts#L12 //TODO: Add sponsors on seekbar: https://github.com/ajayyy/SponsorBlock/blob/e39de9fd852adb9196e0358ed827ad38d9933e29/src/js-components/previewBar.ts#L12
}, },
setPlayerAttrs(player, videoEl, dash, shaka) { setPlayerAttrs(player, videoEl, dash, shaka) {
player player.load("data:application/dash+xml;charset=utf-8;base64," + btoa(dash)).then(() => {
.load("data:application/dash+xml;charset=utf-8;base64," + btoa(dash)) this.video.subtitles.map(subtitle => {
.then(() => {
this.video.subtitles.map((subtitle) => {
player.addTextTrackAsync( player.addTextTrackAsync(
subtitle.url, subtitle.url,
subtitle.code, subtitle.code,
"SUBTITLE", "SUBTITLE",
subtitle.mimeType, subtitle.mimeType,
null, null,
subtitle.name subtitle.name,
); );
}); });
if (localStorage) videoEl.volume = localStorage.getItem("volume") || 1; if (localStorage) videoEl.volume = localStorage.getItem("volume") || 1;
const ui = const ui = this.ui || (this.ui = new shaka.ui.Overlay(player, this.$refs.container, videoEl));
this.ui ||
(this.ui = new shaka.ui.Overlay(player, this.$refs.container, videoEl));
const config = { const config = {
overflowMenuButtons: ["quality", "captions", "playback_rate"], overflowMenuButtons: ["quality", "captions", "playback_rate"],
@ -119,11 +116,7 @@ export default {
}); });
}, },
onKeyPress(e) { onKeyPress(e) {
if ( if (document.activeElement.tagName === "INPUT" && document.activeElement.type === "text") return;
document.activeElement.tagName === "INPUT" &&
document.activeElement.type === "text"
)
return;
const videoEl = this.$refs.videoEl; const videoEl = this.$refs.videoEl;
switch (e.code) { switch (e.code) {
case "KeyF": case "KeyF":

10
src/components/Preferences.vue
View file

@ -30,6 +30,10 @@
<b>Skip Music: Non-Music Section</b> <b>Skip Music: Non-Music Section</b>
<br /> <br />
<input class="uk-checkbox" v-model="skipMusicOffTopic" @change="onChange($event)" type="checkbox" /> <input class="uk-checkbox" v-model="skipMusicOffTopic" @change="onChange($event)" type="checkbox" />
<br />
<b>Autoplay Video</b>
<br />
<input class="uk-checkbox" v-model="autoPlayVideo" @change="onChange($event)" type="checkbox" />
<h2>Instances List</h2> <h2>Instances List</h2>
<table class="uk-table"> <table class="uk-table">
<thead> <thead>
@ -75,6 +79,7 @@ export default {
skipInteraction: true, skipInteraction: true,
skipSelfPromo: true, skipSelfPromo: true,
skipMusicOffTopic: true, skipMusicOffTopic: true,
autoPlayVideo: true,
}; };
}, },
mounted() { mounted() {
@ -133,6 +138,9 @@ export default {
} }
}); });
} }
this.autoPlayVideo =
localStorage.getItem("playerAutoPlay") === null || localStorage.getItem("playerAutoPlay") === "true";
} }
}, },
methods: { methods: {
@ -149,6 +157,8 @@ export default {
if (this.skipSelfPromo) sponsorSelected.push("selfpromo"); if (this.skipSelfPromo) sponsorSelected.push("selfpromo");
if (this.skipMusicOffTopic) sponsorSelected.push("music_offtopic"); if (this.skipMusicOffTopic) sponsorSelected.push("music_offtopic");
localStorage.setItem("selectedSkip", sponsorSelected); localStorage.setItem("selectedSkip", sponsorSelected);
localStorage.setItem("playerAutoPlay", this.autoPlayVideo);
} }
}, },
sslScore(url) { sslScore(url) {