Reader.vue 49 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435
  1. <template>
  2. <div class="column no-wrap">
  3. <div v-show="toolBarActive" ref="header" class="header">
  4. <div ref="buttons" class="row justify-between no-wrap">
  5. <div>
  6. <button ref="loader" v-ripple class="tool-button" :class="buttonActiveClass('loader')" @click="buttonClick('loader')">
  7. <q-icon name="la la-arrow-left" size="32px" />
  8. <q-tooltip :delay="1500" anchor="bottom right" content-style="font-size: 80%">
  9. {{ rstore.readerActions['loader'] }}
  10. </q-tooltip>
  11. </button>
  12. </div>
  13. <div>
  14. <button v-show="showToolButton['undoAction']" ref="undoAction" v-ripple class="tool-button" :class="buttonActiveClass('undoAction')" @click="buttonClick('undoAction')">
  15. <q-icon name="la la-angle-left" size="32px" />
  16. <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">
  17. {{ rstore.readerActions['undoAction'] }}
  18. </q-tooltip>
  19. </button>
  20. <button v-show="showToolButton['redoAction']" ref="redoAction" v-ripple class="tool-button" :class="buttonActiveClass('redoAction')" @click="buttonClick('redoAction')">
  21. <q-icon name="la la-angle-right" size="32px" />
  22. <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">
  23. {{ rstore.readerActions['redoAction'] }}
  24. </q-tooltip>
  25. </button>
  26. <div class="space"></div>
  27. <button v-show="showToolButton['fullScreen']" ref="fullScreen" v-ripple class="tool-button" :class="buttonActiveClass('fullScreen')" @click="buttonClick('fullScreen')">
  28. <q-icon :name="(fullScreenActive ? 'la la-compress-arrows-alt': 'la la-expand-arrows-alt')" size="32px" />
  29. <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">
  30. {{ rstore.readerActions['fullScreen'] }}
  31. </q-tooltip>
  32. </button>
  33. <button v-show="showToolButton['scrolling']" ref="scrolling" v-ripple class="tool-button" :class="buttonActiveClass('scrolling')" @click="buttonClick('scrolling')">
  34. <q-icon name="la la-film" size="32px" />
  35. <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">
  36. {{ rstore.readerActions['scrolling'] }}
  37. </q-tooltip>
  38. </button>
  39. <button v-show="showToolButton['setPosition']" ref="setPosition" v-ripple class="tool-button" :class="buttonActiveClass('setPosition')" @click="buttonClick('setPosition')">
  40. <q-icon name="la la-angle-double-right" size="32px" />
  41. <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">
  42. {{ rstore.readerActions['setPosition'] }}
  43. </q-tooltip>
  44. </button>
  45. <button v-show="showToolButton['search']" ref="search" v-ripple class="tool-button" :class="buttonActiveClass('search')" @click="buttonClick('search')">
  46. <q-icon name="la la-search" size="32px" />
  47. <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">
  48. {{ rstore.readerActions['search'] }}
  49. </q-tooltip>
  50. </button>
  51. <button v-show="showToolButton['copyText']" ref="copyText" v-ripple class="tool-button" :class="buttonActiveClass('copyText')" @click="buttonClick('copyText')">
  52. <q-icon name="la la-copy" size="32px" />
  53. <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">
  54. {{ rstore.readerActions['copyText'] }}
  55. </q-tooltip>
  56. </button>
  57. <button v-show="showToolButton['convOptions']" ref="convOptions" v-ripple class="tool-button" :class="buttonActiveClass('convOptions')" @click="buttonClick('convOptions')">
  58. <q-icon name="la la-magic" size="32px" />
  59. <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">
  60. {{ rstore.readerActions['convOptions'] }}
  61. </q-tooltip>
  62. </button>
  63. <button v-show="showToolButton['refresh']" ref="refresh" v-ripple class="tool-button" :class="buttonActiveClass('refresh')" @click="buttonClick('refresh')">
  64. <q-icon name="la la-sync" size="32px" :class="{clear: !showRefreshIcon}" />
  65. <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">
  66. {{ rstore.readerActions['refresh'] }}
  67. </q-tooltip>
  68. </button>
  69. <div class="space"></div>
  70. <button v-show="showToolButton['contents']" ref="contents" v-ripple class="tool-button" :class="buttonActiveClass('contents')" @click="buttonClick('contents')">
  71. <q-icon name="la la-list" size="32px" />
  72. <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">
  73. {{ rstore.readerActions['contents'] }}
  74. </q-tooltip>
  75. </button>
  76. <button v-show="mode == 'liberama.top' && showToolButton['libs']" ref="libs" v-ripple class="tool-button" :class="buttonActiveClass('libs')" @click="buttonClick('libs')">
  77. <q-icon name="la la-sitemap" size="32px" />
  78. <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">
  79. {{ rstore.readerActions['libs'] }}
  80. </q-tooltip>
  81. </button>
  82. <button v-show="showToolButton['recentBooks']" ref="recentBooks" v-ripple class="tool-button" :class="buttonActiveClass('recentBooks')" @click="buttonClick('recentBooks')">
  83. <q-icon name="la la-book-open" size="32px" />
  84. <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">
  85. {{ rstore.readerActions['recentBooks'] }}
  86. </q-tooltip>
  87. </button>
  88. </div>
  89. <div>
  90. <button v-show="showToolButton['offlineMode']" ref="offlineMode" v-ripple class="tool-button" :class="buttonActiveClass('offlineMode')" @click="buttonClick('offlineMode')">
  91. <q-icon name="la la-unlink" size="32px" />
  92. <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">
  93. {{ rstore.readerActions['offlineMode'] }}
  94. </q-tooltip>
  95. </button>
  96. <button ref="settings" v-ripple class="tool-button" :class="buttonActiveClass('settings')" @click="buttonClick('settings')">
  97. <q-icon name="la la-cog" size="32px" />
  98. <q-tooltip :delay="1500" anchor="bottom left" content-style="font-size: 80%">
  99. {{ rstore.readerActions['settings'] }}
  100. </q-tooltip>
  101. </button>
  102. </div>
  103. </div>
  104. </div>
  105. <div class="main col row relative-position">
  106. <keep-alive>
  107. <component
  108. :is="activePage"
  109. ref="page"
  110. class="col"
  111. @load-book="loadBook"
  112. @load-file="loadFile"
  113. @book-pos-changed="bookPosChanged"
  114. @do-action="doAction"
  115. ></component>
  116. </keep-alive>
  117. <SetPositionPage v-if="setPositionActive" ref="setPositionPage" @set-position-toggle="setPositionToggle" @book-pos-changed="bookPosChanged"></SetPositionPage>
  118. <SearchPage
  119. v-show="searchActive"
  120. ref="searchPage"
  121. @do-action="doAction"
  122. @book-pos-changed="bookPosChanged"
  123. @start-text-search="startTextSearch"
  124. @stop-text-search="stopTextSearch"
  125. ></SearchPage>
  126. <CopyTextPage v-if="copyTextActive" ref="copyTextPage" @do-action="doAction"></CopyTextPage>
  127. <LibsPage v-show="hidden" ref="libsPage" @load-book="loadBook" @libs-close="libsClose" @do-action="doAction"></LibsPage>
  128. <RecentBooksPage v-show="recentBooksActive" ref="recentBooksPage" @load-book="loadBook" @recent-books-close="recentBooksClose"></RecentBooksPage>
  129. <SettingsPage v-show="settingsActive" ref="settingsPage" @do-action="doAction"></SettingsPage>
  130. <HelpPage v-if="helpActive" ref="helpPage" @do-action="doAction"></HelpPage>
  131. <ClickMapPage v-show="clickMapActive" ref="clickMapPage"></ClickMapPage>
  132. <ContentsPage v-show="contentsActive" ref="contentsPage" :book-pos="bookPos" :is-visible="contentsActive" @do-action="doAction" @book-pos-changed="bookPosChanged"></ContentsPage>
  133. <ServerStorage v-show="hidden" ref="serverStorage"></ServerStorage>
  134. <ReaderDialogs ref="dialogs" @donate-toggle="donateToggle" @version-history-toggle="versionHistoryToggle"></ReaderDialogs>
  135. </div>
  136. </div>
  137. </template>
  138. <script>
  139. //-----------------------------------------------------------------------------
  140. import vueComponent from '../vueComponent.js';
  141. import _ from 'lodash';
  142. import {Buffer} from 'safe-buffer';
  143. import LoaderPage from './LoaderPage/LoaderPage.vue';
  144. import TextPage from './TextPage/TextPage.vue';
  145. import ProgressPage from './ProgressPage/ProgressPage.vue';
  146. import SetPositionPage from './SetPositionPage/SetPositionPage.vue';
  147. import SearchPage from './SearchPage/SearchPage.vue';
  148. import CopyTextPage from './CopyTextPage/CopyTextPage.vue';
  149. import LibsPage from './LibsPage/LibsPage.vue';
  150. import RecentBooksPage from './RecentBooksPage/RecentBooksPage.vue';
  151. import SettingsPage from './SettingsPage/SettingsPage.vue';
  152. import HelpPage from './HelpPage/HelpPage.vue';
  153. import ClickMapPage from './ClickMapPage/ClickMapPage.vue';
  154. import ContentsPage from './ContentsPage/ContentsPage.vue';
  155. import ServerStorage from './ServerStorage/ServerStorage.vue';
  156. import ReaderDialogs from './ReaderDialogs/ReaderDialogs.vue';
  157. import bookManager from './share/bookManager';
  158. import wallpaperStorage from './share/wallpaperStorage';
  159. import dynamicCss from '../../share/dynamicCss';
  160. import rstore from '../../store/modules/reader';
  161. import readerApi from '../../api/reader';
  162. import miscApi from '../../api/misc';
  163. import {versionHistory} from './versionHistory';
  164. import * as utils from '../../share/utils';
  165. const componentOptions = {
  166. components: {
  167. LoaderPage,
  168. TextPage,
  169. ProgressPage,
  170. SetPositionPage,
  171. SearchPage,
  172. CopyTextPage,
  173. LibsPage,
  174. RecentBooksPage,
  175. SettingsPage,
  176. HelpPage,
  177. ClickMapPage,
  178. ContentsPage,
  179. ServerStorage,
  180. ReaderDialogs,
  181. },
  182. watch: {
  183. bookPos: function(newValue) {
  184. if (newValue !== undefined && this.activePage == 'TextPage') {
  185. const textPage = this.$refs.page;
  186. if (textPage.bookPos != newValue) {
  187. textPage.bookPos = newValue;
  188. }
  189. if (!this.scrollingActive)
  190. this.debouncedSetRecentBook(newValue);
  191. else
  192. this.scrollingSetRecentBook(newValue);
  193. }
  194. },
  195. routeParamPos: function(newValue) {
  196. if (!this.paramPosIgnore && newValue !== undefined && newValue != this.bookPos) {
  197. this.bookPos = newValue;
  198. }
  199. },
  200. routeParamUrl: function(newValue) {
  201. if (newValue !== '' && newValue !== this.mostRecentBook().url) {
  202. this.loadBook({url: newValue, bookPos: this.routeParamPos});
  203. }
  204. },
  205. settings: function() {
  206. this.loadSettings();
  207. this.updateRoute();
  208. },
  209. loaderActive: function(newValue) {
  210. (async() => {
  211. const recent = this.mostRecentBook();
  212. if (!newValue && !this.loading && recent && !await bookManager.hasBookParsed(recent)) {
  213. this.loadBook(recent);
  214. }
  215. })();
  216. },
  217. dualPageMode(newValue) {
  218. if (newValue)
  219. this.stopScrolling();
  220. },
  221. },
  222. };
  223. class Reader {
  224. _options = componentOptions;
  225. rstore = {};
  226. loaderActive = false;
  227. fullScreenActive = false;
  228. setPositionActive = false;
  229. searchActive = false;
  230. copyTextActive = false;
  231. convOptionsActive = false;
  232. refreshActive = false;
  233. contentsActive = false;
  234. libsActive = false;
  235. recentBooksActive = false;
  236. offlineModeActive = false;
  237. settingsActive = false;
  238. clickMapActive = false;
  239. helpActive = false;
  240. scrollingActive = false;
  241. progressActive = false;
  242. bookPos = null;
  243. allowUrlParamBookPos = false;
  244. showRefreshIcon = true;
  245. mostRecentBookReactive = null;
  246. showToolButton = {};
  247. actionList = [];
  248. actionCur = -1;
  249. hidden = false;
  250. whatsNewVisible = false;
  251. whatsNewContent = '';
  252. donationVisible = false;
  253. dualPageMode = false;
  254. created() {
  255. this.rstore = rstore;
  256. this.loading = true;
  257. this.commit = this.$store.commit;
  258. this.reader = this.$store.state.reader;
  259. this.config = this.$store.state.config;
  260. this.$root.addEventHook('key', this.keyHook);
  261. this.lastActivePage = false;
  262. this.$watch(
  263. () => this.$route.path,
  264. (newValue) => {
  265. if (newValue == '/reader') {
  266. this.updateRoute();
  267. }
  268. }
  269. );
  270. this.debouncedSetRecentBook = _.debounce(async(newValue) => {
  271. const recent = this.mostRecentBook();
  272. if (recent && (recent.bookPos != newValue || recent.bookPosSeen !== this.bookPosSeen)) {
  273. await bookManager.setRecentBook(Object.assign({}, recent, {bookPos: newValue, bookPosSeen: this.bookPosSeen}));
  274. if (this.actionCur < 0 || (this.actionCur >= 0 && this.actionList[this.actionCur] != newValue))
  275. this.addAction(newValue);
  276. this.paramPosIgnore = true;
  277. this.updateRoute();
  278. await this.$nextTick();
  279. this.paramPosIgnore = false;
  280. }
  281. }, 250, {maxWait: 5000});
  282. this.scrollingSetRecentBook = _.debounce((newValue) => {
  283. this.debouncedSetRecentBook(newValue);
  284. }, 15000, {maxWait: 20000});
  285. document.addEventListener('fullscreenchange', () => {
  286. this.fullScreenActive = (document.fullscreenElement !== null);
  287. });
  288. this.loadSettings();
  289. }
  290. mounted() {
  291. this.updateHeaderMinWidth();
  292. (async() => {
  293. await wallpaperStorage.init();
  294. await bookManager.init(this.settings);
  295. bookManager.addEventListener(this.bookManagerEvent);
  296. if (this.$root.getRootRoute() == '/reader') {
  297. if (this.routeParamUrl) {
  298. await this.loadBook({url: this.routeParamUrl, bookPos: this.routeParamPos, force: this.routeParamRefresh});
  299. } else {
  300. this.loaderActive = true;
  301. }
  302. }
  303. await this.$refs.serverStorage.init();
  304. this.checkSetStorageAccessKey();
  305. this.checkActivateDonateHelpPage();
  306. this.loading = false;
  307. //проверим состояние Settings, и обновим, если надо
  308. const newSettings = rstore.addDefaultsToSettings(this.settings);
  309. if (newSettings) {
  310. this.commit('reader/setSettings', newSettings);
  311. }
  312. this.updateRoute();
  313. await this.$refs.dialogs.init();
  314. })();
  315. (async() => {
  316. this.isFirstNeedUpdateNotify = true;
  317. //вечный цикл, запрашиваем периодически конфиг для проверки выхода новой версии читалки
  318. while (true) {// eslint-disable-line no-constant-condition
  319. await this.checkNewVersionAvailable();
  320. await utils.sleep(3600*1000); //каждый час
  321. }
  322. //дальше кода нет
  323. })();
  324. }
  325. loadSettings() {
  326. const settings = this.settings;
  327. this.allowUrlParamBookPos = settings.allowUrlParamBookPos;
  328. this.copyFullText = settings.copyFullText;
  329. this.showClickMapPage = settings.showClickMapPage;
  330. this.clickControl = settings.clickControl;
  331. this.blinkCachedLoad = settings.blinkCachedLoad;
  332. this.showToolButton = settings.showToolButton;
  333. this.enableSitesFilter = settings.enableSitesFilter;
  334. this.showNeedUpdateNotify = settings.showNeedUpdateNotify;
  335. this.splitToPara = settings.splitToPara;
  336. this.djvuQuality = settings.djvuQuality;
  337. this.pdfAsText = settings.pdfAsText;
  338. this.pdfQuality = settings.pdfQuality;
  339. this.dualPageMode = settings.dualPageMode;
  340. this.userWallpapers = settings.userWallpapers;
  341. this.readerActionByKeyCode = utils.userHotKeysObjectSwap(settings.userHotKeys);
  342. this.$root.readerActionByKeyEvent = (event) => {
  343. return this.readerActionByKeyCode[utils.keyEventToCode(event)];
  344. }
  345. this.updateHeaderMinWidth();
  346. this.loadWallpapers();//no await
  347. }
  348. showHelpOnErrorIfNeeded(errorMessage) {
  349. //небольшая эвристика
  350. let i = errorMessage.indexOf('http://');
  351. if (i < 0)
  352. i = errorMessage.indexOf('https://');
  353. errorMessage = errorMessage.substring(i + 7);
  354. const perCount = errorMessage.split('%').length - 1;
  355. if (perCount > errorMessage.length/3.2) {
  356. this.$refs.dialogs.showUrlHelp();
  357. return true;
  358. }
  359. return false;
  360. }
  361. //wallpaper css
  362. async loadWallpapers() {
  363. const wallpaperDataLength = await wallpaperStorage.getLength();
  364. if (wallpaperDataLength !== this.wallpaperDataLength) {//оптимизация
  365. this.wallpaperDataLength = wallpaperDataLength;
  366. let newCss = '';
  367. for (const wp of this.userWallpapers) {
  368. const data = await wallpaperStorage.getData(wp.cssClass);
  369. if (!data) {
  370. //здесь будем восстанавливать данные с сервера
  371. }
  372. if (data) {
  373. newCss += `.${wp.cssClass} {background: url(${data}) center; background-size: 100% 100%;}`;
  374. }
  375. }
  376. dynamicCss.replace('wallpapers', newCss);
  377. }
  378. }
  379. async checkNewVersionAvailable() {
  380. if (!this.checkingNewVersion && this.showNeedUpdateNotify) {
  381. this.checkingNewVersion = true;
  382. try {
  383. await utils.sleep(15*1000); //подождем 15 секунд, чтобы прогрузился ServiceWorker при выходе новой версии
  384. const config = await miscApi.loadConfig();
  385. this.commit('config/setConfig', config);
  386. let againMes = '';
  387. if (this.isFirstNeedUpdateNotify) {
  388. againMes = ' еще один раз';
  389. }
  390. if (this.version != this.clientVersion)
  391. this.$root.notify.info(`Вышла новая версия (v${this.version}) читалки.<br>Пожалуйста, обновите страницу${againMes}.`, 'Обновление');
  392. } catch(e) {
  393. console.error(e);
  394. } finally {
  395. this.checkingNewVersion = false;
  396. }
  397. this.isFirstNeedUpdateNotify = false;
  398. }
  399. }
  400. updateHeaderMinWidth() {
  401. const showButtonCount = Object.values(this.showToolButton).reduce((a, b) => a + (b ? 1 : 0), 0);
  402. if (this.$refs.buttons)
  403. this.$refs.buttons.style.minWidth = 65*showButtonCount + 'px';
  404. (async() => {
  405. await utils.sleep(1000);
  406. if (this.$refs.header)
  407. this.$refs.header.style.overflowX = 'auto';
  408. })();
  409. }
  410. checkSetStorageAccessKey() {
  411. const q = this.$route.query;
  412. if (q['setStorageAccessKey']) {
  413. this.$router.replace(`/reader`);
  414. this.settingsToggle();
  415. this.$nextTick(() => {
  416. this.$refs.settingsPage.enterServerStorageKey(
  417. Buffer.from(utils.fromBase58(q['setStorageAccessKey'])).toString()
  418. );
  419. });
  420. }
  421. }
  422. checkActivateDonateHelpPage() {
  423. const q = this.$route.query;
  424. if (q['donate']) {
  425. this.$router.replace(`/reader`);
  426. this.helpToggle();
  427. this.$nextTick(() => {
  428. this.$refs.helpPage.activateDonateHelpPage();
  429. });
  430. }
  431. }
  432. checkBookPosPercent() {
  433. const q = this.$route.query;
  434. if (q['__pp']) {
  435. let pp = q['__pp'];
  436. if (pp) {
  437. pp = parseFloat(pp) || 0;
  438. const recent = this.mostRecentBook();
  439. (async() => {
  440. await utils.sleep(100);
  441. this.bookPos = Math.floor(recent.textLength*pp/100);
  442. })();
  443. }
  444. }
  445. }
  446. get routeParamPos() {
  447. let result = undefined;
  448. const q = this.$route.query;
  449. if (q['__p']) {
  450. result = q['__p'];
  451. if (Array.isArray(result))
  452. result = result[0];
  453. }
  454. return (result ? parseInt(result, 10) || 0 : result);
  455. }
  456. updateRoute(isNewRoute) {
  457. if (this.loading)
  458. return;
  459. const recent = this.mostRecentBook();
  460. const pos = (recent && recent.bookPos && this.allowUrlParamBookPos ? `__p=${recent.bookPos}&` : '');
  461. const url = (recent ? `url=${recent.url}` : '');
  462. if (isNewRoute)
  463. this.$router.push(`/reader?${pos}${url}`).catch(() => {});
  464. else
  465. this.$router.replace(`/reader?${pos}${url}`).catch(() => {});
  466. }
  467. get mode() {
  468. return this.$store.state.config.mode;
  469. }
  470. get version() {
  471. return this.$store.state.config.version;
  472. }
  473. get clientVersion() {
  474. return versionHistory[0].version;
  475. }
  476. get routeParamUrl() {
  477. let result = '';
  478. const path = this.$route.fullPath;
  479. const i = path.indexOf('url=');
  480. if (i >= 0) {
  481. result = path.substr(i + 4);
  482. }
  483. return decodeURIComponent(result);
  484. }
  485. get routeParamRefresh() {
  486. const q = this.$route.query;
  487. return !!q['__refresh'];
  488. }
  489. bookPosChanged(event) {
  490. if (event.bookPosSeen !== undefined)
  491. this.bookPosSeen = event.bookPosSeen;
  492. this.bookPos = event.bookPos;
  493. }
  494. async bookManagerEvent(eventName, value) {
  495. if (eventName == 'set-recent' || eventName == 'recent-deleted') {
  496. const oldBook = (this.textPage ? this.textPage.lastBook : null);
  497. const oldPos = (this.textPage ? this.textPage.bookPos : null);
  498. const newBook = bookManager.mostRecentBook();
  499. if (!(oldBook && newBook && oldBook.key == newBook.key)) {
  500. this.mostRecentBook();
  501. }
  502. if (oldBook && newBook) {
  503. if (oldBook.key != newBook.key || oldBook.path != newBook.path) {
  504. this.loadingBook = true;
  505. try {
  506. await this.loadBook(newBook);
  507. } finally {
  508. this.loadingBook = false;
  509. }
  510. } else if (oldPos != newBook.bookPos) {
  511. while (this.loadingBook) await utils.sleep(100);
  512. this.bookPosChanged({bookPos: newBook.bookPos});
  513. }
  514. }
  515. }
  516. if (eventName == 'recent-changed') {
  517. if (this.recentBooksActive) {
  518. await this.$refs.recentBooksPage.updateTableData();
  519. }
  520. //сохранение в serverStorage
  521. if (value) {
  522. await utils.sleep(500);
  523. let timer = setTimeout(() => {
  524. if (!this.offlineModeActive)
  525. this.$root.notify.error('Таймаут соединения');
  526. }, 10000);
  527. try {
  528. await this.$refs.serverStorage.saveRecent(value);
  529. } catch (e) {
  530. if (!this.offlineModeActive)
  531. this.$root.notify.error(e.message);
  532. } finally {
  533. clearTimeout(timer);
  534. }
  535. }
  536. }
  537. }
  538. get toolBarActive() {
  539. return this.reader.toolBarActive;
  540. }
  541. mostRecentBook() {
  542. const result = bookManager.mostRecentBook();
  543. this.mostRecentBookReactive = result;
  544. return result;
  545. }
  546. get settings() {
  547. return this.$store.state.reader.settings;
  548. }
  549. addAction(pos) {
  550. let a = this.actionList;
  551. if (!a.length || a[a.length - 1] != pos) {
  552. a.push(pos);
  553. if (a.length > 20)
  554. a.shift();
  555. this.actionCur = a.length - 1;
  556. }
  557. }
  558. toolBarToggle() {
  559. this.commit('reader/setToolBarActive', !this.toolBarActive);
  560. this.$root.eventHook('resize');
  561. }
  562. fullScreenToggle() {
  563. this.fullScreenActive = !this.fullScreenActive;
  564. if (this.fullScreenActive) {
  565. this.$q.fullscreen.request();
  566. } else {
  567. this.$q.fullscreen.exit();
  568. }
  569. }
  570. closeAllWindows() {
  571. this.setPositionActive = false;
  572. this.copyTextActive = false;
  573. this.recentBooksActive = false;
  574. this.settingsActive = false;
  575. this.stopScrolling();
  576. this.stopSearch();
  577. this.helpActive = false;
  578. this.contentsActive = false;
  579. }
  580. loaderToggle() {
  581. this.loaderActive = !this.loaderActive;
  582. if (this.loaderActive) {
  583. this.closeAllWindows();
  584. }
  585. }
  586. setPositionToggle() {
  587. this.setPositionActive = !this.setPositionActive;
  588. const page = this.$refs.page;
  589. if (this.setPositionActive && this.activePage == 'TextPage' && page.parsed) {
  590. this.closeAllWindows();
  591. this.setPositionActive = true;
  592. this.$nextTick(() => {
  593. const recent = this.mostRecentBook();
  594. this.$refs.setPositionPage.init(recent.bookPos, recent.textLength - 1);
  595. });
  596. } else {
  597. this.setPositionActive = false;
  598. }
  599. }
  600. stopScrolling() {
  601. if (this.scrollingActive)
  602. this.scrollingToggle();
  603. }
  604. scrollingToggle() {
  605. this.scrollingActive = !this.scrollingActive;
  606. if (this.activePage == 'TextPage') {
  607. const page = this.$refs.page;
  608. if (this.scrollingActive) {
  609. page.startTextScrolling();
  610. } else {
  611. page.stopTextScrolling();
  612. }
  613. }
  614. if (!this.scrollingActive) {
  615. this.scrollingSetRecentBook.flush();
  616. }
  617. }
  618. stopSearch() {
  619. if (this.searchActive)
  620. this.searchToggle();
  621. }
  622. startTextSearch(opts) {
  623. if (this.activePage == 'TextPage')
  624. this.$refs.page.startSearch(opts.needle);
  625. }
  626. stopTextSearch() {
  627. if (this.activePage == 'TextPage')
  628. this.$refs.page.stopSearch();
  629. }
  630. searchToggle() {
  631. this.searchActive = !this.searchActive;
  632. const page = this.$refs.page;
  633. if (this.searchActive && this.activePage == 'TextPage' && page.parsed) {
  634. this.closeAllWindows();
  635. this.searchActive = true;
  636. this.$nextTick(() => {
  637. this.$refs.searchPage.init(page.parsed);
  638. });
  639. } else {
  640. this.stopTextSearch();
  641. this.searchActive = false;
  642. }
  643. }
  644. copyTextToggle() {
  645. this.copyTextActive = !this.copyTextActive;
  646. const page = this.$refs.page;
  647. if (this.copyTextActive && this.activePage == 'TextPage' && page.parsed) {
  648. this.closeAllWindows();
  649. this.copyTextActive = true;
  650. this.$nextTick(() => {
  651. this.$refs.copyTextPage.init(this.mostRecentBook().bookPos, page.parsed, this.copyFullText);
  652. });
  653. } else {
  654. this.copyTextActive = false;
  655. }
  656. }
  657. recentBooksClose() {
  658. this.recentBooksActive = false;
  659. }
  660. recentBooksToggle() {
  661. this.recentBooksActive = !this.recentBooksActive;
  662. if (this.recentBooksActive) {
  663. this.closeAllWindows();
  664. this.$refs.recentBooksPage.init();
  665. this.recentBooksActive = true;
  666. } else {
  667. this.recentBooksActive = false;
  668. }
  669. }
  670. contentsPageToggle() {
  671. this.contentsActive = !this.contentsActive;
  672. const page = this.$refs.page;
  673. if (this.contentsActive && this.activePage == 'TextPage' && page.parsed) {
  674. this.closeAllWindows();
  675. this.contentsActive = true;
  676. this.$nextTick(() => {
  677. this.$refs.contentsPage.init(this.mostRecentBook(), page.parsed);
  678. });
  679. } else {
  680. this.contentsActive = false;
  681. }
  682. }
  683. libsClose() {
  684. if (this.libsActive)
  685. this.libsToogle();
  686. }
  687. libsToogle() {
  688. this.libsActive = !this.libsActive;
  689. if (this.libsActive) {
  690. this.$refs.libsPage.init();
  691. } else {
  692. this.$refs.libsPage.done();
  693. }
  694. }
  695. offlineModeToggle() {
  696. this.offlineModeActive = !this.offlineModeActive;
  697. this.$refs.serverStorage.offlineModeActive = this.offlineModeActive;
  698. }
  699. settingsToggle() {
  700. this.settingsActive = !this.settingsActive;
  701. if (this.settingsActive) {
  702. this.closeAllWindows();
  703. this.settingsActive = true;
  704. this.$nextTick(() => {
  705. this.$refs.settingsPage.init();
  706. });
  707. } else {
  708. this.settingsActive = false;
  709. }
  710. }
  711. convOptionsToggle() {
  712. this.settingsToggle();
  713. if (this.settingsActive)
  714. this.$refs.settingsPage.selectedTab = 'convert';
  715. }
  716. helpToggle() {
  717. this.helpActive = !this.helpActive;
  718. if (this.helpActive) {
  719. this.closeAllWindows();
  720. this.helpActive = true;
  721. }
  722. }
  723. donateToggle() {
  724. this.helpToggle();
  725. if (this.helpActive) {
  726. this.$nextTick(() => {
  727. this.$refs.helpPage.activateDonateHelpPage();
  728. });
  729. }
  730. }
  731. versionHistoryToggle() {
  732. this.helpToggle();
  733. if (this.helpActive) {
  734. this.$nextTick(() => {
  735. this.$refs.helpPage.activateVersionHistoryHelpPage();
  736. });
  737. }
  738. }
  739. refreshBook() {
  740. const mrb = this.mostRecentBook();
  741. this.loadBook({url: mrb.url, uploadFileName: mrb.uploadFileName, force: true});
  742. }
  743. undoAction() {
  744. if (this.actionCur > 0) {
  745. this.actionCur--;
  746. this.bookPosChanged({bookPos: this.actionList[this.actionCur]});
  747. }
  748. }
  749. redoAction() {
  750. if (this.actionCur < this.actionList.length - 1) {
  751. this.actionCur++;
  752. this.bookPosChanged({bookPos: this.actionList[this.actionCur]});
  753. }
  754. }
  755. buttonClick(action) {
  756. const activeClass = this.buttonActiveClass(action);
  757. this.$refs[action].blur();
  758. if (activeClass['tool-button-disabled'])
  759. return;
  760. this.doAction({action});
  761. }
  762. buttonActiveClass(action) {
  763. const classActive = { 'tool-button-active': true, 'tool-button-active:hover': true };
  764. const classDisabled = { 'tool-button-disabled': true, 'tool-button-disabled:hover': true };
  765. let classResult = {};
  766. switch (action) {
  767. case 'loader':
  768. case 'fullScreen':
  769. case 'setPosition':
  770. case 'search':
  771. case 'copyText':
  772. case 'convOptions':
  773. case 'refresh':
  774. case 'contents':
  775. case 'libs':
  776. case 'recentBooks':
  777. case 'offlineMode':
  778. case 'settings':
  779. if (this.progressActive) {
  780. classResult = classDisabled;
  781. } else if (this[`${action}Active`]) {
  782. classResult = classActive;
  783. }
  784. break;
  785. case 'scrolling':
  786. if (this.progressActive || this.dualPageMode) {
  787. classResult = classDisabled;
  788. } else if (this[`${action}Active`]) {
  789. classResult = classActive;
  790. }
  791. break;
  792. case 'undoAction':
  793. if (this.actionCur <= 0)
  794. classResult = classDisabled;
  795. break;
  796. case 'redoAction':
  797. if (this.actionCur == this.actionList.length - 1)
  798. classResult = classDisabled;
  799. break;
  800. }
  801. if (this.activePage == 'LoaderPage' || !this.mostRecentBookReactive) {
  802. switch (action) {
  803. case 'undoAction':
  804. case 'redoAction':
  805. case 'setPosition':
  806. case 'scrolling':
  807. case 'search':
  808. case 'copyText':
  809. case 'contents':
  810. classResult = classDisabled;
  811. break;
  812. case 'refresh':
  813. case 'recentBooks':
  814. if (!this.mostRecentBookReactive)
  815. classResult = classDisabled;
  816. break;
  817. }
  818. }
  819. return classResult;
  820. }
  821. async activateClickMapPage() {
  822. if (this.clickControl && this.showClickMapPage && !this.clickMapActive) {
  823. this.clickMapActive = true;
  824. await this.$refs.clickMapPage.slowDisappear();
  825. this.clickMapActive = false;
  826. }
  827. }
  828. get activePage() {
  829. let result = undefined;
  830. if (this.progressActive)
  831. result = 'ProgressPage';
  832. else if (this.loaderActive)
  833. result = 'LoaderPage';
  834. else if (this.mostRecentBookReactive)
  835. result = 'TextPage';
  836. if (!result && !this.loading) {
  837. this.loaderActive = true;
  838. result = 'LoaderPage';
  839. }
  840. if (result != 'TextPage') {
  841. this.$root.setAppTitle();
  842. }
  843. // на LoaderPage всегда показываем toolBar
  844. if (result == 'LoaderPage' && !this.toolBarActive) {
  845. this.toolBarToggle();
  846. }
  847. if (this.lastActivePage != result && result == 'TextPage') {
  848. //акивируем страницу с текстом
  849. this.$nextTick(async() => {
  850. const last = this.mostRecentBookReactive;
  851. const isParsed = await bookManager.hasBookParsed(last);
  852. if (!isParsed) {
  853. this.$root.setAppTitle();
  854. return;
  855. }
  856. this.updateRoute();
  857. const textPage = this.$refs.page;
  858. if (textPage.showBook) {
  859. this.textPage = textPage;
  860. textPage.lastBook = last;
  861. textPage.bookPos = (last.bookPos !== undefined ? last.bookPos : 0);
  862. textPage.showBook();
  863. }
  864. });
  865. }
  866. this.lastActivePage = result;
  867. return result;
  868. }
  869. async loadBook(opts) {
  870. if (!opts || !opts.url) {
  871. this.mostRecentBook();
  872. return;
  873. }
  874. this.closeAllWindows();
  875. let url = encodeURI(decodeURI(opts.url));
  876. //TODO: убрать конвертирование 'file://' после 06.2021
  877. if (url.length == 71 && url.indexOf('file://') == 0)
  878. url = url.replace(/^file/, 'disk');
  879. if ((url.indexOf('http://') != 0) && (url.indexOf('https://') != 0) &&
  880. (url.indexOf('disk://') != 0))
  881. url = 'http://' + url;
  882. // уже просматривается сейчас
  883. const lastBook = (this.textPage ? this.textPage.lastBook : null);
  884. if (!opts.force && lastBook && lastBook.url == url &&
  885. (!opts.path || opts.path == lastBook.path) &&
  886. await bookManager.hasBookParsed(lastBook)) {
  887. this.loaderActive = false;
  888. return;
  889. }
  890. this.progressActive = true;
  891. await this.$nextTick();
  892. const progress = this.$refs.page;
  893. this.actionList = [];
  894. this.actionCur = -1;
  895. try {
  896. progress.show();
  897. progress.setState({state: 'parse'});
  898. // есть ли среди недавних
  899. const key = bookManager.keyFromUrl(url);
  900. let wasOpened = await bookManager.getRecentBook({key});
  901. wasOpened = (wasOpened ? wasOpened : {});
  902. const bookPos = (opts.bookPos !== undefined ? opts.bookPos : wasOpened.bookPos);
  903. const bookPosSeen = (opts.bookPos !== undefined ? opts.bookPos : wasOpened.bookPosSeen);
  904. const uploadFileName = (opts.uploadFileName ? opts.uploadFileName : '');
  905. let book = null;
  906. if (!opts.force) {
  907. // пытаемся загрузить и распарсить книгу в менеджере из локального кэша
  908. const bookParsed = await bookManager.getBook({url, path: opts.path}, (prog) => {
  909. progress.setState({progress: prog});
  910. });
  911. // если есть в локальном кэше
  912. if (bookParsed) {
  913. await bookManager.setRecentBook(Object.assign({bookPos, bookPosSeen}, bookParsed));
  914. this.mostRecentBook();
  915. this.addAction(bookPos);
  916. this.loaderActive = false;
  917. progress.hide(); this.progressActive = false;
  918. this.blinkCachedLoadMessage();
  919. this.checkBookPosPercent();
  920. await this.activateClickMapPage();
  921. return;
  922. }
  923. // иначе идем на сервер
  924. // пытаемся загрузить готовый файл с сервера
  925. if (wasOpened.path) {
  926. progress.setState({totalSteps: 5});
  927. try {
  928. const resp = await readerApi.loadCachedBook(wasOpened.path, (state) => {
  929. progress.setState(state);
  930. });
  931. book = Object.assign({}, wasOpened, {data: resp.data});
  932. } catch (e) {
  933. //молчим
  934. }
  935. }
  936. }
  937. progress.setState({totalSteps: 5});
  938. // не удалось, скачиваем книгу полностью с конвертацией
  939. let loadCached = true;
  940. if (!book) {
  941. book = await readerApi.loadBook({
  942. url,
  943. uploadFileName,
  944. enableSitesFilter: this.enableSitesFilter,
  945. skipHtmlCheck: (this.splitToPara ? true : false),
  946. isText: (this.splitToPara ? true : false),
  947. djvuQuality: this.djvuQuality,
  948. pdfAsText: this.pdfAsText,
  949. pdfQuality: this.pdfQuality,
  950. },
  951. (state) => {
  952. progress.setState(state);
  953. }
  954. );
  955. loadCached = false;
  956. }
  957. // добавляем в bookManager
  958. progress.setState({state: 'parse', step: 5});
  959. const addedBook = await bookManager.addBook(book, (prog) => {
  960. progress.setState({progress: prog});
  961. });
  962. // добавляем в историю
  963. await bookManager.setRecentBook(Object.assign({bookPos, bookPosSeen, uploadFileName}, addedBook));
  964. this.mostRecentBook();
  965. this.addAction(bookPos);
  966. this.updateRoute(true);
  967. this.loaderActive = false;
  968. progress.hide(); this.progressActive = false;
  969. if (loadCached) {
  970. this.blinkCachedLoadMessage();
  971. } else
  972. this.stopBlink = true;
  973. this.checkBookPosPercent();
  974. await this.activateClickMapPage();
  975. } catch (e) {
  976. progress.hide(); this.progressActive = false;
  977. this.loaderActive = true;
  978. if (!this.showHelpOnErrorIfNeeded(e.message)) {
  979. this.$root.stdDialog.alert(e.message, 'Ошибка', {color: 'negative'});
  980. }
  981. } finally {
  982. this.checkNewVersionAvailable();
  983. }
  984. }
  985. async loadFile(opts) {
  986. this.progressActive = true;
  987. await this.$nextTick();
  988. const progress = this.$refs.page;
  989. try {
  990. progress.show();
  991. progress.setState({state: 'upload'});
  992. const url = await readerApi.uploadFile(opts.file, this.config.maxUploadFileSize, (state) => {
  993. progress.setState(state);
  994. });
  995. progress.hide(); this.progressActive = false;
  996. await this.loadBook({url, uploadFileName: opts.file.name, force: true});
  997. } catch (e) {
  998. progress.hide(); this.progressActive = false;
  999. this.loaderActive = true;
  1000. this.$root.stdDialog.alert(e.message, 'Ошибка', {color: 'negative'});
  1001. }
  1002. }
  1003. blinkCachedLoadMessage() {
  1004. if (!this.blinkCachedLoad)
  1005. return;
  1006. this.blinkCount = 30;
  1007. if (!this.inBlink) {
  1008. this.inBlink = true;
  1009. this.stopBlink = false;
  1010. this.$nextTick(async() => {
  1011. let page = this.$refs.page;
  1012. while (this.blinkCount) {
  1013. this.showRefreshIcon = !this.showRefreshIcon;
  1014. if (page && page.blinkCachedLoadMessage)
  1015. page.blinkCachedLoadMessage(this.showRefreshIcon);
  1016. await utils.sleep(500);
  1017. if (this.stopBlink)
  1018. break;
  1019. this.blinkCount--;
  1020. page = this.$refs.page;
  1021. }
  1022. this.showRefreshIcon = true;
  1023. this.inBlink = false;
  1024. if (page && page.blinkCachedLoadMessage)
  1025. page.blinkCachedLoadMessage('finish');
  1026. });
  1027. }
  1028. }
  1029. doAction(opts) {
  1030. let result = true;
  1031. let {action = '', event = false} = opts;
  1032. switch (action) {
  1033. case 'loader':
  1034. this.loaderToggle();
  1035. break;
  1036. case 'help':
  1037. this.helpToggle();
  1038. break;
  1039. case 'undoAction':
  1040. this.undoAction();
  1041. break;
  1042. case 'redoAction':
  1043. this.redoAction();
  1044. break;
  1045. case 'fullScreen':
  1046. this.fullScreenToggle();
  1047. break;
  1048. case 'scrolling':
  1049. this.scrollingToggle();
  1050. break;
  1051. case 'stopScrolling':
  1052. this.stopScrolling();
  1053. break;
  1054. case 'setPosition':
  1055. this.setPositionToggle();
  1056. break;
  1057. case 'search':
  1058. this.searchToggle();
  1059. break;
  1060. case 'copyText':
  1061. this.copyTextToggle();
  1062. break;
  1063. case 'convOptions':
  1064. this.convOptionsToggle();
  1065. break;
  1066. case 'refresh':
  1067. this.refreshBook();
  1068. break;
  1069. case 'contents':
  1070. this.contentsPageToggle();
  1071. break;
  1072. case 'libs':
  1073. this.libsToogle();
  1074. break;
  1075. case 'recentBooks':
  1076. this.recentBooksToggle();
  1077. break;
  1078. case 'offlineMode':
  1079. this.offlineModeToggle();
  1080. break;
  1081. case 'settings':
  1082. this.settingsToggle();
  1083. break;
  1084. case 'switchToolbar':
  1085. this.toolBarToggle();
  1086. break;
  1087. case 'donate':
  1088. this.donateToggle();
  1089. break;
  1090. default:
  1091. result = false;
  1092. break;
  1093. }
  1094. if (!result && this.activePage == 'TextPage' && this.$refs.page) {
  1095. result = true;
  1096. const textPage = this.$refs.page;
  1097. switch (action) {
  1098. case 'bookBegin':
  1099. textPage.doHome();
  1100. break;
  1101. case 'bookEnd':
  1102. textPage.doEnd();
  1103. break;
  1104. case 'pageBack':
  1105. textPage.doPageUp();
  1106. break;
  1107. case 'pageForward':
  1108. textPage.doPageDown();
  1109. break;
  1110. case 'lineBack':
  1111. textPage.doUp();
  1112. break;
  1113. case 'lineForward':
  1114. textPage.doDown();
  1115. break;
  1116. case 'incFontSize':
  1117. textPage.doFontSizeInc();
  1118. break;
  1119. case 'decFontSize':
  1120. textPage.doFontSizeDec();
  1121. break;
  1122. case 'scrollingSpeedUp':
  1123. textPage.doScrollingSpeedUp();
  1124. break;
  1125. case 'scrollingSpeedDown':
  1126. textPage.doScrollingSpeedDown();
  1127. break;
  1128. default:
  1129. result = false;
  1130. break;
  1131. }
  1132. }
  1133. if (result && event) {
  1134. event.preventDefault();
  1135. event.stopPropagation();
  1136. }
  1137. return result;
  1138. }
  1139. keyHook(event) {
  1140. let result = false;
  1141. if (this.$root.getRootRoute() == '/reader') {
  1142. if (this.$root.stdDialog.active)
  1143. return result;
  1144. if (!result)
  1145. result = this.$refs.dialogs.keyHook(event);
  1146. if (!result && this.helpActive)
  1147. result = this.$refs.helpPage.keyHook(event);
  1148. if (!result && this.settingsActive)
  1149. result = this.$refs.settingsPage.keyHook(event);
  1150. if (!result && this.recentBooksActive)
  1151. result = this.$refs.recentBooksPage.keyHook(event);
  1152. if (!result && this.setPositionActive)
  1153. result = this.$refs.setPositionPage.keyHook(event);
  1154. if (!result && this.searchActive)
  1155. result = this.$refs.searchPage.keyHook(event);
  1156. if (!result && this.copyTextActive)
  1157. result = this.$refs.copyTextPage.keyHook(event);
  1158. if (!result && this.contentsActive)
  1159. result = this.$refs.contentsPage.keyHook(event);
  1160. if (!result && this.$refs.page && this.$refs.page.keyHook)
  1161. result = this.$refs.page.keyHook(event);
  1162. if (!result && event.type == 'keydown') {
  1163. const action = this.$root.readerActionByKeyEvent(event);
  1164. if (action == 'loader') {
  1165. result = this.doAction({action, event});
  1166. }
  1167. if (!result && this.activePage == 'TextPage') {
  1168. result = this.doAction({action, event});
  1169. }
  1170. }
  1171. }
  1172. return result;
  1173. }
  1174. }
  1175. export default vueComponent(Reader);
  1176. //-----------------------------------------------------------------------------
  1177. </script>
  1178. <style scoped>
  1179. .header {
  1180. padding-left: 5px;
  1181. padding-right: 5px;
  1182. background-color: #1B695F;
  1183. color: #000;
  1184. overflow: hidden;
  1185. height: 50px;
  1186. }
  1187. .main {
  1188. background-color: #EBE2C9;
  1189. color: #000;
  1190. }
  1191. .tool-button {
  1192. margin: 0px 2px 0 2px;
  1193. padding: 0;
  1194. color: #3E843E;
  1195. background-color: #E6EDF4;
  1196. margin-top: 5px;
  1197. height: 38px;
  1198. width: 38px;
  1199. border: 0;
  1200. border-radius: 6px;
  1201. box-shadow: 3px 3px 5px black;
  1202. outline: 0;
  1203. }
  1204. .tool-button:hover {
  1205. background-color: white;
  1206. cursor: pointer;
  1207. }
  1208. .tool-button-active {
  1209. box-shadow: 0 0 0;
  1210. color: white;
  1211. background-color: #8AB45F;
  1212. position: relative;
  1213. top: 1px;
  1214. left: 1px;
  1215. }
  1216. .tool-button-active:hover {
  1217. color: white;
  1218. background-color: #81C581;
  1219. cursor: pointer;
  1220. }
  1221. .tool-button-disabled {
  1222. color: lightgray;
  1223. background-color: gray;
  1224. cursor: default;
  1225. }
  1226. .tool-button-disabled:hover {
  1227. color: lightgray;
  1228. background-color: gray;
  1229. cursor: default;
  1230. }
  1231. .space {
  1232. width: 10px;
  1233. display: inline-block;
  1234. }
  1235. .clear {
  1236. color: rgba(0,0,0,0);
  1237. }
  1238. </style>