diff --git a/src/App.vue b/src/App.vue
index bc9548ee..7ff0d9da 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -5,7 +5,11 @@
:class="{ 'uk-light': darkMode }"
>
-
+
+
+
+
+
diff --git a/src/components/Channel.vue b/src/components/Channel.vue
index f12d187c..fc30cd1e 100644
--- a/src/components/Channel.vue
+++ b/src/components/Channel.vue
@@ -32,9 +32,11 @@ export default {
},
mounted() {
this.getChannelData();
+ },
+ activated() {
window.addEventListener("scroll", this.handleScroll);
},
- unmounted() {
+ deactivated() {
window.removeEventListener("scroll", this.handleScroll);
},
methods: {
diff --git a/src/components/Player.vue b/src/components/Player.vue
index 3d9b2323..2f007236 100644
--- a/src/components/Player.vue
+++ b/src/components/Player.vue
@@ -29,6 +29,11 @@ export default {
selectedAutoPlay: Boolean,
selectedAutoLoop: Boolean,
},
+ data() {
+ return {
+ player: null,
+ };
+ },
computed: {
shouldAutoPlay: _this => {
return _this.getPreferenceBoolean("playerAutoPlay", true);
@@ -196,7 +201,7 @@ export default {
});
},
},
- mounted() {
+ activated() {
import("hotkeys-js")
.then(mod => mod.default)
.then(hotkeys => {
@@ -239,13 +244,18 @@ export default {
});
});
},
- beforeUnmount() {
+ deactivated() {
+ if (this.ui) {
+ this.ui.destroy();
+ this.ui = undefined;
+ this.player = undefined;
+ }
if (this.player) {
this.player.destroy();
this.player = undefined;
- this.ui = undefined;
}
if (this.hotkeys) this.hotkeys.unbind();
+ this.$refs.container.querySelectorAll("div").forEach(node => node.remove());
},
};
diff --git a/src/components/Playlist.vue b/src/components/Playlist.vue
index d12725b8..de3975f9 100644
--- a/src/components/Playlist.vue
+++ b/src/components/Playlist.vue
@@ -46,9 +46,11 @@ export default {
},
mounted() {
this.getPlaylistData();
+ },
+ activated() {
window.addEventListener("scroll", this.handleScroll);
},
- unmounted() {
+ deactivated() {
window.removeEventListener("scroll", this.handleScroll);
},
computed: {
diff --git a/src/components/SearchResults.vue b/src/components/SearchResults.vue
index 8a982ad3..c7ab748e 100644
--- a/src/components/SearchResults.vue
+++ b/src/components/SearchResults.vue
@@ -86,16 +86,13 @@ export default {
},
mounted() {
this.updateResults();
+ },
+ activated() {
window.addEventListener("scroll", this.handleScroll);
},
- unmounted() {
+ deactivated() {
window.removeEventListener("scroll", this.handleScroll);
},
- watch: {
- "$route.query.search_query": function(q) {
- if (q) this.updateResults();
- },
- },
methods: {
async fetchResults() {
return await await this.fetchJson(this.apiUrl() + "/search", {
diff --git a/src/components/WatchVideo.vue b/src/components/WatchVideo.vue
index cd7dcfad..eea5d81c 100644
--- a/src/components/WatchVideo.vue
+++ b/src/components/WatchVideo.vue
@@ -134,21 +134,23 @@ export default {
};
},
mounted() {
- this.selectedAutoPlay = this.getPreferenceBoolean("autoplay", true);
- this.getVideoData();
+ this.getVideoData().then(() => {
+ this.$refs.videoPlayer.loadVideo();
+ });
this.getSponsors();
this.getComments();
+ },
+ activated() {
+ this.selectedAutoPlay = this.getPreferenceBoolean("autoplay", true);
+ if (this.video.duration) this.$refs.videoPlayer.loadVideo();
window.addEventListener("scroll", this.handleScroll);
},
- unmounted() {
+ deactivated() {
window.removeEventListener("scroll", this.handleScroll);
},
watch: {
"$route.query.v": function(v) {
if (v) {
- this.getVideoData();
- this.getSponsors();
- this.getComments();
window.scrollTo(0, 0);
}
},
@@ -175,7 +177,7 @@ export default {
this.setPreference("autoplay", this.selectedAutoPlay);
},
async getVideoData() {
- this.fetchVideo()
+ await this.fetchVideo()
.then(data => {
this.video = data;
})
@@ -189,8 +191,6 @@ export default {
.replaceAll("https://www.youtube.com", "")
.replaceAll("\n", "
"),
);
-
- this.$refs.videoPlayer.loadVideo();
}
});
},