groove/audiobookshelf
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf.git synced 2026-07-12 12:21:34 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Initial transcription support

Browse source
This commit is contained in:
mfcar 2024-05-04 11:00:30 +01:00
parent 410801347c
commit b37a863c0a
No known key found for this signature in database
10 changed files with 227 additions and 63 deletions
Download patch file Download diff file Expand all files Collapse all files

21
client/components/app/MediaPlayerContainer.vue
View file

@ -1,5 +1,6 @@
<template>
<div v-if="streamLibraryItem" id="mediaPlayerContainer" class="w-full fixed bottom-0 left-0 right-0 h-48 lg:h-40 z-50 bg-primary px-2 lg:px-4 pb-1 lg:pb-4 pt-2">
<div v-if="streamLibraryItem" id="mediaPlayerContainer" class="w-full fixed bottom-0 left-0 right-0 z-50 bg-primary px-2 lg:px-4 pb-1 lg:pb-4 pt-2"
:class="[showTranscriptionUi ? 'h-64' : 'h-48', showTranscriptionUi ? 'lg:h-64' : 'lg:h-40']">
<div id="videoDock" />
<div class="absolute left-2 top-2 lg:left-4 cursor-pointer">
<covers-book-cover expand-on-click :library-item="streamLibraryItem" :width="bookCoverWidth" :book-cover-aspect-ratio="coverAspectRatio" />
@ -41,6 +42,7 @@
:sleep-timer-set="sleepTimerSet"
:sleep-timer-remaining="sleepTimerRemaining"
:is-podcast="isPodcast"
:transcription-enabled="showTranscriptionUi"
@playPause="playPause"
@jumpForward="jumpForward"
@jumpBackward="jumpBackward"
@ -51,8 +53,11 @@
@showBookmarks="showBookmarks"
@showSleepTimer="showSleepTimerModal = true"
@showPlayerQueueItems="showPlayerQueueItemsModal = true"
@showTranscription="showTranscriptionUi = !showTranscriptionUi"
/>
<transcription-ui v-if="showTranscriptionUi"></transcription-ui>
<modals-bookmarks-modal v-model="showBookmarksModal" :bookmarks="bookmarks" :current-time="bookmarkCurrentTime" :library-item-id="libraryItemId" @select="selectBookmark" />
<modals-sleep-timer-modal v-model="showSleepTimerModal" :timer-set="sleepTimerSet" :timer-time="sleepTimerTime" :remaining="sleepTimerRemaining" @set="setSleepTimer" @cancel="cancelSleepTimer" @increment="incrementSleepTimer" @decrement="decrementSleepTimer" />
@ -63,8 +68,10 @@
<script>
import PlayerHandler from '@/players/PlayerHandler'
import TranscriptionUi from "@/components/player/TranscriptionUi.vue";
export default {
components: {TranscriptionUi},
data() {
return {
playerHandler: new PlayerHandler(this),
@ -76,6 +83,7 @@ export default {
currentTime: 0,
showSleepTimerModal: false,
showPlayerQueueItemsModal: false,
showTranscriptionUi: false,
sleepTimerSet: false,
sleepTimerTime: 0,
sleepTimerRemaining: 0,
@ -86,6 +94,17 @@ export default {
coverAspectRatio: 1
}
},
watch: {
'playerHandler.playerState': function (newVal, oldVal) {
// Refresh the transcription UI when the player is changed
if (newVal === 'LOADED') {
this.showTranscriptionUi = false;
this.$nextTick(() => {
this.showTranscriptionUi = true;
});
}
},
},
computed: {
isSquareCover() {
return this.coverAspectRatio === 1