diff --git a/client/components/AudioPlayer.vue b/client/components/AudioPlayer.vue index 597c9097..1a8cf911 100644 --- a/client/components/AudioPlayer.vue +++ b/client/components/AudioPlayer.vue @@ -8,7 +8,16 @@

{{ totalDurationPretty }}

-
+
+
+ format_list_bulleted +
+
+ format_list_bulleted +
+
+ +
@@ -58,6 +67,8 @@
@@ -66,7 +77,11 @@ import Hls from 'hls.js' export default { props: { - loading: Boolean + loading: Boolean, + chapters: { + type: Array, + default: () => [] + } }, data() { return { @@ -84,7 +99,8 @@ export default { audioEl: null, totalDuration: 0, seekedTime: 0, - seekLoading: false + seekLoading: false, + showChaptersModal: false } }, computed: { @@ -96,6 +112,10 @@ export default { } }, methods: { + selectChapter(chapter) { + this.seek(chapter.start) + this.showChaptersModal = false + }, seek(time) { if (this.loading) { return @@ -110,7 +130,7 @@ export default { } this.seekedTime = time this.seekLoading = true - console.warn('SEEK TO', this.$secondsToTimestamp(time)) + this.audioEl.currentTime = time if (this.$refs.playedTrack) { @@ -361,7 +381,7 @@ export default { xhr.setRequestHeader('Authorization', `Bearer ${this.token}`) } } - console.log('[AudioPlayer-Set] HLS Config', hlsOptions) + // console.log('[AudioPlayer-Set] HLS Config', hlsOptions) this.hlsInstance = new Hls(hlsOptions) var audio = this.$refs.audio audio.volume = this.volume @@ -386,10 +406,13 @@ export default { } }) this.hlsInstance.on(Hls.Events.DESTROYING, () => { - console.warn('[HLS] Destroying HLS Instance') + console.log('[HLS] Destroying HLS Instance') }) }) }, + showChapters() { + this.showChaptersModal = true + }, play() { if (!this.$refs.audio) { console.error('No Audio ref') @@ -410,7 +433,6 @@ export default { this.staleHlsInstance = this.hlsInstance this.staleHlsInstance.destroy() this.hlsInstance = null - console.log('Terminated HLS Instance', this.staleHlsInstance) } }, async resetStream(startTime) { diff --git a/client/components/app/StreamContainer.vue b/client/components/app/StreamContainer.vue index 3468db56..a45e2e9b 100644 --- a/client/components/app/StreamContainer.vue +++ b/client/components/app/StreamContainer.vue @@ -14,7 +14,7 @@ close - + @@ -49,6 +49,9 @@ export default { book() { return this.streamAudiobook ? this.streamAudiobook.book || {} : {} }, + chapters() { + return this.streamAudiobook ? this.streamAudiobook.chapters || [] : [] + }, title() { return this.book.title || 'No Title' }, @@ -94,7 +97,7 @@ export default { streamProgress(data) { if (!data.numSegments) return var chunks = data.chunks - console.log(`[STREAM-CONTAINER] Stream Progress ${data.percent}`) + console.log(`[StreamContainer] Stream Progress ${data.percent}`) if (this.$refs.audioPlayer) { this.$refs.audioPlayer.setChunksReady(chunks, data.numSegments) } else { @@ -104,7 +107,7 @@ export default { streamOpen(stream) { this.stream = stream if (this.$refs.audioPlayer) { - console.log('[STREAM-CONTAINER] streamOpen', stream) + console.log('[StreamContainer] streamOpen', stream) this.openStream() } else if (this.audioPlayerReady) { console.error('No Audio Ref') diff --git a/client/components/modals/ChaptersModal.vue b/client/components/modals/ChaptersModal.vue new file mode 100644 index 00000000..1a0a349a --- /dev/null +++ b/client/components/modals/ChaptersModal.vue @@ -0,0 +1,44 @@ + + + \ No newline at end of file diff --git a/client/components/modals/EditModal.vue b/client/components/modals/EditModal.vue index 163d03ac..a4fbbc20 100644 --- a/client/components/modals/EditModal.vue +++ b/client/components/modals/EditModal.vue @@ -46,6 +46,11 @@ export default { title: 'Tracks', component: 'modals-edit-tabs-tracks' }, + { + id: 'chapters', + title: 'Chapters', + component: 'modals-edit-tabs-chapters' + }, { id: 'download', title: 'Download', diff --git a/client/components/modals/Modal.vue b/client/components/modals/Modal.vue index 7b5609cb..aeb57b61 100644 --- a/client/components/modals/Modal.vue +++ b/client/components/modals/Modal.vue @@ -1,5 +1,5 @@