Fix player reuse and sponsorblock.

This commit is contained in:
FireMasterK 2021-02-25 15:24:43 +05:30
parent d4d74661d9
commit dee927c527
No known key found for this signature in database
GPG key ID: 8DFF5DD33E93DB58

View file

@ -93,7 +93,6 @@ export default {
title: "Loading..." title: "Loading..."
}, },
player: null, player: null,
audioplayer: null,
sponsors: null, sponsors: null,
selectedAutoPlay: null, selectedAutoPlay: null,
showDesc: true showDesc: true
@ -106,16 +105,14 @@ export default {
}, },
beforeUnmount() { beforeUnmount() {
if (this.player) { if (this.player) {
this.player.dispose(); document.querySelector("video").remove();
} window.player = undefined;
if (this.audioplayer) { window.ui = undefined;
this.audioplayer.pause();
} }
}, },
watch: { watch: {
"$route.query.v": function(v) { "$route.query.v": function(v) {
if (v) { if (v) {
if (this.audioplayer) this.audioplayer.pause();
this.getVideoData(); this.getVideoData();
this.getSponsors(); this.getSponsors();
} }
@ -128,7 +125,7 @@ export default {
); );
}, },
async fetchSponsors() { async fetchSponsors() {
await this.fetchJson( return await this.fetchJson(
Constants.BASE_URL + Constants.BASE_URL +
"/sponsors/" + "/sponsors/" +
this.$route.query.v + this.$route.query.v +
@ -139,6 +136,46 @@ export default {
if (localStorage) if (localStorage)
localStorage.setItem("autoplay", this.selectedAutoPlay); localStorage.setItem("autoplay", this.selectedAutoPlay);
}, },
setPlayerAttrs(player, videoEl, dash, shaka) {
player
.load(
"data:application/dash+xml;charset=utf-8;base64," +
btoa(dash)
)
.then(() => {
this.video.subtitles.map(subtitle => {
player.addTextTrack(
subtitle.url,
"eng",
"SUBTITLE",
subtitle.mimeType,
null,
"English"
);
player.setTextTrackVisibility(true);
});
if (localStorage)
videoEl.volume = localStorage.getItem("volume") || 1;
const ui =
window.ui ||
(window.ui = new shaka.ui.Overlay(
player,
document.querySelector(
"div[data-shaka-player-container]"
),
videoEl
));
const config = {
overflowMenuButtons: [
"quality",
"captions",
"playback_rate"
]
};
ui.configure(config);
});
},
async getVideoData() { async getVideoData() {
this.fetchVideo() this.fetchVideo()
.then(data => { .then(data => {
@ -168,66 +205,36 @@ export default {
const videoEl = document.querySelector("video"); const videoEl = document.querySelector("video");
if (noPrevPlayer) {
setTimeout(function() { setTimeout(function() {
shaka shaka
.then(shaka => shaka.default) .then(shaka => shaka.default)
.then(shaka => { .then(shaka => {
if (noPrevPlayer) {
shaka.polyfill.installAll(); shaka.polyfill.installAll();
const player = new shaka.Player(videoEl); const player = new shaka.Player(videoEl);
player WatchVideo.player = player;
.load( window.player = player;
"data:application/dash+xml;charset=utf-8;base64," +
btoa(dash) WatchVideo.setPlayerAttrs(
) player,
.then(() => { videoEl,
WatchVideo.video.subtitles.map( dash,
subtitle => { shaka
player.addTextTrack(
subtitle.url,
"eng",
"SUBTITLE",
subtitle.mimeType,
null,
"English"
); );
player.setTextTrackVisibility( } else {
true WatchVideo.setPlayerAttrs(
window.player,
videoEl,
dash,
shaka
); );
} }
);
if (localStorage)
videoEl.volume =
localStorage.getItem(
"volume"
) || 1;
const ui = new shaka.ui.Overlay(
player,
document.querySelector(
"div[data-shaka-player-container]"
),
videoEl
);
const config = {
overflowMenuButtons: [
"quality",
"captions",
"playback_rate"
]
};
ui.configure(config);
});
videoEl.setAttribute(
"poster",
WatchVideo.video.thumbnailUrl
);
}); });
}, 0); }, 0);
}
videoEl.setAttribute("poster", this.video.thumbnailUrl);
if (this.$route.query.t) if (this.$route.query.t)
this.player.currentTime(this.$route.query.t); this.player.currentTime(this.$route.query.t);