diff --git a/NUXT/components/Player/index.vue b/NUXT/components/Player/index.vue
index 8426126..a25aa9f 100644
--- a/NUXT/components/Player/index.vue
+++ b/NUXT/components/Player/index.vue
@@ -152,7 +152,12 @@
@fullscreen="(controls = $refs.player.paused), handleFullscreenChange()"
/>
-
+
+
+
+
diff --git a/NUXT/components/Player/seekbar.vue b/NUXT/components/Player/seekbar.vue
index 0892d48..f83bec5 100644
--- a/NUXT/components/Player/seekbar.vue
+++ b/NUXT/components/Player/seekbar.vue
@@ -7,22 +7,6 @@
style="display: none"
:src="vidWrs"
/>
-
({
+ scrubbing: false,
+ progress: 0,
+ duration: 0,
+ vidWrs: "",
+ }),
mounted() {
- console.log("sources", this.sources);
- this.vidSrc = this.sources[this.sources.length - 1].url;
- this.vidWrs = this.sources[1].url;
- let vid = this.video;
- vid.addEventListener("loadeddata", (e) => {
- // console.log("%c loadeddata", "color: #00ff00");
- console.log(e);
- //Video should now be loaded but we can add a second check
- if (vid.readyState >= 3) {
- vid.ontimeupdate = () => {
- // console.log("%c timeupdate", "color: #aaaaff");
- this.duration = vid.duration;
- if (!this.scrubbing) this.progress = vid.currentTime;
- this.percent = (vid.currentTime / vid.duration) * 100;
- };
- vid.onprogress = () => {
- // console.log("%c progress", "color: #ff00ff");
- this.buffered = (vid.buffered.end(0) / vid.duration) * 100;
- };
+ // this.vidWrs = this.sources[1].url;
+ this.video.addEventListener("loadeddata", (e) => {
+ if (this.video.readyState >= 3) {
+ this.video.addEventListener("timeupdate", () => {
+ this.duration = this.video.duration;
+ if (!this.scrubbing) this.progress = this.currentTime;
+ });
}
});
},
methods: {
+ seek(e) {
+ // console.log(`scrubbing ${e}`);
+ let vid = this.$refs.playerfake;
+ let canvas = this.$refs.preview;
+ this.$refs.playerfake.currentTime = e;
+ canvas
+ .getContext("2d")
+ .drawImage(
+ vid,
+ 0,
+ 0,
+ this.video.clientWidth / 3,
+ this.video.clientHeight / 3
+ );
+ },
+ scrub(e) {
+ this.video.currentTime = e;
+ },
// TODO: better scrubbing preview
loadVideoFrames() {
// Exit loop if desired number of frames have been extracted
@@ -228,24 +233,6 @@ export default {
console.log(this.frames);
},
// TODO: scrubbing preview end
- seek(e) {
- // console.log(`scrubbing ${e}`);
- let vid = this.$refs.playerfake;
- let canvas = this.$refs.preview;
- this.$refs.playerfake.currentTime = e;
- canvas
- .getContext("2d")
- .drawImage(
- vid,
- 0,
- 0,
- this.video.clientWidth / 3,
- this.video.clientHeight / 3
- );
- },
- scrub(e) {
- this.video.currentTime = e;
- },
},
};
diff --git a/NUXT/components/Player/sponsorblock.vue b/NUXT/components/Player/sponsorblock.vue
index 7456bbf..e056aaa 100644
--- a/NUXT/components/Player/sponsorblock.vue
+++ b/NUXT/components/Player/sponsorblock.vue
@@ -1,5 +1,22 @@
-
+
+
+
+
+
diff --git a/NUXT/pages/watch.vue b/NUXT/pages/watch.vue
index 17bd3be..ca4a0ff 100644
--- a/NUXT/pages/watch.vue
+++ b/NUXT/pages/watch.vue
@@ -228,6 +228,7 @@
hide-overlay
persistent
no-click-animation
+ style="z-index: 2 !important"
attach="#content-container"
>