Mirrors/audiobookshelf
Mirrors/audiobookshelf
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf.git synced 2025-09-10 17:58:02 +02:00
Code Issues Packages Projects Releases Wiki Activity

Fixed rectangle book cover sub-sorting and conditional divider display.

Browse Source
This commit is contained in:
tagmeh 2025-08-06 18:14:35 -05:00
parent faa0a833e2
commit 43ca263eac
1 changed files with 9 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
client/components/covers/SortedCovers.vue
View File

@ -15,8 +15,8 @@
</template> </template>
</div> </div>
<!-- Divider if both sections have covers --> <!-- Divider only shows when there are covers in both sections -->
<div v-if="primaryCovers.length && secondaryCovers.length" class="w-full border-b border-white/10 my-4"></div> <div v-if="hasBothCoverTypes" class="w-full border-b border-white/10 my-4"></div>
<!-- Secondary Covers Section (opposite aspect ratio) --> <!-- Secondary Covers Section (opposite aspect ratio) -->
<div v-if="secondaryCovers.length" class="flex items-center flex-wrap justify-center"> <div v-if="secondaryCovers.length" class="flex items-center flex-wrap justify-center">
@ -57,9 +57,10 @@ export default {
computed: { computed: {
// Sort covers by dimension and size // Sort covers by dimension and size
sortedCovers() { sortedCovers() {
// sort by height, then sub-sort by width
return [...this.covers].sort((a, b) => { return [...this.covers].sort((a, b) => {
// Sort by area (width * height) // Sort by height first, then by width
return a.width * a.height - b.width * b.height return a.height - b.height || a.width - b.width
}) })
}, },
// Get square covers (width === height) // Get square covers (width === height)
@ -77,6 +78,10 @@ export default {
// Determine secondary covers (opposite of primary) // Determine secondary covers (opposite of primary)
secondaryCovers() { secondaryCovers() {
return this.bookCoverAspectRatio === 1 ? this.rectangleCovers : this.squareCovers return this.bookCoverAspectRatio === 1 ? this.rectangleCovers : this.squareCovers
},
// Check if we have both types of covers to show the divider
hasBothCoverTypes() {
return this.primaryCovers.length > 0 && this.secondaryCovers.length > 0
} }
} }
} }