mirror/advplyr.audiobookshelf
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf.git synced 2025-08-01 16:54:59 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 6

Add:Library media type selection and library icons

Browse source
This commit is contained in:
advplyr 2022-03-03 19:03:34 -06:00
parent d3a8ecc8d1
commit 408775a25a
11 changed files with 235 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

18
client/components/modals/libraries/EditLibrary.vue
View file

@ -6,11 +6,14 @@
</div>
<div v-if="!showDirectoryPicker" class="w-full h-full py-4">
<div class="flex flex-wrap -mx-1">
<div class="w-full md:w-2/3 px-1">
<div class="flex flex-wrap md:flex-nowrap -mx-1">
<div class="w-full md:flex-grow px-1 py-1 md:py-0">
<ui-text-input-with-label v-model="name" label="Library Name" />
</div>
<div class="w-full md:w-1/3 px-1">
<div class="w-1/2 md:w-72 px-1 py-1 md:py-0">
<ui-media-type-picker v-model="mediaType" />
</div>
<div class="w-1/2 md:w-72 px-1 py-1 md:py-0">
<ui-dropdown v-model="provider" :items="providers" label="Metadata Provider" small />
</div>
</div>
@ -18,7 +21,6 @@
<div class="w-full py-4">
<p class="px-1 text-sm font-semibold">Folders</p>
<div v-for="(folder, index) in folders" :key="index" class="w-full flex items-center py-1 px-2">
<!-- <ui-text-input :value="folder.fullPath" type="text" class="w-full" /> -->
<span class="material-icons bg-opacity-50 mr-2 text-yellow-200" style="font-size: 1.2rem">folder</span>
<ui-editable-text v-model="folder.fullPath" type="text" class="w-full" />
<span v-show="folders.length > 1" class="material-icons ml-2 cursor-pointer hover:text-error" @click="removeFolder(folder)">close</span>
@ -60,6 +62,7 @@ export default {
return {
name: '',
provider: '',
mediaType: '',
folders: [],
showDirectoryPicker: false,
disableWatcher: false
@ -80,7 +83,7 @@ export default {
var newfolderpaths = this.folderPaths.join(',')
var origfolderpaths = this.library.folders.map((f) => f.fullPath).join(',')
return newfolderpaths === origfolderpaths && this.name === this.library.name && this.provider === this.library.provider && this.disableWatcher === this.library.disableWatcher
return newfolderpaths === origfolderpaths && this.name === this.library.name && this.provider === this.library.provider && this.disableWatcher === this.library.disableWatcher && this.mediaType === this.library.mediaType
},
providers() {
return this.$store.state.scanners.providers
@ -103,6 +106,7 @@ export default {
this.provider = this.library ? this.library.provider : ''
this.folders = this.library ? this.library.folders.map((p) => ({ ...p })) : []
this.disableWatcher = this.library ? !!this.library.disableWatcher : false
this.mediaType = this.library ? this.library.mediaType : 'default'
this.showDirectoryPicker = false
},
selectFolder(fullPath) {
@ -129,6 +133,8 @@ export default {
name: this.name,
provider: this.provider,
folders: this.folders,
mediaType: this.mediaType,
icon: this.mediaType,
disableWatcher: this.disableWatcher
}
@ -163,6 +169,8 @@ export default {
name: this.name,
provider: this.provider,
folders: this.folders,
mediaType: this.mediaType,
icon: this.mediaType,
disableWatcher: this.disableWatcher
}

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

@ -1,9 +1,7 @@
<template>
<div class="w-full px-4 h-12 border border-white border-opacity-10 flex items-center relative -mt-px" :class="selected ? 'bg-primary bg-opacity-50' : 'hover:bg-primary hover:bg-opacity-25'" @mouseover="mouseover = true" @mouseleave="mouseover = false">
<div v-show="selected" class="absolute top-0 left-0 h-full w-0.5 bg-warning z-10" />
<svg v-if="!libraryScan" xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-white" :class="isHovering ? 'text-opacity-90' : 'text-opacity-50'" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4m0 5c0 2.21-3.582 4-8 4s-8-1.79-8-4" />
</svg>
<widgets-library-icon v-if="!libraryScan" :icon="library.icon" :size="6" class="text-white" :class="isHovering ? 'text-opacity-90' : 'text-opacity-50'" />
<svg v-else viewBox="0 0 24 24" class="h-6 w-6 text-white text-opacity-50 animate-spin">
<path fill="currentColor" d="M12,4V2A10,10 0 0,0 2,12H4A8,8 0 0,1 12,4Z" />
</svg>