diff --git a/client/components/Reader/Reader.vue b/client/components/Reader/Reader.vue
index 0773db07..3a51ccd7 100644
--- a/client/components/Reader/Reader.vue
+++ b/client/components/Reader/Reader.vue
@@ -8,10 +8,10 @@
-
+
-
+
@@ -21,16 +21,18 @@
-
+
-
+
-
+
-
+
+
+
@@ -46,10 +48,11 @@
-
@@ -112,6 +115,9 @@ class Reader extends Vue {
progressActive = false;
fullScreenActive = false;
+ scrollingActive = false;
+ searchActive = false;
+ copyTextActive = false;
historyActive = false;
setPositionActive = false;
@@ -192,7 +198,10 @@ class Reader extends Vue {
}
get lastOpenedBook() {
- return this.$store.getters['reader/lastOpenedBook'];
+ const result = this.$store.getters['reader/lastOpenedBook'];
+ if (!result)
+ this.closeAllTextPages()
+ return result;
}
toolBarToggle() {
@@ -222,21 +231,40 @@ class Reader extends Vue {
}
}
+ closeAllTextPages() {
+ this.historyActive = false;
+ this.setPositionActive = false;
+ }
+
loaderToggle() {
this.loaderActive = !this.loaderActive;
+ if (this.loaderActive) {
+ this.closeAllTextPages();
+ }
}
historyToggle() {
this.historyActive = !this.historyActive;
+ if (this.historyActive && this.activePage == 'TextPage') {
+ this.closeAllTextPages();
+ this.historyActive = true;
+ } else {
+ this.historyActive = false;
+ }
}
setPositionToggle() {
this.setPositionActive = !this.setPositionActive;
- if (this.setPositionActive) {
+ if (this.setPositionActive && this.activePage == 'TextPage' && this.lastOpenedBook) {
+ this.closeAllTextPages();
+ this.setPositionActive = true;
+
this.$nextTick(() => {
this.$refs.setPositionPage.sliderMax = this.lastOpenedBook.textLength - 1;
this.$refs.setPositionPage.sliderValue = this.lastOpenedBook.bookPos;
});
+ } else {
+ this.setPositionActive = false;
}
}
@@ -265,13 +293,41 @@ class Reader extends Vue {
buttonActiveClass(button) {
const classActive = { 'tool-button-active': true, 'tool-button-active:hover': true };
+ const classDisabled = { 'tool-button-disabled': true, 'tool-button-disabled:hover': true };
+ let classResult = {};
+
switch (button) {
- case 'loader': return (this.loaderActive ? classActive : {});
- case 'fullScreen': return (this.fullScreenActive ? classActive : {});
- case 'history': return (this.historyActive ? classActive : {});
- case 'setPosition': return (this.setPositionActive ? classActive : {});
+ case 'loader':
+ case 'fullScreen':
+ case 'setPosition':
+ case 'scrolling':
+ case 'search':
+ case 'copyText':
+ case 'history':
+ if (this[`${button}Active`])
+ classResult = classActive;
+ break;
}
- return {};
+
+ if (this.activePage == 'LoaderPage' || !this.lastOpenedBook) {
+ switch (button) {
+ case 'undoAction':
+ case 'redoAction':
+ case 'setPosition':
+ case 'scrolling':
+ case 'search':
+ case 'copyText':
+ case 'history':
+ classResult = classDisabled;
+ break;
+ case 'refresh':
+ if (!this.lastOpenedBook)
+ classResult = classDisabled;
+ break;
+ }
+ }
+
+ return classResult;
}
get activePage() {
@@ -315,16 +371,12 @@ class Reader extends Vue {
});
}
- this.$nextTick(() => {
- if (this.$refs.page)
- this.$refs.page.fullScreenToggle = this.fullScreenToggle;
- });
-
this.lastActivePage = result;
return result;
}
loadBook(opts) {
+ this.closeAllTextPages();
this.progressActive = true;
this.$nextTick(async() => {
const progress = this.$refs.page;
@@ -525,6 +577,16 @@ class Reader extends Vue {
background-color: #81C581;
}
+.tool-button-disabled {
+ color: lightgray;
+ background-color: gray;
+}
+
+.tool-button-disabled:hover {
+ color: lightgray;
+ background-color: gray;
+}
+
i {
font-size: 200%;
}
diff --git a/client/components/Reader/TextPage/TextPage.vue b/client/components/Reader/TextPage/TextPage.vue
index 52d16ea2..c9e9f730 100644
--- a/client/components/Reader/TextPage/TextPage.vue
+++ b/client/components/Reader/TextPage/TextPage.vue
@@ -632,8 +632,7 @@ class TextPage extends Vue {
case 'Enter':
case 'Backquote'://`
case 'KeyF':
- if (this.fullScreenToggle)
- this.fullScreenToggle();
+ this.$emit('full-screen-toogle');
break;
case 'Tab':
this.doToolBarToggle();