groove/audiobookshelf
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf.git synced 2026-02-04 01:09:40 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 6

Support multi library 1.4.0

Browse source
This commit is contained in:
advplyr 2021-10-05 21:10:49 -05:00
parent a65f7e6fad
commit d9d34e87e0
29 changed files with 452 additions and 188 deletions
Download patch file Download diff file Expand all files Collapse all files

7
client/components/app/BookShelfToolbar.vue
View file

@ -81,14 +81,17 @@ export default {
set(val) {
this.$store.commit('audiobooks/setKeywordFilter', val)
}
},
currentLibraryId() {
return this.$store.state.libraries.currentLibraryId
}
},
methods: {
searchBackArrow() {
this.$router.replace('/library')
this.$router.replace(`/library/${this.currentLibraryId}/bookshelf`)
},
seriesBackArrow() {
this.$router.replace('/library/series')
this.$router.replace(`/library/${this.currentLibraryId}/bookshelf/series`)
this.$emit('update:selectedSeries', null)
},
updateOrder() {

5
client/components/app/StreamContainer.vue
View file

@ -63,12 +63,15 @@ export default {
},
playlistUrl() {
return this.stream ? this.stream.clientPlaylistUri : null
},
libraryId() {
return this.streamAudiobook ? this.streamAudiobook.libraryId : null
}
},
methods: {
filterByAuthor() {
if (this.$route.name !== 'index') {
this.$router.push('/library')
this.$router.push(`/library/${this.libraryId || this.$store.state.libraries.currentLibraryId}/bookshelf`)
}
var settingsUpdate = {
filterBy: `authors.${this.$encode(this.author)}`

5
client/components/controls/GlobalSearch.vue
View file

@ -50,12 +50,15 @@ export default {
computed: {
audiobooks() {
return this.$store.state.audiobooks.audiobooks
},
currentLibraryId() {
return this.$store.state.libraries.currentLibraryId
}
},
methods: {
submitSearch() {
if (!this.search) return
this.$router.push(`/library/search?query=${this.search}`)
this.$router.push(`/library/${this.currentLibraryId}/bookshelf/search?query=${this.search}`)
this.search = null
this.items = []

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

@ -33,7 +33,7 @@
<template v-for="cover in localCovers">
<div :key="cover.path" class="m-0.5 border-2 border-transparent hover:border-yellow-300 cursor-pointer" :class="cover.localPath === imageUrl ? 'border-yellow-300' : ''" @click="setCover(cover.localPath)">
<div class="h-24 bg-primary" style="width: 60px">
<img :src="cover.localPath" class="h-full w-full object-contain" />
<img :src="`${cover.localPath}?token=${userToken}`" class="h-full w-full object-contain" />
</div>
</div>
</template>
@ -124,21 +124,31 @@ export default {
this.$emit('update:processing', val)
}
},
audiobookId() {
return this.audiobook ? this.audiobook.id : null
},
book() {
return this.audiobook ? this.audiobook.book || {} : {}
},
audiobookPath() {
return this.audiobook ? this.audiobook.path : null
},
otherFiles() {
return this.audiobook ? this.audiobook.otherFiles || [] : []
},
userCanUpload() {
return this.$store.getters['user/getUserCanUpload']
},
userToken() {
return this.$store.getters['user/getToken']
},
localCovers() {
return this.otherFiles
.filter((f) => f.filetype === 'image')
.map((file) => {
var _file = { ...file }
_file.localPath = Path.join('local', _file.path)
var imgRelPath = _file.path.replace(this.audiobookPath, '')
_file.localPath = `/s/book/${this.audiobookId}${imgRelPath}`
return _file
})
}

13
client/components/modals/edit-tabs/Details.vue
View file

@ -60,8 +60,8 @@
<ui-btn v-if="isRootUser" :loading="savingMetadata" color="bg" type="button" class="h-full" small @click.stop.prevent="saveMetadata">Save Metadata</ui-btn>
</ui-tooltip>
<ui-tooltip text="(Root User Only) Rescan audiobook including metadata" direction="bottom" class="ml-4">
<ui-btn v-if="isRootUser" :loading="rescanning" color="bg" type="button" class="h-full" small @click.stop.prevent="rescan">Re-Scan</ui-btn>
<ui-tooltip :disabled="libraryScan" text="(Root User Only) Rescan audiobook including metadata" direction="bottom" class="ml-4">
<ui-btn v-if="isRootUser" :loading="rescanning" :disabled="libraryScan" color="bg" type="button" class="h-full" small @click.stop.prevent="rescan">Re-Scan</ui-btn>
</ui-tooltip>
<div class="flex-grow" />
@ -138,6 +138,13 @@ export default {
},
series() {
return this.$store.state.audiobooks.series
},
libraryId() {
return this.audiobook ? this.audiobook.libraryId : null
},
libraryScan() {
if (!this.libraryId) return null
return this.$store.getters['scanners/getLibraryScan'](this.libraryId)
}
},
methods: {
@ -207,6 +214,8 @@ export default {
this.details.volumeNumber = this.book.volumeNumber
this.details.publishYear = this.book.publishYear
console.log('INIT', this.details)
this.newTags = this.audiobook.tags || []
},
resetProgress() {

21
client/components/modals/edit-tabs/Tracks.vue
View file

@ -13,7 +13,7 @@
<th class="text-left">Duration</th>
<th v-if="showDownload" class="text-center">Download</th>
</tr>
<template v-for="track in tracks">
<template v-for="track in tracksCleaned">
<tr :key="track.index">
<td class="text-center">
<p>{{ track.index }}</p>
@ -28,7 +28,7 @@
{{ $secondsToTimestamp(track.duration) }}
</td>
<td v-if="showDownload" class="font-mono text-center">
<a :href="`/local/${track.path}`" download><span class="material-icons icon-text">download</span></a>
<a :href="`/s/book/${audiobook.id}/${track.relativePath}?token=${userToken}`" download><span class="material-icons icon-text">download</span></a>
</td>
</tr>
</template>
@ -59,6 +59,23 @@ export default {
}
},
computed: {
audiobookPath() {
return this.audiobook.path
},
tracksCleaned() {
return this.tracks.map((track) => {
var trackPath = track.path.replace(/\\/g, '/')
var audiobookPath = this.audiobookPath.replace(/\\/g, '/')
return {
...track,
relativePath: trackPath.replace(audiobookPath)
}
})
},
userToken() {
return this.$store.getters['user/getToken']
},
userCanUpdate() {
return this.$store.getters['user/getUserCanUpdate']
},

4
client/components/modals/libraries/LibraryItem.vue
View file

@ -10,8 +10,8 @@
<p class="text-xl font-book pl-4" :class="mouseover ? 'underline' : ''">{{ library.name }}</p>
<div class="flex-grow" />
<ui-btn v-show="mouseover && !libraryScan && canScan" small color="bg" @click.stop="scan">Scan</ui-btn>
<span v-show="mouseover && showEdit && canEdit" class="material-icons text-xl text-gray-300 hover:text-gray-50 ml-4" @click.stop="editClick">edit</span>
<span v-show="mouseover && showEdit && canDelete" class="material-icons text-xl text-gray-300 ml-3" :class="isMain ? 'text-opacity-5 cursor-not-allowed' : 'hover:text-gray-50'" @click.stop="deleteClick">delete</span>
<span v-show="mouseover && !libraryScan && showEdit && canEdit" class="material-icons text-xl text-gray-300 hover:text-gray-50 ml-4" @click.stop="editClick">edit</span>
<span v-show="!libraryScan && mouseover && showEdit && canDelete" class="material-icons text-xl text-gray-300 ml-3" :class="isMain ? 'text-opacity-5 cursor-not-allowed' : 'hover:text-gray-50'" @click.stop="deleteClick">delete</span>
</div>
</template>

29
client/components/tables/TracksTable.vue
View file

@ -21,7 +21,7 @@
<th class="text-left">Duration</th>
<th v-if="userCanDownload" class="text-center">Download</th>
</tr>
<template v-for="track in tracks">
<template v-for="track in tracksCleaned">
<tr :key="track.index">
<td class="text-center">
<p>{{ track.index }}</p>
@ -36,7 +36,7 @@
{{ $secondsToTimestamp(track.duration) }}
</td>
<td v-if="userCanDownload" class="text-center">
<a :href="`/local/${track.path}`" download><span class="material-icons icon-text">download</span></a>
<a :href="`/s/book/${audiobook.id}/${track.relativePath}?token=${userToken}`" download><span class="material-icons icon-text">download</span></a>
</td>
</tr>
</template>
@ -53,7 +53,10 @@ export default {
type: Array,
default: () => []
},
audiobookId: String
audiobook: {
type: Object,
default: () => null
}
},
data() {
return {
@ -61,6 +64,26 @@ export default {
}
},
computed: {
audiobookId() {
return this.audiobook.id
},
audiobookPath() {
return this.audiobook.path
},
tracksCleaned() {
return this.tracks.map((track) => {
var trackPath = track.path.replace(/\\/g, '/')
var audiobookPath = this.audiobookPath.replace(/\\/g, '/')
return {
...track,
relativePath: trackPath.replace(audiobookPath)
}
})
},
userToken() {
return this.$store.getters['user/getToken']
},
userCanDownload() {
return this.$store.getters['user/getUserCanDownload']
},

15
client/components/ui/Dropdown.vue
View file

@ -1,7 +1,7 @@
<template>
<div class="relative w-44" v-click-outside="clickOutside">
<div class="relative w-full" v-click-outside="clickOutside">
<p class="text-sm text-opacity-75 mb-1">{{ label }}</p>
<button type="button" class="relative w-full bg-fg border border-gray-500 rounded shadow-sm pl-3 pr-10 py-2 text-left focus:outline-none sm:text-sm cursor-pointer" aria-haspopup="listbox" aria-expanded="true" @click.stop.prevent="showMenu = !showMenu">
<button type="button" :disabled="disabled" class="relative h-10 w-full bg-fg border border-gray-500 rounded shadow-sm pl-3 pr-10 py-2 text-left focus:outline-none sm:text-sm cursor-pointer" aria-haspopup="listbox" aria-expanded="true" @click.stop.prevent="clickShowMenu">
<span class="flex items-center">
<span class="block truncate">{{ selectedText }}</span>
</span>
@ -11,11 +11,11 @@
</button>
<transition name="menu">
<ul v-show="showMenu" class="absolute z-10 -mt-px w-full bg-primary border border-black-200 shadow-lg max-h-56 rounded-b-md py-1 text-base ring-1 ring-black ring-opacity-5 overflow-auto focus:outline-none sm:text-sm" tabindex="-1" role="listbox" aria-activedescendant="listbox-option-3">
<ul v-show="showMenu" class="absolute z-10 -mt-px w-full bg-primary border border-black-200 shadow-lg max-h-56 rounded-b-md py-1 ring-1 ring-black ring-opacity-5 overflow-auto focus:outline-none sm:text-sm" tabindex="-1" role="listbox" aria-activedescendant="listbox-option-3">
<template v-for="item in items">
<li :key="item.value" class="text-gray-100 select-none relative py-2 cursor-pointer hover:bg-black-400" id="listbox-option-0" role="option" @click="clickedOption(item.value)">
<div class="flex items-center">
<span class="font-normal ml-3 block truncate font-sans">{{ item.text }}</span>
<span class="font-normal ml-3 block truncate font-sans text-sm">{{ item.text }}</span>
</div>
</li>
</template>
@ -35,7 +35,8 @@ export default {
items: {
type: Array,
default: () => []
}
},
disabled: Boolean
},
data() {
return {
@ -59,6 +60,10 @@ export default {
}
},
methods: {
clickShowMenu() {
if (this.disabled) return
this.showMenu = !this.showMenu
},
clickOutside() {
this.showMenu = false
},

14
client/components/ui/Tooltip.vue
View file

@ -20,6 +20,7 @@ export default {
data() {
return {
tooltip: null,
tooltipId: null,
isShowing: false
}
},
@ -45,13 +46,14 @@ export default {
'font-size': '0.75rem'
}
var size = this.$calculateTextSize(this.text, styles)
console.log('Text Size', size.width, size.height)
return size.width
},
createTooltip() {
if (!this.$refs.box) return
var tooltip = document.createElement('div')
tooltip.className = 'absolute px-2 py-1 text-white pointer-events-none text-xs rounded shadow-lg max-w-xs'
this.tooltipId = String(Math.floor(Math.random() * 10000))
tooltip.id = this.tooltipId
tooltip.className = 'tooltip-wrapper absolute px-2 py-1 text-white pointer-events-none text-xs rounded shadow-lg max-w-xs'
tooltip.style.zIndex = 100
tooltip.style.backgroundColor = 'rgba(0,0,0,0.85)'
tooltip.innerHTML = this.text
@ -91,8 +93,14 @@ export default {
if (this.disabled) return
if (!this.tooltip) {
this.createTooltip()
if (!this.tooltip) return
}
if (!this.$refs.box) return // Ensure element is not destroyed
try {
document.body.appendChild(this.tooltip)
} catch (error) {
console.error(error)
}
document.body.appendChild(this.tooltip)
this.isShowing = true
},
hideTooltip() {

12
client/layouts/default.vue
View file

@ -67,6 +67,11 @@ export default {
if (payload.serverSettings) {
this.$store.commit('setServerSettings', payload.serverSettings)
}
if (payload.librariesScanning) {
payload.librariesScanning.forEach((libraryScan) => {
this.scanStart(libraryScan)
})
}
},
streamOpen(stream) {
if (this.$refs.streamContainer) this.$refs.streamContainer.streamOpen(stream)
@ -123,7 +128,7 @@ export default {
var existingScan = this.$store.getters['scanners/getLibraryScan'](data.id)
if (existingScan && !isNaN(existingScan.toastId)) {
this.$toast.update(existingScan.toastId, { content: message, options: { timeout: 5000, type: 'success', closeButton: false, position: 'bottom-center' } }, true)
this.$toast.update(existingScan.toastId, { content: message, options: { timeout: 5000, type: 'success', closeButton: false, position: 'bottom-center', onClose: () => null } }, true)
} else {
this.$toast.success(message, { timeout: 5000, position: 'bottom-center' })
}
@ -131,20 +136,19 @@ export default {
this.$store.commit('scanners/remove', data)
},
onScanToastCancel(id) {
console.log('On Scan Toast Cancel', id)
this.$root.socket.emit('cancel_scan', id)
},
scanStart(data) {
data.toastId = this.$toast(`Scanning "${data.name}"...`, { timeout: false, type: 'info', draggable: false, closeOnClick: false, closeButton: CloseButton, closeButtonClassName: 'cancel-scan-btn', showCloseButtonOnHover: false, position: 'bottom-center', onClose: () => this.onScanToastCancel(data.id) })
console.log('Scan start toast id', data.toastId)
this.$store.commit('scanners/addUpdate', data)
},
scanProgress(data) {
console.log('scan progress', data)
var existingScan = this.$store.getters['scanners/getLibraryScan'](data.id)
if (existingScan && !isNaN(existingScan.toastId)) {
data.toastId = existingScan.toastId
this.$toast.update(existingScan.toastId, { content: `Scanning "${existingScan.name}"... ${data.progress.progress || 0}%`, options: { timeout: false } }, true)
} else {
data.toastId = this.$toast(`Scanning "${data.name}"...`, { timeout: false, type: 'info', draggable: false, closeOnClick: false, closeButton: CloseButton, closeButtonClassName: 'cancel-scan-btn', showCloseButtonOnHover: false, position: 'bottom-center', onClose: () => this.onScanToastCancel(data.id) })
}
this.$store.commit('scanners/addUpdate', data)

2
client/package.json
View file

@ -1,6 +1,6 @@
{
"name": "audiobookshelf-client",
"version": "1.3.5",
"version": "1.4.0",
"description": "Audiobook manager and player",
"main": "index.js",
"scripts": {

6
client/pages/audiobook/_id/index.vue
View file

@ -11,7 +11,9 @@
<div class="flex-grow px-10">
<div class="flex">
<div class="mb-2">
<h1 class="text-2xl font-book leading-7">{{ title }}</h1>
<h1 class="text-2xl font-book leading-7">
{{ title }}<span v-if="isDeveloperMode"> ({{ audiobook.ino }})</span>
</h1>
<h3 v-if="series" class="font-book text-gray-300 text-lg leading-7">{{ seriesText }}</h3>
<div class="w-min">
<ui-tooltip :text="authorTooltipText" direction="bottom">
@ -84,7 +86,7 @@
</div>
</div>
<tables-tracks-table :tracks="tracks" :audiobook-id="audiobook.id" class="mt-6" />
<tables-tracks-table :tracks="tracks" :audiobook="audiobook" class="mt-6" />
<tables-audio-files-table v-if="otherAudioFiles.length" :audiobook-id="audiobook.id" :files="otherAudioFiles" class="mt-6" />

25
client/pages/config/index.vue
View file

@ -19,7 +19,7 @@
</div>
<div class="flex items-center py-2">
<ui-toggle-switch v-model="newServerSettings.scannerFindCovers" :disabled="updatingServerSettings" @input="updatingServerSettings" />
<ui-toggle-switch v-model="newServerSettings.scannerFindCovers" :disabled="updatingServerSettings" @input="updateScannerFindCovers" />
<ui-tooltip :text="scannerFindCoversTooltip">
<p class="pl-4 text-lg">Scanner find covers <span class="material-icons icon-text">info_outlined</span></p>
</ui-tooltip>
@ -123,8 +123,6 @@
</div>
<div class="fixed bottom-0 left-0 w-10 h-10" @dblclick="setDeveloperMode"></div>
</div>
</template>
@ -187,6 +185,11 @@ export default {
toggleShowExperimentalFeatures() {
this.$store.commit('setExperimentalFeatures', !this.showExperimentalFeatures)
},
updateScannerFindCovers(val) {
this.updateServerSettings({
scannerFindCovers: !!val
})
},
updateCoverStorageDestination(val) {
this.newServerSettings.coverDestination = val ? this.$constants.CoverDestination.AUDIOBOOK : this.$constants.CoverDestination.METADATA
this.updateServerSettings({
@ -194,10 +197,9 @@ export default {
})
},
updateScannerParseSubtitle(val) {
var payload = {
scannerParseSubtitle: val
}
this.updateServerSettings(payload)
this.updateServerSettings({
scannerParseSubtitle: !!val
})
},
updateServerSettings(payload) {
this.updatingServerSettings = true
@ -216,15 +218,6 @@ export default {
var value = !this.$store.state.developerMode
this.$store.commit('setDeveloperMode', value)
this.$toast.info(`Developer Mode ${value ? 'Enabled' : 'Disabled'}`)
this.$axios
.$get('/test-fs')
.then((res) => {
console.log('Test FS Result', res)
})
.catch((error) => {
console.error('Failed to test FS', error)
})
},
scan() {
this.$root.socket.emit('scan', this.$store.state.libraries.currentLibraryId)

4
client/pages/config/log.vue
View file

@ -4,7 +4,9 @@
<div class="mb-4 flex items-center justify-between">
<p class="text-2xl">Logger</p>
<ui-dropdown v-model="newServerSettings.logLevel" label="Server Log Level" :items="logLevelItems" @input="logLevelUpdated" />
<div class="w-44">
<ui-dropdown v-model="newServerSettings.logLevel" label="Server Log Level" :items="logLevelItems" @input="logLevelUpdated" />
</div>
</div>
<div class="relative">

2
client/pages/login.vue
View file

@ -37,7 +37,7 @@ export default {
if (this.$route.query.redirect) {
this.$router.replace(this.$route.query.redirect)
} else {
this.$router.replace('/')
this.$router.replace(`/library/${this.$store.state.libraries.currentLibraryId}`)
}
}
}

81
client/pages/upload/index.vue
View file

@ -4,6 +4,15 @@
<article class="max-h-full overflow-y-auto relative flex flex-col rounded-md" @drop="drop" @dragover="dragover" @dragleave="dragleave" @dragenter="dragenter">
<h1 class="text-xl font-book px-8 pt-4 pb-2">Audiobook Uploader</h1>
<div class="flex my-2 px-6">
<div class="w-1/3 px-2">
<!-- <ui-text-input-with-label v-model="title" label="Title" /> -->
<ui-dropdown v-model="selectedLibraryId" :items="libraryItems" label="Library" @input="libraryChanged" />
</div>
<div class="w-2/3 px-2">
<ui-dropdown v-model="selectedFolderId" :items="folderItems" :disabled="!selectedLibraryId" label="Folder" />
</div>
</div>
<div class="flex my-2 px-6">
<div class="w-1/2 px-2">
<ui-text-input-with-label v-model="title" label="Title" />
@ -127,7 +136,9 @@ export default {
showUploader: true,
validAudioFiles: [],
validImageFiles: [],
invalidFiles: []
invalidFiles: [],
selectedLibraryId: null,
selectedFolderId: null
}
},
computed: {
@ -140,13 +151,55 @@ export default {
directory() {
if (!this.author || !this.title) return ''
if (this.series) {
return Path.join('/audiobooks', this.author, this.series, this.title)
return Path.join(this.author, this.series, this.title)
} else {
return Path.join('/audiobooks', this.author, this.title)
return Path.join(this.author, this.title)
}
},
libraries() {
return this.$store.state.libraries.libraries
},
libraryItems() {
return this.libraries.map((lib) => {
return {
value: lib.id,
text: lib.name
}
})
},
selectedLibrary() {
return this.libraries.find((lib) => lib.id === this.selectedLibraryId)
},
selectedFolder() {
if (!this.selectedLibrary) return null
return this.selectedLibrary.folders.find((fold) => fold.id === this.selectedFolderId)
},
folderItems() {
if (!this.selectedLibrary) return []
return this.selectedLibrary.folders.map((fold) => {
return {
value: fold.id,
text: fold.fullPath
}
})
}
},
methods: {
libraryChanged() {
if (!this.selectedLibrary && this.selectedFolderId) {
this.selectedFolderId = null
} else if (this.selectedFolderId) {
if (!this.selectedLibrary.folders.find((fold) => fold.id === this.selectedFolderId)) {
this.selectedFolderId = null
}
}
this.setDefaultFolder()
},
setDefaultFolder() {
if (!this.selectedFolderId && this.selectedLibrary && this.selectedLibrary.folders.length) {
this.selectedFolderId = this.selectedLibrary.folders[0].id
}
},
reset() {
this.title = ''
this.author = ''
@ -218,12 +271,18 @@ export default {
this.$toast.error('Must enter a title and author')
return
}
if (!this.selectedLibraryId || !this.selectedFolderId) {
this.$toast.error('Must select a library and folder')
return
}
this.processing = true
var form = new FormData()
form.set('title', this.title)
form.set('author', this.author)
form.set('series', this.series)
form.set('library', this.selectedLibraryId)
form.set('folder', this.selectedFolderId)
var index = 0
var files = this.validAudioFiles.concat(this.validImageFiles)
@ -234,21 +293,21 @@ export default {
this.$axios
.$post('/upload', form)
.then((data) => {
if (data.error) {
this.$toast.error(data.error)
} else {
this.$toast.success('Audiobook Uploaded Successfully')
this.reset()
}
this.$toast.success('Audiobook Uploaded Successfully')
this.reset()
this.processing = false
})
.catch((error) => {
console.error('Failed', error)
this.$toast.error('Oops, something went wrong...')
var errorMessage = error.response && error.response.data ? error.response.data : 'Oops, something went wrong...'
this.$toast.error(errorMessage)
this.processing = false
})
}
},
mounted() {}
mounted() {
this.selectedLibraryId = this.$store.state.libraries.currentLibraryId
this.setDefaultFolder()
}
}
</script>

3
client/store/index.js
View file

@ -35,7 +35,7 @@ export const actions = {
}
return this.$axios.$patch('/api/serverSettings', updatePayload).then((result) => {
if (result.success) {
commit('setServerSettings', result.settings)
commit('setServerSettings', result.serverSettings)
return true
} else {
return false
@ -78,6 +78,7 @@ export const mutations = {
state.versionData = versionData
},
setServerSettings(state, settings) {
if (!settings) return
state.serverSettings = settings
},
setStreamAudiobook(state, audiobook) {