Update epub player styles and force pagination

This commit is contained in:
Bill Thornton 2020-11-22 02:31:48 -05:00
parent 629a279491
commit c4aebce2b1
2 changed files with 16 additions and 16 deletions

View File

@ -26,7 +26,7 @@ export class BookPlayer {
width: '100%', width: '100%',
height: '100%', height: '100%',
// TODO: Add option for scrolled-doc // TODO: Add option for scrolled-doc
flow: 'auto' flow: 'paginated'
}; };
this.onDialogClosed = this.onDialogClosed.bind(this); this.onDialogClosed = this.onDialogClosed.bind(this);
@ -146,8 +146,8 @@ export class BookPlayer {
elem.addEventListener('close', this.onDialogClosed, {once: true}); elem.addEventListener('close', this.onDialogClosed, {once: true});
elem.querySelector('#btnBookplayerExit').addEventListener('click', this.onDialogClosed, {once: true}); elem.querySelector('#btnBookplayerExit').addEventListener('click', this.onDialogClosed, {once: true});
elem.querySelector('#btnBookplayerToc').addEventListener('click', this.openTableOfContents); elem.querySelector('#btnBookplayerToc').addEventListener('click', this.openTableOfContents);
elem.querySelector('#btnBookplayerPrev').addEventListener('click', this.prevChapter); elem.querySelector('#btnBookplayerPrev')?.addEventListener('click', this.prevChapter);
elem.querySelector('#btnBookplayerNext').addEventListener('click', this.nextChapter); elem.querySelector('#btnBookplayerNext')?.addEventListener('click', this.nextChapter);
} }
bindEvents() { bindEvents() {
@ -165,8 +165,8 @@ export class BookPlayer {
elem.removeEventListener('close', this.onDialogClosed); elem.removeEventListener('close', this.onDialogClosed);
elem.querySelector('#btnBookplayerExit').removeEventListener('click', this.onDialogClosed); elem.querySelector('#btnBookplayerExit').removeEventListener('click', this.onDialogClosed);
elem.querySelector('#btnBookplayerToc').removeEventListener('click', this.openTableOfContents); elem.querySelector('#btnBookplayerToc').removeEventListener('click', this.openTableOfContents);
elem.querySelector('#btnBookplayerPrev').removeEventListener('click', this.prevChapter); elem.querySelector('#btnBookplayerPrev')?.removeEventListener('click', this.prevChapter);
elem.querySelector('#btnBookplayerNext').removeEventListener('click', this.nextChapter); elem.querySelector('#btnBookplayerNext')?.removeEventListener('click', this.nextChapter);
} }
unbindEvents() { unbindEvents() {

View File

@ -9,6 +9,16 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.topButtons {
top: 0.5vh;
z-index: 1002;
position: absolute;
top: 0;
width: 100%;
color: #000;
opacity: .7;
}
.bookPlayerContainer { .bookPlayerContainer {
flex-grow: 1; flex-grow: 1;
} }
@ -23,23 +33,13 @@
margin-right: 2vw; margin-right: 2vw;
} }
.bookplayerButtonIcon {
color: black;
background-color: #fff;
}
.bookplayerErrorMsg { .bookplayerErrorMsg {
text-align: center; text-align: center;
} }
#btnBookplayerPrev { #btnBookplayerPrev,
margin: 0.5vh 0.5vh;
color: black;
}
#btnBookplayerNext { #btnBookplayerNext {
margin: 0.5vh 0.5vh; margin: 0.5vh 0.5vh;
color: black;
} }
} }