jellyfin/jellyfin-vue
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-vue.git synced 2024-10-06 19:13:36 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

refactor(subtitles): use computed value for current subtitle variable

Browse Source
This commit is contained in:
Sean McBroom 2024-06-08 18:26:58 -05:00 committed by Fernando Fernández
parent caad390fe9
commit a063f0fab2
2 changed files with 11 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
frontend/src/components/Playback/SubtitleTrack.vue
View File

@ -14,12 +14,11 @@
</template> </template>
<script setup> <script setup>
import { ref, onMounted } from 'vue'; import { computed } from 'vue';
import { clientSettings } from '@/store/client-settings'; import { clientSettings } from '@/store/client-settings';
import { mediaControls } from '@/store';
import { playerElement } from '@/store/player-element' import { playerElement } from '@/store/player-element'
import { mediaElementRef } from '@/store'; import { isNil } from '@/utils/validation';
const currentSubtitle = ref(undefined);
/** /**
* Function to find the current subtitle based on the current time. * Function to find the current subtitle based on the current time.
@ -56,21 +55,14 @@ const findCurrentSubtitle = (data, currentTime) => {
} }
}; };
/** /**
* Function to update the current subtitle based on the current time of the media element. * Update the current subtitle based on the current time of the media element.
*/ */
const updateSubtitle = () => { const currentSubtitle = computed(() =>
const currentSubtitleTrackData = playerElement.currentExternalSubtitleTrack?.parsed; !isNil(mediaControls.currentTime?.value)
const currentTime = mediaElementRef.value?.currentTime; && !isNil(playerElement.currentExternalSubtitleTrack?.parsed)
? findCurrentSubtitle(playerElement.currentExternalSubtitleTrack.parsed, mediaControls.currentTime.value)
currentSubtitle.value = findCurrentSubtitle(currentSubtitleTrackData, currentTime); : undefined
}; );
/**
* onMounted lifecycle hook to setup event listeners and initialize the subtitle update mechanism.
*/
onMounted(() => {
// Add listener to the 'timeupdate' event on the media element to update the subtitle.
mediaElementRef.value.addEventListener('timeupdate', updateSubtitle);
});
</script> </script>
<style scoped> <style scoped>

2
frontend/src/store/player-element.ts
View File

@ -79,7 +79,7 @@ class PlayerElementStore extends CommonStore<PlayerElementState> {
/** /**
* Logic for applying custom subtitle track. * Logic for applying custom subtitle track.
* *
* Returns flase if subtitle devliery method isn't external * Returns false if subtitle delivery method isn't external
* or if device is iOS/Android. * or if device is iOS/Android.
*/ */
private get _useCustomSubtitleTrack(): boolean { private get _useCustomSubtitleTrack(): boolean {