mirror of
https://github.com/advplyr/audiobookshelf.git
synced 2026-07-27 03:31:46 +00:00
Merge branch 'master' into social
This commit is contained in:
Ben
GitHub
commit
12b7976ef3
245 changed files with 11554 additions and 3676 deletions
|
|
@ -2,15 +2,16 @@
|
|||
<div class="w-full h-full">
|
||||
<div class="bg-bg rounded-md shadow-lg border border-white border-opacity-5 p-4 mb-8">
|
||||
<div class="flex items-center mb-2">
|
||||
<h1 class="text-xl">Backups</h1>
|
||||
<h1 class="text-xl">{{ $strings.HeaderBackups }}</h1>
|
||||
</div>
|
||||
|
||||
<p class="text-base mb-4 text-gray-300">Backups include users, user progress, library item details, server settings, and images stored in <span class="font-mono text-gray-100">/metadata/items</span> & <span class="font-mono text-gray-100">/metadata/authors</span>. <br />Backups <strong>do not</strong> include any files stored in your library folders.</p>
|
||||
<p class="text-base mb-2 text-gray-300">{{ $strings.MessageBackupsDescription }} <span class="font-mono text-gray-100">/metadata/items</span> & <span class="font-mono text-gray-100">/metadata/authors</span>.</p>
|
||||
<p class="text-base mb-4 text-gray-300">{{ $strings.MessageBackupsNote }}</p>
|
||||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-toggle-switch v-model="enableBackups" small :disabled="updatingServerSettings" @input="updateBackupsSettings" />
|
||||
<ui-tooltip :text="backupsTooltip">
|
||||
<p class="pl-4 text-lg">Enable automatic backups <span class="material-icons icon-text">info_outlined</span></p>
|
||||
<ui-tooltip :text="$strings.LabelBackupsEnableAutomaticBackupsHelp">
|
||||
<p class="pl-4 text-lg">{{ $strings.LabelBackupsEnableAutomaticBackups }} <span class="material-icons icon-text">info_outlined</span></p>
|
||||
</ui-tooltip>
|
||||
</div>
|
||||
|
||||
|
|
@ -25,14 +26,16 @@
|
|||
<div class="flex items-center py-2">
|
||||
<ui-text-input type="number" v-model="backupsToKeep" no-spinner :disabled="updatingServerSettings" :padding-x="1" text-center class="w-10" @change="updateBackupsSettings" />
|
||||
|
||||
<p class="pl-4 text-lg">Number of backups to keep</p>
|
||||
<ui-tooltip :text="$strings.LabelBackupsNumberToKeepHelp">
|
||||
<p class="pl-4 text-lg">{{ $strings.LabelBackupsNumberToKeep }} <span class="material-icons icon-text">info_outlined</span></p>
|
||||
</ui-tooltip>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-text-input type="number" v-model="maxBackupSize" no-spinner :disabled="updatingServerSettings" :padding-x="1" text-center class="w-10" @change="updateBackupsSettings" />
|
||||
|
||||
<ui-tooltip :text="maxBackupSizeTooltip">
|
||||
<p class="pl-4 text-lg">Maximum backup size (in GB) <span class="material-icons icon-text">info_outlined</span></p>
|
||||
<ui-tooltip :text="$strings.LabelBackupsMaxBackupSizeHelp">
|
||||
<p class="pl-4 text-lg">{{ $strings.LabelBackupsMaxBackupSize }} <span class="material-icons icon-text">info_outlined</span></p>
|
||||
</ui-tooltip>
|
||||
</div>
|
||||
|
||||
|
|
@ -65,12 +68,6 @@ export default {
|
|||
}
|
||||
},
|
||||
computed: {
|
||||
backupsTooltip() {
|
||||
return 'Backups saved in /metadata/backups'
|
||||
},
|
||||
maxBackupSizeTooltip() {
|
||||
return 'As a safeguard against misconfiguration, backups will fail if they exceed the configured size.'
|
||||
},
|
||||
serverSettings() {
|
||||
return this.$store.state.serverSettings
|
||||
},
|
||||
|
|
|
|||
|
|
@ -2,19 +2,19 @@
|
|||
<div>
|
||||
<div class="bg-bg rounded-md shadow-lg border border-white border-opacity-5 p-4 mb-2">
|
||||
<div class="mb-2">
|
||||
<h1 class="text-xl">Settings</h1>
|
||||
<h1 class="text-xl">{{ $strings.HeaderSettings }}</h1>
|
||||
</div>
|
||||
|
||||
<div class="lg:flex">
|
||||
<div class="flex-1">
|
||||
<div class="pt-4">
|
||||
<h2 class="font-semibold">General</h2>
|
||||
<h2 class="font-semibold">{{ $strings.HeaderSettingsGeneral }}</h2>
|
||||
</div>
|
||||
<div class="flex items-end py-2">
|
||||
<ui-toggle-switch v-model="newServerSettings.storeCoverWithItem" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('storeCoverWithItem', val)" />
|
||||
<ui-tooltip :text="tooltips.storeCoverWithItem">
|
||||
<ui-tooltip :text="$strings.LabelSettingsStoreCoversWithItemHelp">
|
||||
<p class="pl-4">
|
||||
Store covers with item
|
||||
{{ $strings.LabelSettingsStoreCoversWithItem }}
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
|
|
@ -22,9 +22,9 @@
|
|||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-toggle-switch v-model="newServerSettings.storeMetadataWithItem" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('storeMetadataWithItem', val)" />
|
||||
<ui-tooltip :text="tooltips.storeMetadataWithItem">
|
||||
<ui-tooltip :text="$strings.LabelSettingsStoreMetadataWithItemHelp">
|
||||
<p class="pl-4">
|
||||
Store metadata with item
|
||||
{{ $strings.LabelSettingsStoreMetadataWithItem }}
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
|
|
@ -32,20 +32,20 @@
|
|||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-toggle-switch v-model="newServerSettings.sortingIgnorePrefix" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('sortingIgnorePrefix', val)" />
|
||||
<ui-tooltip :text="tooltips.sortingIgnorePrefix">
|
||||
<ui-tooltip :text="$strings.LabelSettingsSortingIgnorePrefixesHelp">
|
||||
<p class="pl-4">
|
||||
Ignore prefixes when sorting
|
||||
{{ $strings.LabelSettingsSortingIgnorePrefixes }}
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
</div>
|
||||
<div v-if="newServerSettings.sortingIgnorePrefix" class="w-72 ml-14 mb-2">
|
||||
<ui-multi-select v-model="newServerSettings.sortingPrefixes" small :items="newServerSettings.sortingPrefixes" label="Prefixes to Ignore (case insensitive)" @input="updateSortingPrefixes" :disabled="updatingServerSettings" />
|
||||
<ui-multi-select v-model="newServerSettings.sortingPrefixes" small :items="newServerSettings.sortingPrefixes" :label="$strings.LabelPrefixesToIgnore" @input="updateSortingPrefixes" :disabled="updatingServerSettings" />
|
||||
</div>
|
||||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-toggle-switch v-model="newServerSettings.chromecastEnabled" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('chromecastEnabled', val)" />
|
||||
<p class="pl-4">Chromecast support</p>
|
||||
<p class="pl-4">{{ $strings.LabelSettingsChromecastSupport }}</p>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center py-2">
|
||||
|
|
@ -59,45 +59,50 @@
|
|||
</div>
|
||||
|
||||
<div class="pt-4">
|
||||
<h2 class="font-semibold">Display</h2>
|
||||
<h2 class="font-semibold">{{ $strings.HeaderSettingsDisplay }}</h2>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-toggle-switch v-model="homeUseAlternativeBookshelfView" :disabled="updatingServerSettings" @input="updateHomeAlternativeBookshelfView" />
|
||||
<ui-tooltip :text="tooltips.bookshelfView">
|
||||
<ui-toggle-switch v-model="homepageUseBookshelfView" :disabled="updatingServerSettings" @input="updateHomeUseBookshelfView" />
|
||||
<ui-tooltip :text="$strings.LabelSettingsBookshelfViewHelp">
|
||||
<p class="pl-4">
|
||||
Alternative bookshelf view for home page
|
||||
{{ $strings.LabelSettingsHomePageBookshelfView }}
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-toggle-switch v-model="useAlternativeBookshelfView" :disabled="updatingServerSettings" @input="updateAlternativeBookshelfView" />
|
||||
<ui-tooltip :text="tooltips.bookshelfView">
|
||||
<ui-toggle-switch v-model="useBookshelfView" :disabled="updatingServerSettings" @input="updateUseBookshelfView" />
|
||||
<ui-tooltip :text="$strings.LabelSettingsBookshelfViewHelp">
|
||||
<p class="pl-4">
|
||||
Alternative bookshelf view
|
||||
{{ $strings.LabelSettingsLibraryBookshelfView }}
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center py-2">
|
||||
<p class="pr-4">Date Format</p>
|
||||
<ui-dropdown v-model="newServerSettings.dateFormat" :items="dateFormats" small class="max-w-40" @input="(val) => updateSettingsKey('dateFormat', val)" />
|
||||
<div class="py-2">
|
||||
<p class="px-1 text-sm font-semibold">{{ $strings.LabelSettingsDateFormat }}</p>
|
||||
<ui-dropdown v-model="newServerSettings.dateFormat" :items="dateFormats" small class="max-w-52" @input="(val) => updateSettingsKey('dateFormat', val)" />
|
||||
</div>
|
||||
|
||||
<div class="py-2">
|
||||
<p class="px-1 text-sm font-semibold">{{ $strings.LabelLanguageDefaultServer }}</p>
|
||||
<ui-dropdown ref="langDropdown" v-model="newServerSettings.language" :items="$languageCodeOptions" small class="max-w-52" @input="updateServerLanguage" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex-1">
|
||||
<div class="pt-4">
|
||||
<h2 class="font-semibold">Scanner</h2>
|
||||
<h2 class="font-semibold">{{ $strings.HeaderSettingsScanner }}</h2>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-toggle-switch v-model="newServerSettings.scannerParseSubtitle" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('scannerParseSubtitle', val)" />
|
||||
<ui-tooltip :text="tooltips.scannerParseSubtitle">
|
||||
<ui-tooltip :text="$strings.LabelSettingsParseSubtitlesHelp">
|
||||
<p class="pl-4">
|
||||
Parse subtitles
|
||||
{{ $strings.LabelSettingsParseSubtitles }}
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
|
|
@ -105,9 +110,9 @@
|
|||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-toggle-switch v-model="newServerSettings.scannerFindCovers" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('scannerFindCovers', val)" />
|
||||
<ui-tooltip :text="tooltips.scannerFindCovers">
|
||||
<ui-tooltip :text="$strings.LabelSettingsFindCoversHelp">
|
||||
<p class="pl-4">
|
||||
Find covers
|
||||
{{ $strings.LabelSettingsFindCovers }}
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
|
|
@ -119,9 +124,9 @@
|
|||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-toggle-switch v-model="newServerSettings.scannerPreferOverdriveMediaMarker" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('scannerPreferOverdriveMediaMarker', val)" />
|
||||
<ui-tooltip :text="tooltips.scannerPreferOverdriveMediaMarker">
|
||||
<ui-tooltip :text="$strings.LabelSettingsOverdriveMediaMarkersHelp">
|
||||
<p class="pl-4">
|
||||
Use Overdrive Media Markers for chapters
|
||||
{{ $strings.LabelSettingsOverdriveMediaMarkers }}
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
|
|
@ -129,9 +134,9 @@
|
|||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-toggle-switch v-model="newServerSettings.scannerPreferAudioMetadata" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('scannerPreferAudioMetadata', val)" />
|
||||
<ui-tooltip :text="tooltips.scannerPreferAudioMetadata">
|
||||
<ui-tooltip :text="$strings.LabelSettingsPreferAudioMetadataHelp">
|
||||
<p class="pl-4">
|
||||
Prefer audio metadata
|
||||
{{ $strings.LabelSettingsPreferAudioMetadata }}
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
|
|
@ -139,9 +144,9 @@
|
|||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-toggle-switch v-model="newServerSettings.scannerPreferOpfMetadata" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('scannerPreferOpfMetadata', val)" />
|
||||
<ui-tooltip :text="tooltips.scannerPreferOpfMetadata">
|
||||
<ui-tooltip :text="$strings.LabelSettingsPreferOPFMetadataHelp">
|
||||
<p class="pl-4">
|
||||
Prefer OPF metadata
|
||||
{{ $strings.LabelSettingsPreferOPFMetadata }}
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
|
|
@ -149,9 +154,9 @@
|
|||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-toggle-switch v-model="newServerSettings.scannerPreferMatchedMetadata" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('scannerPreferMatchedMetadata', val)" />
|
||||
<ui-tooltip :text="tooltips.scannerPreferMatchedMetadata">
|
||||
<ui-tooltip :text="$strings.LabelSettingsPreferMatchedMetadataHelp">
|
||||
<p class="pl-4">
|
||||
Prefer matched metadata
|
||||
{{ $strings.LabelSettingsPreferMatchedMetadata }}
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
|
|
@ -159,57 +164,45 @@
|
|||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-toggle-switch v-model="newServerSettings.scannerDisableWatcher" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('scannerDisableWatcher', val)" />
|
||||
<ui-tooltip :text="tooltips.scannerDisableWatcher">
|
||||
<ui-tooltip :text="$strings.LabelSettingsDisableWatcherHelp">
|
||||
<p class="pl-4">
|
||||
Disable Watcher
|
||||
{{ $strings.LabelSettingsDisableWatcher }}
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
</div>
|
||||
|
||||
<!-- <div class="flex items-center py-2">
|
||||
<ui-text-input type="number" v-model="newServerSettings.scannerMaxThreads" no-spinner :disabled="updatingServerSettings" :padding-x="1" text-center class="w-10" @change="updateScannerMaxThreads" />
|
||||
<ui-tooltip :text="tooltips.scannerMaxThreads">
|
||||
<p class="pl-4">
|
||||
Max # of threads to use
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
</div> -->
|
||||
|
||||
<div class="pt-4">
|
||||
<h2 class="font-semibold">Experimental Features</h2>
|
||||
<h2 class="font-semibold">{{ $strings.HeaderSettingsExperimental }}</h2>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center py-2">
|
||||
<div class="flex items-center">
|
||||
<ui-toggle-switch v-model="showExperimentalFeatures" />
|
||||
<ui-tooltip :text="tooltips.experimentalFeatures">
|
||||
<p class="pl-4">
|
||||
Experimental Features
|
||||
<a href="https://github.com/advplyr/audiobookshelf/discussions/75" target="_blank">
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</a>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
</div>
|
||||
<ui-toggle-switch v-model="showExperimentalFeatures" />
|
||||
<ui-tooltip :text="$strings.LabelSettingsExperimentalFeaturesHelp">
|
||||
<p class="pl-4">
|
||||
{{ $strings.LabelSettingsExperimentalFeatures }}
|
||||
<a href="https://github.com/advplyr/audiobookshelf/discussions/75" target="_blank">
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</a>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-toggle-switch v-model="newServerSettings.enableEReader" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('enableEReader', val)" />
|
||||
<ui-tooltip :text="tooltips.enableEReader">
|
||||
<ui-tooltip :text="$strings.LabelSettingsEnableEReaderHelp">
|
||||
<p class="pl-4">
|
||||
Enable e-reader for all users
|
||||
{{ $strings.LabelSettingsEnableEReader }}
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
</div>
|
||||
|
||||
<!-- <div class="flex items-center py-2">
|
||||
<ui-toggle-switch v-model="newServerSettings.scannerUseSingleThreadedProber" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('scannerUseSingleThreadedProber', val)" />
|
||||
<ui-tooltip :text="tooltips.scannerUseSingleThreadedProber">
|
||||
<ui-toggle-switch v-model="newServerSettings.scannerUseTone" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('scannerUseTone', val)" />
|
||||
<ui-tooltip text="Tone library for metadata">
|
||||
<p class="pl-4">
|
||||
Scanner use old single threaded audio prober
|
||||
Use Tone library for metadata
|
||||
<span class="material-icons icon-text text-sm">info_outlined</span>
|
||||
</p>
|
||||
</ui-tooltip>
|
||||
|
|
@ -221,11 +214,15 @@
|
|||
<div class="h-0.5 bg-primary bg-opacity-30 w-full" />
|
||||
|
||||
<div class="flex items-center py-4">
|
||||
<ui-btn color="bg" small :padding-x="4" class="hidden lg:block mr-2" :loading="isPurgingCache" @click="purgeCache">Purge Cache</ui-btn>
|
||||
<ui-btn color="bg" small :padding-x="4" class="hidden lg:block mr-2" :loading="isResettingLibraryItems" @click="resetLibraryItems">Remove All Library Items</ui-btn>
|
||||
<div class="flex-grow" />
|
||||
<ui-btn color="bg" small :padding-x="4" class="hidden lg:block mr-2" :loading="isPurgingCache" @click.stop="purgeCache">{{ $strings.ButtonPurgeAllCache }}</ui-btn>
|
||||
<ui-btn color="bg" small :padding-x="4" class="hidden lg:block mr-2" :loading="isPurgingCache" @click.stop="purgeItemsCache">{{ $strings.ButtonPurgeItemsCache }}</ui-btn>
|
||||
<ui-btn color="bg" small :padding-x="4" class="hidden lg:block mr-2" :loading="isResettingLibraryItems" @click="resetLibraryItems">{{ $strings.ButtonRemoveAllLibraryItems }}</ui-btn>
|
||||
</div>
|
||||
<div class="flex items-center py-4">
|
||||
<div class="flex-grow" />
|
||||
<p class="pr-2 text-sm font-book text-yellow-400">
|
||||
Report bugs, request features, and contribute on
|
||||
{{ $strings.MessageReportBugsAndContribute }}
|
||||
<a class="underline" href="https://github.com/advplyr/audiobookshelf" target="_blank">github</a>
|
||||
</p>
|
||||
<a href="https://github.com/advplyr/audiobookshelf" target="_blank" class="text-white hover:text-gray-200 hover:scale-150 hover:rotate-6 transform duration-500">
|
||||
|
|
@ -236,7 +233,7 @@
|
|||
</svg>
|
||||
</a>
|
||||
<p class="pl-4 pr-2 text-sm font-book text-yellow-400">
|
||||
Join us on
|
||||
{{ $strings.MessageJoinUsOn }}
|
||||
<a class="underline" href="https://discord.gg/pJsjuNCKRq" target="_blank">discord</a>
|
||||
</p>
|
||||
<a href="https://discord.gg/pJsjuNCKRq" target="_blank" class="text-white hover:text-gray-200 hover:scale-150 hover:rotate-6 transform duration-500">
|
||||
|
|
@ -280,29 +277,10 @@ export default {
|
|||
return {
|
||||
isResettingLibraryItems: false,
|
||||
updatingServerSettings: false,
|
||||
homeUseAlternativeBookshelfView: false,
|
||||
useAlternativeBookshelfView: false,
|
||||
homepageUseBookshelfView: false,
|
||||
useBookshelfView: false,
|
||||
isPurgingCache: false,
|
||||
newServerSettings: {},
|
||||
tooltips: {
|
||||
experimentalFeatures: 'Features in development that could use your feedback and help testing. Click to open github discussion.',
|
||||
scannerDisableWatcher: 'Disables the automatic adding/updating of items when file changes are detected. *Requires server restart',
|
||||
scannerPreferOpfMetadata: 'OPF file metadata will be used for book details over folder names',
|
||||
scannerPreferMatchedMetadata: 'Matched data will overide book details when using Quick Match',
|
||||
scannerPreferAudioMetadata: 'Audio file ID3 meta tags will be used for book details over folder names',
|
||||
scannerParseSubtitle: 'Extract subtitles from audiobook folder names.<br>Subtitle must be seperated by " - "<br>i.e. "Book Title - A Subtitle Here" has the subtitle "A Subtitle Here"',
|
||||
sortingIgnorePrefix: 'i.e. for prefix "the" book title "The Book Title" would sort as "Book Title, The"',
|
||||
scannerFindCovers: 'If your audiobook does not have an embedded cover or a cover image inside the folder, the scanner will attempt to find a cover.<br>Note: This will extend scan time',
|
||||
bookshelfView: 'Alternative view without wooden bookshelf',
|
||||
storeCoverWithItem: 'By default covers are stored in /metadata/items, enabling this setting will store covers in your library item folder. Only one file named "cover" will be kept',
|
||||
storeMetadataWithItem: 'By default metadata files are stored in /metadata/items, enabling this setting will store metadata files in your library item folders. Uses .abs file extension',
|
||||
coverAspectRatio: 'Prefer to use square covers over standard 1.6:1 book covers',
|
||||
enableEReader: 'E-reader is still a work in progress, but use this setting to open it up to all your users (or use the "Experimental Features" toggle just for use by you)',
|
||||
scannerPreferOverdriveMediaMarker: 'MP3 files from Overdrive come with chapter timings embedded as custom metadata. Enabling this will use these tags for chapter timings automatically',
|
||||
shareStats: 'Allow users to share latest listening activity with other users on an opt-in basis',
|
||||
scannerUseSingleThreadedProber: 'The old scanner used a single thread. Leaving it in to use as a comparison for now.',
|
||||
scannerMaxThreads: 'Number of concurrent media files to scan at a time. Value of 1 will be a slower scan but less CPU usage. <br><br>Value of 0 defaults to # of CPU cores for this server times 2 (i.e. 4-core CPU will be 8)'
|
||||
},
|
||||
showConfirmPurgeCache: false
|
||||
}
|
||||
},
|
||||
|
|
@ -333,26 +311,6 @@ export default {
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
updateScannerMaxThreads(val) {
|
||||
if (!val || isNaN(val)) {
|
||||
this.$toast.error('Invalid max threads must be a number')
|
||||
this.newServerSettings.scannerMaxThreads = 0
|
||||
return
|
||||
}
|
||||
if (Number(val) < 0) {
|
||||
this.$toast.error('Max threads must be >= 0')
|
||||
this.newServerSettings.scannerMaxThreads = 0
|
||||
return
|
||||
}
|
||||
if (Math.round(Number(val)) !== Number(val)) {
|
||||
this.$toast.error('Max threads must be an integer')
|
||||
this.newServerSettings.scannerMaxThreads = 0
|
||||
return
|
||||
}
|
||||
this.updateServerSettings({
|
||||
scannerMaxThreads: Number(val)
|
||||
})
|
||||
},
|
||||
updateSortingPrefixes(val) {
|
||||
if (!val || !val.length) {
|
||||
this.$toast.error('Must have at least 1 prefix')
|
||||
|
|
@ -368,20 +326,18 @@ export default {
|
|||
scannerCoverProvider: val
|
||||
})
|
||||
},
|
||||
updateBookCoverAspectRatio(val) {
|
||||
updateHomeUseBookshelfView(val) {
|
||||
this.updateServerSettings({
|
||||
coverAspectRatio: val ? this.$constants.BookCoverAspectRatio.SQUARE : this.$constants.BookCoverAspectRatio.STANDARD
|
||||
homeBookshelfView: !val ? this.$constants.BookshelfView.DETAIL : this.$constants.BookshelfView.STANDARD
|
||||
})
|
||||
},
|
||||
updateHomeAlternativeBookshelfView(val) {
|
||||
updateUseBookshelfView(val) {
|
||||
this.updateServerSettings({
|
||||
homeBookshelfView: val ? this.$constants.BookshelfView.TITLES : this.$constants.BookshelfView.STANDARD
|
||||
bookshelfView: !val ? this.$constants.BookshelfView.DETAIL : this.$constants.BookshelfView.STANDARD
|
||||
})
|
||||
},
|
||||
updateAlternativeBookshelfView(val) {
|
||||
this.updateServerSettings({
|
||||
bookshelfView: val ? this.$constants.BookshelfView.TITLES : this.$constants.BookshelfView.STANDARD
|
||||
})
|
||||
updateServerLanguage(val) {
|
||||
this.updateSettingsKey('language', val)
|
||||
},
|
||||
updateSettingsKey(key, val) {
|
||||
this.updateServerSettings({
|
||||
|
|
@ -396,6 +352,11 @@ export default {
|
|||
console.log('Updated Server Settings', success)
|
||||
this.updatingServerSettings = false
|
||||
this.$toast.success('Server settings updated')
|
||||
|
||||
if (payload.language) {
|
||||
// Updating language after save allows for re-rendering
|
||||
this.$setLanguageCode(payload.language)
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error('Failed to update server settings', error)
|
||||
|
|
@ -407,11 +368,11 @@ export default {
|
|||
this.newServerSettings = this.serverSettings ? { ...this.serverSettings } : {}
|
||||
this.newServerSettings.sortingPrefixes = [...(this.newServerSettings.sortingPrefixes || [])]
|
||||
|
||||
this.homeUseAlternativeBookshelfView = this.newServerSettings.homeBookshelfView === this.$constants.BookshelfView.TITLES
|
||||
this.useAlternativeBookshelfView = this.newServerSettings.bookshelfView === this.$constants.BookshelfView.TITLES
|
||||
this.homepageUseBookshelfView = this.newServerSettings.homeBookshelfView != this.$constants.BookshelfView.DETAIL
|
||||
this.useBookshelfView = this.newServerSettings.bookshelfView != this.$constants.BookshelfView.DETAIL
|
||||
},
|
||||
resetLibraryItems() {
|
||||
if (confirm('WARNING! This action will remove all library items from the database including any updates or matches you have made. This does not do anything to your actual files. Shall we continue?')) {
|
||||
if (confirm(this.$strings.MessageRemoveAllItemsWarning)) {
|
||||
this.isResettingLibraryItems = true
|
||||
this.$axios
|
||||
.$delete('/api/items/all')
|
||||
|
|
@ -434,7 +395,7 @@ export default {
|
|||
this.showConfirmPurgeCache = false
|
||||
this.isPurgingCache = true
|
||||
await this.$axios
|
||||
.$post('/api/purgecache')
|
||||
.$post('/api/cache/purge')
|
||||
.then(() => {
|
||||
this.$toast.success('Cache Purged!')
|
||||
})
|
||||
|
|
@ -443,6 +404,31 @@ export default {
|
|||
this.$toast.error('Failed to purge cache')
|
||||
})
|
||||
this.isPurgingCache = false
|
||||
},
|
||||
purgeItemsCache() {
|
||||
const payload = {
|
||||
message: `<span class="text-warning text-base">Warning! This will delete the entire folder at /metadata/cache/items.</span><br />Are you sure you want to purge items cache?`,
|
||||
callback: (confirmed) => {
|
||||
if (confirmed) {
|
||||
this.sendPurgeItemsCache()
|
||||
}
|
||||
},
|
||||
type: 'yesNo'
|
||||
}
|
||||
this.$store.commit('globals/setConfirmPrompt', payload)
|
||||
},
|
||||
async sendPurgeItemsCache() {
|
||||
this.isPurgingCache = true
|
||||
await this.$axios
|
||||
.$post('/api/cache/items/purge')
|
||||
.then(() => {
|
||||
this.$toast.success('Items Cache Purged!')
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error('Failed to purge items cache', error)
|
||||
this.$toast.error('Failed to purge items cache')
|
||||
})
|
||||
this.isPurgingCache = false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
<template>
|
||||
<div class="bg-bg rounded-md shadow-lg border border-white border-opacity-5 p-4 mb-8">
|
||||
<h1 class="text-xl">Stats for library {{ currentLibraryName }}</h1>
|
||||
<h1 class="text-xl">{{ $strings.HeaderLibraryStats }}: {{ currentLibraryName }}</h1>
|
||||
<stats-preview-icons v-if="totalItems" :library-stats="libraryStats" />
|
||||
|
||||
<div class="flex lg:flex-row flex-wrap justify-between flex-col mt-8">
|
||||
<div class="w-80 my-6 mx-auto">
|
||||
<h1 class="text-2xl mb-4 font-book">Top 5 Genres</h1>
|
||||
<p v-if="!top5Genres.length">No Genres</p>
|
||||
<h1 class="text-2xl mb-4 font-book">{{ $strings.HeaderStatsTop5Genres }}</h1>
|
||||
<p v-if="!top5Genres.length">{{ $strings.MessageNoGenres }}</p>
|
||||
<template v-for="genre in top5Genres">
|
||||
<div :key="genre.genre" class="w-full py-2">
|
||||
<div class="flex items-end mb-1">
|
||||
|
|
@ -23,8 +23,8 @@
|
|||
</template>
|
||||
</div>
|
||||
<div class="w-80 my-6 mx-auto">
|
||||
<h1 class="text-2xl mb-4 font-book">Top 10 Authors</h1>
|
||||
<p v-if="!top10Authors.length">No Authors</p>
|
||||
<h1 class="text-2xl mb-4 font-book">{{ $strings.HeaderStatsTop10Authors }}</h1>
|
||||
<p v-if="!top10Authors.length">{{ $strings.MessageNoAuthors }}</p>
|
||||
<template v-for="(author, index) in top10Authors">
|
||||
<div :key="author.id" class="w-full py-2">
|
||||
<div class="flex items-center mb-1">
|
||||
|
|
@ -42,8 +42,8 @@
|
|||
</template>
|
||||
</div>
|
||||
<div class="w-80 my-6 mx-auto">
|
||||
<h1 class="text-2xl mb-4 font-book">Longest Items (hrs)</h1>
|
||||
<p v-if="!top10LongestItems.length">No Items</p>
|
||||
<h1 class="text-2xl mb-4 font-book">{{ $strings.HeaderStatsLongestItems }}</h1>
|
||||
<p v-if="!top10LongestItems.length">{{ $strings.MessageNoItems }}</p>
|
||||
<template v-for="(ab, index) in top10LongestItems">
|
||||
<div :key="index" class="w-full py-2">
|
||||
<div class="flex items-center mb-1">
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<div class="w-full h-full">
|
||||
<div class="bg-bg rounded-md shadow-lg border border-white border-opacity-5 p-4 mb-8">
|
||||
<div class="flex items-center mb-2">
|
||||
<h1 class="text-xl">Logs</h1>
|
||||
<h1 class="text-xl">{{ $strings.HeaderLogs }}</h1>
|
||||
</div>
|
||||
<div class="flex justify-between mb-2 place-items-end">
|
||||
<ui-text-input ref="input" v-model="search" placeholder="Search filter.." @input="inputUpdate" clearable class="w-full sm:w-40 h-8 text-sm sm:mb-0" />
|
||||
|
|
@ -22,7 +22,7 @@
|
|||
</div>
|
||||
|
||||
<div v-if="!logs.length" class="absolute top-0 left-0 w-full h-full flex flex-col items-center justify-center text-center">
|
||||
<p class="text-xl text-gray-200 mb-2">No Logs</p>
|
||||
<p class="text-xl text-gray-200 mb-2">{{ $strings.MessageNoLogs }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
190
client/pages/config/notifications.vue
Normal file
190
client/pages/config/notifications.vue
Normal file
|
|
@ -0,0 +1,190 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="bg-bg rounded-md shadow-lg border border-white border-opacity-5 p-3 md:p-8 mb-2 max-w-3xl mx-auto">
|
||||
<h2 class="text-xl font-semibold mb-4">{{ $strings.HeaderAppriseNotificationSettings }}</h2>
|
||||
<p id="appriseDescription" class="mb-6 text-gray-200" v-html="$strings.MessageAppriseDescription" />
|
||||
|
||||
<form @submit.prevent="submitForm">
|
||||
<ui-text-input-with-label ref="apiUrlInput" v-model="appriseApiUrl" :disabled="savingSettings" label="Apprise API Url" class="mb-2" />
|
||||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-text-input ref="maxNotificationQueueInput" type="number" v-model="maxNotificationQueue" no-spinner :disabled="savingSettings" :padding-x="1" text-center class="w-10" />
|
||||
|
||||
<ui-tooltip :text="$strings.LabelNotificationsMaxQueueSizeHelp" direction="right">
|
||||
<p class="pl-2 md:pl-4 text-base md:text-lg">{{ $strings.LabelNotificationsMaxQueueSize }}<span class="material-icons icon-text ml-1">info_outlined</span></p>
|
||||
</ui-tooltip>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center py-2">
|
||||
<ui-text-input ref="maxFailedAttemptsInput" type="number" v-model="maxFailedAttempts" no-spinner :disabled="savingSettings" :padding-x="1" text-center class="w-10" />
|
||||
|
||||
<ui-tooltip :text="$strings.LabelNotificationsMaxFailedAttemptsHelp" direction="right">
|
||||
<p class="pl-2 md:pl-4 text-base md:text-lg">{{ $strings.LabelNotificationsMaxFailedAttempts }}<span class="material-icons icon-text ml-1">info_outlined</span></p>
|
||||
</ui-tooltip>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center justify-end pt-4">
|
||||
<ui-btn :loading="savingSettings" type="submit">{{ $strings.ButtonSave }}</ui-btn>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div class="w-full h-px bg-white bg-opacity-10 my-6" />
|
||||
|
||||
<div class="flex items-center justify-between mb-6">
|
||||
<h2 class="text-xl font-semibold">{{ $strings.HeaderNotifications }}</h2>
|
||||
<ui-btn small color="success" class="flex items-center" @click="clickCreate">{{ $strings.ButtonCreate }} <span class="material-icons text-lg pl-2">add</span></ui-btn>
|
||||
</div>
|
||||
|
||||
<div v-if="!notifications.length" class="flex justify-center text-center">
|
||||
<p class="text-lg text-gray-200">{{ $strings.MessageNoNotifications }}</p>
|
||||
</div>
|
||||
<template v-for="notification in notifications">
|
||||
<cards-notification-card :key="notification.id" :notification="notification" @update="updateSettings" @edit="editNotification" />
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<modals-notification-edit-modal v-model="showEditModal" :notification="selectedNotification" :notification-data="notificationData" @update="updateSettings" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
savingSettings: false,
|
||||
appriseApiUrl: null,
|
||||
maxNotificationQueue: 0,
|
||||
maxFailedAttempts: 0,
|
||||
notifications: [],
|
||||
notificationSettings: null,
|
||||
notificationData: null,
|
||||
showEditModal: false,
|
||||
selectedNotification: null,
|
||||
sendingTest: false
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
methods: {
|
||||
updateSettings(settings) {
|
||||
this.notificationSettings = settings
|
||||
this.notifications = settings.notifications
|
||||
},
|
||||
editNotification(notification) {
|
||||
this.selectedNotification = notification
|
||||
this.showEditModal = true
|
||||
},
|
||||
clickCreate() {
|
||||
this.selectedNotification = null
|
||||
this.showEditModal = true
|
||||
},
|
||||
validateAppriseApiUrl() {
|
||||
try {
|
||||
return new URL(this.appriseApiUrl)
|
||||
} catch (error) {
|
||||
console.log('URL error', error)
|
||||
this.$toast.error(error.message)
|
||||
return false
|
||||
}
|
||||
},
|
||||
validateForm() {
|
||||
if (this.$refs.apiUrlInput) {
|
||||
this.$refs.apiUrlInput.blur()
|
||||
}
|
||||
if (this.$refs.maxNotificationQueueInput) {
|
||||
this.$refs.maxNotificationQueueInput.blur()
|
||||
}
|
||||
if (this.$refs.maxFailedAttemptsInput) {
|
||||
this.$refs.maxFailedAttemptsInput.blur()
|
||||
}
|
||||
|
||||
if (!this.validateAppriseApiUrl()) {
|
||||
return false
|
||||
}
|
||||
|
||||
if (isNaN(this.maxNotificationQueue) || this.maxNotificationQueue <= 0) {
|
||||
this.$toast.error('Max notification queue must be >= 0')
|
||||
return false
|
||||
}
|
||||
|
||||
if (isNaN(this.maxFailedAttempts) || this.maxFailedAttempts <= 0) {
|
||||
this.$toast.error('Max failed attempts must be >= 0')
|
||||
return false
|
||||
}
|
||||
|
||||
return true
|
||||
},
|
||||
submitForm() {
|
||||
if (!this.validateForm()) return
|
||||
|
||||
const updatePayload = {
|
||||
appriseApiUrl: this.appriseApiUrl || null,
|
||||
maxNotificationQueue: Number(this.maxNotificationQueue),
|
||||
maxFailedAttempts: Number(this.maxFailedAttempts)
|
||||
}
|
||||
this.savingSettings = true
|
||||
this.$axios
|
||||
.$patch('/api/notifications', updatePayload)
|
||||
.then(() => {
|
||||
this.$toast.success('Notification settings updated')
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error('Failed to update notification settings', error)
|
||||
this.$toast.error('Failed to update notification settings')
|
||||
})
|
||||
.finally(() => {
|
||||
this.savingSettings = false
|
||||
})
|
||||
},
|
||||
async init() {
|
||||
this.loading = true
|
||||
const notificationResponse = await this.$axios.$get('/api/notifications').catch((error) => {
|
||||
console.error('Failed to get notification settings', error)
|
||||
this.$toast.error('Failed to load notification settings')
|
||||
return null
|
||||
})
|
||||
this.loading = false
|
||||
if (!notificationResponse) {
|
||||
return
|
||||
}
|
||||
this.notificationData = notificationResponse.data
|
||||
this.setNotificationSettings(notificationResponse.settings)
|
||||
},
|
||||
setNotificationSettings(notificationSettings) {
|
||||
this.notificationSettings = notificationSettings
|
||||
this.appriseApiUrl = notificationSettings.appriseApiUrl
|
||||
this.maxNotificationQueue = notificationSettings.maxNotificationQueue
|
||||
this.maxFailedAttempts = notificationSettings.maxFailedAttempts
|
||||
this.notifications = notificationSettings.notifications || []
|
||||
},
|
||||
notificationsUpdated(notificationSettings) {
|
||||
console.log('Notifications updated', notificationSettings)
|
||||
this.setNotificationSettings(notificationSettings)
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
this.$root.socket.on('notifications_updated', this.notificationsUpdated)
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.$root.socket.off('notifications_updated', this.notificationsUpdated)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#appriseDescription a {
|
||||
color: rgb(96 165 250);
|
||||
}
|
||||
#appriseDescription a:hover {
|
||||
color: rgb(147 197 253);
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
#appriseDescription code {
|
||||
font-size: 0.875rem;
|
||||
border-radius: 6px;
|
||||
background-color: rgb(82, 82, 82);
|
||||
color: white;
|
||||
padding: 2px 4px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -2,23 +2,23 @@
|
|||
<div class="w-full h-full">
|
||||
<div class="bg-bg rounded-md shadow-lg border border-white border-opacity-5 p-4 mb-8">
|
||||
<div class="flex items-center mb-2">
|
||||
<h1 class="text-xl">Listening Sessions</h1>
|
||||
<h1 class="text-xl">{{ $strings.HeaderListeningSessions }}</h1>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-end mb-2">
|
||||
<ui-dropdown v-model="selectedUser" :items="userItems" label="Filter by User" small class="max-w-48" @input="updateUserFilter" />
|
||||
<ui-dropdown v-model="selectedUser" :items="userItems" :label="$strings.LabelFilterByUser" small class="max-w-48" @input="updateUserFilter" />
|
||||
</div>
|
||||
|
||||
<div v-if="listeningSessions.length" class="block max-w-full">
|
||||
<table class="userSessionsTable">
|
||||
<tr class="bg-primary bg-opacity-40">
|
||||
<th class="w-48 min-w-48 text-left">Item</th>
|
||||
<th class="w-20 min-w-20 text-left hidden md:table-cell">User</th>
|
||||
<th class="w-32 min-w-32 text-left hidden md:table-cell">Play Method</th>
|
||||
<th class="w-32 min-w-32 text-left hidden sm:table-cell">Device Info</th>
|
||||
<th class="w-32 min-w-32">Listened</th>
|
||||
<th class="w-16 min-w-16">Last Time</th>
|
||||
<th class="flex-grow hidden sm:table-cell">Last Update</th>
|
||||
<th class="w-48 min-w-48 text-left">{{ $strings.LabelItem }}</th>
|
||||
<th class="w-20 min-w-20 text-left hidden md:table-cell">{{ $strings.LabelUser }}</th>
|
||||
<th class="w-32 min-w-32 text-left hidden md:table-cell">{{ $strings.LabelPlayMethod }}</th>
|
||||
<th class="w-32 min-w-32 text-left hidden sm:table-cell">{{ $strings.LabelDeviceInfo }}</th>
|
||||
<th class="w-32 min-w-32">{{ $strings.LabelTimeListened }}</th>
|
||||
<th class="w-16 min-w-16">{{ $strings.LabelLastTime }}</th>
|
||||
<th class="flex-grow hidden sm:table-cell">{{ $strings.LabelLastUpdate }}</th>
|
||||
</tr>
|
||||
|
||||
<tr v-for="session in listeningSessions" :key="session.id" class="cursor-pointer" @click="showSession(session)">
|
||||
|
|
@ -55,7 +55,7 @@
|
|||
<ui-icon-btn icon="arrow_forward_ios" :size="7" icon-font-size="1rem" class="mx-1" :disabled="currentPage >= numPages - 1" @click="nextPage" />
|
||||
</div>
|
||||
</div>
|
||||
<p v-else class="text-white text-opacity-50">No sessions yet...</p>
|
||||
<p v-else class="text-white text-opacity-50">{{ $strings.MessageNoListeningSessions }}</p>
|
||||
</div>
|
||||
|
||||
<modals-listening-session-modal v-model="showSessionModal" :session="selectedSession" @removedSession="removedSession" />
|
||||
|
|
@ -88,6 +88,7 @@ export default {
|
|||
numPages: 0,
|
||||
total: 0,
|
||||
currentPage: 0,
|
||||
itemsPerPage: 10,
|
||||
userFilter: null,
|
||||
selectedUser: '',
|
||||
processingGoToTimestamp: false
|
||||
|
|
@ -112,6 +113,16 @@ export default {
|
|||
},
|
||||
methods: {
|
||||
removedSession() {
|
||||
// If on last page and this was the last session then load prev page
|
||||
if (this.currentPage == this.numPages - 1) {
|
||||
const newTotal = this.total - 1
|
||||
const newNumPages = Math.ceil(newTotal / this.itemsPerPage)
|
||||
if (newNumPages < this.numPages) {
|
||||
this.prevPage()
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
this.loadSessions(this.currentPage)
|
||||
},
|
||||
async clickCurrentTime(session) {
|
||||
|
|
@ -127,20 +138,47 @@ export default {
|
|||
this.processingGoToTimestamp = false
|
||||
return
|
||||
}
|
||||
if (session.episodeId && !libraryItem.media.episodes.find((ep) => ep.id === session.episodeId)) {
|
||||
if (session.episodeId && !libraryItem.media.episodes.some((ep) => ep.id === session.episodeId)) {
|
||||
this.$toast.error('Failed to get podcast episode')
|
||||
this.processingGoToTimestamp = false
|
||||
return
|
||||
}
|
||||
|
||||
var queueItem = {}
|
||||
if (session.episodeId) {
|
||||
var episode = libraryItem.media.episodes.find((ep) => ep.id === session.episodeId)
|
||||
queueItem = {
|
||||
libraryItemId: libraryItem.id,
|
||||
libraryId: libraryItem.libraryId,
|
||||
episodeId: episode.id,
|
||||
title: episode.title,
|
||||
subtitle: libraryItem.media.metadata.title,
|
||||
caption: episode.publishedAt ? `Published ${this.$formatDate(episode.publishedAt, 'MMM do, yyyy')}` : 'Unknown publish date',
|
||||
duration: episode.audioFile.duration || null,
|
||||
coverPath: libraryItem.media.coverPath || null
|
||||
}
|
||||
} else {
|
||||
queueItem = {
|
||||
libraryItemId: libraryItem.id,
|
||||
libraryId: libraryItem.libraryId,
|
||||
episodeId: null,
|
||||
title: libraryItem.media.metadata.title,
|
||||
subtitle: libraryItem.media.metadata.authors.map((au) => au.name).join(', '),
|
||||
caption: '',
|
||||
duration: libraryItem.media.duration || null,
|
||||
coverPath: libraryItem.media.coverPath || null
|
||||
}
|
||||
}
|
||||
|
||||
const payload = {
|
||||
message: `Start playback for "${session.displayTitle}" at ${this.$secondsToTimestamp(session.currentTime)}?`,
|
||||
message: this.$getString('MessageStartPlaybackAtTime', [session.displayTitle, this.$secondsToTimestamp(session.currentTime)]),
|
||||
callback: (confirmed) => {
|
||||
if (confirmed) {
|
||||
this.$eventBus.$emit('play-item', {
|
||||
libraryItemId: libraryItem.id,
|
||||
episodeId: session.episodeId || null,
|
||||
startTime: session.currentTime
|
||||
startTime: session.currentTime,
|
||||
queueItems: [queueItem]
|
||||
})
|
||||
}
|
||||
this.processingGoToTimestamp = false
|
||||
|
|
@ -181,7 +219,7 @@ export default {
|
|||
},
|
||||
async loadSessions(page) {
|
||||
var userFilterQuery = this.selectedUser ? `&user=${this.selectedUser}` : ''
|
||||
const data = await this.$axios.$get(`/api/sessions?page=${page}&itemsPerPage=10${userFilterQuery}`).catch((err) => {
|
||||
const data = await this.$axios.$get(`/api/sessions?page=${page}&itemsPerPage=${this.itemsPerPage}${userFilterQuery}`).catch((err) => {
|
||||
console.error('Failed to load listening sesions', err)
|
||||
return null
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div class="bg-bg rounded-md shadow-lg border border-white border-opacity-5 p-4 mb-8">
|
||||
<h1 class="text-xl">Stats for {{ username }}</h1>
|
||||
<h1 class="text-xl">{{ $strings.HeaderYourStats }}</h1>
|
||||
|
||||
<div class="flex justify-center">
|
||||
<div class="flex p-2">
|
||||
|
|
@ -12,7 +12,7 @@
|
|||
</svg>
|
||||
<div class="px-3">
|
||||
<p class="text-4xl md:text-5xl font-bold">{{ userItemsFinished.length }}</p>
|
||||
<p class="font-book text-xs md:text-sm text-white text-opacity-80">Items Finished</p>
|
||||
<p class="font-book text-xs md:text-sm text-white text-opacity-80">{{ $strings.LabelStatsItemsFinished }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -22,7 +22,7 @@
|
|||
</div>
|
||||
<div class="px-1">
|
||||
<p class="text-4xl md:text-5xl font-bold">{{ totalDaysListened }}</p>
|
||||
<p class="font-book text-xs md:text-sm text-white text-opacity-80">Days Listened</p>
|
||||
<p class="font-book text-xs md:text-sm text-white text-opacity-80">{{ $strings.LabelStatsDaysListened }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -32,7 +32,7 @@
|
|||
</div>
|
||||
<div class="px-1">
|
||||
<p class="text-4xl md:text-5xl font-bold">{{ totalMinutesListening }}</p>
|
||||
<p class="font-book text-xs md:text-sm text-white text-opacity-80">Minutes Listening</p>
|
||||
<p class="font-book text-xs md:text-sm text-white text-opacity-80">{{ $strings.LabelStatsMinutesListening }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -40,11 +40,11 @@
|
|||
<stats-daily-listening-chart :listening-stats="listeningStats" class="origin-top-left transform scale-75 lg:scale-100" />
|
||||
<div class="w-80 my-6 mx-auto">
|
||||
<div class="flex mb-4 items-center">
|
||||
<h1 class="text-2xl font-book">Recent Sessions</h1>
|
||||
<h1 class="text-2xl font-book">{{ $strings.HeaderStatsRecentSessions }}</h1>
|
||||
<div class="flex-grow" />
|
||||
<ui-btn :to="`/config/users/${user.id}/sessions`" class="text-xs" :padding-x="1.5" :padding-y="1">View All</ui-btn>
|
||||
<ui-btn :to="`/config/users/${user.id}/sessions`" class="text-xs" :padding-x="1.5" :padding-y="1">{{ $strings.ButtonViewAll }}</ui-btn>
|
||||
</div>
|
||||
<p v-if="!mostRecentListeningSessions.length">No Listening Sessions</p>
|
||||
<p v-if="!mostRecentListeningSessions.length">{{ $strings.MessageNoListeningSessions }}</p>
|
||||
<template v-for="(item, index) in mostRecentListeningSessions">
|
||||
<div :key="item.id" class="w-full py-0.5">
|
||||
<div class="flex items-center mb-1">
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<div class="h-10 w-10 flex items-center justify-center">
|
||||
<span class="material-icons text-2xl">arrow_back</span>
|
||||
</div>
|
||||
<p class="pl-1">All Users</p>
|
||||
<p class="pl-1">{{ $strings.LabelAllUsers }}</p>
|
||||
</div>
|
||||
</nuxt-link>
|
||||
<div class="flex items-center mb-2 mt-4 px-2 sm:px-0">
|
||||
|
|
@ -22,22 +22,22 @@
|
|||
</div>
|
||||
<div class="w-full h-px bg-white bg-opacity-10 my-2" />
|
||||
<div class="py-2">
|
||||
<h1 class="text-lg mb-2 text-white text-opacity-90 px-2 sm:px-0">Listening Stats</h1>
|
||||
<h1 class="text-lg mb-2 text-white text-opacity-90 px-2 sm:px-0">{{ $strings.HeaderListeningStats }}</h1>
|
||||
<div class="flex items-center">
|
||||
<p class="text-sm text-gray-300">{{ listeningSessions.length }} Listening Sessions</p>
|
||||
<ui-btn :to="`/config/users/${user.id}/sessions`" class="text-xs mx-2" :padding-x="1.5" :padding-y="1">View All</ui-btn>
|
||||
<p class="text-sm text-gray-300">{{ listeningSessions.total }} {{ $strings.HeaderListeningSessions }}</p>
|
||||
<ui-btn :to="`/config/users/${user.id}/sessions`" class="text-xs mx-2" :padding-x="1.5" :padding-y="1">{{ $strings.ButtonViewAll }}</ui-btn>
|
||||
</div>
|
||||
<p class="text-sm text-gray-300">
|
||||
Total Time Listened:
|
||||
{{ $strings.LabelTotalTimeListened }}:
|
||||
<span class="font-mono text-base">{{ listeningTimePretty }}</span>
|
||||
</p>
|
||||
<p v-if="timeListenedToday" class="text-sm text-gray-300">
|
||||
Time Listened Today:
|
||||
{{ $strings.LabelTimeListenedToday }}:
|
||||
<span class="font-mono text-base">{{ $elapsedPrettyExtended(timeListenedToday) }}</span>
|
||||
</p>
|
||||
|
||||
<div v-if="latestSession" class="mt-4">
|
||||
<h1 class="text-lg mb-2 text-white text-opacity-90 px-2 sm:px-0">Last Listening Session</h1>
|
||||
<h1 class="text-lg mb-2 text-white text-opacity-90 px-2 sm:px-0">{{ $strings.HeaderLastListeningSession }}</h1>
|
||||
<p class="text-sm text-gray-300">
|
||||
<strong>{{ latestSession.displayTitle }}</strong> {{ $dateDistanceFromNow(latestSession.updatedAt) }} for <span class="font-mono text-base">{{ $elapsedPrettyExtended(this.latestSession.timeListening) }}</span>
|
||||
</p>
|
||||
|
|
@ -45,22 +45,35 @@
|
|||
</div>
|
||||
<div class="w-full h-px bg-white bg-opacity-10 my-2" />
|
||||
<div class="py-2">
|
||||
<h1 class="text-lg mb-2 text-white text-opacity-90 px-2 sm:px-0">Saved Media Progress</h1>
|
||||
<table v-if="mediaProgress.length" class="userAudiobooksTable">
|
||||
<h1 class="text-lg mb-2 text-white text-opacity-90 px-2 sm:px-0">{{ $strings.HeaderSavedMediaProgress }}</h1>
|
||||
|
||||
<div v-if="mediaProgressWithoutMedia.length" class="flex items-center py-2 mb-2">
|
||||
<p class="text-error">User has media progress for {{ mediaProgressWithoutMedia.length }} items that no longer exist.</p>
|
||||
<div class="flex-grow" />
|
||||
<ui-btn small :loading="purgingMediaProgress" @click.stop="purgeMediaProgress">{{ $strings.ButtonPurgeMediaProgress }}</ui-btn>
|
||||
</div>
|
||||
|
||||
<table v-if="mediaProgressWithMedia.length" class="userAudiobooksTable">
|
||||
<tr class="bg-primary bg-opacity-40">
|
||||
<th class="w-16 text-left">Item</th>
|
||||
<th class="w-16 text-left">{{ $strings.LabelItem }}</th>
|
||||
<th class="text-left"></th>
|
||||
<th class="w-32">Progress</th>
|
||||
<th class="w-40 hidden sm:table-cell">Started At</th>
|
||||
<th class="w-40 hidden sm:table-cell">Last Update</th>
|
||||
<th class="w-32">{{ $strings.LabelProgress }}</th>
|
||||
<th class="w-40 hidden sm:table-cell">{{ $strings.LabelStartedAt }}</th>
|
||||
<th class="w-40 hidden sm:table-cell">{{ $strings.LabelLastUpdate }}</th>
|
||||
</tr>
|
||||
<tr v-for="item in mediaProgress" :key="item.id" :class="!item.isFinished ? '' : 'isFinished'">
|
||||
<tr v-for="item in mediaProgressWithMedia" :key="item.id" :class="!item.isFinished ? '' : 'isFinished'">
|
||||
<td>
|
||||
<covers-book-cover :width="50" :library-item="item" :book-cover-aspect-ratio="bookCoverAspectRatio" />
|
||||
</td>
|
||||
<td class="font-book">
|
||||
<p>{{ item.media && item.media.metadata ? item.media.metadata.title : 'Unknown' }}</p>
|
||||
<p v-if="item.media && item.media.metadata && item.media.metadata.authorName" class="text-white text-opacity-50 text-sm font-sans">by {{ item.media.metadata.authorName }}</p>
|
||||
<template v-if="item.media && item.media.metadata && item.episode">
|
||||
<p>{{ item.episode.title || 'Unknown' }}</p>
|
||||
<p class="text-white text-opacity-50 text-sm font-sans">{{ item.media.metadata.title }}</p>
|
||||
</template>
|
||||
<template v-else-if="item.media && item.media.metadata">
|
||||
<p>{{ item.media.metadata.title || 'Unknown' }}</p>
|
||||
<p v-if="item.media.metadata.authorName" class="text-white text-opacity-50 text-sm font-sans">by {{ item.media.metadata.authorName }}</p>
|
||||
</template>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<p class="text-sm">{{ Math.floor(item.progress * 100) }}%</p>
|
||||
|
|
@ -77,7 +90,7 @@
|
|||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<p v-else class="text-white text-opacity-50">Nothing listened to yet...</p>
|
||||
<p v-else class="text-white text-opacity-50">{{ $strings.MessageNoMediaProgress }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -97,8 +110,9 @@ export default {
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
listeningSessions: [],
|
||||
listeningStats: {}
|
||||
listeningSessions: {},
|
||||
listeningStats: {},
|
||||
purgingMediaProgress: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
|
@ -117,6 +131,12 @@ export default {
|
|||
mediaProgress() {
|
||||
return this.user.mediaProgress.sort((a, b) => b.lastUpdate - a.lastUpdate)
|
||||
},
|
||||
mediaProgressWithMedia() {
|
||||
return this.mediaProgress.filter((mp) => mp.media)
|
||||
},
|
||||
mediaProgressWithoutMedia() {
|
||||
return this.mediaProgress.filter((mp) => !mp.media)
|
||||
},
|
||||
totalListeningTime() {
|
||||
return this.listeningStats.totalTime || 0
|
||||
},
|
||||
|
|
@ -127,8 +147,8 @@ export default {
|
|||
return this.listeningStats.today || 0
|
||||
},
|
||||
latestSession() {
|
||||
if (!this.listeningSessions.length) return null
|
||||
return this.listeningSessions[0]
|
||||
if (!this.listeningSessions.sessions || !this.listeningSessions.sessions.length) return null
|
||||
return this.listeningSessions.sessions[0]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -139,17 +159,35 @@ export default {
|
|||
this.listeningSessions = await this.$axios
|
||||
.$get(`/api/users/${this.user.id}/listening-sessions?page=0&itemsPerPage=10`)
|
||||
.then((data) => {
|
||||
return data.sessions || []
|
||||
return data || {}
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error('Failed to load listening sesions', err)
|
||||
return []
|
||||
return {}
|
||||
})
|
||||
this.listeningStats = await this.$axios.$get(`/api/users/${this.user.id}/listening-stats`).catch((err) => {
|
||||
console.error('Failed to load listening sesions', err)
|
||||
return []
|
||||
})
|
||||
console.log('Loaded user listening data', this.listeningSessions, this.listeningStats)
|
||||
},
|
||||
purgeMediaProgress() {
|
||||
this.purgingMediaProgress = true
|
||||
|
||||
this.$axios
|
||||
.$post(`/api/users/${this.user.id}/purge-media-progress`)
|
||||
.then((updatedUser) => {
|
||||
console.log('Updated user', updatedUser)
|
||||
this.$toast.success('Media progress purged')
|
||||
this.user = updatedUser
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error('Failed to purge media progress', error)
|
||||
this.$toast.error('Failed to purge media progress')
|
||||
})
|
||||
.finally(() => {
|
||||
this.purgingMediaProgress = false
|
||||
})
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
|
@ -183,4 +221,4 @@ export default {
|
|||
padding: 4px 8px;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<div class="h-10 w-10 flex items-center justify-center">
|
||||
<span class="material-icons text-2xl">arrow_back</span>
|
||||
</div>
|
||||
<p class="pl-1">Back to User</p>
|
||||
<p class="pl-1">{{ $strings.LabelBackToUser }}</p>
|
||||
</div>
|
||||
</nuxt-link>
|
||||
<div class="flex items-center mb-2 mt-4 px-2 sm:px-0">
|
||||
|
|
@ -17,16 +17,16 @@
|
|||
<div class="w-full h-px bg-white bg-opacity-10 my-2" />
|
||||
|
||||
<div class="py-2">
|
||||
<h1 class="text-lg mb-2 text-white text-opacity-90 px-2 sm:px-0">Listening Sessions</h1>
|
||||
<h1 class="text-lg mb-2 text-white text-opacity-90 px-2 sm:px-0">{{ $strings.HeaderListeningSessions }}</h1>
|
||||
<div v-if="listeningSessions.length">
|
||||
<table class="userSessionsTable">
|
||||
<tr class="bg-primary bg-opacity-40">
|
||||
<th class="w-48 min-w-48 text-left">Item</th>
|
||||
<th class="w-32 min-w-32 text-left hidden md:table-cell">Play Method</th>
|
||||
<th class="w-32 min-w-32 text-left hidden sm:table-cell">Device Info</th>
|
||||
<th class="w-32 min-w-32">Listened</th>
|
||||
<th class="w-16 min-w-16">Last Time</th>
|
||||
<th class="flex-grow hidden sm:table-cell">Last Update</th>
|
||||
<th class="w-48 min-w-48 text-left">{{ $strings.LabelItem }}</th>
|
||||
<th class="w-32 min-w-32 text-left hidden md:table-cell">{{ $strings.LabelPlayMethod }}</th>
|
||||
<th class="w-32 min-w-32 text-left hidden sm:table-cell">{{ $strings.LabelDeviceInfo }}</th>
|
||||
<th class="w-32 min-w-32">{{ $strings.LabelTimeListened }}</th>
|
||||
<th class="w-16 min-w-16">{{ $strings.LabelLastTime }}</th>
|
||||
<th class="flex-grow hidden sm:table-cell">{{ $strings.LabelLastUpdate }}</th>
|
||||
</tr>
|
||||
<tr v-for="session in listeningSessions" :key="session.id" class="cursor-pointer" @click="showSession(session)">
|
||||
<td class="py-1 max-w-48">
|
||||
|
|
@ -86,6 +86,7 @@ export default {
|
|||
numPages: 0,
|
||||
total: 0,
|
||||
currentPage: 0,
|
||||
itemsPerPage: 10,
|
||||
processingGoToTimestamp: false
|
||||
}
|
||||
},
|
||||
|
|
@ -99,6 +100,16 @@ export default {
|
|||
},
|
||||
methods: {
|
||||
removedSession() {
|
||||
// If on last page and this was the last session then load prev page
|
||||
if (this.currentPage == this.numPages - 1) {
|
||||
const newTotal = this.total - 1
|
||||
const newNumPages = Math.ceil(newTotal / this.itemsPerPage)
|
||||
if (newNumPages < this.numPages) {
|
||||
this.prevPage()
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
this.loadSessions(this.currentPage)
|
||||
},
|
||||
async clickCurrentTime(session) {
|
||||
|
|
@ -114,20 +125,47 @@ export default {
|
|||
this.processingGoToTimestamp = false
|
||||
return
|
||||
}
|
||||
if (session.episodeId && !libraryItem.media.episodes.find((ep) => ep.id === session.episodeId)) {
|
||||
if (session.episodeId && !libraryItem.media.episodes.some((ep) => ep.id === session.episodeId)) {
|
||||
this.$toast.error('Failed to get podcast episode')
|
||||
this.processingGoToTimestamp = false
|
||||
return
|
||||
}
|
||||
|
||||
var queueItem = {}
|
||||
if (session.episodeId) {
|
||||
var episode = libraryItem.media.episodes.find((ep) => ep.id === session.episodeId)
|
||||
queueItem = {
|
||||
libraryItemId: libraryItem.id,
|
||||
libraryId: libraryItem.libraryId,
|
||||
episodeId: episode.id,
|
||||
title: episode.title,
|
||||
subtitle: libraryItem.media.metadata.title,
|
||||
caption: episode.publishedAt ? `Published ${this.$formatDate(episode.publishedAt, 'MMM do, yyyy')}` : 'Unknown publish date',
|
||||
duration: episode.audioFile.duration || null,
|
||||
coverPath: libraryItem.media.coverPath || null
|
||||
}
|
||||
} else {
|
||||
queueItem = {
|
||||
libraryItemId: libraryItem.id,
|
||||
libraryId: libraryItem.libraryId,
|
||||
episodeId: null,
|
||||
title: libraryItem.media.metadata.title,
|
||||
subtitle: libraryItem.media.metadata.authors.map((au) => au.name).join(', '),
|
||||
caption: '',
|
||||
duration: libraryItem.media.duration || null,
|
||||
coverPath: libraryItem.media.coverPath || null
|
||||
}
|
||||
}
|
||||
|
||||
const payload = {
|
||||
message: `Start playback for "${session.displayTitle}" at ${this.$secondsToTimestamp(session.currentTime)}?`,
|
||||
message: this.$getString('MessageStartPlaybackAtTime', [session.displayTitle, this.$secondsToTimestamp(session.currentTime)]),
|
||||
callback: (confirmed) => {
|
||||
if (confirmed) {
|
||||
this.$eventBus.$emit('play-item', {
|
||||
libraryItemId: libraryItem.id,
|
||||
episodeId: session.episodeId || null,
|
||||
startTime: session.currentTime
|
||||
startTime: session.currentTime,
|
||||
queueItems: [queueItem]
|
||||
})
|
||||
}
|
||||
this.processingGoToTimestamp = false
|
||||
|
|
@ -164,7 +202,7 @@ export default {
|
|||
return 'Unknown'
|
||||
},
|
||||
async loadSessions(page) {
|
||||
const data = await this.$axios.$get(`/api/users/${this.user.id}/listening-sessions?page=${page}&itemsPerPage=10`).catch((err) => {
|
||||
const data = await this.$axios.$get(`/api/users/${this.user.id}/listening-sessions?page=${page}&itemsPerPage=${this.itemsPerPage}`).catch((err) => {
|
||||
console.error('Failed to load listening sesions', err)
|
||||
return null
|
||||
})
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue