mirror/advplyr.audiobookshelf
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf.git synced 2025-07-25 21:35:07 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 7

Update book finder and cover matching - includes LibGen provider

Browse source
This commit is contained in:
Mark Cooper 2021-08-21 09:15:44 -05:00
parent be7e2576f1
commit 30700c1eb0
14 changed files with 379 additions and 76 deletions
Download patch file Download diff file Expand all files Collapse all files

65
client/components/modals/edit-tabs/Cover.vue
View file

@ -2,13 +2,35 @@
<div class="w-full h-full">
<div class="flex">
<cards-book-cover :audiobook="audiobook" />
<div class="flex-grow px-8">
<div class="flex-grow pl-6 pr-2">
<form @submit.prevent="submitForm">
<div class="flex items-center">
<ui-text-input-with-label v-model="imageUrl" label="Cover Image URL" />
<ui-btn color="success" type="submit" :padding-x="4" class="mt-5 ml-4">Update</ui-btn>
<ui-btn color="success" type="submit" :padding-x="4" class="mt-5 ml-3 w-24">Update</ui-btn>
</div>
</form>
<form @submit.prevent="submitSearchForm">
<div class="flex items-center justify-start -mx-1 py-2 mt-2">
<div class="flex-grow px-1">
<ui-text-input-with-label v-model="searchTitle" label="Search Title" placeholder="Search" :disabled="processing" />
</div>
<div class="flex-grow px-1">
<ui-text-input-with-label v-model="searchAuthor" label="Author" :disabled="processing" />
</div>
<div class="w-24 px-1">
<ui-btn type="submit" class="mt-5 w-full" :padding-x="0">Search</ui-btn>
</div>
</div>
</form>
<div v-if="hasSearched" class="flex items-center flex-wrap justify-center max-h-72 overflow-y-scroll mt-2 max-w-full">
<p v-if="!coversFound.length">No Covers Found</p>
<template v-for="cover in coversFound">
<div :key="cover" class="m-0.5 border-2 border-transparent hover:border-yellow-300 cursor-pointer" :class="cover === imageUrl ? 'border-yellow-300' : ''" @click="setCover(cover)">
<img :src="cover" class="h-24 object-cover" style="width: 60px" />
</div>
</template>
</div>
</div>
</div>
</div>
@ -25,7 +47,11 @@ export default {
},
data() {
return {
imageUrl: null
searchTitle: null,
searchAuthor: null,
imageUrl: null,
coversFound: [],
hasSearched: false
}
},
watch: {
@ -51,14 +77,22 @@ export default {
},
methods: {
init() {
if (this.coversFound.length && (this.searchTitle !== this.book.title || this.searchAuthor !== this.book.author)) {
this.coversFound = []
this.hasSearched = false
}
this.imageUrl = this.book.cover || ''
this.searchTitle = this.book.title || ''
this.searchAuthor = this.book.author || ''
},
async submitForm() {
console.log('Submit form', this.details)
submitForm() {
this.updateCover(this.imageUrl)
},
async updateCover(cover) {
this.isProcessing = true
const updatePayload = {
book: {
cover: this.imageUrl
cover: cover
}
}
var updatedAudiobook = await this.$axios.$patch(`/api/audiobook/${this.audiobook.id}`, updatePayload).catch((error) => {
@ -71,6 +105,25 @@ export default {
this.$toast.success('Update Successful')
this.$emit('close')
}
},
getSearchQuery() {
var searchQuery = `provider=best&title=${this.searchTitle}`
if (this.searchAuthor) searchQuery += `&author=${this.searchAuthor}`
return searchQuery
},
async submitSearchForm() {
this.isProcessing = true
var searchQuery = this.getSearchQuery()
var results = await this.$axios.$get(`/api/find/covers?${searchQuery}`).catch((error) => {
console.error('Failed', error)
return []
})
this.coversFound = results
this.isProcessing = false
this.hasSearched = true
},
setCover(cover) {
this.updateCover(cover)
}
}
}