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

Merge pull request #1240 from Bnyro/chaptersfix

Browse source 
fix the highlighting of the last chapter
This commit is contained in:
Kavin 2022-07-25 17:55:44 +05:30 committed by GitHub
commit 4853582484
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 11 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
src/components/ChaptersBar.vue
View file

@ -9,11 +9,7 @@
v-for="(chapter, index) in chapters"
@click="$emit('seek', chapter.start)"
class="chapter-vertical"
:class="
playerPosition >= chapter.start && playerPosition < chapters[index + 1].start
? 'chapter-vertical bg-red-500/50'
: 'chapter-vertical'
"
:class="{ 'bg-red-500/50': isCurrentChapter(index) }"
>
<div class="flex">
<span class="mt-5 mr-2 text-current" v-text="index + 1" />
@ -31,11 +27,8 @@
:key="chapter.start"
v-for="(chapter, index) in chapters"
@click="$emit('seek', chapter.start)"
:class="
playerPosition >= chapter.start && playerPosition < chapters[index + 1].start
? 'chapter bg-red-500/50'
: 'chapter'
"
class="chapter"
:class="{ 'bg-red-500/50': isCurrentChapter(index) }"
>
<img :src="chapter.image" :alt="chapter.title" />
<div class="m-1 flex">
@ -73,7 +66,7 @@
<script setup>
import { defineProps, defineEmits } from "vue";
defineProps({
const props = defineProps({
chapters: Object,
mobileLayout: {
type: Boolean,
@ -85,5 +78,12 @@ defineProps({
},
});
const isCurrentChapter = index => {
return (
props.playerPosition >= props.chapters[index].start &&
props.playerPosition < (props.chapters[index + 1]?.start ?? Infinity)
);
};
defineEmits(["seek"]);
</script>