diff --git a/client/components/cards/BookMatchCard.vue b/client/components/cards/BookMatchCard.vue index dd782d30..77619e55 100644 --- a/client/components/cards/BookMatchCard.vue +++ b/client/components/cards/BookMatchCard.vue @@ -15,8 +15,8 @@
by {{ book.author }}
Narrated by {{ book.narrator }}
-Runtime: {{ $elapsedPrettyExtended(book.duration * 60) }}
-Runtime: {{ $elapsedPrettyExtended(bookDuration, false) }} {{ bookDurationComparison }}
+{{ series.series }} #{{ series.sequence }} @@ -29,9 +29,7 @@
by {{ book.author }}
{{ book.genres.join(', ') }}
@@ -56,7 +54,8 @@ export default { default: () => {} }, isPodcast: Boolean, - bookCoverAspectRatio: Number + bookCoverAspectRatio: Number, + currentBookDuration: Number }, data() { return { @@ -65,12 +64,27 @@ export default { }, computed: { bookCovers() { - return this.book.covers ? this.book.covers || [] : [] + return this.book.covers || [] + }, + bookDuration() { + return (this.book.duration || 0) * 60 + }, + bookDurationComparison() { + if (!this.bookDuration || !this.currentBookDuration) return '' + let differenceInSeconds = this.currentBookDuration - this.bookDuration + // Only show seconds on difference if difference is less than an hour + if (differenceInSeconds < 0) { + differenceInSeconds = Math.abs(differenceInSeconds) + return `(${this.$elapsedPrettyExtended(differenceInSeconds, false, differenceInSeconds < 3600)} shorter)` + } else if (differenceInSeconds > 0) { + return `(${this.$elapsedPrettyExtended(differenceInSeconds, false, differenceInSeconds < 3600)} longer)` + } + return '(exact match)' } }, methods: { selectMatch() { - var book = { ...this.book } + const book = { ...this.book } book.cover = this.selectedCover this.$emit('select', book) }, diff --git a/client/components/modals/item/tabs/Match.vue b/client/components/modals/item/tabs/Match.vue index 0c5d67eb..1c682919 100644 --- a/client/components/modals/item/tabs/Match.vue +++ b/client/components/modals/item/tabs/Match.vue @@ -22,7 +22,7 @@