etc/VueTube
0
0
Fork 0
mirror of https://github.com/VueTubeApp/VueTube synced 2024-11-17 16:55:12 +00:00
Code Issues Projects Releases Wiki Activity

sponsorblock cleanup

Browse source
This commit is contained in:
Nikita Krupin 2022-06-08 12:32:04 -04:00
parent 59b65b7d9e
commit a079946ae1
2 changed files with 26 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
NUXT/components/Player/index.vue
View file

@ -274,12 +274,11 @@
@seeking="seeking = !seeking" @seeking="seeking = !seeking"
/> />
<sponsorblock <sponsorblock
v-if="$refs.player" v-if="$refs.player && blocks.length > 0"
:video="$refs.player" :duration="$refs.player.duration"
:seeking="seeking"
:videoid="videoid"
:controls="controls"
:fullscreen="isFullscreen" :fullscreen="isFullscreen"
:controls="controls"
:seeking="seeking"
:blocks="blocks" :blocks="blocks"
/> />
</div> </div>
@ -354,7 +353,7 @@ export default {
}); });
vid.addEventListener("loadeddata", (e) => { vid.addEventListener("loadeddata", (e) => {
// TODO: detect video loading state and send this.loading to play button :loading = loading // TODO: detect video loading state and send this.loading to play button :loading = loading here
// console.log(e); // console.log(e);
if (vid.readyState >= 3) { if (vid.readyState >= 3) {
vid.addEventListener("timeupdate", () => { vid.addEventListener("timeupdate", () => {
@ -362,7 +361,7 @@ export default {
this.watched = this.$vuetube.humanTime(vid.currentTime); this.watched = this.$vuetube.humanTime(vid.currentTime);
if (!this.seeking) this.progress = vid.currentTime; if (!this.seeking) this.progress = vid.currentTime;
// console.log("sb check", data); // console.log("sb check", this.blocks);
// iterate over data.segments array // iterate over data.segments array
if (this.blocks.length > 0) if (this.blocks.length > 0)
this.blocks.forEach((sponsor) => { this.blocks.forEach((sponsor) => {
@ -378,6 +377,7 @@ export default {
} }
}); });
}); });
// TODO: detect video loading state and send this.loading to play button :loading = loading here
vid.addEventListener("progress", () => { vid.addEventListener("progress", () => {
this.buffered = (vid.buffered.end(0) / vid.duration) * 100; this.buffered = (vid.buffered.end(0) / vid.duration) * 100;
}); });

56
NUXT/components/Player/sponsorblock.vue
View file

@ -23,13 +23,18 @@
: 'width: 100%; left: 0; bottom: 1px;' : 'width: 100%; left: 0; bottom: 1px;'
" "
/> />
<!-- // TODO:background-color="colors[block.category]" -->
</div> </div>
</template> </template>
<script> <script>
export default { export default {
props: { props: {
video: { blocks: {
type: Array,
required: true,
},
duration: {
type: Object, type: Object,
required: true, required: true,
}, },
@ -37,10 +42,6 @@ export default {
type: Boolean, type: Boolean,
required: true, required: true,
}, },
videoid: {
type: String,
required: true,
},
fullscreen: { fullscreen: {
type: Boolean, type: Boolean,
required: true, required: true,
@ -49,40 +50,19 @@ export default {
type: Boolean, type: Boolean,
required: true, required: true,
}, },
blocks: {
type: Array,
required: true,
}, },
data: () => ({
colors: {
sponsor: "green",
selfpromo: "yellow",
exclusive_access: "teal",
interaction: "fuchsia",
poi_highlight: "deeppink",
intro: "lightblue",
outro: "blue",
music_offtopic: "orange",
filter: "purple",
}, },
}),
}; };
</script> </script>
<style>
.sponsor {
color: green;
}
.selfpromo {
color: yellow;
}
.exclusive_access {
color: orange;
}
.interaction {
color: blue;
}
.intro {
color: purple;
}
.outro {
color: purple;
}
.music_offtopic {
color: red;
}
.poi_highlight {
color: #ff00ff;
}
.filler {
color: blue;
}
</style>