mirror/advplyr.audiobookshelf-app
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf-app.git synced 2025-08-31 07:09:53 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update:Increase cover size on fullscreen audio player #491

Browse source
This commit is contained in:
advplyr 2023-01-08 13:27:09 -06:00
parent d85158bd70
commit 83fdf4fd65
1 changed files with 14 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

18
components/app/AudioPlayer.vue
View file

@ -132,6 +132,7 @@ export default {
data() { data() {
return { return {
windowHeight: 0, windowHeight: 0,
windowWidth: 0,
playbackSession: null, playbackSession: null,
showChapterModal: false, showChapterModal: false,
showFullscreen: false, showFullscreen: false,
@ -213,11 +214,19 @@ export default {
return 46 / this.bookCoverAspectRatio return 46 / this.bookCoverAspectRatio
}, },
fullscreenBookCoverWidth() { fullscreenBookCoverWidth() {
var heightScale = (this.windowHeight - 200) / 651 if (this.windowWidth < this.windowHeight) {
if (this.bookCoverAspectRatio === 1) { // Portrait
return 260 * heightScale let sideSpace = 20
if (this.bookCoverAspectRatio === 1.6) sideSpace += (this.windowWidth - sideSpace) * 0.375
return this.windowWidth - sideSpace
} else {
// Landscape
const heightScale = (this.windowHeight - 200) / 651
if (this.bookCoverAspectRatio === 1) {
return 260 * heightScale
}
return 190 * heightScale
} }
return 200 * heightScale
}, },
showCastBtn() { showCastBtn() {
return this.$store.state.isCastAvailable return this.$store.state.isCastAvailable
@ -775,6 +784,7 @@ export default {
}, },
updateScreenSize() { updateScreenSize() {
this.windowHeight = window.innerHeight this.windowHeight = window.innerHeight
this.windowWidth = window.innerWidth
const coverHeight = this.fullscreenBookCoverWidth * this.bookCoverAspectRatio const coverHeight = this.fullscreenBookCoverWidth * this.bookCoverAspectRatio
document.documentElement.style.setProperty('--cover-image-width', this.fullscreenBookCoverWidth + 'px') document.documentElement.style.setProperty('--cover-image-width', this.fullscreenBookCoverWidth + 'px')
document.documentElement.style.setProperty('--cover-image-height', coverHeight + 'px') document.documentElement.style.setProperty('--cover-image-height', coverHeight + 'px')