Merge branch 'release/0.11.8'

0.11.7-6

client/api/reader.js

@@ -1,5 +1,6 @@
 import axios from 'axios';
 import * as utils from '../share/utils';
+import * as cryptoUtils from '../share/cryptoUtils';
 import wsc from './webSocketConnection';
 
 const api = axios.create({
@@ -174,11 +175,10 @@ class Reader {
         return await axios.get(url, options);
     }
 
-    async uploadFile(file, maxUploadFileSize, callback) {
+    async uploadFile(file, maxUploadFileSize = 10*1024*1024, callback) {
-        if (!maxUploadFileSize)
-            maxUploadFileSize = 10*1024*1024;
         if (file.size > maxUploadFileSize)
             throw new Error(`Размер файла превышает ${maxUploadFileSize} байт`);
+
         let formData = new FormData();
         formData.append('file', file, file.name);
 
@@ -225,6 +225,33 @@ class Reader {
 
         return response;
     }
+
+    async uploadFileBuf(buf, urlCallback) {
+        const key = utils.toHex(cryptoUtils.sha256(buf));
+        const url = `disk://${key}`;
+
+        if (urlCallback)
+            urlCallback(url);
+
+        let response;
+        try {
+            await axios.head(`/upload/${key}`, {headers: {'Cache-Control': 'no-cache'}});
+            response = await wsc.message(await wsc.send({action: 'upload-file-touch', url}));
+        } catch (e) {
+            response = await wsc.message(await wsc.send({action: 'upload-file-buf', buf}));
+        }
+
+        if (response.error)
+            throw new Error(response.error);
+
+        return response;
+    }
+
+    async getUploadedFileBuf(url) {
+        url = url.replace('disk://', '/upload/');
+        return (await axios.get(url)).data;
+    }
+
 }
 
 export default new Reader();

client/components/ExternalLibs/BookmarkSettings/BookmarkSettings.vue

@@ -11,7 +11,7 @@
                         Открыть выбранную закладку
                     </q-tooltip>
                 </q-btn>
-                <q-input ref="search" v-model="search" class="col" rounded outlined dense bg-color="white" placeholder="Найти">
+                <q-input ref="search" v-model="search" class="col" outlined dense bg-color="white" placeholder="Найти">
                     <template #append>
                         <q-icon v-if="search !== ''" name="la la-times" class="cursor-pointer" @click="resetSearch" />
                     </template>

client/components/ExternalLibs/ExternalLibs.vue

@@ -5,19 +5,19 @@
         </template>
 
         <template #buttons>
-            <span class="full-screen-button row justify-center items-center" @mousedown.stop @click="fullScreenToggle">
+            <span class="header-button row justify-center items-center" @mousedown.stop @click="fullScreenToggle">
                 <q-icon :name="(fullScreenActive ? 'la la-compress-arrows-alt': 'la la-expand-arrows-alt')" size="16px" />
                 <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">На весь экран</q-tooltip>
             </span>
-            <span class="full-screen-button row justify-center items-center" @mousedown.stop @click="changeScale(0.1)">
+            <span class="header-button row justify-center items-center" @mousedown.stop @click="changeScale(0.1)">
                 <q-icon name="la la-plus" size="16px" />
                 <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Увеличить масштаб</q-tooltip>
             </span>
-            <span class="full-screen-button row justify-center items-center" @mousedown.stop @click="changeScale(-0.1)">
+            <span class="header-button row justify-center items-center" @mousedown.stop @click="changeScale(-0.1)">
                 <q-icon name="la la-minus" size="16px" />
                 <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Уменьшить масштаб</q-tooltip>
             </span>
-            <span class="full-screen-button row justify-center items-center" @mousedown.stop @click="showHelp">
+            <span class="header-button row justify-center items-center" @mousedown.stop @click="showHelp">
                 <q-icon name="la la-question-circle" size="16px" />
                 <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Справка</q-tooltip>
             </span>
@@ -32,7 +32,7 @@
                     :options="rootLinkOptions"
                     style="width: 230px"
                     dropdown-icon="la la-angle-down la-sm"
-                    rounded outlined dense emit-value map-options display-value-sanitize options-sanitize
+                    outlined dense emit-value map-options display-value-sanitize options-sanitize
                     @popup-show="onSelectPopupShow" @popup-hide="onSelectPopupHide"
                 >
                     <template #prepend>
@@ -61,7 +61,7 @@
                     :options="selectedLinkOptions"
                     style="width: 50px"
                     dropdown-icon="la la-angle-down la-sm"
-                    rounded outlined dense emit-value map-options hide-selected display-value-sanitize options-sanitize
+                    outlined dense emit-value map-options hide-selected display-value-sanitize options-sanitize
                     @popup-show="onSelectPopupShow" @popup-hide="onSelectPopupHide"
                 >
                     <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">
@@ -73,7 +73,7 @@
                     ref="input"
                     v-model="bookUrl"
                     class="col q-mr-sm"
-                    rounded outlined dense
+                    outlined dense
                     bg-color="white"
                     placeholder="Скопируйте сюда ссылку на книгу и нажмите 'Открыть'"
                     @focus="selectAllOnFocus" @keydown="bookUrlKeyDown"
@@ -99,7 +99,7 @@
                     </template>
                 </q-input>
 
-                <q-btn :disabled="!bookUrl" rounded color="green-7" no-caps size="14px" @click="submitUrl">
+                <q-btn :disabled="!bookUrl" color="green-7" no-caps size="14px" @click="submitUrl">
                     Открыть
                     <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">
                         Открыть в читалке
@@ -894,14 +894,15 @@ export default vueComponent(ExternalLibs);
     background-color: #A0A0A0;
 }
 
-.full-screen-button {
+.header-button {
     width: 30px;
     height: 30px;
     cursor: pointer;
 }
 
-.full-screen-button:hover {
+.header-button:hover {
-    background-color: #69C05F;
+    color: white;
+    background-color: #39902F;
 }
 
 .transparent-layout {

client/components/Reader/ContentsPage/ContentsPage.vue

@@ -23,15 +23,15 @@
 
         <div class="q-mb-sm" />
 
-        <div v-show="selectedTab == 'contents'" class="tab-panel">
+        <div v-show="selectedTab == 'contents'" ref="tabPanelContents" class="tab-panel">
             <div>
                 <div v-for="item in contents" :key="item.key" class="column" style="width: 540px">
-                    <div class="row q-px-sm no-wrap" :class="{'item': !item.isBookPos, 'item-book-pos': item.isBookPos}">
+                    <div :ref="`mainitem${item.key}`" class="row q-px-sm no-wrap" :class="{'item': !item.isBookPos, 'item-book-pos': item.isBookPos}">
                         <div v-if="item.list.length" class="row justify-center items-center expand-button clickable" @click="expandClick(item.key)">
-                            <q-icon name="la la-caret-right" class="icon" :class="{'expanded-icon': item.expanded}" color="green-8" size="20px" />
+                            <q-icon name="la la-caret-right" class="icon" :class="{'expanded-icon': item.expanded}" color="green-8" size="24px" />
                         </div>
                         <div v-else class="no-expand-button clickable" @click="setBookPos(item.offset)">
-                            <q-icon name="la la-stop" class="icon" style="visibility: hidden" size="20px" />
+                            <q-icon name="la la-stop" class="icon" style="visibility: hidden" size="24px" />
                         </div>
                         <div class="col row clickable" @click="setBookPos(item.offset)">
                             <div :style="item.indentStyle"></div>
@@ -42,8 +42,12 @@
                         </div>
                     </div>
                     
-                    <div v-if="item.expanded" :ref="`subitem${item.key}`" class="subitems-transition">
+                    <div v-if="item.expanded" :ref="`subdiv${item.key}`" class="subitems-transition">
-                        <div v-for="subitem in item.list" :key="subitem.key" class="row q-px-sm no-wrap" :class="{'subitem': !subitem.isBookPos, 'subitem-book-pos': subitem.isBookPos}">
+                        <div 
+                            v-for="subitem in item.list" 
+                            :ref="`subitem${subitem.key}`" 
+                            :key="subitem.key" class="row q-px-sm no-wrap" :class="{'subitem': !subitem.isBookPos, 'subitem-book-pos': subitem.isBookPos}"
+                        >
                             <div class="col row clickable" @click="setBookPos(subitem.offset)">
                                 <div class="no-expand-button"></div>
                                 <div :style="subitem.indentStyle"></div>
@@ -61,10 +65,10 @@
             </div>
         </div>
 
-        <div v-show="selectedTab == 'images'" class="tab-panel">
+        <div v-show="selectedTab == 'images'" ref="tabPanelImages" class="tab-panel">
             <div>
                 <div v-for="item in images" :key="item.key" class="column" style="width: 540px">
-                    <div class="row q-px-sm no-wrap" :class="{'item': !item.isBookPos, 'item-book-pos': item.isBookPos}">
+                    <div :ref="`image${item.key}`" class="row q-px-sm no-wrap" :class="{'item': !item.isBookPos, 'item-book-pos': item.isBookPos}">
                         <div class="col row clickable" @click="setBookPos(item.offset)">
                             <div class="image-thumb-box row justify-center items-center">
                                 <div v-show="!imageLoaded[item.id]" class="image-thumb column justify-center">
@@ -124,7 +128,10 @@ const componentOptions = {
     watch: {
         bookPos() {
             this.updateBookPosSelection();
-        }
+        },
+        selectedTab() {
+            this.updateBookPosScrollTop();
+        },
     },
 };
 class ContentsPage {
@@ -282,31 +289,30 @@ class ContentsPage {
         if (!this.isVisible)
             return;
 
-        await utils.sleep(50);
+        await this.$nextTick();
         const bp = this.bookPos;
         
         for (let i = 0; i < this.contents.length; i++) {
             const item = this.contents[i];
             const nextOffset = (i < this.contents.length - 1 ? this.contents[i + 1].offset : this.parsed.textLength);
 
+            if (bp >= item.offset && bp < nextOffset) {
+                item.isBookPos = true;
+            } else if (item.isBookPos) {
+                item.isBookPos = false;
+            }
+
             for (let j = 0; j < item.list.length; j++) {
                 const subitem = item.list[j];
                 const nextSubOffset = (j < item.list.length - 1 ? item.list[j + 1].offset : nextOffset);
 
                 if (bp >= subitem.offset && bp < nextSubOffset) {
                     subitem.isBookPos = true;
-                    this.contents[i] = Object.assign(item, {list: item.list});
+                    this.updateBookPosScrollTop('contents', item, subitem, j);
                 } else if (subitem.isBookPos) {
                     subitem.isBookPos = false;
-                    this.contents[i] = Object.assign(item, {list: item.list});
                 }
             }
-
-            if (bp >= item.offset && bp < nextOffset) {
-                this.contents[i] = Object.assign(item, {isBookPos: true});
-            } else if (item.isBookPos) {
-                this.contents[i] = Object.assign(item, {isBookPos: false});
-            }
         }
 
         for (let i = 0; i < this.images.length; i++) {
@@ -314,11 +320,92 @@ class ContentsPage {
             const nextOffset = (i < this.images.length - 1 ? this.images[i + 1].offset : this.parsed.textLength);
 
             if (bp >= img.offset && bp < nextOffset) {
-                this.images[i] = Object.assign(img, {isBookPos: true});
+                this.images[i].isBookPos = true;
             } else if (img.isBookPos) {
-                this.images[i] = Object.assign(img, {isBookPos: false});
+                this.images[i].isBookPos = false;
             }
         }
+
+        this.updateBookPosScrollTop();
+    }
+
+    /*getOffsetTop(key) {
+        let el = this.getFirstElem(this.$refs[`mainitem${key}`]);
+        return (el ? el.offsetTop : 0);
+    }*/
+
+    async updateBookPosScrollTop() {
+        try {
+            await this.$nextTick();
+
+            if (this.selectedTab == 'contents') {
+                let item;
+                let subitem;
+                let i;
+
+                //ищем выделенные item
+                for(const _item of this.contents) {
+                    if (_item.isBookPos) {
+                        item = _item;
+                        for (let ii = 0; ii < item.list.length; ii++) {
+                            const _subitem = item.list[ii];
+                            if (_subitem.isBookPos) {
+                                subitem = _subitem;
+                                i = ii;
+                                break;
+                            }
+                        }
+                        break;
+                    }
+                }
+
+                if (!item)
+                    return;
+
+                //вычисляем и смещаем tabPanel.scrollTop
+                let el = this.getFirstElem(this.$refs[`mainitem${item.key}`]);
+                let elShift = 0;
+                if (subitem && item.expanded) {
+                    const subEl = this.getFirstElem(this.$refs[`subitem${subitem.key}`]);
+                    elShift = el.offsetHeight - subEl.offsetHeight*(i + 1);
+                } else {
+                    elShift = el.offsetHeight;
+                }
+
+                const tabPanel = this.$refs.tabPanelContents;
+                const halfH = tabPanel.clientHeight/2;
+                const newScrollTop = el.offsetTop - halfH - elShift;
+                if (newScrollTop < 20 + tabPanel.scrollTop - halfH || newScrollTop > -20 + tabPanel.scrollTop + halfH) 
+                    tabPanel.scrollTop = newScrollTop;
+            }
+
+            if (this.selectedTab == 'images') {
+                let item;
+
+                //ищем выделенные item
+                for(const _item of this.images) {
+                    if (_item.isBookPos) {
+                        item = _item;
+                        break;
+                    }
+                }
+
+                if (!item)
+                    return;
+
+                //вычисляем и смещаем tabPanel.scrollTop
+                let el = this.getFirstElem(this.$refs[`image${item.key}`]);
+
+                const tabPanel = this.$refs.tabPanelImages;
+                const halfH = tabPanel.clientHeight/2;
+                const newScrollTop = el.offsetTop - halfH - el.offsetHeight/2;
+
+                if (newScrollTop < 20 + tabPanel.scrollTop - halfH || newScrollTop > -20 + tabPanel.scrollTop + halfH) 
+                    tabPanel.scrollTop = newScrollTop;
+            }
+        } catch (e) {
+            console.error(e);
+        }
     }
 
     getFirstElem(items) {
@@ -330,8 +417,8 @@ class ContentsPage {
         const expanded = !item.expanded;
 
         if (!expanded) {
-            let subitems = this.getFirstElem(this.$refs[`subitem${key}`]);
+            let subdiv = this.getFirstElem(this.$refs[`subdiv${key}`]);
-            subitems.style.height = '0';
+            subdiv.style.height = '0';
             await utils.sleep(200);
         }
 
@@ -339,8 +426,8 @@ class ContentsPage {
 
         if (expanded) {
             await this.$nextTick();
-            let subitems = this.getFirstElem(this.$refs[`subitem${key}`]);
+            let subdiv = this.getFirstElem(this.$refs[`subdiv${key}`]);
-            subitems.style.height = subitems.scrollHeight + 'px';
+            subdiv.style.height = subdiv.scrollHeight + 'px';
         }
     }
 

client/components/Reader/HelpPage/HelpPage.vue

@@ -5,13 +5,20 @@
         </template>
 
         <div class="col column" style="min-width: 600px">
-            <q-btn-toggle
+            <div class="bg-grey-3 row">
-                v-model="selectedTab"
+                <q-tabs
-                toggle-color="primary"
+                    v-model="selectedTab"
-                no-caps unelevated
+                    active-color="black"
-                :options="buttons"
+                    active-bg-color="white"
-            />
+                    indicator-color="white"
-            <div class="separator"></div>
+                    dense
+                    no-caps
+                    inline-label
+                    class="bg-grey-4 text-grey-7"
+                >
+                    <q-tab v-for="btn in buttons" :key="btn.value" :name="btn.value" :label="btn.label" />
+                </q-tabs>
+            </div>
 
             <keep-alive>
                 <component :is="activePage" ref="page" class="col"></component>
@@ -93,8 +100,4 @@ export default vueComponent(HelpPage);
 </script>
 
 <style scoped>
-.separator {
-    height: 1px;
-    background-color: #E0E0E0;
-}
 </style>

client/components/Reader/ProgressPage/ProgressPage.vue

@@ -1,5 +1,5 @@
 <template>
-    <div v-show="visible" class="column justify-center items-center z-max" style="background-color: rgba(0, 0, 0, 0.8)">
+    <div v-show="visible" class="column justify-center items-center" style="background-color: rgba(0, 0, 0, 0.8); z-index: 100;">
         <div class="column justify-start items-center" style="height: 250px">
             <q-circular-progress
                 show-value

client/components/Reader/Reader.vue

@@ -141,6 +141,7 @@
                     @load-file="loadFile"
                     @book-pos-changed="bookPosChanged"
                     @do-action="doAction"
+                    @hide-tool-bar="hideToolBar"
                 ></component>
             </keep-alive>
 
@@ -193,6 +194,7 @@ import ReaderDialogs from './ReaderDialogs/ReaderDialogs.vue';
 
 import bookManager from './share/bookManager';
 import wallpaperStorage from './share/wallpaperStorage';
+import coversStorage from './share/coversStorage';
 import dynamicCss from '../../share/dynamicCss';
 
 import rstore from '../../store/modules/reader';
@@ -201,6 +203,7 @@ import miscApi from '../../api/misc';
 
 import {versionHistory} from './versionHistory';
 import * as utils from '../../share/utils';
+import LockQueue from '../../share/LockQueue';
 
 const componentOptions = {
     components: {
@@ -313,6 +316,8 @@ class Reader {
         this.reader = this.$store.state.reader;
         this.config = this.$store.state.config;
 
+        this.lock = new LockQueue(100);
+
         this.$root.addEventHook('key', this.keyHook);
 
         this.lastActivePage = false;
@@ -345,6 +350,13 @@ class Reader {
             this.debouncedSetRecentBook(newValue);
         }, 15000, {maxWait: 20000});
 
+        this.debouncedHideToolBar = _.debounce((event) => {
+            if (this.toolBarHideOnScroll && this.toolBarActive !== !!event.show) {
+                this.commit('reader/setToolBarActive', !!event.show);
+                this.$root.eventHook('resize');
+            }
+        }, 200);
+
         document.addEventListener('fullscreenchange', () => {
             this.fullScreenActive = (document.fullscreenElement !== null);
         });
@@ -355,6 +367,8 @@ class Reader {
     mounted() {
         (async() => {
             await wallpaperStorage.init();
+            await coversStorage.init();
+            
             await bookManager.init(this.settings);
             bookManager.addEventListener(this.bookManagerEvent);
 
@@ -402,6 +416,7 @@ class Reader {
         this.clickControlActive = this.clickControl;
         this.blinkCachedLoad = settings.blinkCachedLoad;
         this.showToolButton = settings.showToolButton;
+        this.toolBarHideOnScroll = settings.toolBarHideOnScroll;
         this.enableSitesFilter = settings.enableSitesFilter;
         this.showNeedUpdateNotify = settings.showNeedUpdateNotify;
         this.splitToPara = settings.splitToPara;
@@ -438,22 +453,47 @@ class Reader {
 
     //wallpaper css
     async loadWallpapers() {
-        const wallpaperDataLength = await wallpaperStorage.getLength();
+        if (!_.isEqual(this.userWallpapers, this.prevUserWallpapers)) {//оптимизация
-        if (wallpaperDataLength !== this.wallpaperDataLength) {//оптимизация
+            this.prevUserWallpapers = _.cloneDeep(this.userWallpapers);
-            this.wallpaperDataLength = wallpaperDataLength;
 
             let newCss = '';
+            let updated = false;
+            const wallpaperExists = new Set();
             for (const wp of this.userWallpapers) {
-                const data = await wallpaperStorage.getData(wp.cssClass);
+                wallpaperExists.add(wp.cssClass);
 
+                let data = await wallpaperStorage.getData(wp.cssClass);
                 if (!data) {
                     //здесь будем восстанавливать данные с сервера
+                    const url = `disk://${wp.cssClass.replace('user-paper', '')}`;
+                    try {
+                        data = await readerApi.getUploadedFileBuf(url);
+                        await wallpaperStorage.setData(wp.cssClass, data);
+                        updated = true;
+                    } catch (e) {
+                        console.error(e);
+                    }
                 }
 
                 if (data) {
                     newCss += `.${wp.cssClass} {background: url(${data}) center; background-size: 100% 100%;}`;                
                 }
             }
+
+            //почистим wallpaperStorage
+            for (const key of await wallpaperStorage.getKeys()) {
+                if (!wallpaperExists.has(key)) {
+                    await wallpaperStorage.removeData(key);
+                }
+            }
+
+            //обновим settings, если загружали обои из /upload/
+            if (updated) {
+                const newSettings = _.cloneDeep(this.settings);
+                newSettings.needUpdateSettingsView = (newSettings.needUpdateSettingsView < 10 ? newSettings.needUpdateSettingsView + 1 : 0);
+                this.commit('reader/setSettings', newSettings);
+            }
+
             dynamicCss.replace('wallpapers', newCss);
         }
     }
@@ -662,6 +702,10 @@ class Reader {
         this.$root.eventHook('resize');
     }
 
+    hideToolBar(event) {
+        this.debouncedHideToolBar(event);
+    }
+
     fullScreenToggle() {
         this.fullScreenActive = !this.fullScreenActive;
         if (this.fullScreenActive) {
@@ -897,7 +941,7 @@ class Reader {
 
     refreshBook() {
         const mrb = this.mostRecentBook();
-        this.loadBook({url: mrb.url, uploadFileName: mrb.uploadFileName, force: true});
+        this.loadBook(Object.assign({}, mrb, {force: true}));
     }
 
     undoAction() {
@@ -982,7 +1026,6 @@ class Reader {
                     classResult = classDisabled;
                     break;
                 case 'refresh':
-                case 'recentBooks':
                     if (!this.mostRecentBookReactive)
                         classResult = classDisabled;
                     break;
@@ -1051,7 +1094,7 @@ class Reader {
         return result;
     }
 
-    async loadBook(opts) {
+    async _loadBook(opts) {
         if (!opts || !opts.url) {
             this.mostRecentBook();
             return;
@@ -1061,10 +1104,6 @@ class Reader {
 
         let url = encodeURI(decodeURI(opts.url));
 
-        //TODO: убрать конвертирование 'file://' после 06.2021
-        if (url.length == 71 && url.indexOf('file://') == 0)
-            url = url.replace(/^file/, 'disk');
-
         if ((url.indexOf('http://') != 0) && (url.indexOf('https://') != 0) &&
             (url.indexOf('disk://') != 0))
             url = 'http://' + url;
@@ -1091,33 +1130,37 @@ class Reader {
             progress.show();
             progress.setState({state: 'parse'});
 
-            // есть ли среди недавних
+            // есть ли среди загруженных
-            const key = bookManager.keyFromUrl(url);
+            let wasOpened = bookManager.findRecentByUrlAndPath(url, opts.path);
-            let wasOpened = await bookManager.getRecentBook({key});
+            wasOpened = (wasOpened ? _.cloneDeep(wasOpened) : {});
-            wasOpened = (wasOpened ? wasOpened : {});
+
-            const bookPos = (opts.bookPos !== undefined ? opts.bookPos : wasOpened.bookPos);
+            wasOpened = Object.assign(wasOpened, {
-            const bookPosSeen = (opts.bookPos !== undefined ? opts.bookPos : wasOpened.bookPosSeen);
+                url: (opts.url !== undefined ? opts.url : wasOpened.url),
-            const uploadFileName = (opts.uploadFileName ? opts.uploadFileName : '');
+                path: (opts.path !== undefined ? opts.path : wasOpened.path),
+                bookPos: (opts.bookPos !== undefined ? opts.bookPos : wasOpened.bookPos),
+                bookPosSeen: (opts.bookPos !== undefined ? opts.bookPos : wasOpened.bookPosSeen),
+                uploadFileName: (opts.uploadFileName ? opts.uploadFileName : wasOpened.uploadFileName),
+            });
 
             let book = null;
 
             if (!opts.force) {
                 // пытаемся загрузить и распарсить книгу в менеджере из локального кэша
-                const bookParsed = await bookManager.getBook({url, path: opts.path}, (prog) => {
+                const bookParsed = await bookManager.getBook(wasOpened, (prog) => {
                     progress.setState({progress: prog});
                 });
 
                 // если есть в локальном кэше
                 if (bookParsed) {
-                    await bookManager.setRecentBook(Object.assign({bookPos, bookPosSeen}, bookParsed));
+                    await bookManager.setRecentBook(Object.assign(wasOpened, bookParsed));
                     this.mostRecentBook();
-                    this.addAction(bookPos);
+                    this.addAction(wasOpened.bookPos);
                     this.loaderActive = false;
                     progress.hide(); this.progressActive = false;
                     this.blinkCachedLoadMessage();
 
                     this.checkBookPosPercent();
-                    await this.activateClickMapPage();
+                    this.activateClickMapPage();//no await
                     return;
                 }
 
@@ -1131,7 +1174,7 @@ class Reader {
                         });
                         book = Object.assign({}, wasOpened, {data: resp.data});
                     } catch (e) {
-                        //молчим
+                        this.$root.notify.error('Конвертированный файл не найден на сервере.<br>Пробуем загрузить оригинал.', 'Ошибка загрузки');
                     }
                 }
             }
@@ -1142,7 +1185,7 @@ class Reader {
             if (!book) {
                 book = await readerApi.loadBook({
                         url,
-                        uploadFileName,
+                        uploadFileName: wasOpened.uploadFileName,
                         enableSitesFilter: this.enableSitesFilter,
                         skipHtmlCheck: (this.splitToPara ? true : false),
                         isText: (this.splitToPara ? true : false),
@@ -1159,14 +1202,44 @@ class Reader {
 
             // добавляем в bookManager
             progress.setState({state: 'parse', step: 5});
+
             const addedBook = await bookManager.addBook(book, (prog) => {
                 progress.setState({progress: prog});
             });
 
+            // sameBookKey
+            if (url.indexOf('disk://') == 0) {
+                //ищем такой файл в загруженных
+                let found = bookManager.findRecentBySameBookKey(wasOpened.uploadFileName);
+                found = (found ? _.cloneDeep(found) : found);
+
+                if (found) {
+                    if (wasOpened.sameBookKey != found.sameBookKey) {
+                        //спрашиваем, надо ли объединить файлы
+                        const askResult = bookManager.keysEqual(found.path, addedBook.path) || 
+                            await this.$root.stdDialog.askYesNo(`
+    Файл с именем "${wasOpened.uploadFileName}" уже есть в загруженных.
+    <br>Объединить позицию?`, 'Найдена похожая книга');
+                        if (askResult) {
+                            wasOpened.bookPos = found.bookPos;
+                            wasOpened.bookPosSeen = found.bookPosSeen;
+                            wasOpened.sameBookKey = found.sameBookKey;
+                        }
+                    }
+                } else {
+                    wasOpened.sameBookKey = wasOpened.uploadFileName;
+                }
+            } else {
+                wasOpened.sameBookKey = addedBook.url;
+            }
+
+            if (!bookManager.keysEqual(wasOpened.path, addedBook.path))
+                delete wasOpened.loadTime;
+
             // добавляем в историю
-            await bookManager.setRecentBook(Object.assign({bookPos, bookPosSeen, uploadFileName}, addedBook));
+            await bookManager.setRecentBook(Object.assign(wasOpened, addedBook));
             this.mostRecentBook();
-            this.addAction(bookPos);
+            this.addAction(wasOpened.bookPos);
             this.updateRoute(true);
 
             this.loaderActive = false;
@@ -1177,11 +1250,11 @@ class Reader {
                 this.stopBlink = true;
 
             this.checkBookPosPercent();
-            await this.activateClickMapPage();
+            this.activateClickMapPage();//no await
         } catch (e) {
             progress.hide(); this.progressActive = false;
             this.loaderActive = true;
-            if (!this.showHelpOnErrorIfNeeded(e.message)) {
+            if (!this.showHelpOnErrorIfNeeded(url)) {
                 this.$root.stdDialog.alert(e.message, 'Ошибка', {color: 'negative'});
             }
         } finally {
@@ -1189,7 +1262,16 @@ class Reader {
         }
     }
 
-    async loadFile(opts) {
+    async loadBook(opts) {
+        await this.lock.get();
+        try {
+            await this._loadBook(opts);
+        } finally {
+            this.lock.ret();
+        }
+    }
+
+    async _loadFile(opts) {
         this.progressActive = true;
 
         await this.$nextTick();
@@ -1205,7 +1287,7 @@ class Reader {
 
             progress.hide(); this.progressActive = false;
 
-            await this.loadBook({url, uploadFileName: opts.file.name, force: true});
+            await this._loadBook({url, uploadFileName: opts.file.name, force: true});
         } catch (e) {
             progress.hide(); this.progressActive = false;
             this.loaderActive = true;
@@ -1213,6 +1295,15 @@ class Reader {
         }
     }
 
+    async loadFile(opts) {
+        await this.lock.get();
+        try {
+            await this._loadFile(opts);
+        } finally {
+            this.lock.ret();
+        }
+    }
+
     blinkCachedLoadMessage() {
         if (!this.blinkCachedLoad)
             return;

client/components/Reader/ReaderDialogs/ReaderDialogs.vue

@@ -54,7 +54,7 @@
 
                 <br><br>
                 <div class="row justify-center">
-                    <!--q-btn class="q-px-sm" color="primary" dense no-caps rounded @click="openDonate">
+                    <!--q-btn class="q-px-sm" color="primary" dense no-caps @click="openDonate">
                         Помочь проекту
                     </q-btn-->
                 </div>

client/components/Reader/SearchPage/SearchPage.vue

@@ -8,12 +8,10 @@
             <span v-show="initStep">{{ initPercentage }}%</span>
 
             <div v-show="!initStep" class="input">
-                <!--input ref="input"
+                <q-input
-                    placeholder="что ищем"
+                    ref="input" v-model="needle"
-                    :value="needle" @input="needle = $event.target.value"/-->
-                <q-input ref="input" v-model="needle"
                     class="col" outlined dense
-                    placeholder="что ищем"
+                    placeholder="Найти"
                     @keydown="inputKeyDown"         
                 />
                 <div style="position: absolute; right: 10px; margin-top: 10px; font-size: 16px;">
@@ -108,7 +106,7 @@ class SearchPage {
             this.parsed = parsed;
         }
 
-        this.header = 'Найти';
+        this.header = 'Поиск в тексте';
         await this.$nextTick();
         this.$refs.input.focus();
         this.$refs.input.select();

client/components/Reader/SettingsPage/ButtonsTab.inc

@@ -1,9 +0,0 @@
-<div class="part-header">Показывать кнопки панели</div>
-
-<div class="item row" v-for="item in toolButtons" :key="item.name" v-show="item.name != 'libs' || mode == 'liberama.top'">
-    <div class="label-3"></div>
-    <div class="col row">
-        <q-checkbox size="xs" v-model="showToolButton[item.name]" :label="rstore.readerActions[item.name]"
-        />
-    </div>
-</div>

client/components/Reader/SettingsPage/SettingsPage.vue

@@ -1,5 +1,5 @@
 <template>
-    <Window ref="window" height="95%" width="600px" @close="close">
+    <Window ref="window" width="600px" @close="close">
         <template #header>
             Настройки
         </template>
@@ -24,7 +24,7 @@
                     <div v-show="tabsScrollable" class="q-pt-lg" />
                     <q-tab class="tab" name="profiles" icon="la la-users" label="Профили" />
                     <q-tab class="tab" name="view" icon="la la-eye" label="Вид" />
-                    <q-tab class="tab" name="buttons" icon="la la-grip-horizontal" label="Кнопки" />
+                    <q-tab class="tab" name="toolbar" icon="la la-grip-horizontal" label="Панель" />
                     <q-tab class="tab" name="keys" icon="la la-gamepad" label="Управление" />
                     <q-tab class="tab" name="pagemove" icon="la la-school" label="Листание" />
                     <q-tab class="tab" name="convert" icon="la la-magic" label="Конвертир." />
@@ -82,8 +82,8 @@
                     </div>
                 </div>
                 <!-- Кнопки ---------------------------------------------------------------------->
-                <div v-if="selectedTab == 'buttons'" class="fit tab-panel">
+                <div v-if="selectedTab == 'toolbar'" class="fit tab-panel">
-                    @@include('./ButtonsTab.inc');
+                    @@include('./ToolBarTab.inc');
                 </div>
                 <!-- Управление ------------------------------------------------------------------>
                 <div v-if="selectedTab == 'keys'" class="fit column">
@@ -124,6 +124,7 @@ import NumInput from '../../share/NumInput.vue';
 import UserHotKeys from './UserHotKeys/UserHotKeys.vue';
 import wallpaperStorage from '../share/wallpaperStorage';
 
+import readerApi from '../../../api/reader';
 import rstore from '../../../store/modules/reader';
 import defPalette from './defPalette';
 
@@ -636,8 +637,17 @@ class SettingsPage {
 
                     if (index < 0)
                         newUserWallpapers.push({label, cssClass});
-                    if (!wallpaperStorage.keyExists(cssClass))
+                    if (!wallpaperStorage.keyExists(cssClass)) {
                         await wallpaperStorage.setData(cssClass, data);
+                        //отправим data на сервер в файл `/upload/${key}`
+                        try {
+                            //const res = 
+                            await readerApi.uploadFileBuf(data);
+                            //console.log(res);
+                        } catch (e) {
+                            console.error(e);
+                        }
+                    }
 
                     this.userWallpapers = newUserWallpapers;
                     this.wallpaper = cssClass;
@@ -702,11 +712,11 @@ export default vueComponent(SettingsPage);
     margin-bottom: 5px;
 }
 
-.label-1, .label-7 {
+.label-1, .label-3, .label-7 {
     width: 75px;
 }
 
-.label-2, .label-3, .label-4, .label-5 {
+.label-2, .label-4, .label-5 {
     width: 110px;
 }
 

client/components/Reader/SettingsPage/ToolBarTab.inc

@@ -0,0 +1,18 @@
+<div class="part-header">Отображение</div>
+
+<div class="item row no-wrap">
+    <div class="label-3"></div>
+    <q-checkbox size="xs" v-model="toolBarHideOnScroll" label="Скрывать/показывать панель при прокрутке" >
+        <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
+            Скрывать/показывть панель при прокрутке текста вперед/назад
+        </q-tooltip>
+    </q-checkbox>
+</div>
+
+<div class="part-header">Показывать кнопки</div>
+
+<div class="item row no-wrap" v-for="item in toolButtons" :key="item.name" v-show="item.name != 'libs' || mode == 'liberama.top'">
+    <div class="label-3"></div>
+        <q-checkbox size="xs" v-model="showToolButton[item.name]" :label="rstore.readerActions[item.name]"
+        />
+</div>

client/components/Reader/SettingsPage/UserHotKeys/UserHotKeys.vue

@@ -13,7 +13,7 @@
                     ref="input"
                     v-model="search"
                     class="q-ml-sm col"
-                    outlined dense rounded
+                    outlined dense
                     bg-color="grey-4"
                     placeholder="Найти"                    
                     @click.stop

client/components/Reader/TextPage/TextPage.vue

@@ -66,7 +66,14 @@ const componentOptions = {
     watch: {
         bookPos: function() {
             this.$emit('book-pos-changed', {bookPos: this.bookPos, bookPosSeen: this.bookPosSeen});
+
             this.draw();
+
+            if (this.userBookPosChange) {
+                this.$emit('hide-tool-bar', {show: (this.bookPos == 0 || this.bookPos < this.prevBookPos)});
+                this.prevBookPos = this.bookPos;
+                this.userBookPosChange = false;
+            }
         },
         bookPosSeen: function() {
             this.$emit('book-pos-changed', {bookPos: this.bookPos, bookPosSeen: this.bookPosSeen});
@@ -99,6 +106,8 @@ class TextPage {
     lastBook = null;
     bookPos = 0;
     bookPosSeen = null;
+    prevBookPos = 0;
+    userBookPosChange = false;
 
     fontStyle = null;
     fontSize = null;
@@ -155,7 +164,7 @@ class TextPage {
 
         this.$root.addEventHook('resize', async() => {
             this.$nextTick(this.onResize);
-            await utils.sleep(500);
+            await utils.sleep(200);
             this.$nextTick(this.onResize);
         });
     }
@@ -499,12 +508,25 @@ class TextPage {
     }
 
     async onResize() {
+        if (this.resizing)
+            return;
+        
+        this.resizing = true;
         try {
+            const scrolled = this.doingScrolling;
+            if (scrolled)
+                await this.stopTextScrolling();
+
             this.calcDrawProps();
             this.setBackground();
             this.draw();
+
+            if (scrolled)
+                this.startTextScrolling();
         } catch (e) {
             //
+        } finally {
+            this.resizing = false;
         }
     }
 
@@ -652,7 +674,7 @@ class TextPage {
         }
 
         if (this.book && this.bookPos > 0 && this.bookPos >= this.parsed.textLength) {
-            this.doEnd(true);
+            this.doEnd(true, false);
             return;
         }
 
@@ -675,7 +697,7 @@ class TextPage {
         this.debouncedDrawPageDividerAndOrnament();
 
         if (this.book && this.linesDown && this.linesDown.length < this.pageLineCount) {
-            this.doEnd(true);
+            this.doEnd(true, false);
             return;
         }
     }
@@ -911,12 +933,14 @@ class TextPage {
 
     doDown() {
         if (this.linesDown && this.linesDown.length > this.pageLineCount && this.pageLineCount > 0) {
+            this.userBookPosChange = true;
             this.bookPos = this.linesDown[1].begin;
         }
     }
 
     doUp() {
         if (this.linesUp && this.linesUp.length > 1 && this.pageLineCount > 0) {
+            this.userBookPosChange = true;
             this.bookPos = this.linesUp[1].begin;
         }
     }
@@ -929,6 +953,7 @@ class TextPage {
             if (i >= 0 && this.linesDown.length >= 2*i + (this.keepLastToFirst ? 1 : 0)) {
                 this.currentAnimation = this.pageChangeAnimation;
                 this.pageChangeDirectionDown = true;
+                this.userBookPosChange = true;
                 this.bookPos = this.linesDown[i].begin;
             } else 
                 this.doEnd();
@@ -944,6 +969,7 @@ class TextPage {
             if (i >= 0 && this.linesUp.length > i) {
                 this.currentAnimation = this.pageChangeAnimation;
                 this.pageChangeDirectionDown = false;
+                this.userBookPosChange = true;
                 this.bookPos = this.linesUp[i].begin;
             }
         }
@@ -952,10 +978,11 @@ class TextPage {
     doHome() {
         this.currentAnimation = this.pageChangeAnimation;
         this.pageChangeDirectionDown = false;
+        this.userBookPosChange = true;
         this.bookPos = 0;
     }
 
-    doEnd(noAni) {
+    doEnd(noAni, isUser = true) {
         if (this.parsed.para.length && this.pageLineCount > 0) {
             let i = this.parsed.para.length - 1;
             let lastPos = this.parsed.para[i].offset + this.parsed.para[i].length - 1;
@@ -966,6 +993,7 @@ class TextPage {
                 if (!noAni)
                     this.currentAnimation = this.pageChangeAnimation;
                 this.pageChangeDirectionDown = true;
+                this.userBookPosChange = isUser;
                 this.bookPos = lines[i].begin;
             }
         }

client/components/Reader/share/BookParser.js

@@ -3,6 +3,8 @@ import sax from '../../../../server/core/sax';
 import * as utils from '../../../share/utils';
 
 const maxImageLineCount = 100;
+const maxParaLength = 10000;
+const maxParaTextLength = 10000;
 
 // defaults
 const defaultSettings = {
@@ -83,6 +85,7 @@ export default class BookParser {
         let binaryId = '';
         let binaryType = '';
         let dimPromises = [];
+        this.coverPageId = '';
 
         //оглавление
         this.contents = [];
@@ -226,13 +229,26 @@ export default class BookParser {
             paraOffset += len;
         };
 
-        const growParagraph = (text, len) => {
+        const growParagraph = (text, len, textRaw) => {
+            //начальный параграф
             if (paraIndex < 0) {
                 newParagraph();
                 growParagraph(text, len);
                 return;
             }
 
+            //ограничение на размер куска текста в параграфе
+            if (textRaw && textRaw.length > maxParaTextLength) {
+                while (textRaw.length > 0) {
+                    const textPart = textRaw.substring(0, maxParaTextLength);
+                    textRaw = textRaw.substring(maxParaTextLength);
+
+                    newParagraph();
+                    growParagraph(textPart, textPart.length);
+                }
+                return;
+            }
+
             if (inSubtitle) {
                 curSubtitle.title += text;
             } else if (inTitle) {
@@ -240,6 +256,14 @@ export default class BookParser {
             }
 
             const p = para[paraIndex];
+
+            //ограничение на размер параграфа
+            if (p.length > maxParaLength) {
+                newParagraph();
+                growParagraph(text, len);
+                return;
+            }
+
             p.length += len;
             p.text += text;
             paraOffset += len;
@@ -266,7 +290,7 @@ export default class BookParser {
                     const href = attrs.href.value;
                     const alt = (attrs.alt && attrs.alt.value ? attrs.alt.value : '');
                     const {id, local} = this.imageHrefToId(href);
-                    if (href[0] == '#') {//local
+                    if (local) {//local
                         imageNum++;
 
                         if (inPara && !this.sets.showInlineImagesInCenter && !center)
@@ -278,6 +302,11 @@ export default class BookParser {
 
                         if (inPara && this.sets.showInlineImagesInCenter)
                             newParagraph();
+
+                        //coverpage
+                        if (path == '/fictionbook/description/title-info/coverpage/image') {
+                            this.coverPageId = id;
+                        }
                     } else {//external
                         imageNum++;
 
@@ -536,7 +565,7 @@ export default class BookParser {
                 tClose += (center ? '</center>' : '');
 
                 if (text != ' ')
-                    growParagraph(`${tOpen}${text}${tClose}`, text.length);
+                    growParagraph(`${tOpen}${text}${tClose}`, text.length, text);
                 else
                     growParagraph(' ', 1);
             }

client/components/Reader/share/bookManager.js

@@ -1,10 +1,14 @@
 import localForage from 'localforage';
+import path from 'path-browserify';
 import _ from 'lodash';
 
-import * as utils from '../../../share/utils';
 import BookParser from './BookParser';
+import readerApi from '../../../api/reader';
+import coversStorage from './coversStorage';
+import * as utils from '../../../share/utils';
 
 const maxDataSize = 500*1024*1024;//compressed bytes
+const maxRecentLength = 5000;
 
 //локальный кэш метаданных книг, ограничение maxDataSize
 const bmMetaStore = localForage.createInstance({
@@ -17,9 +21,6 @@ const bmDataStore = localForage.createInstance({
 });
 
 //список недавно открытых книг
-const bmRecentStoreOld = localForage.createInstance({
-    name: 'bmRecentStore'
-});
 const bmRecentStoreNew = localForage.createInstance({
     name: 'bmRecentStoreNew'
 });
@@ -39,7 +40,7 @@ class BookManager {
 
         this.saveRecentItem = _.debounce(() => {
             bmRecentStoreNew.setItem('recent-item', this.recentItem);
-            this.recentRev = (this.recentRev < 1000 ? this.recentRev + 1 : 1);
+            this.recentRev = (this.recentRev < maxRecentLength ? this.recentRev + 1 : 1);
             bmRecentStoreNew.setItem('rev', this.recentRev);
         }, 200, {maxWait: 300});
 
@@ -54,6 +55,9 @@ class BookManager {
             if (this.recentItem)
                 this.recent[this.recentItem.key] = this.recentItem;
 
+            //конвертируем в новые ключи
+            await this.convertRecent();
+
             this.recentLastKey = await bmRecentStoreNew.getItem('recent-last-key');
             if (this.recentLastKey) {
                 const meta = await bmMetaStore.getItem(`bmMeta-${this.recentLastKey}`);
@@ -70,6 +74,40 @@ class BookManager {
         this.loadStored();//no await
     }
 
+    //TODO: убрать в 2025г
+    async convertRecent() {
+        const converted = await bmRecentStoreNew.getItem('recent-converted');
+
+        if (converted)
+            return;
+
+        const newRecent = {};
+        for (const book of Object.values(this.recent)) {
+
+            if (!book.path) {
+                continue;
+            }
+
+            const newKey = this.keyFromPath(book.path);
+
+            newRecent[newKey] = _.cloneDeep(book);
+            newRecent[newKey].key = newKey;
+            if (!newRecent[newKey].loadTime)
+                newRecent[newKey].loadTime = newRecent[newKey].addTime;
+        }
+
+        this.recent = newRecent;
+
+        //console.log(converted);
+        (async() => {
+            await utils.sleep(3000);
+            this.saveRecent();
+            this.emit('recent-changed');
+            this.emit('set-recent');
+            await bmRecentStoreNew.setItem('recent-converted', true);
+        })();
+    }
+
     //Ленивая асинхронная загрузка bmMetaStore
     async loadStored() {
         //даем время для загрузки последней читаемой книги, чтобы не блокировать приложение
@@ -196,8 +234,8 @@ class BookManager {
 
     async addBook(newBook, callback) {        
         let meta = {url: newBook.url, path: newBook.path};
-        meta.key = this.keyFromUrl(meta.url);
+        meta.key = this.keyFromPath(meta.path);
-        meta.addTime = Date.now();
+        meta.addTime = Date.now();//время добавления в кеш
 
         const cb = (perc) => {
             const p = Math.round(30*perc/100);
@@ -232,10 +270,10 @@ class BookManager {
     async hasBookParsed(meta) {
         if (!this.books) 
             return false;
-        if (!meta.url)
+        if (!meta.path)
             return false;
         if (!meta.key)
-            meta.key = this.keyFromUrl(meta.url);
+            meta.key = this.keyFromPath(meta.path);
 
         let book = this.books[meta.key];
 
@@ -250,8 +288,12 @@ class BookManager {
 
     async getBook(meta, callback) {
         let result = undefined;
+
+        if (!meta.path)
+            return;
+
         if (!meta.key)
-            meta.key = this.keyFromUrl(meta.url);
+            meta.key = this.keyFromPath(meta.path);
 
         result = this.books[meta.key];
 
@@ -261,11 +303,6 @@ class BookManager {
                 this.books[meta.key] = result;
         }
 
-        //Если файл на сервере изменился, считаем, что в кеше его нету
-        if (meta.path && result && meta.path != result.path) {
-            return;
-        }
-
         if (result && !result.parsed) {
             let data = await bmDataStore.getItem(`bmData-${meta.key}`);
             callback(5);
@@ -310,9 +347,36 @@ class BookManager {
         const parsed = new BookParser(this.settings);
 
         const parsedMeta = await parsed.parse(data, callback);
+
+        //cover page
+        let coverPageUrl = '';
+        if (parsed.coverPageId && parsed.binary[parsed.coverPageId]) {
+            const bin = parsed.binary[parsed.coverPageId];
+            let dataUrl = `data:${bin.type};base64,${bin.data}`;
+            try {
+                dataUrl = await utils.resizeImage(dataUrl, 160, 160, 0.94);
+            } catch (e) {
+                console.error(e);
+            }
+
+            //отправим dataUrl на сервер в /upload
+            try {
+                await readerApi.uploadFileBuf(dataUrl, (url) => {
+                    coverPageUrl = url;
+                });
+            } catch (e) {
+                console.error(e);
+            }
+
+            //сохраним в storage
+            if (coverPageUrl)
+                await coversStorage.setData(coverPageUrl, dataUrl);
+        }
+
         const result = Object.assign({}, meta, parsedMeta, {
             length: data.length,
             textLength: parsed.textLength,
+            coverPageUrl,
             parsed
         });
 
@@ -325,10 +389,20 @@ class BookManager {
         return result;
     }
 
-    keyFromUrl(url) {
+    /*keyFromUrl(url) {
         return utils.stringToHex(url);
+    }*/
+
+    keyFromPath(bookPath) {
+        return path.basename(bookPath);
     }
 
+    keysEqual(bookPath1, bookPath2) {
+        if (bookPath1 === undefined || bookPath2 === undefined)
+            return false;
+        
+        return (this.keyFromPath(bookPath1) === this.keyFromPath(bookPath2));
+    }
     //-- recent --------------------------------------------------------------
     async recentSetItem(item = null, skipCheck = false) {
         const rev = await bmRecentStoreNew.getItem('rev');
@@ -369,7 +443,10 @@ class BookManager {
 
     async setRecentBook(value) {
         let result = this.metaOnly(value);
-        result.touchTime = Date.now();
+        result.touchTime = Date.now();//время последнего чтения
+        if (!result.loadTime)
+            result.loadTime = Date.now();//время загрузки файла
+
         result.deleted = 0;
 
         if (this.recent[result.key]) {
@@ -385,9 +462,9 @@ class BookManager {
         return this.recent[value.key];
     }
 
-    async delRecentBook(value) {
+    async delRecentBook(value, delFlag = 1) {
         const item = this.recent[value.key];
-        item.deleted = 1;
+        item.deleted = delFlag;
 
         if (this.recentLastKey == value.key) {
             await this.recentSetLastKey(null);
@@ -397,11 +474,18 @@ class BookManager {
         this.emit('recent-deleted', value.key);
     }
 
+    async restoreRecentBook(value) {
+        const item = this.recent[value.key];
+        item.deleted = 0;
+
+        await this.recentSetItem(item);
+    }
+
     async cleanRecentBooks() {
         const sorted = this.getSortedRecent();
 
         let isDel = false;
-        for (let i = 1000; i < sorted.length; i++) {
+        for (let i = maxRecentLength; i < sorted.length; i++) {
             delete this.recent[sorted[i].key];
             isDel = true;
         }
@@ -421,7 +505,7 @@ class BookManager {
 
         let max = 0;
         let result = null;
-        for (let key in this.recent) {
+        for (const key in this.recent) {
             const book = this.recent[key];
             if (!book.deleted && book.touchTime > max) {
                 max = book.touchTime;
@@ -452,6 +536,43 @@ class BookManager {
         return result;
     }
 
+    findRecentByUrlAndPath(url, bookPath) {
+        if (bookPath) {
+            const key = this.keyFromPath(bookPath);
+            const book = this.recent[key];
+            if (book && !book.deleted)
+                return book;
+        }
+
+        let max = 0;
+        let result = null;
+
+        for (const key in this.recent) {
+            const book = this.recent[key];
+            if (!book.deleted && book.url == url && book.loadTime > max) {
+                max = book.loadTime;
+                result = book;
+            }
+        }
+
+        return result;
+    }
+
+    findRecentBySameBookKey(sameKey) {
+        let max = 0;
+        let result = null;
+
+        for (const key in this.recent) {
+            const book = this.recent[key];
+            if (!book.deleted && book.sameBookKey == sameKey && book.loadTime > max) {
+                max = book.loadTime;
+                result = book;
+            }
+        }
+
+        return result;
+    }
+
     async setRecent(value) {
         const mergedRecent = _.cloneDeep(this.recent);
 

client/components/Reader/share/coversStorage.js

@@ -0,0 +1,61 @@
+import localForage from 'localforage';
+//import _ from 'lodash';
+import * as utils from '../../../share/utils';
+
+const maxDataSize = 100*1024*1024;
+
+const coversStore = localForage.createInstance({
+    name: 'coversStorage'
+});
+
+class CoversStorage {
+    constructor() {
+    }
+
+    async init() {
+        this.cleanCovers(); //no await
+    }
+
+    async setData(key, data) {
+        await coversStore.setItem(key, {addTime: Date.now(), data});
+    }
+
+    async getData(key) {
+        const item = await coversStore.getItem(key);
+        return (item ? item.data : undefined);
+    }
+
+    async removeData(key) {
+        await coversStore.removeItem(key);
+    }
+
+    async cleanCovers() {
+        await utils.sleep(10000);
+
+        while (1) {// eslint-disable-line no-constant-condition
+            let size = 0;
+            let min = Date.now();
+            let toDel = null;
+            for (const key of (await coversStore.keys())) {
+                const item = await coversStore.getItem(key);
+
+                size += item.data.length;
+
+                if (item.addTime < min) {
+                    toDel = key;
+                    min = item.addTime;
+                }
+            }
+
+
+            if (size > maxDataSize && toDel) {
+                await this.removeData(toDel);
+            } else {
+                break;
+            }
+        }
+    }
+
+}
+
+export default new CoversStorage();

client/components/Reader/share/wallpaperStorage.js

@@ -32,6 +32,10 @@ class WallpaperStorage {
         this.cachedKeys = await wpStore.keys();
     }
 
+    async getKeys() {
+        return await wpStore.keys();
+    }
+
     keyExists(key) {//не асинхронная
         return this.cachedKeys.includes(key);
     }

client/components/Reader/versionHistory.js

@@ -1,4 +1,40 @@
 export const versionHistory = [
+{
+    version: '0.11.8',
+    releaseDate: '2022-07-14',
+    showUntil: '2022-07-13',
+    content:
+`
+<ul>
+    <li>добавлено отображение и синхронизация обложек в окне загруженных книг</li>
+    <li>добавлена синхронизация обоев</li>
+</ul>
+
+`
+},
+
+{
+    version: '0.11.7',
+    releaseDate: '2022-07-12',
+    showUntil: '2022-07-19',
+    content:
+`
+<ul>
+    <li>добавлено автосокрытие панели управления при листании, отключается в настройках</li>
+    <li>изменения в окне загруженных книг:</li>
+        <ul>
+            <li>добавлена группировка по версиям файла одной и той же книги</li>
+            <li>группировка происходит по имени загружаемого файла, либо по URL книги</li>
+            <li>добавлены различные методы сортировки списка загруженных книг</li>
+            <li>нумерация всегда осуществляется по времени загрузки</li>
+        </ul>
+    <li>незначительные общие изменения интерфейса, приведение к единому стилю</li>
+    <li>исправления багов</li>
+</ul>
+
+`
+},
+
 {
     version: '0.11.6',
     releaseDate: '2022-07-02',

client/components/share/StdDialog.vue

@@ -55,6 +55,34 @@
             </div>
         </div>
 
+        <!--------------------------------------------------->
+        <div v-show="type == 'askYesNo'" class="bg-white no-wrap">
+            <div class="header row">
+                <div class="caption col row items-center q-ml-md">
+                    <q-icon v-show="caption" class="q-mr-sm" :class="iconColor" :name="iconName" size="28px"></q-icon>
+                    <div v-html="caption"></div>
+                </div>
+                <div class="close-icon column justify-center items-center">
+                    <q-btn v-close-popup flat round dense>
+                        <q-icon name="la la-times" size="18px"></q-icon>
+                    </q-btn>
+                </div>
+            </div>
+
+            <div class="q-mx-md">
+                <div v-html="message"></div>
+            </div>
+
+            <div class="buttons row justify-end q-pa-md">
+                <q-btn v-close-popup class="q-px-md q-ml-sm" dense no-caps>
+                    Нет
+                </q-btn>
+                <q-btn class="q-px-md q-ml-sm" color="primary" dense no-caps @click="okClick">
+                    Да
+                </q-btn>
+            </div>
+        </div>
+
         <!--------------------------------------------------->
         <div v-show="type == 'prompt'" class="bg-white no-wrap">
             <div class="header row">
@@ -262,6 +290,23 @@ class StdDialog {
         });
     }
 
+    askYesNo(message, caption, opts) {
+        return new Promise((resolve) => {
+            this.init(message, caption, opts);
+
+            this.hideTrigger = () => {
+                if (this.ok) {
+                    resolve(true);
+                } else {
+                    resolve(false);
+                }
+            };
+
+            this.type = 'askYesNo';
+            this.active = true;
+        });
+    }
+
     prompt(message, caption, opts) {
         return new Promise((resolve) => {
             this.enableValidator = false;

client/components/share/Window.vue

@@ -153,7 +153,7 @@ export default vueComponent(Window);
 }
 
 .header {
-    background: linear-gradient(to bottom right, green, #59B04F);
+    background: linear-gradient(to bottom right, #007000, #59B04F);
     align-items: center;
     height: 30px;
 }
@@ -161,8 +161,8 @@ export default vueComponent(Window);
 .header-text {
     margin-left: 10px;
     margin-right: 10px;
-    color: yellow;
+    color: #FFFFA0;
-    text-shadow: 2px 1px 5px black, 2px 2px 5px black;
+    text-shadow: 2px 2px 5px #005000, 2px 1px 5px #005000;
     overflow: hidden;
     white-space: nowrap;
 }
@@ -174,7 +174,8 @@ export default vueComponent(Window);
 }
 
 .close-button:hover {
-    background-color: #69C05F;
+    color: white;
+    background-color: #FF3030;
 }
 
-</style>
+</style>

client/quasar.js

@@ -32,6 +32,8 @@ import {QPopupProxy} from 'quasar/src/components/popup-proxy';
 import {QDialog} from 'quasar/src/components/dialog';
 import {QChip} from 'quasar/src/components/chip';
 import {QTree} from 'quasar/src/components/tree';
+import {QVirtualScroll} from 'quasar/src/components/virtual-scroll';
+
 //import {QExpansionItem} from 'quasar/src/components/expansion-item';
 
 const components = {
@@ -62,6 +64,7 @@ const components = {
     QChip,
     QTree,
     //QExpansionItem,
+    QVirtualScroll,
 };
 
 //directives 

client/share/LockQueue.js

@@ -0,0 +1,53 @@
+class LockQueue {
+    constructor(queueSize) {
+        this.queueSize = queueSize;
+        this.freed = true;
+        this.waitingQueue = [];
+    }
+
+    //async
+    get(take = true) {
+        return new Promise((resolve, reject) => {
+            if (this.freed) {
+                if (take)
+                    this.freed = false;
+                resolve();
+                return;
+            }
+
+            if (this.waitingQueue.length < this.queueSize) {
+                this.waitingQueue.push({resolve, reject});
+            } else {
+                reject(new Error('Lock queue is too long'));
+            }
+        });
+    }
+
+    ret() {
+        if (this.waitingQueue.length) {
+            this.waitingQueue.shift().resolve();
+        } else {
+            this.freed = true;
+        }
+    }
+
+    //async
+    wait() {
+        return this.get(false);
+    }
+
+    retAll() {
+        while (this.waitingQueue.length) {
+            this.waitingQueue.shift().resolve();
+        }
+    }
+
+    errAll(error = 'rejected') {
+        while (this.waitingQueue.length) {
+            this.waitingQueue.shift().reject(new Error(error));
+        }
+    }
+
+}
+
+export default LockQueue;

client/share/utils.js

@@ -363,4 +363,50 @@ export function getBookTitle(fb2) {
     ]).join(' - ');
 
     return result;
+}
+
+export function resizeImage(dataUrl, toWidth, toHeight, quality = 0.9) {
+    return new Promise ((resolve, reject) => { (async() => {
+        const img = new Image();
+
+        let resolved = false;
+        img.onload = () => {
+            try {
+                let width = img.width;
+                let height = img.height;
+
+                if (width > height) {
+                    if (width > toWidth) {
+                        height = height * (toWidth / width);
+                        width = toWidth;
+                    }
+                } else {
+                    if (height > toHeight) {
+                        width = width * (toHeight / height);
+                        height = toHeight;
+                    }
+                }
+
+                const canvas = document.createElement('canvas');
+                canvas.width = width;
+                canvas.height = height;
+                const ctx = canvas.getContext('2d');
+                ctx.drawImage(img, 0, 0, width, height);
+                const result = canvas.toDataURL('image/jpeg', quality);
+                resolved = true;
+                resolve(result);
+            } catch (e) {
+                reject(e);
+                return;
+            }
+        };
+
+        img.onerror = reject;
+
+        img.src = dataUrl;
+
+        await sleep(1000);
+        if (!resolved)
+            reject('Не удалось изменить размер');
+    })().catch(reject); });
 }

client/store/modules/reader.js

@@ -21,7 +21,7 @@ const readerActions = {
     'offlineMode': 'Автономный режим (без интернета)',
     'contents': 'Оглавление/закладки',
     'libs': 'Сетевая библиотека',
-    'recentBooks': 'Открыть недавние',
+    'recentBooks': 'Показать загруженные',
     'switchToolbar': 'Показать/скрыть панель управления',
     'donate': '',
     'bookBegin': 'В начало книги',
@@ -185,8 +185,14 @@ const settingDefaults = {
 
     fontShifts: {},
     showToolButton: {},
+    toolBarHideOnScroll: true,
     userHotKeys: {},
     userWallpapers: [],
+
+    recentShowSameBook: false,
+    recentSortMethod: '',
+
+    needUpdateSettingsView: 0,
 };
 
 for (const font of fonts)

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "Liberama",
-  "version": "0.11.6",
+  "version": "0.11.8",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "Liberama",
-      "version": "0.11.6",
+      "version": "0.11.8",
       "hasInstallScript": true,
       "license": "CC0-1.0",
       "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "Liberama",
-  "version": "0.11.6",
+  "version": "0.11.8",
   "author": "Book Pauk <bookpauk@gmail.com>",
   "license": "CC0-1.0",
   "repository": "bookpauk/liberama",

server/controllers/WebSocketController.js

@@ -25,6 +25,10 @@ class WebSocketController {
             ws.on('message', (message) => {
                 this.onMessage(ws, message.toString());
             });
+
+            ws.on('error', (err) => {
+                log(LM_ERR, err);
+            });
         });
 
         setTimeout(() => { this.periodicClean(); }, cleanPeriod);
@@ -70,6 +74,10 @@ class WebSocketController {
                     await this.readerRestoreCachedFile(req, ws); break;
                 case 'reader-storage':
                     await this.readerStorageDo(req, ws); break;
+                case 'upload-file-buf':
+                    await this.uploadFileBuf(req, ws); break;
+                case 'upload-file-touch':
+                    await this.uploadFileTouch(req, ws); break;
 
                 default:
                     throw new Error(`Action not found: ${req.action}`);
@@ -168,6 +176,20 @@ class WebSocketController {
 
         this.send(await this.readerStorage.doAction(req.body), req, ws);
     }
+
+    async uploadFileBuf(req, ws) {
+        if (!req.buf)
+            throw new Error(`key 'buf' is empty`);
+        
+        this.send({url: await this.readerWorker.saveFileBuf(req.buf)}, req, ws);
+    }
+
+    async uploadFileTouch(req, ws) {
+        if (!req.url)
+            throw new Error(`key 'url' is empty`);
+        
+        this.send({url: await this.readerWorker.uploadFileTouch(req.url)}, req, ws);
+    }
 }
 
 module.exports = WebSocketController;

server/core/Reader/BookConverter/textUtils.js

@@ -3,7 +3,7 @@ const chardet = require('chardet');
 function getEncoding(buf) {
     let selected = getEncodingLite(buf);
 
-    if (selected == 'ISO-8859-5') {
+    if (selected == 'ISO-8859-5' && buf.length > 10) {
         const charsetAll = chardet.analyse(buf.slice(0, 20000));
         for (const charset of charsetAll) {
             if (charset.name.indexOf('ISO-8859') < 0) {

server/core/Reader/ReaderWorker.js

@@ -219,6 +219,27 @@ class ReaderWorker {
         return `disk://${hash}`;
     }
 
+    async saveFileBuf(buf) {
+        const hash = await utils.getBufHash(buf, 'sha256', 'hex');
+        const outFilename = `${this.config.uploadDir}/${hash}`;
+
+        if (!await fs.pathExists(outFilename)) {
+            await fs.writeFile(outFilename, buf);
+        } else {
+            await utils.touchFile(outFilename);
+        }
+
+        return `disk://${hash}`;
+    }
+
+    async uploadFileTouch(url) {
+        const outFilename = `${this.config.uploadDir}/${url.replace('disk://', '')}`;
+
+        await utils.touchFile(outFilename);
+
+        return url;
+    }
+
     async restoreRemoteFile(filename) {
         const basename = path.basename(filename);
         const targetName = `${this.config.tempPublicDir}/${basename}`;

server/core/WebSocketConnection.js

@@ -94,7 +94,7 @@ class WebSocketConnection {
                     this.ws = new this.WebSocket(this.url);
                 }
 
-                const onopen = (e) => {
+                const onopen = () => {
                     this.connecting = false;
                     resolve(this.ws);
                 };

server/core/utils.js

@@ -34,6 +34,12 @@ function getFileHash(filename, hashName, enc) {
     });
 }
 
+function getBufHash(buf, hashName, enc) {
+    const hash = crypto.createHash(hashName);
+    hash.update(buf);
+    return hash.digest(enc);
+}
+
 function sleep(ms) {
     return new Promise(resolve => setTimeout(resolve, ms));
 }
@@ -129,6 +135,7 @@ module.exports = {
     fromBase36,
     bufferRemoveZeroes,
     getFileHash,
+    getBufHash,
     sleep,
     toUnixTime,
     randomHexString,

server/index.js

@@ -11,6 +11,8 @@ const ayncExit = new (require('./core/AsyncExit'))();
 
 let log = null;
 
+const maxPayloadSize = 50;//in MB
+
 async function init() {
     //config
     const configManager = new (require('./config'))();//singleton
@@ -63,7 +65,7 @@ async function main() {
         if (serverCfg.mode !== 'none') {
             const app = express();
             const server = http.createServer(app);
-            const wss = new WebSocket.Server({ server, maxPayload: 10*1024*1024 });
+            const wss = new WebSocket.Server({ server, maxPayload: maxPayloadSize*1024*1024 });
 
             const serverConfig = Object.assign({}, config, serverCfg);
 
@@ -75,7 +77,7 @@ async function main() {
             }
 
             app.use(compression({ level: 1 }));
-            app.use(express.json({limit: '10mb'}));
+            app.use(express.json({limit: `${maxPayloadSize}mb`}));
             if (devModule)
                 devModule.logQueries(app);