From 859849b66c8d1c857193481d1f64c33aa5c72e3d Mon Sep 17 00:00:00 2001 From: Book Pauk Date: Tue, 15 Jan 2019 19:01:13 +0700 Subject: [PATCH] =?UTF-8?q?=D0=A0=D0=B5=D1=84=D0=B0=D0=BA=D1=82=D0=BE?= =?UTF-8?q?=D1=80=D0=B8=D0=BD=D0=B3,=20=D0=BF=D1=80=D0=BE=D0=BC=D0=B5?= =?UTF-8?q?=D0=B6=D1=83=D1=82=D0=BE=D1=87=D0=BD=D1=8B=D0=B9=20=D0=BA=D0=BE?= =?UTF-8?q?=D0=BC=D0=BC=D0=B8=D1=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/components/Reader/Reader.vue | 142 ++++++++++++------ .../components/Reader/TextPage/TextPage.vue | 70 ++------- client/store/modules/reader.js | 4 - 3 files changed, 105 insertions(+), 111 deletions(-) diff --git a/client/components/Reader/Reader.vue b/client/components/Reader/Reader.vue index 2e7370bf..886c5a02 100644 --- a/client/components/Reader/Reader.vue +++ b/client/components/Reader/Reader.vue @@ -42,8 +42,9 @@ + {{ bookPos }} - + @@ -66,9 +67,27 @@ export default @Component({ TextPage, ProgressPage }, + watch: { + bookPos: function(newValue) { + if (newValue !== undefined && this.pageActive == 'TextPage') { + const textPage = this.$refs.page; + if (textPage.bookPos != newValue) { + textPage.bookPos = newValue; + this.commit('reader/setOpenedBook', Object.assign({}, this.lastOpenedBook, {bookPos: newValue})); + } + } + }, + routeParamPos: function(newValue) { + if (newValue !== undefined && newValue != this.bookPos) { + this.bookPos = newValue; + } + }, + }, }) class Reader extends Vue { + loaderActive = false; progressActive = false; + bookPos = null; created() { this.commit = this.$store.commit; @@ -76,18 +95,38 @@ class Reader extends Vue { this.reader = this.$store.state.reader; this.$root.addKeyHook(this.keyHook); + + this.lastActivePage = false; } mounted() { /*while (this.lastOpenedBook) { this.commit('reader/delOpenedBook', this.lastOpenedBook); }*/ - if (this.$root.rootRoute == '/reader' && this.routeParamUrl && this.routeParamUrl != this.lastOpenedBook.url) { - this.commit('reader/setLoaderActive', true); - this.loadBook({url: this.routeParamUrl}); + const lastUrl = (this.lastOpenedBook ? this.lastOpenedBook.url : ''); + if (this.$root.rootRoute == '/reader' && this.routeParamUrl && this.routeParamUrl != lastUrl) { + this.loaderActive = true; + this.loadBook({url: this.routeParamUrl, bookPos: this.routeParamPos}); } } + get routeParamPos() { + let result = undefined; + const q = this.$route.query; + if (q['__p']) { + result = q['__p']; + if (Array.isArray(result)) + result = result[0]; + } + + return (result ? parseInt(result, 10) || 0 : result); + } + + updateRoute() { + const pos = (this.bookPos != undefined ? `__p=${this.bookPos}&` : ''); + this.$router.replace(`/reader?${pos}url=${this.lastOpenedBook.url}`); + } + get routeParamUrl() { let result = ''; const path = this.$route.fullPath; @@ -99,8 +138,9 @@ class Reader extends Vue { return decodeURIComponent(result); } - get loaderActive() { - return this.reader.loaderActive; + bookPosChanged(event) { + this.bookPos = event.bookPos; + this.updateRoute(); } get fullScreenActive() { @@ -113,16 +153,11 @@ class Reader extends Vue { buttonClick(button) { switch (button) { - case 'loader': this.commit('reader/setLoaderActive', !this.loaderActive); this.resetRoute(); break; + case 'loader': this.loaderActive = !this.loaderActive; break; case 'fullscreen': this.commit('reader/setFullScreenActive', !this.fullScreenActive); break; } } - resetRoute() { - if (this.loaderActive) - this.$router.replace('/reader'); - } - buttonActiveClass(button) { const classActive = { 'tool-button-active': true, 'tool-button-active:hover': true }; switch (button) { @@ -143,7 +178,7 @@ class Reader extends Vue { result = 'TextPage'; if (!result) { - this.commit('reader/setLoaderActive', true); + this.loaderActive = true; result = 'LoaderPage'; } @@ -151,6 +186,29 @@ class Reader extends Vue { this.$root.$emit('set-app-title'); } + if (this.lastActivePage != result && result == 'TextPage') { + //акивируем страницу с текстом + this.$nextTick(async() => { + const last = this.lastOpenedBook; + const isParsed = await bookManager.hasBookParsed(last); + if (!isParsed) { + this.$root.$emit('set-app-title'); + this.loadBook({url: last.url, bookPos: last.bookPos}); + return; + } else { + this.bookPos = last.bookPos; + } + + const textPage = this.$refs.page; + + textPage.lastBook = last; + textPage.bookPos = (this.bookPos !== undefined ? this.bookPos : 0); + + textPage.showBook(); + }); + } + + this.lastActivePage = result; return result; } @@ -158,10 +216,26 @@ class Reader extends Vue { this.progressActive = true; this.$nextTick(async() => { const progress = this.$refs.page; - progress.show(); - progress.setState({totalSteps: 5}); try { + progress.show(); + progress.setState({state: 'parse'}); + + const bookParsed = await bookManager.getBook({url: opts.url}, (prog) => { + progress.setState({progress: prog}); + }); + + if (bookParsed) { + this.commit('reader/setOpenedBook', bookManager.metaOnly(bookParsed)); + this.bookPos = bookParsed.bookPos; + this.updateRoute(); + this.loaderActive = false; + progress.hide(); this.progressActive = false; + return; + } + + progress.setState({totalSteps: 5}); + const book = await readerApi.loadBook(opts.url, (state) => { progress.setState(state); }); @@ -172,43 +246,15 @@ class Reader extends Vue { }); this.commit('reader/setOpenedBook', bookManager.metaOnly(addedBook)); - this.commit('reader/setLoaderActive', false); + this.bookPos = opts.bookPos; + this.updateRoute(); + + this.loaderActive = false; progress.hide(); this.progressActive = false; } catch (e) { progress.hide(); this.progressActive = false; - this.commit('reader/setLoaderActive', true); - this.resetRoute(); - this.$alert(e.message, 'Ошибка', {type: 'error'}); - } - }); - } - - parseBook(meta) { - this.progressActive = true; - this.$nextTick(async() => { - if (bookManager.hasBookParsed(meta)) { - this.progressActive = false; - return; - } - - const progress = this.$refs.page; - progress.show(); - progress.setState({state: 'parse'}); - try { - const isParsed = await bookManager.getBook(meta, (prog) => { - progress.setState({progress: prog}); - }); - - progress.hide(); this.progressActive = false; - - if (!isParsed) { - this.loadBook({url: meta.url}); - } - } catch (e) { - progress.hide(); this.progressActive = false; - this.commit('reader/setLoaderActive', true); - this.resetRoute(); + this.loaderActive = true; this.$alert(e.message, 'Ошибка', {type: 'error'}); } }); diff --git a/client/components/Reader/TextPage/TextPage.vue b/client/components/Reader/TextPage/TextPage.vue index 47f9796d..f0a2c102 100644 --- a/client/components/Reader/TextPage/TextPage.vue +++ b/client/components/Reader/TextPage/TextPage.vue @@ -1,9 +1,8 @@ @@ -18,51 +17,39 @@ import bookManager from '../share/bookManager'; export default @Component({ watch: { bookPos: function(newValue) { - this.updateRoute(newValue); - this.commit('reader/setOpenedBook', Object.assign({}, this.lastOpenedBook, {bookPos: newValue})); + this.$emit('book-pos-changed', {bookPos: newValue}); this.drawPage(); }, - routeParamPos: function(newValue) { - if (newValue !== undefined && newValue != this.bookPos) { - this.bookPos = newValue; - } - }, }, }) class TextPage extends Vue { + lastBook = null; meta = null; fb2 = null; - bookPos = 0; + bookPos = 0; created() { this.commit = this.$store.commit; this.dispatch = this.$store.dispatch; this.config = this.$store.state.config; this.reader = this.$store.state.reader; - - this.lastOpenTry = ''; } - activated() { + showBook() { this.$refs.main.focus(); this.book = null; this.meta = null; this.fb2 = null; - let last = this.lastOpenedBook; + this.drawPage();//пока не загрузили, очистим канвас - if (last && !(this.routeParamUrl && this.routeParamUrl != last.url)) { + if (this.lastBook) { (async() => { - const isParsed = await bookManager.hasBookParsed(last); + const isParsed = await bookManager.hasBookParsed(this.lastBook); if (!isParsed) { - this.$root.$emit('set-app-title'); - if (this.lastOpenTry != last.url) { - this.$emit('parse-book', last); - this.lastOpenTry = last.url; - } return; } - this.book = await bookManager.getBook(last); + this.book = await bookManager.getBook(this.lastBook); this.meta = bookManager.metaOnly(this.book); this.fb2 = this.meta.fb2; @@ -74,48 +61,13 @@ class TextPage extends Vue { this.fb2.bookTitle ]).join(' ')); - this.bookPos = (this.routeParamPos !== undefined ? this.routeParamPos : last.bookPos || 0); - this.updateRoute(this.bookPos); this.drawPage(); })(); } } - get lastOpenedBook() { - return this.$store.getters['reader/lastOpenedBook']; - } - - get routeParamUrl() { - let result = ''; - const path = this.$route.fullPath; - const i = path.indexOf('url='); - if (i >= 0) { - result = path.substr(i + 4); - } - - return decodeURIComponent(result); - } - - get routeParamPos() { - let result = undefined; - const q = this.$route.query; - if (q['__p']) { - result = q['__p']; - if (Array.isArray(result)) - result = result[0]; - } - - return (result ? parseInt(result, 10) || 0 : result); - } - - updateRoute(newPos) { - if (this.book) - this.$router.replace(`/reader?__p=${newPos}&url=${this.lastOpenedBook.url}`); - } - drawPage() { - const last = this.lastOpenedBook; - if (!last) + if (!this.lastBook) return; //пустой канвас diff --git a/client/store/modules/reader.js b/client/store/modules/reader.js index 154c5730..e38f6304 100644 --- a/client/store/modules/reader.js +++ b/client/store/modules/reader.js @@ -2,7 +2,6 @@ import Vue from 'vue'; // initial state const state = { - loaderActive: false, fullScreenActive: false, openedBook: {}, }; @@ -28,9 +27,6 @@ const actions = {}; // mutations const mutations = { - setLoaderActive(state, value) { - state.loaderActive = value; - }, setFullScreenActive(state, value) { state.fullScreenActive = value; },