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

Switch to non reactive variables for shaka-player.

Browse source
This commit is contained in:
FireMaskterK 2021-10-06 15:33:52 +01:00
parent b4155c47d0
commit edf668dfd4
1 changed files with 18 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
src/components/Player.vue
View file

@ -52,7 +52,8 @@ export default {
}, },
data() { data() {
return { return {
player: null, $player: null,
$ui: null,
}; };
}, },
computed: { computed: {
@ -91,7 +92,7 @@ export default {
if (this.$route.query.t) videoEl.currentTime = this.$route.query.t; if (this.$route.query.t) videoEl.currentTime = this.$route.query.t;
const noPrevPlayer = !this.player; const noPrevPlayer = !this.$player;
var streams = []; var streams = [];
@ -173,7 +174,7 @@ export default {
this.setPlayerAttrs(localPlayer, videoEl, uri, mime, this.shaka); this.setPlayerAttrs(localPlayer, videoEl, uri, mime, this.shaka);
}); });
else this.setPlayerAttrs(this.player, videoEl, uri, mime, this.shaka); else this.setPlayerAttrs(this.$player, videoEl, uri, mime, this.shaka);
if (noPrevPlayer) { if (noPrevPlayer) {
videoEl.addEventListener("timeupdate", () => { videoEl.addEventListener("timeupdate", () => {
@ -225,8 +226,8 @@ 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(localPlayer, videoEl, uri, mime, shaka) { setPlayerAttrs(localPlayer, videoEl, uri, mime, shaka) {
if (!this.ui) { if (!this.$ui) {
this.ui = new shaka.ui.Overlay(localPlayer, this.$refs.container, videoEl); this.$ui = new shaka.ui.Overlay(localPlayer, this.$refs.container, videoEl);
const config = { const config = {
overflowMenuButtons: ["quality", "captions", "picture_in_picture", "playback_rate", "airplay"], overflowMenuButtons: ["quality", "captions", "picture_in_picture", "playback_rate", "airplay"],
@ -237,16 +238,16 @@ export default {
}, },
}; };
this.ui.configure(config); this.$ui.configure(config);
} }
const player = this.ui.getControls().getPlayer(); const player = this.$ui.getControls().getPlayer();
this.player = player; this.$player = player;
const disableVideo = this.getPreferenceBoolean("listen", false) && !this.video.livestream; const disableVideo = this.getPreferenceBoolean("listen", false) && !this.video.livestream;
this.player.configure({ this.$player.configure({
preferredVideoCodecs: this.preferredVideoCodecs, preferredVideoCodecs: this.preferredVideoCodecs,
preferredAudioCodecs: ["opus", "mp4a"], preferredAudioCodecs: ["opus", "mp4a"],
manifest: { manifest: {
@ -257,7 +258,7 @@ export default {
const quality = this.getPreferenceNumber("quality", 0); const quality = this.getPreferenceNumber("quality", 0);
const qualityConds = const qualityConds =
quality > 0 && (this.video.audioStreams.length > 0 || this.video.livestream) && !disableVideo; quality > 0 && (this.video.audioStreams.length > 0 || this.video.livestream) && !disableVideo;
if (qualityConds) this.player.configure("abr.enabled", false); if (qualityConds) this.$player.configure("abr.enabled", false);
player.load(uri, 0, mime).then(() => { player.load(uri, 0, mime).then(() => {
if (qualityConds) { if (qualityConds) {
@ -291,14 +292,14 @@ export default {
}); });
}, },
destroy() { destroy() {
if (this.ui) { if (this.$ui) {
this.ui.destroy(); this.$ui.destroy();
this.ui = undefined; this.$ui = undefined;
this.player = undefined; this.$player = undefined;
} }
if (this.player) { if (this.$player) {
this.player.destroy(); this.$player.destroy();
this.player = undefined; this.$player = undefined;
} }
if (this.hotkeys) this.hotkeys.unbind(); if (this.hotkeys) this.hotkeys.unbind();
if (this.$refs.container) this.$refs.container.querySelectorAll("div").forEach(node => node.remove()); if (this.$refs.container) this.$refs.container.querySelectorAll("div").forEach(node => node.remove());