Merge branch 'release/0.10.0'

0.9.12-1

client/api/misc.js

@@ -13,8 +13,7 @@ class Misc {
         ]};
 
         try {
-            await wsc.open();
-            const config = await wsc.message(wsc.send(Object.assign({action: 'get-config'}, query)));
+            const config = await wsc.message(await wsc.send(Object.assign({action: 'get-config'}, query)));
             if (config.error)
                 throw new Error(config.error);
             return config;

client/api/reader.js

@@ -19,8 +19,7 @@ class Reader {
 
         let response = {};
         try {
-            await wsc.open();
-            const requestId = wsc.send({action: 'worker-get-state-finish', workerId});
+            const requestId = await wsc.send({action: 'worker-get-state-finish', workerId});
 
             let prevResponse = false;
             while (1) {// eslint-disable-line no-constant-condition
@@ -66,7 +65,7 @@ class Reader {
                 await utils.sleep(refreshPause);
 
             i++;
-            if (i > 120*1000/refreshPause) {//2 мин ждем телодвижений воркера
+            if (i > 180*1000/refreshPause) {//3 мин ждем телодвижений воркера
                 throw new Error('Слишком долгое время ожидания');
             }
             //проверка воркера
@@ -124,8 +123,7 @@ class Reader {
             let response = null
             
             try {
-                await wsc.open();
-                response = await wsc.message(wsc.send({action: 'reader-restore-cached-file', path: url}));
+                response = await wsc.message(await wsc.send({action: 'reader-restore-cached-file', path: url}));
             } catch (e) {
                 console.error(e);
                 //если с WebSocket проблема, работаем по http
@@ -181,9 +179,8 @@ class Reader {
             maxUploadFileSize = 10*1024*1024;
         if (file.size > maxUploadFileSize)
             throw new Error(`Размер файла превышает ${maxUploadFileSize} байт`);
-
         let formData = new FormData();
-        formData.append('file', file);
+        formData.append('file', file, file.name);
 
         const options = {
             headers: {
@@ -211,8 +208,7 @@ class Reader {
     async storage(request) {
         let response = null;
         try {
-            await wsc.open();
-            response = await wsc.message(wsc.send({action: 'reader-storage', body: request}));
+            response = await wsc.message(await wsc.send({action: 'reader-storage', body: request}));
         } catch (e) {
             console.error(e);
             //если с WebSocket проблема, работаем по http

client/api/webSocketConnection.js

@@ -1,185 +1,3 @@
-import * as utils from '../share/utils';
-
-const cleanPeriod = 60*1000;//1 минута
-
-class WebSocketConnection {
-    //messageLifeTime в минутах (cleanPeriod)
-    constructor(messageLifeTime = 5) {
-        this.ws = null;
-        this.timer = null;
-        this.listeners = [];
-        this.messageQueue = [];
-        this.messageLifeTime = messageLifeTime;
-        this.requestId = 0;
-
-        this.connecting = false;
-    }
-
-    addListener(listener) {
-        if (this.listeners.indexOf(listener) < 0)
-            this.listeners.push(Object.assign({regTime: Date.now()}, listener));
-    }
-
-    //рассылаем сообщение и удаляем те обработчики, которые его получили
-    emit(mes, isError) {
-        const len = this.listeners.length;
-        if (len > 0) {
-            let newListeners = [];
-            for (const listener of this.listeners) {
-                let emitted = false;
-                if (isError) {
-                    if (listener.onError)
-                        listener.onError(mes);
-                    emitted = true;
-                } else {
-                    if (listener.onMessage) {
-                        if (listener.requestId) {
-                            if (listener.requestId === mes.requestId) {
-                                listener.onMessage(mes);
-                                emitted = true;
-                            }
-                        } else {
-                            listener.onMessage(mes);
-                            emitted = true;
-                        }
-                    } else {
-                        emitted = true;
-                    }
-                }
-
-                if (!emitted)
-                    newListeners.push(listener);
-            }
-            this.listeners = newListeners;
-        }
-        
-        return this.listeners.length != len;
-    }
-
-    open(url) {
-        return new Promise((resolve, reject) => { (async() => {
-            //Ожидаем окончания процесса подключения, если open уже был вызван
-            let i = 0;
-            while (this.connecting && i < 200) {//10 сек
-                await utils.sleep(50);
-                i++;
-            }
-            if (i >= 200)
-                this.connecting = false;
-
-            //проверим подключение, и если нет, то подключимся заново
-            if (this.ws && this.ws.readyState == WebSocket.OPEN) {
-                resolve(this.ws);
-            } else {
-                this.connecting = true;
-                const protocol = (window.location.protocol == 'https:' ? 'wss:' : 'ws:');
-
-                url = url || `${protocol}//${window.location.host}/ws`;
-                
-                this.ws = new WebSocket(url);
-
-                if (this.timer) {
-                    clearTimeout(this.timer);
-                }
-                this.timer = setTimeout(() => { this.periodicClean(); }, cleanPeriod);
-
-                this.ws.onopen = (e) => {
-                    this.connecting = false;
-                    resolve(e);
-                };
-
-                this.ws.onmessage = (e) => {
-                    try {
-                        const mes = JSON.parse(e.data);
-                        this.messageQueue.push({regTime: Date.now(), mes});
-
-                        let newMessageQueue = [];
-                        for (const message of this.messageQueue) {
-                            if (!this.emit(message.mes)) {
-                                newMessageQueue.push(message);
-                            }
-                        }
-
-                        this.messageQueue = newMessageQueue;
-                    } catch (e) {
-                        this.emit(e.message, true);
-                    }
-                };
-
-                this.ws.onerror = (e) => {
-                    this.emit(e.message, true);
-                    if (this.connecting) {
-                        this.connecting = false;
-                        reject(e);
-                    }
-                };
-            }
-        })() });
-    }
-
-    //timeout в минутах (cleanPeriod)
-    message(requestId, timeout = 2) {
-        return new Promise((resolve, reject) => {
-            this.addListener({
-                requestId,
-                timeout,
-                onMessage: (mes) => {
-                    resolve(mes);
-                },
-                onError: (e) => {
-                    reject(e);
-                }
-            });
-        });
-    }
-
-    send(req) {
-        if (this.ws && this.ws.readyState == WebSocket.OPEN) {
-            const requestId = ++this.requestId;
-            this.ws.send(JSON.stringify(Object.assign({requestId}, req)));
-            return requestId;
-        } else {
-            throw new Error('WebSocket connection is not ready');
-        }
-    }
-
-    close() {
-        if (this.ws && this.ws.readyState == WebSocket.OPEN) {
-            this.ws.close();
-        }
-    }
-
-    periodicClean() {
-        try {
-            this.timer = null;
-
-            const now = Date.now();
-            //чистка listeners
-            let newListeners = [];
-            for (const listener of this.listeners) {
-                if (now - listener.regTime < listener.timeout*cleanPeriod - 50) {
-                    newListeners.push(listener);
-                } else {
-                    if (listener.onError)
-                        listener.onError('Время ожидания ответа истекло');
-                }
-            }
-            this.listeners = newListeners;
-
-            //чистка messageQueue
-            let newMessageQueue = [];
-            for (const message of this.messageQueue) {
-                if (now - message.regTime < this.messageLifeTime*cleanPeriod - 50) {
-                    newMessageQueue.push(message);
-                }
-            }
-            this.messageQueue = newMessageQueue;
-        } finally {
-            if (this.ws.readyState == WebSocket.OPEN) {
-                this.timer = setTimeout(() => { this.periodicClean(); }, cleanPeriod);
-            }
-        }
-    }
-}
+import WebSocketConnection from '../../server/core/WebSocketConnection';
 
 export default new WebSocketConnection();

client/components/App.vue

@@ -2,7 +2,7 @@
     <div class="fit row">
         <Notify ref="notify"/>
         <StdDialog ref="stdDialog"/>
-        <keep-alive>
+        <keep-alive v-if="showPage">
             <router-view class="col"></router-view>
         </keep-alive>
     </div>
@@ -12,8 +12,11 @@
 //-----------------------------------------------------------------------------
 import Vue from 'vue';
 import Component from 'vue-class-component';
+
 import Notify from './share/Notify.vue';
 import StdDialog from './share/StdDialog.vue';
+
+import miscApi from '../api/misc';
 import * as utils from '../share/utils';
 
 export default @Component({
@@ -30,6 +33,8 @@ export default @Component({
 
 })
 class App extends Vue {
+    showPage = false;
+
     itemRuText = {
         '/cardindex': 'Картотека',
         '/reader': 'Читалка',
@@ -42,7 +47,6 @@ class App extends Vue {
 
     created() {
         this.commit = this.$store.commit;
-        this.dispatch = this.$store.dispatch;
         this.state = this.$store.state;
         this.uistate = this.$store.state.uistate;
         this.config = this.$store.state.config;
@@ -116,18 +120,28 @@ class App extends Vue {
         this.$root.notify = this.$refs.notify;
         this.$root.stdDialog = this.$refs.stdDialog;
 
-        this.dispatch('config/loadConfig');
-        this.$watch('apiError', function(newError) {
-            if (newError) {
-                let mes = newError.message;
-                if (newError.response && newError.response.config)
-                    mes = newError.response.config.url + '<br>' + newError.response.statusText;
-                this.$root.notify.error(mes, 'Ошибка API');
-            }
-        });
-
         this.setAppTitle();
         (async() => {
+            //загрузим конфиг сревера
+            try {
+                const config = await miscApi.loadConfig();
+                this.commit('config/setConfig', config);
+                this.showPage = true;
+            } catch(e) {
+                //проверим, не получен ли конфиг ранее
+                if (!this.mode) {
+                    this.$root.notify.error(e.message, 'Ошибка API');
+                } else {
+                    //вероятно, работаем в оффлайне
+                    this.showPage = true;
+                }
+                console.error(e);
+            }
+
+            //запросим persistent storage
+            if (navigator.storage && navigator.storage.persist) {
+                navigator.storage.persist();
+            }
             await this.routerReady();
             this.redirectIfNeeded();
         })();
@@ -248,7 +262,7 @@ body, html, #app {
 }
 
 .dborder {
-    border: 2px solid yellow !important;
+    border: 2px solid magenta !important;
 }
 
 .icon-rotate {
@@ -256,6 +270,14 @@ body, html, #app {
     animation: rotating 2s linear infinite;
 }
 
+@keyframes rotating { 
+    from { 
+        transform: rotate(0deg); 
+    } to { 
+        transform: rotate(360deg); 
+    }
+}
+
 .notify-button-icon {
     font-size: 16px !important;
 }

client/components/ExternalLibs/BookmarkSettings/BookmarkSettings.vue

@@ -0,0 +1,349 @@
+<template>
+    <Window ref="window" width="600px" height="95%" @close="close">
+        <template slot="header">
+            Настроить закладки
+        </template>
+
+        <div class="col column fit">
+            <div class="row items-center top-panel bg-grey-3">
+                <q-btn class="q-mr-md" round dense color="blue" icon="la la-check" @click.stop="openSelected" size="16px" :disabled="!selected">
+                    <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Открыть выбранную закладку</q-tooltip>
+                </q-btn>
+                <q-input class="col" ref="search" rounded outlined dense bg-color="white" placeholder="Найти" v-model="search">
+                    <template v-slot:append>
+                        <q-icon v-if="search !== ''" name="la la-times" class="cursor-pointer" @click="resetSearch"/>
+                    </template>
+                </q-input>
+            </div>
+
+            <div class="col row">
+                <div class="left-panel column items-center no-wrap bg-grey-3">
+                    <q-btn class="q-my-sm" round dense color="blue" icon="la la-plus" @click.stop="addBookmark" size="14px">
+                        <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Добавить закладку</q-tooltip>
+                    </q-btn>
+                    <q-btn class="q-mb-sm" round dense color="blue" icon="la la-minus" @click.stop="delBookmark" size="14px" :disabled="!ticked.length">
+                        <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Удалить отмеченные закладки</q-tooltip>
+                    </q-btn>
+                    <q-btn class="q-mb-sm" round dense color="blue" icon="la la-edit" @click.stop="editBookmark" size="14px" :disabled="!selected || selected.indexOf('r-') == 0">
+                        <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Редактировать закладку</q-tooltip>
+                    </q-btn>
+                    <q-btn class="q-mb-sm" round dense color="blue" icon="la la-arrow-up" @click.stop="moveBookmark(false)" size="14px" :disabled="!ticked.length">
+                        <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Переместить отмеченные вверх</q-tooltip>
+                    </q-btn>
+                    <q-btn class="q-mb-sm" round dense color="blue" icon="la la-arrow-down" @click.stop="moveBookmark(true)" size="14px" :disabled="!ticked.length">
+                        <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Переместить отмеченные вниз</q-tooltip>
+                    </q-btn>
+                    <q-btn class="q-mb-sm" round dense color="blue" icon="la la-broom" @click.stop="setDefaultBookmarks" size="14px">
+                        <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Установить по умолчанию</q-tooltip>
+                    </q-btn>
+                    <div class="space"/>
+                </div>
+
+                <div class="col fit tree">
+                    <div v-show="nodes.length" class="checkbox-tick-all">
+                        <q-checkbox v-model="tickAll" @input="makeTickAll" size="36px" label="Выбрать все" />
+                    </div>
+                    <q-tree
+                        class="q-my-xs"
+                        :nodes="nodes"
+                        node-key="key"
+                        tick-strategy="leaf"
+                        :selected.sync="selected"
+                        :ticked.sync="ticked"
+                        :expanded.sync="expanded"
+                        selected-color="black"
+                        :filter="search"
+                        no-nodes-label="Закладок пока нет"
+                        no-results-label="Ничего не найдено"
+                    >
+                        <template v-slot:default-header="p">
+                            <div class="q-px-xs" :class="{selected: selected == p.key}">{{ p.node.label }}</div>
+                        </template>
+                    </q-tree>
+                </div>
+            </div>
+        </div>
+    </Window>
+</template>
+
+<script>
+//-----------------------------------------------------------------------------
+import Vue from 'vue';
+import Component from 'vue-class-component';
+import _ from 'lodash';
+
+import Window from '../../share/Window.vue';
+import * as lu from '../linkUtils';
+import rstore from '../../../store/modules/reader';
+
+const BookmarkSettingsProps = Vue.extend({
+    props: {
+        libs: Object,
+        addBookmarkVisible: Boolean,
+    }
+});
+
+export default @Component({
+    components: {
+        Window,
+    },
+    watch: {
+        ticked: function() {
+            this.checkAllTicked();
+        },
+    }    
+})
+class BookmarkSettings extends BookmarkSettingsProps {
+    search = '';
+    selected = '';
+    ticked = [];
+    expanded = [];
+    tickAll = false;
+
+    created() {
+        this.afterInit = true;
+    }
+
+    mounted() {
+    }
+
+    init() {
+        this.$refs.window.init();
+    }
+
+    get nodes() {
+        const result = [];
+
+        const expanded = [];
+        this.links = {};
+        this.libs.groups.forEach(group => {
+            const rkey = `r-${group.r}`;
+            const g = {label: group.r, key: rkey, children: []};
+            this.links[rkey] = {l: group.r, c: ''};
+
+            group.list.forEach(link => {
+                const key = link.l;
+                g.children.push({
+                    label: (link.c ? link.c + ' ': '') + lu.removeOrigin(link.l),
+                    key
+                });
+
+                this.links[key] = link;
+                if (link.l == this.libs.startLink && expanded.indexOf(rkey) < 0) {
+                    expanded.push(rkey);
+                }
+
+            });
+
+            result.push(g);
+        });
+
+        if (this.afterInit) {
+            this.$nextTick(() => {
+                this.expanded = expanded;
+            });
+            this.afterInit = false;
+        }
+
+        return result;
+    }
+
+    makeTickAll() {
+        if (this.tickAll) {
+            const newTicked = [];
+            for (const key of Object.keys(this.links)) {
+                if (key.indexOf('r-') != 0)
+                    newTicked.push(key);
+            }
+            this.ticked = newTicked;
+        } else {
+            this.ticked = [];
+        }
+    }
+
+    checkAllTicked() {
+        const ticked = new Set(this.ticked);
+
+        let newTickAll = !!(this.nodes.length);
+        for (const key of Object.keys(this.links)) {
+            if (key.indexOf('r-') != 0 && !ticked.has(key))
+                newTickAll = false;
+        }
+        this.tickAll = newTickAll;
+    }
+
+    resetSearch() {
+        this.search = '';
+        this.$refs.search.focus();
+    }
+
+    openSelected() {
+        if (!this.selected)
+            return;
+        if (this.selected.indexOf('r-') === 0) {//rootLink
+            this.$emit('do-action', {action: 'setRootLink', data: this.links[this.selected].l});
+        } else {//selectedLink
+            this.$emit('do-action', {action: 'setSelectedLink', data: this.links[this.selected].l});
+        }
+        this.close();
+    }
+
+    editBookmark() {
+        this.$emit('do-action', {action: 'editBookmark', data: {link: this.links[this.selected].l, desc: this.links[this.selected].c}});
+    }
+
+    addBookmark() {
+        this.$emit('do-action', {action: 'addBookmark'});
+    }
+
+    async delBookmark() {
+        const newLibs = _.cloneDeep(this.libs);
+
+        if (await this.$root.stdDialog.confirm(`Подтвердите удаление ${this.ticked.length} закладок:`, ' ')) {
+            const ticked = new Set(this.ticked);
+            for (let i = newLibs.groups.length - 1; i >= 0; i--) {
+                const g = newLibs.groups[i];
+                for (let j = g.list.length - 1; j >= 0; j--) {
+                    if (ticked.has(g.list[j].l)) {
+                        delete g.list[j];
+                    }
+                }
+                g.list = g.list.filter(v => v);
+                if (!g.list.length)
+                    delete newLibs.groups[i];
+                else {
+                    const item = lu.getListItemByLink(g.list, g.s);
+                    if (!item)
+                        g.s = g.list[0].l;
+                }
+            }
+
+            newLibs.groups = newLibs.groups.filter(v => v);
+            this.ticked = [];
+            this.selected = '';
+            this.$emit('do-action', {action: 'setLibs', data: newLibs});
+        }
+    }
+
+    moveBookmark(down = false) {
+        const newLibs = _.cloneDeep(this.libs);
+
+        const ticked = new Set(this.ticked);
+        let moved = false;
+        let prevFull = false;
+        if (!down) {
+            for (let i = 0; i < newLibs.groups.length; i++) {
+                const g = newLibs.groups[i];
+                let count = 0;
+                for (let j = 0; j < g.list.length; j++) {
+                    if (ticked.has(g.list[j].l)) {
+                        if (j > 0 && !ticked.has(g.list[j - 1].l)) {
+                            [g.list[j], g.list[j - 1]] = [g.list[j - 1], g.list[j]];
+                            moved = true;
+                        }
+                        count++;
+                    }
+                }
+
+                if (count == g.list.length && !prevFull && i > 0) {
+                    const gs = newLibs.groups;
+                    [gs[i], gs[i - 1]] = [gs[i - 1], gs[i]];
+                    moved = true;
+                } else
+                    prevFull = (count == g.list.length);
+            }
+        } else {
+            for (let i = newLibs.groups.length - 1; i >= 0; i--) {
+                const g = newLibs.groups[i];
+                let count = 0;
+                for (let j = g.list.length - 1; j >= 0; j--) {
+                    if (ticked.has(g.list[j].l)) {
+                        if (j < g.list.length - 1 && !ticked.has(g.list[j + 1].l)) {
+                            [g.list[j], g.list[j + 1]] = [g.list[j + 1], g.list[j]];
+                            moved = true;
+                        }
+                        count++;
+                    }
+                }
+
+                if (count == g.list.length && !prevFull && i < newLibs.groups.length - 1) {
+                    const gs = newLibs.groups;
+                    [gs[i], gs[i + 1]] = [gs[i + 1], gs[i]];
+                    moved = true;
+                } else
+                    prevFull = (count == g.list.length);
+            }
+        }
+
+        if (moved)
+            this.$emit('do-action', {action: 'setLibs', data: newLibs});
+    }
+
+    async setDefaultBookmarks() {
+        const result = await this.$root.stdDialog.prompt(`Введите 'да' для сброса всех закладок в предустановленные значения:`, ' ', {
+            inputValidator: (str) => { if (str && str.toLowerCase() === 'да') return true; else return 'Удаление не подтверждено'; },
+        });
+
+        if (result && result.value && result.value.toLowerCase() == 'да') {
+            this.$emit('do-action', {action: 'setLibs', data: _.cloneDeep(
+                Object.assign({helpShowed: true}, rstore.libsDefaults)
+            )});
+        }
+    }
+
+    close() {
+        this.afterInit = false;
+        this.$emit('close');
+    }
+
+    keyHook(event) {
+        if (this.addBookmarkVisible)
+            return false;
+
+        if (event.type == 'keydown' && event.key == 'Escape') {
+            this.close();
+            return true;
+        }
+        return false;
+    }
+
+}
+//-----------------------------------------------------------------------------
+</script>
+
+<style scoped>
+.top-panel {
+    height: 50px;
+    border-bottom: 1px solid gray;
+    padding: 0 10px 0 12px;
+}
+
+.left-panel {
+    width: 60px;
+    height: 100%;
+    border-right: 1px solid gray;
+    overflow-x: hidden;
+    overflow-y: auto;
+}
+
+.tree {
+    padding: 0px 10px 10px 10px;
+    overflow-x: auto;
+    overflow-y: auto;
+}
+
+.selected {
+    text-shadow: 0 0 20px yellow, 0 0 15px yellow, 0 0 10px yellow, 0 0 10px yellow, 0 0 5px yellow;
+}
+
+.checkbox-tick-all {
+    border-bottom: 1px solid #bbbbbb;
+    margin-bottom: 7px;
+    padding: 5px 5px 2px 16px;
+}
+
+.space {
+    min-height: 1px;
+    width: 1px;
+}
+</style>

client/components/ExternalLibs/ExternalLibs.vue

@@ -9,6 +9,18 @@
                 <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)">
+                <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)">
+                <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">
+                <q-icon name="la la-question-circle" size="16px"/>
+                <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Справка</q-tooltip>
+            </span>
         </template>
 
         <div v-show="ready" class="col column" style="min-width: 600px">
@@ -23,12 +35,12 @@
                         <q-btn class="q-mr-xs" round dense color="blue" icon="la la-plus" @click.stop="addBookmark" size="12px">
                             <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Добавить закладку</q-tooltip>
                         </q-btn>
-                        <q-btn round dense color="blue" icon="la la-bars" @click.stop="bookmarkSettings"  size="12px" disabled>
-                            <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Настроить закладки (пока недоступно)</q-tooltip>                            
+                        <q-btn round dense color="blue" icon="la la-bars" @click.stop="bookmarkSettings" size="12px">
+                            <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Настроить закладки</q-tooltip>
                         </q-btn>
                     </template>
                     <template v-slot:selected>
-                        <div style="overflow: hidden; white-space: nowrap;">{{ removeProtocol(rootLink) }}</div>
+                        <div style="overflow: hidden; white-space: nowrap;">{{ rootLinkWithoutProtocol }}</div>
                     </template>
                 </q-select>
 
@@ -44,23 +56,30 @@
                     @focus="selectAllOnFocus" @keydown="bookUrlKeyDown"
                 >
                     <template v-slot:prepend>
-                        <q-btn class="q-mr-xs" round dense color="blue" icon="la la-home" @click="goToLink(libs.startLink)" size="12px">
+                        <q-btn class="q-mr-xs" round dense color="blue" icon="la la-home" @click="goToLink(selectedLink)" size="12px">
                             <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Вернуться на стартовую страницу</q-tooltip>
                         </q-btn>
-                        <q-btn round dense color="blue" icon="la la-angle-double-down" @click="openBookUrlInFrame" size="12px">
+                        <q-btn round dense color="blue" icon="la la-angle-double-down" @click="openBookUrlInFrame" size="12px" :disabled="!bookUrl">
                             <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Загрузить URL во фрейм</q-tooltip>
                         </q-btn>
                     </template>
+                    <template v-slot:append>
+                        <q-btn round dense color="blue" icon="la la-cog" @click.stop="optionsVisible = true" size="12px">
+                            <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Опции</q-tooltip>
+                        </q-btn>
+                    </template>
                 </q-input>
 
-                <q-btn rounded color="green-7" no-caps size="14px" @click="submitUrl">Открыть
+                <q-btn rounded color="green-7" no-caps size="14px" @click="submitUrl" :disabled="!bookUrl">Открыть
                     <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Открыть в читалке</q-tooltip>
                 </q-btn>
             </div>
             <div class="separator"></div>
 
-            <div class="col fit" style="position: relative;">
-                <iframe v-if="frameVisible" class="fit" ref="frame" :src="frameSrc" frameborder="0"></iframe>
+            <div class="col fit" ref="frameBox" style="position: relative;">
+                <div ref="frameWrap" class="overflow-hidden">
+                    <iframe v-if="frameVisible" ref="frame" :src="frameSrc" frameborder="0"></iframe>
+                </div>
                 <div v-show="transparentLayoutVisible" ref="transparentLayout" class="fit transparent-layout" @click="transparentLayoutClick"></div>
             </div>
 
@@ -68,7 +87,8 @@
                 <template slot="header">
                     <div class="row items-center">
                         <q-icon class="q-mr-sm" name="la la-bookmark" size="28px"></q-icon>
-                        Добавить закладку
+                        <div v-if="addBookmarkMode == 'edit'">Редактировать закладку</div>
+                        <div v-else>Добавить закладку</div>
                     </div>
                 </template>
 
@@ -96,7 +116,30 @@
                     <q-btn class="q-px-md q-ml-sm" color="primary" dense no-caps @click="okAddBookmark" :disabled="!bookmarkLink">OK</q-btn>
                 </template>
             </Dialog>
+
+            <Dialog ref="options" v-model="optionsVisible">
+                <template slot="header">
+                    <div class="row items-center">
+                        <q-icon class="q-mr-sm" name="la la-cog" size="28px"></q-icon>
+                        Опции
+                    </div>
+                </template>
+
+                <div class="q-mx-md column">
+                    <q-checkbox v-model="closeAfterSubmit" size="36px" label="Закрыть окно при отправке ссылки в читалку" />
+                    <q-checkbox v-model="openInFrameOnEnter" size="36px" label="Открывать ссылку во фрейме при нажатии 'Enter'" />
+                    <q-checkbox v-model="openInFrameOnAdd" size="36px" label="Активировать новую закладку после добавления" />
+                </div>
+
+                <template slot="footer">
+                    <q-btn class="q-px-md q-ml-sm" color="primary" dense no-caps @click="optionsVisible = false">OK</q-btn>
+                </template>
+            </Dialog>
         </div>
+
+        <BookmarkSettings v-if="bookmarkSettingsActive" ref="bookmarkSettings" :libs="libs" :addBookmarkVisible="addBookmarkVisible"
+            @do-action="doAction" @close="closeBookmarkSettings">
+        </BookmarkSettings>
     </Window>
 </template>
 
@@ -108,58 +151,102 @@ import _ from 'lodash';
 
 import Window from '../share/Window.vue';
 import Dialog from '../share/Dialog.vue';
+import BookmarkSettings from './BookmarkSettings/BookmarkSettings.vue';
+
 import rstore from '../../store/modules/reader';
 import * as utils from '../../share/utils';
+import * as lu from './linkUtils';
 
 const proxySubst = {
     'http://flibusta.is': 'http://b.liberama.top:23480',
+    'http://fantasy-worlds.org': 'http://b.liberama.top:23580',
 };
 
 export default @Component({
     components: {
         Window,
-        Dialog
+        Dialog,
+        BookmarkSettings
     },
     watch: {
         libs: function() {
             this.loadLibs();
         },
-        rootLink: function() {
-            this.updateSelectedLink();
-            this.updateStartLink();
-        },
-        selectedLink: function() {
-            this.updateStartLink();
-        },
         defaultRootLink: function() {
             this.updateBookmarkLink();
-        }
+        },
+        bookUrl: function(newValue) {
+            const value = lu.addProtocol(newValue);
+            const subst = this.makeProxySubst(value, true);
+            if (value != subst) {
+                this.$nextTick(() => {
+                    this.bookUrl = subst;
+                });
+            }
+        },
+        bookmarkLink: function(newValue) {
+            const value = lu.addProtocol(newValue);
+            const subst = this.makeProxySubst(value, true);
+            if (value != subst) {
+                this.$nextTick(() => {
+                    this.bookmarkLink = subst;
+                });
+            }
+        },
+        closeAfterSubmit: function(newValue) {
+            this.commitProp('closeAfterSubmit', newValue);
+        },
+        openInFrameOnEnter: function(newValue) {
+            this.commitProp('openInFrameOnEnter', newValue);
+        },
+        openInFrameOnAdd: function(newValue) {
+            this.commitProp('openInFrameOnAdd', newValue);
+        },
     }    
 })
 class ExternalLibs extends Vue {
     ready = false;
     frameVisible = false;
-    startLink = '';
     rootLink = '';
     selectedLink = '';
     frameSrc = '';
     bookUrl = '';
     libs = {};
     fullScreenActive = false;
-    addBookmarkVisible = false;
     transparentLayoutVisible = false;
 
+    addBookmarkVisible = false;
+    optionsVisible = false;
+
+    addBookmarkMode = '';
     bookmarkLink = '';
     bookmarkDesc = '';
     defaultRootLink = '';
 
+    bookmarkSettingsActive = false;
+
+    closeAfterSubmit = false;
+    openInFrameOnEnter = false;
+    openInFrameOnAdd = false;
+    frameScale = 1;
+
     created() {
+        this.oldStartLink = '';
+        this.justOpened = true;
         this.$root.addKeyHook(this.keyHook);
 
+        this.$root.$on('resize', async() => {
+            await utils.sleep(200);
+            this.frameResize();
+        });
+
         document.addEventListener('fullscreenchange', () => {
             this.fullScreenActive = (document.fullscreenElement !== null);
         });
 
+        this.debouncedGoToLink = _.debounce((link) => {
+            this.goToLink(link);
+        }, 100, {'maxWait':200});
         //this.commit = this.$store.commit;
         //this.commit('reader/setLibs', rstore.libsDefaults);
     }
@@ -252,8 +339,6 @@ class ExternalLibs extends Vue {
         } else if (d.type == 'libs') {
             this.ready = true;
             this.libs = _.cloneDeep(d.data);
-            if (!this.frameSrc)
-                this.goToLink(this.libs.startLink);
         } else if (d.type == 'notify') {
             this.$root.notify.success(d.data, '', {position: 'bottom-right'});
         }
@@ -278,11 +363,44 @@ class ExternalLibs extends Vue {
         this.sendMessage({type: 'libs', data: libs});
     }
 
+    commitProp(prop, value) {
+        let libs = _.cloneDeep(this.libs);
+        libs[prop] = value;
+        this.commitLibs(libs);
+    }
+
     loadLibs() {
         const libs = this.libs;
-        this.startLink = (libs.comment ? libs.comment + ' ': '') + this.removeProtocol(libs.startLink);
-        this.rootLink = this.getOrigin(libs.startLink);
-        this.updateSelectedLink();
+
+        if (!libs.helpShowed) {
+            this.showHelp();
+            (async() => {
+                await utils.sleep(1000);
+                this.commitProp('helpShowed', true);
+            })();
+        }
+
+        this.selectedLink = libs.startLink;
+        this.closeAfterSubmit = libs.closeAfterSubmit || false;
+        this.openInFrameOnEnter = libs.openInFrameOnEnter || false;
+        this.openInFrameOnAdd = libs.openInFrameOnAdd || false;
+
+        this.frameScale = 1;
+        const index = lu.getSafeRootIndexByUrl(this.libs.groups, this.selectedLink);
+        if (index >= 0)
+            this.frameScale = this.libs.groups[index].frameScale || 1;
+
+        this.updateStartLink();
+    }
+
+    doAction(event) {
+        switch (event.action) {
+            case 'setLibs': this.commitLibs(event.data); break;
+            case 'setRootLink': this.rootLink = event.data; this.rootLinkInput(); break;
+            case 'setSelectedLink': this.selectedLink = event.data; this.selectedLinkInput(); break;
+            case 'editBookmark': this.addBookmark('edit', event.data.link, event.data.desc); break;
+            case 'addBookmark': this.addBookmark('add'); break;
+        }
     }
 
     get mode() {
@@ -290,33 +408,61 @@ class ExternalLibs extends Vue {
     }
 
     get header() {
-        let result = (this.ready ? 'Библиотека' : 'Загрузка...');
-        if (this.ready && this.startLink) {
-            result += ` | ${this.startLink}`;
+        let result = (this.ready ? 'Сетевая библиотека' : 'Загрузка...');
+        if (this.ready && this.selectedLink) {
+            result += ` | ${(this.libs.comment ? this.libs.comment + ' ': '') + lu.removeProtocol(this.libs.startLink)}`;
         }
         this.$root.$emit('set-app-title', result);
         return result;
     }
 
-    updateSelectedLink() {
-        if (!this.ready)
-            return;
-        const index = this.getRootIndexByUrl(this.libs.groups, this.rootLink);
-        if (index >= 0)
-            this.selectedLink = this.libs.groups[index].s;
+    get rootLinkWithoutProtocol() {
+        return lu.removeProtocol(this.rootLink);
     }
 
-    updateStartLink() {
+    updateSelectedLinkByRoot() {
         if (!this.ready)
             return;
-        const index = this.getRootIndexByUrl(this.libs.groups, this.rootLink);
+
+        const index = lu.getSafeRootIndexByUrl(this.libs.groups, this.rootLink);
+        if (index >= 0)
+            this.selectedLink = this.libs.groups[index].s;
+        else
+            this.selectedLink = '';
+    }
+
+    updateStartLink(force) {
+        if (!this.ready)
+            return;
+
+        let index = -1;
+        try {
+            this.rootLink = lu.getOrigin(this.selectedLink);
+            index = lu.getRootIndexByUrl(this.libs.groups, this.rootLink);
+        } catch(e) {
+            //
+        }
+
         if (index >= 0) {
             let libs = _.cloneDeep(this.libs);
-            libs.groups[index].s = this.selectedLink;
-            libs.startLink = this.selectedLink;
-            libs.comment = this.getCommentByLink(libs.groups[index].list, this.selectedLink);
-            this.goToLink(this.selectedLink);
-            this.commitLibs(libs);
+            const com = this.getCommentByLink(libs.groups[index].list, this.selectedLink);
+            if (libs.groups[index].s != this.selectedLink ||
+                libs.startLink != this.selectedLink ||
+                libs.comment != com) {
+                libs.groups[index].s = this.selectedLink;
+                libs.startLink = this.selectedLink;
+                libs.comment = com;
+                this.commitLibs(libs);
+            }
+
+            if (force || this.oldStartLink != libs.startLink) {
+                this.oldStartLink = libs.startLink;
+                this.debouncedGoToLink(this.selectedLink);
+            }
+        } else {
+            this.rootLink = '';
+            this.selectedLink = '';
+            this.debouncedGoToLink(this.selectedLink);
         }
     }
 
@@ -326,7 +472,7 @@ class ExternalLibs extends Vue {
             return result;
 
         this.libs.groups.forEach(group => {
-            result.push({label: this.removeProtocol(group.r), value: group.r});
+            result.push({label: lu.removeProtocol(group.r), value: group.r});
         });
 
         return result;
@@ -336,7 +482,7 @@ class ExternalLibs extends Vue {
         let result = [];
 
         rstore.libsDefaults.groups.forEach(group => {
-            result.push({label: this.removeProtocol(group.r), value: group.r});
+            result.push({label: lu.removeProtocol(group.r), value: group.r});
         });
 
         return result;
@@ -347,10 +493,10 @@ class ExternalLibs extends Vue {
         if (!this.ready)
             return result;
 
-        const index = this.getRootIndexByUrl(this.libs.groups, this.rootLink);
+        const index = lu.getSafeRootIndexByUrl(this.libs.groups, this.rootLink);
         if (index >= 0) {
             this.libs.groups[index].list.forEach(link => {
-                result.push({label: (link.c ? link.c + ' ': '') + this.removeOrigin(link.l), value: link.l});
+                result.push({label: (link.c ? link.c + ' ': '') + lu.removeOrigin(link.l), value: link.l});
             });
         }
 
@@ -359,66 +505,69 @@ class ExternalLibs extends Vue {
 
     openBookUrlInFrame() {
         if (this.bookUrl) {
-            this.goToLink(this.addProtocol(this.bookUrl));
+            this.goToLink(lu.addProtocol(this.bookUrl));
         }
     }
 
     goToLink(link) {
-        if (!this.ready)
+        if (!this.ready || !link)
             return;
 
+        if (!link) {
+            this.frameVisible = false;
+            return;
+        }
+
         this.frameSrc = this.makeProxySubst(link);
+
         this.frameVisible = false;
         this.$nextTick(() => {
             this.frameVisible = true;
             this.$nextTick(() => {
-                this.$refs.frame.contentWindow.focus();
+                if (this.$refs.frame) {
+                    this.$refs.frame.contentWindow.focus();
+                    this.frameResize();
+                }
             });
         });
     }
 
-    addProtocol(url) {
-        if ((url.indexOf('http://') != 0) && (url.indexOf('https://') != 0))
-            return 'http://' + url;
-        return url;
+    frameResize() {
+        this.$refs.frameWrap.style = 'width: 1px; height: 1px;';
+        this.$nextTick(() => {
+            if (this.$refs.frame) {
+                const w = this.$refs.frameBox.offsetWidth;
+                const h = this.$refs.frameBox.offsetHeight;
+                const normalSize = `width: ${w}px; height: ${h}px;`;
+                this.$refs.frameWrap.style = normalSize;
+                if (this.frameScale != 1) {
+                    const s = this.frameScale;
+                    this.$refs.frame.style = `width: ${w/s}px; height: ${h/s}px; transform: scale(${s}); transform-origin: 0 0;`;
+                } else {
+                    this.$refs.frame.style = normalSize;
+                }
+            }
+        });
     }
 
-    removeProtocol(url) {
-        return url.replace(/(^\w+:|^)\/\//, '');
-    }
+    changeScale(delta) {
+        if ((this.frameScale > 0.1 && delta <= 0) || (this.frameScale < 5 && delta >= 0)) {
+             this.frameScale = _.round(this.frameScale + delta, 1);
 
-    getOrigin(url) {
-        const parsed = new URL(url);
-        return parsed.origin;
-    }
+            const index = lu.getSafeRootIndexByUrl(this.libs.groups, this.selectedLink);
+            if (index >= 0) {
+                let libs = _.cloneDeep(this.libs);
+                libs.groups[index].frameScale = this.frameScale;
+                this.commitLibs(libs);
+            }
 
-    removeOrigin(url) {
-        const parsed = new URL(url);
-        const result = url.substring(parsed.origin.length);
-        return (result ? result : '/');
-    }
-
-    getRootIndexByUrl(groups, url) {
-        if (!this.ready)
-            return -1;
-        const origin = this.getOrigin(url);
-        for (let i = 0; i < groups.length; i++) {
-            if (groups[i].r == origin)
-                return i;
+            this.frameResize();
+            this.$root.notify.success(`Масштаб изменен: ${(this.frameScale*100).toFixed(0)}%`, '', {position: 'bottom-right'});
         }
-        return -1;
-    }
-
-    getListItemByLink(list, link) {
-        for (const item of list) {
-            if (item.l == link)
-                return item;
-        }
-        return null;
     }
 
     getCommentByLink(list, link) {
-        const item = this.getListItemByLink(list, link);
+        const item = lu.getListItemByLink(list, link);
         return (item ? item.c : '');
     }
 
@@ -426,7 +575,7 @@ class ExternalLibs extends Vue {
         for (const [key, value] of Object.entries(proxySubst)) {
             if (reverse && value == url.substring(0, value.length)) {
                 return key + url.substring(value.length);
-            } else if (key == url.substring(0, key.length)) {
+            } else if (!reverse && key == url.substring(0, key.length)) {
                 return value + url.substring(key.length);
             }
         }
@@ -440,29 +589,37 @@ class ExternalLibs extends Vue {
     }
 
     rootLinkInput() {
-        this.updateSelectedLink();
-        this.updateStartLink();
+        this.updateSelectedLinkByRoot();
+        this.updateStartLink(true);
     }
 
     selectedLinkInput() {
-        this.updateStartLink();
+        this.updateStartLink(true);
     }
 
     submitUrl() {
         if (this.bookUrl) {
             this.sendMessage({type: 'submitUrl', data: {
-                url: this.makeProxySubst(this.addProtocol(this.bookUrl), true), 
+                url: this.bookUrl,
                 force: true
             }});
             this.bookUrl = '';
-            if (this.libs.closeAfterSubmit)
+            if (this.closeAfterSubmit)
                 this.close();
         }
     }
 
-    addBookmark() {
-        this.bookmarkLink = (this.bookUrl ? this.makeProxySubst(this.addProtocol(this.bookUrl), true) : '');
-        this.bookmarkDesc = '';
+    addBookmark(mode = 'add', link = '', desc = '') {
+
+        if (mode == 'edit') {
+            this.editBookmarkLink = this.bookmarkLink = link;
+            this.editBookmarkDesc = this.bookmarkDesc = desc;
+        } else {
+            this.bookmarkLink = this.bookUrl;
+            this.bookmarkDesc = '';
+        }
+
+        this.addBookmarkMode = mode;
         this.addBookmarkVisible = true;
         this.$nextTick(() => {
             this.$refs.bookmarkLink.focus();
@@ -471,7 +628,7 @@ class ExternalLibs extends Vue {
     }
 
     updateBookmarkLink() {
-        const index = this.getRootIndexByUrl(rstore.libsDefaults.groups, this.defaultRootLink);
+        const index = lu.getSafeRootIndexByUrl(rstore.libsDefaults.groups, this.defaultRootLink);
         if (index >= 0) {
             this.bookmarkLink = rstore.libsDefaults.groups[index].s;
             this.bookmarkDesc = this.getCommentByLink(rstore.libsDefaults.groups[index].list, this.bookmarkLink);
@@ -494,8 +651,9 @@ class ExternalLibs extends Vue {
 
     bookmarkDescKeyDown(event) {
         if (event.key == 'Enter') {
-            this.okAddBookmark();
+            event.stopPropagation();
             event.preventDefault();
+            this.okAddBookmark();
         }
     }
 
@@ -503,55 +661,82 @@ class ExternalLibs extends Vue {
         if (!this.bookmarkLink)
             return;
 
-        const link = this.addProtocol(this.bookmarkLink);
+        const link = (this.addBookmarkMode == 'edit' ? lu.addProtocol(this.editBookmarkLink) : lu.addProtocol(this.bookmarkLink));
         let index = -1;
         try {
-            index = this.getRootIndexByUrl(this.libs.groups, link);
+            index = lu.getRootIndexByUrl(this.libs.groups, link);
         } catch (e) {
             await this.$root.stdDialog.alert('Неверный формат ссылки', 'Ошибка');
             return;
         }
 
+        let libs = _.cloneDeep(this.libs);
+
+        //добавление
         //есть группа в закладках
         if (index >= 0) {
-            const item = this.getListItemByLink(this.libs.groups[index].list, link);
-            
-            if (!item || item.c != this.bookmarkDesc) {
-                //добавляем
-                let libs = _.cloneDeep(this.libs);
+            const item = lu.getListItemByLink(libs.groups[index].list, link);
 
+            //редактирование
+            if (item && this.addBookmarkMode == 'edit') {
+                if (item) {
+                    //редактируем
+                    item.l = link;
+                    item.c = this.bookmarkDesc;
+                    this.commitLibs(libs);
+                } else {
+                    await this.$root.stdDialog.alert('Не удалось отредактировать закладку', 'Ошибка');
+                }
+            } else if (!item) {
+                //добавляем
                 if (libs.groups[index].list.length >= 100) {
                     await this.$root.stdDialog.alert('Достигнут предел количества закладок для этого сайта', 'Ошибка');
                     return;
                 }
 
                 libs.groups[index].list.push({l: link, c: this.bookmarkDesc});
+
+                if (this.openInFrameOnAdd) {
+                    libs.startLink = link;
+                    libs.comment = this.bookmarkDesc;
+                }
+
                 this.commitLibs(libs);
+            } else if (item.c != this.bookmarkDesc) {
+                if (await this.$root.stdDialog.confirm(`Такая закладка уже существует с другим описанием.<br>` +
+                    `Заменить '${this.$sanitize(item.c)}' на '${this.$sanitize(this.bookmarkDesc)}'?`, ' ')) {
+                    item.c = this.bookmarkDesc;
+                    this.commitLibs(libs);                    
+                } else 
+                    return;
+            } else {
+                await this.$root.stdDialog.alert('Такая закладка уже существует', ' ');
+                return;
             }
         } else {//нет группы в закладках
-            let libs = _.cloneDeep(this.libs);
-
             if (libs.groups.length >= 100) {
                 await this.$root.stdDialog.alert('Достигнут предел количества различных сайтов в закладках', 'Ошибка');
                 return;
             }
 
             //добавляем сначала группу
-            libs.groups.push({r: this.getOrigin(link), s: link, list: []});
+            libs.groups.push({r: lu.getOrigin(link), s: link, list: []});
             
-            index = this.getRootIndexByUrl(libs.groups, link);
+            index = lu.getSafeRootIndexByUrl(libs.groups, link);
             if (index >= 0)
                 libs.groups[index].list.push({l: link, c: this.bookmarkDesc});
 
+            if (this.openInFrameOnAdd) {
+                libs.startLink = link;
+                libs.comment = this.bookmarkDesc;
+            }
+
             this.commitLibs(libs);
         }
 
         this.addBookmarkVisible = false;
     }
 
-    bookmarkSettings() {
-    }
-
     fullScreenToggle() {
         this.fullScreenActive = !this.fullScreenActive;
         if (this.fullScreenActive) {
@@ -579,19 +764,65 @@ class ExternalLibs extends Vue {
 
     bookUrlKeyDown(event) {
         if (event.key == 'Enter') {
-            this.submitUrl();
+            if (!this.openInFrameOnEnter) {
+                this.submitUrl();
+            } else {
+                if (this.bookUrl)
+                    this.goToLink(this.bookUrl);
+            }
             event.preventDefault();
         }
     }
 
-    keyHook() {
+    bookmarkSettings() {
+        this.bookmarkSettingsActive = true;
+        this.$nextTick(() => {
+            this.$refs.bookmarkSettings.init();
+        });
+    }
+
+    closeBookmarkSettings() {
+        this.bookmarkSettingsActive = false;
+    }
+
+    showHelp() {
+        this.$root.stdDialog.alert(`
+<p>Окно 'Сетевая библиотека' позволяет открывать ссылки в читалке без переключения между окнами,
+что особенно актуально для мобильных устройств. Имеется возможность управлять закладками
+на понравившиеся ресурсы, книги или страницы авторов. Открытие ссылок и навигация происходят во фрейме, но,
+к сожалению, в нем открываются не все страницы.</p>
+
+<p>Доступ к сайтам <span style="color: blue">http://flibusta.is</span> и <span style="color: blue">http://fantasy-worlds.org</span> работает через прокси.
+
+<br><span style="color: red"><b>ПРЕДУПРЕЖДЕНИЕ!</b></span>
+Доступ предназначен только для просмотра и скачивания книг. Авторизоваться на этих сайтах
+из фрейма категорически не рекомендуется, т.к. ваше подключение не защищено и данные могут попасть 
+к третьим лицам.
+</p>
+
+<p>Из-за проблем с безопасностью, навигация 'вперед-назад' во фрейме осуществляется с помощью контекстного меню правой кнопкой мыши.
+На мобильных устройствах для этого служит системная клавиша 'Назад (стрелка влево)' и опция 'Вперед (стрелка вправо)' в меню браузера. 
+</p>
+
+<p>Приятного пользования ;-)
+</p>
+            `, 'Справка', {iconName: 'la la-info-circle'});
+    }
+
+    keyHook(event) {
         if (this.$root.rootRoute() == '/external-libs') {
-            if (this.$refs.dialogAddBookmark.active)
+            if (this.$root.stdDialog.active)
+                return false;
+
+            if (this.bookmarkSettingsActive && this.$refs.bookmarkSettings.keyHook(event))
+                return true;
+
+            if (this.addBookmarkVisible || this.optionsVisible)
                 return false;
 
             if (event.type == 'keydown' && event.key == 'F4') {
-                this.addBookmark()
-                return;
+                this.addBookmark();
+                return true;
             }
 
             if (event.type == 'keydown' && event.key == 'Escape' &&
@@ -599,12 +830,11 @@ class ExternalLibs extends Vue {
                 (document.activeElement != this.$refs.selectedLink.$refs.target || !this.$refs.selectedLink.menu)
                ) {
                 this.close();
+                return true;
             }
-            return true;
         }
         return false;
     }
-
 }
 //-----------------------------------------------------------------------------
 </script>

client/components/ExternalLibs/linkUtils.js

@@ -0,0 +1,48 @@
+export function addProtocol(url) {
+    if ((url.indexOf('http://') != 0) && (url.indexOf('https://') != 0))
+        return 'http://' + url;
+    return url;
+}
+
+export function removeProtocol(url) {
+    return url.replace(/(^\w+:|^)\/\//, '');
+}
+
+export function getOrigin(url) {
+    const parsed = new URL(url);
+    return parsed.origin;
+}
+
+export function removeOrigin(url) {
+    const parsed = new URL(url);
+    const result = url.substring(parsed.origin.length);
+    return (result ? result : '/');
+}
+
+export function getRootIndexByUrl(groups, url) {
+    const origin = getOrigin(url);
+    for (let i = 0; i < groups.length; i++) {
+        if (groups[i].r == origin)
+            return i;
+    }
+    return -1;
+}
+
+export function getSafeRootIndexByUrl(groups, url) {
+    let index = -1;
+    try {
+        index = getRootIndexByUrl(groups, url);
+    } catch(e) {
+        //
+    }
+    return index;
+}
+
+export function getListItemByLink(list, link) {
+    for (const item of list) {
+        if (item.l == link)
+            return item;
+    }
+    return null;
+}
+

client/components/Reader/ContentsPage/ContentsPage.vue

@@ -0,0 +1,436 @@
+<template>
+    <Window width="600px" ref="window" @close="close">
+        <template slot="header">
+            Оглавление/закладки
+        </template>
+
+    <div class="bg-grey-3 row">
+        <q-tabs
+            v-model="selectedTab"
+            active-color="black"
+            active-bg-color="white"
+            indicator-color="white"
+            dense
+            no-caps
+            inline-label
+            class="no-mp bg-grey-4 text-grey-7"
+        >
+            <q-tab name="contents" icon="la la-list" label="Оглавление" />
+            <q-tab name="images" icon="la la-image" label="Изображения" />
+            <q-tab name="bookmarks"  icon="la la-bookmark" label="Закладки" />
+        </q-tabs>
+    </div>
+
+    <div class="q-mb-sm"/>
+
+    <div class="tab-panel" v-show="selectedTab == 'contents'">
+        <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 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"/>
+                    </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"/>
+                    </div>
+                    <div class="col row clickable" @click="setBookPos(item.offset)">
+                        <div :style="item.indentStyle"></div>
+                        <div class="q-mr-sm col overflow-hidden column justify-center" :style="item.labelStyle" v-html="item.label"></div>
+                        <div class="column justify-center">{{ item.perc }}%</div>
+                    </div>
+                </div>
+                
+                <div v-if="item.expanded" :ref="`subitem${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 class="col row clickable" @click="setBookPos(subitem.offset)">
+                            <div class="no-expand-button"></div>
+                            <div :style="subitem.indentStyle"></div>
+                            <div class="q-mr-sm col overflow-hidden column justify-center" :style="item.labelStyle" v-html="subitem.label"></div>
+                            <div class="column justify-center">{{ subitem.perc }}%</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div v-if="!contents.length" class="column justify-center items-center" style="height: 100px">
+                Оглавление отсутствует
+            </div>
+        </div>
+    </div>
+
+    <div class="tab-panel" v-show="selectedTab == 'images'">
+        <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 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"><i class="loading-img-icon la la-images"></i></div>
+                            <img v-show="imageLoaded[item.id]" class="image-thumb" :src="imageSrc[item.id]"/>
+                        </div>
+                        <div class="no-expand-button column justify-center items-center">
+                            <div class="image-num">{{ item.num }}</div>
+                            <div v-show="item.type == 'image/jpeg'" class="image-type it-jpg-color row justify-center">JPG</div>
+                            <div v-show="item.type == 'image/png'" class="image-type it-png-color row justify-center">PNG</div>
+                            <div v-show="!item.local" class="image-type it-net-color row justify-center">INET</div>
+                        </div>
+                        <div :style="item.indentStyle"></div>
+                        <div class="q-mr-sm col overflow-hidden column justify-center" :style="item.labelStyle" v-html="item.label"></div>
+                        <div class="column justify-center">{{ item.perc }}%</div>
+                    </div>
+                </div>
+            </div>
+            <div v-if="!images.length" class="column justify-center items-center" style="height: 100px">
+                Изображения отсутствуют
+            </div>
+        </div>
+    </div>
+
+    <div class="tab-panel" v-show="selectedTab == 'bookmarks'">
+        <div class="column justify-center items-center" style="height: 100px">
+            Раздел находится в разработке
+        </div>
+    </div>
+
+    </Window>
+</template>
+
+<script>
+//-----------------------------------------------------------------------------
+import Vue from 'vue';
+import Component from 'vue-class-component';
+//import _ from 'lodash';
+
+import Window from '../../share/Window.vue';
+import * as utils from '../../../share/utils';
+
+const ContentsPageProps = Vue.extend({
+    props: {
+        bookPos: Number,
+        isVisible: Boolean,
+    }
+});
+
+export default @Component({
+    components: {
+        Window,
+    },
+    watch: {
+        bookPos: function() {
+            this.updateBookPosSelection();
+        }
+    },
+})
+class ContentsPage extends ContentsPageProps {
+    selectedTab = 'contents';
+    contents = [];
+    images = [];
+    imageSrc = [];
+    imageLoaded = [];
+
+    created() {
+    }
+
+    async init(currentBook, parsed) {
+        this.$refs.window.init();
+
+        //закладки
+
+        //проверим, надо ли обновлять списки
+        if (this.parsed == parsed) {
+            this.updateBookPosSelection();
+            return;
+        }
+
+        //далее формирование оглавления
+        this.parsed = parsed;
+        this.contents = [];
+        await this.$nextTick();
+
+        const pc = parsed.contents;
+        const ims = parsed.images;
+        const newpc = [];        
+        if (pc.length) {//если есть оглавление
+            //преобразуем все, кроме первого, разделы body в title-subtitle
+            let curSubtitles = [];
+            let prevBodyIndex = -1;
+            for (let i = 0; i < pc.length; i++) {
+                const cont = pc[i];
+                if (prevBodyIndex != cont.bodyIndex)
+                    curSubtitles = [];
+
+                prevBodyIndex = cont.bodyIndex;
+
+                if (cont.bodyIndex > 1) {
+                    if (cont.inset < 1) {
+                        newpc.push(Object.assign({}, cont, {subtitles: curSubtitles}));
+                    } else {
+                        curSubtitles.push(Object.assign({}, cont, {inset: cont.inset - 1}));
+                    }
+                } else {
+                    newpc.push(cont);
+                }
+            }
+        } else {//попробуем вытащить из images
+            for (let i = 0; i < ims.length; i++) {
+                const image = ims[i];
+
+                if (image.alt) {
+                    newpc.push({paraIndex: image.paraIndex, title: image.alt, inset: 1, bodyIndex: 0, subtitles: []});
+                }
+            }
+        }
+
+        const prepareLabel = (title, bolder = false) => {
+            let titleParts = title.split('<p>');
+            const textParts = titleParts.filter(v => v).map(v => `<div>${utils.removeHtmlTags(v)}</div>`);
+            if (bolder && textParts.length > 1)
+                textParts[0] = `<b>${textParts[0]}</b>`;
+            return textParts.join('');
+        }
+
+        const getIndentStyle = inset => `width: ${inset*20}px`;
+
+        const getLabelStyle = (inset) => {
+            const fontSizes = ['110%', '100%', '90%', '85%'];
+            inset = (inset > 3 ? 3 : inset);
+            return `font-size: ${fontSizes[inset]}`;
+        };
+
+        //формируем newContents
+        let i = 0;
+        const newContents = [];
+        newpc.forEach((cont) => {
+            const label = prepareLabel(cont.title, true);
+            const indentStyle = getIndentStyle(cont.inset);
+            const labelStyle = getLabelStyle(cont.inset);
+
+            let j = 0;
+            const list = [];
+            cont.subtitles.forEach((sub) => {
+                const l = prepareLabel(sub.title);
+                const s = getIndentStyle(sub.inset + 1);
+                const ls = getLabelStyle(cont.inset + 1);
+                const p = parsed.para[sub.paraIndex];
+                list[j] = {perc: (p.offset/parsed.textLength*100).toFixed(2), label: l, key: j, offset: p.offset, indentStyle: s, labelStyle: ls};
+                j++;
+            });
+
+            const p = parsed.para[cont.paraIndex];
+            newContents[i] = {perc: (p.offset/parsed.textLength*100).toFixed(0), label, key: i, offset: p.offset, indentStyle, labelStyle, expanded: false, list};
+
+            i++;
+        });
+
+        this.contents = newContents;
+
+        //формируем newImages
+        const newImages = [];
+        for (i = 0; i < ims.length; i++) {
+            const image = ims[i];
+            const bin = parsed.binary[image.id];
+            const type = (bin ? bin.type : '');
+            
+            const label = (image.alt ? image.alt : '<span style="font-size: 90%; color: #dddddd"><i>Без названия</i></span>');
+            const indentStyle = getIndentStyle(1);
+            const labelStyle = getLabelStyle(1);
+
+            const p = parsed.para[image.paraIndex];
+            newImages.push({perc: (p.offset/parsed.textLength*100).toFixed(0), label, key: i, offset: p.offset,
+                indentStyle, labelStyle, type, num: image.num, id: image.id, local: image.local});
+        }
+
+        this.images = newImages;
+
+        if (this.selectedTab == 'contents' && !this.contents.length && this.images.length)
+            this.selectedTab = 'images';
+
+        //выделим на bookPos
+        this.updateBookPosSelection();
+
+        //асинхронная загрузка изображений
+        this.imageSrc = [];
+        this.imageLoaded = [];
+        await utils.sleep(50);
+        (async() => {
+            for (i = 0; i < ims.length; i++) {
+                const {id, local} = ims[i];
+                const bin = this.parsed.binary[id];
+                if (local)
+                    this.$set(this.imageSrc, id, (bin ? `data:${bin.type};base64,${bin.data}` : ''));
+                else
+                    this.$set(this.imageSrc, id, id);
+                this.imageLoaded[id] = true;
+                await utils.sleep(5);
+            }
+        })();
+    }
+
+    async updateBookPosSelection() {
+        if (!this.isVisible)
+            return;
+
+        await utils.sleep(50);
+        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);
+
+            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.$set(this.contents, i, Object.assign(item, {list: item.list}));
+                } else if (subitem.isBookPos) {
+                    subitem.isBookPos = false;
+                    this.$set(this.contents, i, Object.assign(item, {list: item.list}));
+                }
+            }
+
+            if (bp >= item.offset && bp < nextOffset) {
+                this.$set(this.contents, i, Object.assign(item, {isBookPos: true}));
+            } else if (item.isBookPos) {
+                this.$set(this.contents, i, Object.assign(item, {isBookPos: false}));
+            }
+        }
+
+        for (let i = 0; i < this.images.length; i++) {
+            const img = this.images[i];
+            const nextOffset = (i < this.images.length - 1 ? this.images[i + 1].offset : this.parsed.textLength);
+
+            if (bp >= img.offset && bp < nextOffset) {
+                this.$set(this.images, i, Object.assign(img, {isBookPos: true}));
+            } else if (img.isBookPos) {
+                this.$set(this.images, i, Object.assign(img, {isBookPos: false}));
+            }
+        }
+    }
+
+    async expandClick(key) {
+        const item = this.contents[key];
+        const expanded = !item.expanded;
+
+        if (!expanded) {
+            const subitems = this.$refs[`subitem${key}`][0];
+            subitems.style.height = '0';
+            await utils.sleep(200);
+        }
+
+        this.$set(this.contents, key, Object.assign({}, item, {expanded}));
+
+        if (expanded) {
+            await this.$nextTick();
+            const subitems = this.$refs[`subitem${key}`][0];
+            subitems.style.height = subitems.scrollHeight + 'px';
+        }
+    }
+
+    async setBookPos(newValue) {
+        this.$emit('book-pos-changed', {bookPos: newValue});
+        this.close();
+    }
+
+    close() {
+        this.$emit('do-action', {action: 'contents'});
+    }
+
+    keyHook(event) {
+        if (!this.$root.stdDialog.active && event.type == 'keydown' && event.key == 'Escape') {
+            this.close();
+        }
+        return true;
+    }
+}
+//-----------------------------------------------------------------------------
+</script>
+
+<style scoped>
+.tab-panel {
+    overflow-x: hidden;
+    overflow-y: auto;
+    font-size: 90%;
+    padding: 0 10px 0px 10px;
+}
+
+.clickable {
+    cursor: pointer;
+    padding: 10px 0 10px 0;
+}
+
+.item, .subitem, .item-book-pos, .subitem-book-pos {
+    border-bottom: 1px solid #e0e0e0;
+}
+
+.item:hover, .subitem:hover {
+    background-color: #f0f0f0;
+}
+
+.item-book-pos {
+    background-color: #b0f0b0;
+}
+
+.subitem-book-pos {
+    background-color: #d0f5d0;
+}
+
+.item-book-pos:hover {
+    background-color: #b0e0b0;
+}
+
+.subitem-book-pos:hover {
+    background-color: #d0f0d0;
+}
+
+.expand-button, .no-expand-button {
+    width: 40px;
+}
+
+.subitems-transition {
+    height: 0;
+    transition: height 0.2s linear;
+    overflow: hidden;
+}
+
+.icon {
+    transition: transform 0.2s;
+}
+
+.expanded-icon {
+    transform: rotate(90deg);
+}
+
+.image-num {
+    font-size: 120%;
+    padding-bottom: 3px;
+}
+.image-type {
+    border: 1px solid black;
+    border-radius: 6px;
+    font-size: 80%;
+    padding: 2px 0 2px 0;
+    width: 34px;
+}
+.it-jpg-color {
+    background: linear-gradient(to right, #fabc3d, #ffec6d);
+}
+.it-png-color {
+    background: linear-gradient(to right, #4bc4e5, #6bf4ff);
+}
+.it-net-color {
+    background: linear-gradient(to right, #00c400, #00f400);
+}
+
+.image-thumb-box {
+    width: 120px;
+    overflow: hidden;
+}
+
+.image-thumb {
+    height: 50px;
+}
+
+.loading-img-icon {
+    font-size: 250%;
+}
+</style>

client/components/Reader/HelpPage/DonateHelpPage/DonateHelpPage.vue

@@ -3,10 +3,10 @@
         <div class="box">
             <p class="p">Вы можете пожертвовать на развитие проекта любую сумму:</p>
             <div class="address">
-                <img class="logo" src="./assets/yandex.png">
-                <q-btn class="q-ml-sm q-px-sm" dense no-caps @click="donateYandexMoney">Пожертвовать</q-btn><br>
-                <div class="para">{{ yandexAddress }}
-                    <q-icon class="copy-icon" name="la la-copy" @click="copyAddress(yandexAddress, 'Яндекс кошелек')">
+                <img class="logo" src="./assets/yoomoney.png">
+                <q-btn class="q-ml-sm q-px-sm" dense no-caps @click="donateYooMoney">Пожертвовать</q-btn><br>
+                <div class="para">{{ yooAddress }}
+                    <q-icon class="copy-icon" name="la la-copy" @click="copyAddress(yooAddress, 'Кошелёк ЮMoney')">
                         <q-tooltip :delay="1000" anchor="top middle" self="center middle" content-style="font-size: 80%">Скопировать</q-tooltip>                    
                     </q-icon>
                 </div>
@@ -60,7 +60,7 @@ import {copyTextToClipboard} from '../../../../share/utils';
 export default @Component({
 })
 class DonateHelpPage extends Vue {
-    yandexAddress = '410018702323056';
+    yooAddress = '410018702323056';
     paypalAddress = 'bookpauk@gmail.com';
     bitcoinAddress = '3EbgZ7MK1UVaN38Gty5DCBtS4PknM4Ut85';
     litecoinAddress = 'MP39Riec4oSNB3XMjiquKoLWxbufRYNXxZ';
@@ -69,8 +69,8 @@ class DonateHelpPage extends Vue {
     created() {
     }
 
-    donateYandexMoney() {
-        window.open(`https://money.yandex.ru/to/${this.yandexAddress}`, '_blank');
+    donateYooMoney() {
+        window.open(`https://yoomoney.ru/to/${this.yooAddress}`, '_blank');
     }
 
     async copyAddress(address, prefix) {

client/components/Reader/LoaderPage/LoaderPage.vue

@@ -7,8 +7,8 @@
             <span class="greeting"><b>{{ title }}</b></span>
             <div class="q-my-sm"></div>
             <span class="greeting">Добро пожаловать!</span>
-            <span class="greeting">Поддерживаются форматы: <b>fb2, html, txt</b> и сжатие: <b>zip, bz2, gz</b></span>
-            <span v-if="isExternalConverter" class="greeting">...а также форматы: <b>rtf, doc, docx, pdf, epub, mobi</b></span>
+            <span class="greeting">Поддерживаются форматы: <b>fb2, html, txt</b> и сжатие: <b>zip, bz2, gz<span v-if="isExternalConverter">, rar</span></b></span>
+            <span v-if="isExternalConverter" class="greeting">...а также частично форматы: <b>epub, mobi, rtf, doc, docx, pdf, djvu</b></span>
         </div>
 
         <div class="col-auto column justify-start items-center no-wrap overflow-hidden">

client/components/Reader/LoaderPage/PasteTextPage/PasteTextPage.vue

@@ -68,7 +68,7 @@ class PasteTextPage extends Vue {
     }
 
     loadBuffer() {
-        this.$emit('load-buffer', {buffer: `<buffer><cut-title>${utils.escapeXml(this.bookTitle)}</cut-title>${this.$refs.textArea.value}</buffer>`});
+        this.$emit('load-buffer', {buffer: `<buffer><fb2-title>${utils.escapeXml(this.bookTitle)}</fb2-title>${utils.escapeXml(this.$refs.textArea.value)}</buffer>`});
         this.close();
     }
 

client/components/Reader/Reader.vue

@@ -39,15 +39,19 @@
                         <q-icon name="la la-copy" size="32px"/>
                         <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">{{ rstore.readerActions['copyText'] }}</q-tooltip>
                     </button>
-                    <button ref="splitToPara" v-show="showToolButton['splitToPara']" class="tool-button" :class="buttonActiveClass('splitToPara')" @click="buttonClick('splitToPara')" v-ripple>
-                        <q-icon name="la la-retweet" size="32px"/>
-                        <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">{{ rstore.readerActions['splitToPara'] }}</q-tooltip>
+                    <button ref="convOptions" v-show="showToolButton['convOptions']" class="tool-button" :class="buttonActiveClass('convOptions')" @click="buttonClick('convOptions')" v-ripple>
+                        <q-icon name="la la-magic" size="32px"/>
+                        <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">{{ rstore.readerActions['convOptions'] }}</q-tooltip>
                     </button>
                     <button ref="refresh" v-show="showToolButton['refresh']" class="tool-button" :class="buttonActiveClass('refresh')" @click="buttonClick('refresh')" v-ripple>
                         <q-icon name="la la-sync" size="32px" :class="{clear: !showRefreshIcon}"/>
                         <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">{{ rstore.readerActions['refresh'] }}</q-tooltip>
                     </button>
                     <div class="space"></div>
+                    <button ref="contents" v-show="showToolButton['contents']" class="tool-button" :class="buttonActiveClass('contents')" @click="buttonClick('contents')" v-ripple>
+                        <q-icon name="la la-list" size="32px"/>
+                        <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">{{ rstore.readerActions['contents'] }}</q-tooltip>
+                    </button>
                     <button ref="libs" v-show="mode == 'liberama.top' && showToolButton['libs']" class="tool-button" :class="buttonActiveClass('libs')" @click="buttonClick('libs')" v-ripple>
                         <q-icon name="la la-sitemap" size="32px"/>
                         <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">{{ rstore.readerActions['libs'] }}</q-tooltip>
@@ -89,71 +93,15 @@
                 @stop-text-search="stopTextSearch">
             </SearchPage>
             <CopyTextPage v-if="copyTextActive" ref="copyTextPage" @do-action="doAction"></CopyTextPage>
-            <LibsPage v-show="libsActive" ref="libsPage" @load-book="loadBook" @libs-close="libsClose" @do-action="doAction"></LibsPage>
+            <LibsPage v-show="hidden" ref="libsPage" @load-book="loadBook" @libs-close="libsClose" @do-action="doAction"></LibsPage>
             <RecentBooksPage v-show="recentBooksActive" ref="recentBooksPage" @load-book="loadBook" @recent-books-close="recentBooksClose"></RecentBooksPage>
             <SettingsPage v-show="settingsActive" ref="settingsPage" @do-action="doAction"></SettingsPage>
             <HelpPage v-if="helpActive" ref="helpPage" @do-action="doAction"></HelpPage>
             <ClickMapPage v-show="clickMapActive" ref="clickMapPage"></ClickMapPage>
             <ServerStorage v-show="hidden" ref="serverStorage"></ServerStorage>
+            <ContentsPage v-show="contentsActive" ref="contentsPage" :book-pos="bookPos" :is-visible="contentsActive" @do-action="doAction" @book-pos-changed="bookPosChanged"></ContentsPage>
 
-            <Dialog ref="dialog1" v-model="whatsNewVisible">
-                <template slot="header">
-                    Что нового:
-                </template>
-
-                <div style="line-height: 20px" v-html="whatsNewContent"></div>
-
-                <span class="clickable" @click="openVersionHistory">Посмотреть историю версий</span>
-                <span slot="footer">
-                    <q-btn class="q-px-md" dense no-caps @click="whatsNewDisable">Больше не показывать</q-btn>
-                </span>
-            </Dialog>
-
-            <Dialog ref="dialog2" v-model="donationVisible">
-                <template slot="header">
-                    Здравствуйте, уважаемые читатели!
-                </template>
-
-                <div style="word-break: normal">
-                    Стартовала ежегодная акция "Оплатим хостинг вместе".<br><br>
-
-                    Для оплаты годового хостинга читалки, необходимо собрать около 2000 рублей.
-                    В настоящий момент у автора эта сумма есть в наличии. Однако будет справедливо, если каждый
-                    сможет проголосовать рублем за то, чтобы читалка так и оставалась:
-
-                    <ul>
-                        <li>непрерывно улучшаемой</li>
-                        <li>без рекламы</li>
-                        <li>без регистрации</li>
-                        <li>Open Source</li>
-                    </ul>
-
-                    Автор также обращается с просьбой о помощи в распространении 
-                    <a href="https://omnireader.ru" target="_blank">ссылки</a>
-                    <q-icon class="copy-icon" name="la la-copy" @click="copyLink('https://omnireader.ru')">
-                        <q-tooltip :delay="1000" anchor="top middle" self="center middle" content-style="font-size: 80%">Скопировать</q-tooltip>                    
-                    </q-icon>
-                    на читалку через тематические форумы, соцсети, мессенджеры и пр.
-                    Чем нас больше, тем легче оставаться на плаву и тем больше мотивации у разработчика, чтобы продолжать работать над проектом.
-
-                    <br><br>
-                    Если соберется бóльшая сумма, то разработка децентрализованной библиотеки для свободного обмена книгами будет по возможности ускорена.
-                    <br><br>
-                    P.S. При необходимости можно воспользоваться подходящим обменником на <a href="https://www.bestchange.ru" target="_blank">bestchange.ru</a>
-
-                    <br><br>
-                    <div class="row justify-center">
-                        <q-btn class="q-px-sm" color="primary" dense no-caps rounded @click="openDonate">Помочь проекту</q-btn>
-                    </div>
-                </div>
-
-                <span slot="footer">
-                    <span class="clickable row justify-end" style="font-size: 60%; color: grey" @click="donationDialogDisable">Больше не показывать</span>                        
-                    <br>
-                    <q-btn class="q-px-sm" dense no-caps @click="donationDialogRemind">Напомнить позже</q-btn>
-                </span>
-            </Dialog>
-
+            <ReaderDialogs ref="dialogs" @donate-toggle="donateToggle" @version-history-toggle="versionHistoryToggle"></ReaderDialogs>
         </div>
     </div>
 </template>
@@ -178,13 +126,17 @@ import SettingsPage from './SettingsPage/SettingsPage.vue';
 import HelpPage from './HelpPage/HelpPage.vue';
 import ClickMapPage from './ClickMapPage/ClickMapPage.vue';
 import ServerStorage from './ServerStorage/ServerStorage.vue';
-import Dialog from '../share/Dialog.vue';
+import ContentsPage from './ContentsPage/ContentsPage.vue';
+
+import ReaderDialogs from './ReaderDialogs/ReaderDialogs.vue';
 
 import bookManager from './share/bookManager';
 import rstore from '../../store/modules/reader';
 import readerApi from '../../api/reader';
-import * as utils from '../../share/utils';
+import miscApi from '../../api/misc';
+
 import {versionHistory} from './versionHistory';
+import * as utils from '../../share/utils';
 
 export default @Component({
     components: {
@@ -201,7 +153,9 @@ export default @Component({
         HelpPage,
         ClickMapPage,
         ServerStorage,
-        Dialog,
+        ContentsPage,
+
+        ReaderDialogs,
     },
     watch: {
         bookPos: function(newValue) {
@@ -240,6 +194,10 @@ export default @Component({
                 }
             })();
         },
+        dualPageMode(newValue) {
+            if (newValue)
+                this.stopScrolling();
+        },
     },
 })
 class Reader extends Vue {
@@ -258,6 +216,7 @@ class Reader extends Vue {
     settingsActive = false;
     helpActive = false;
     clickMapActive = false;
+    contentsActive = false;
 
     bookPos = null;
     allowUrlParamBookPos = false;
@@ -272,12 +231,12 @@ class Reader extends Vue {
     whatsNewVisible = false;
     whatsNewContent = '';
     donationVisible = false;
+    dualPageMode = false;
 
     created() {
         this.rstore = rstore;
         this.loading = true;
         this.commit = this.$store.commit;
-        this.dispatch = this.$store.dispatch;
         this.reader = this.$store.state.reader;
         this.config = this.$store.state.config;
 
@@ -298,11 +257,11 @@ class Reader extends Vue {
                 await this.$nextTick();
                 this.paramPosIgnore = false;
             }
-        }, 500, {'maxWait':5000});
+        }, 500, {maxWait: 5000});
 
         this.scrollingSetRecentBook = _.debounce((newValue) => {
             this.debouncedSetRecentBook(newValue);
-        }, 15000, {'maxWait':20000});
+        }, 15000, {maxWait: 20000});
 
         document.addEventListener('fullscreenchange', () => {
             this.fullScreenActive = (document.fullscreenElement !== null);
@@ -331,10 +290,25 @@ class Reader extends Vue {
             this.checkActivateDonateHelpPage();
             this.loading = false;
 
+            //проверим состояние Settings, и обновим, если надо
+            const newSettings = rstore.addDefaultsToSettings(this.settings);
+            if (newSettings) {
+                this.commit('reader/setSettings', newSettings);
+            }
+
             this.updateRoute();
 
-            await this.showWhatsNew();
-            await this.showDonation();
+            await this.$refs.dialogs.init();
+        })();
+
+        (async() => {
+            this.isFirstNeedUpdateNotify = true;
+            //вечный цикл, запрашиваем периодически конфиг для проверки выхода новой версии читалки
+            while (true) {// eslint-disable-line no-constant-condition
+                await this.checkNewVersionAvailable();
+                await utils.sleep(3600*1000); //каждый час
+            }
+            //дальше кода нет
         })();
     }
 
@@ -345,10 +319,14 @@ class Reader extends Vue {
         this.showClickMapPage = settings.showClickMapPage;
         this.clickControl = settings.clickControl;
         this.blinkCachedLoad = settings.blinkCachedLoad;
-        this.showWhatsNewDialog = settings.showWhatsNewDialog;
-        this.showDonationDialog2020 = settings.showDonationDialog2020;
         this.showToolButton = settings.showToolButton;
         this.enableSitesFilter = settings.enableSitesFilter;
+        this.showNeedUpdateNotify = settings.showNeedUpdateNotify;
+        this.splitToPara = settings.splitToPara;
+        this.djvuQuality = settings.djvuQuality;
+        this.pdfAsText = settings.pdfAsText;
+        this.pdfQuality = settings.pdfQuality;
+        this.dualPageMode = settings.dualPageMode;
 
         this.readerActionByKeyCode = utils.userHotKeysObjectSwap(settings.userHotKeys);
         this.$root.readerActionByKeyEvent = (event) => {
@@ -358,6 +336,30 @@ class Reader extends Vue {
         this.updateHeaderMinWidth();
     }
 
+    async checkNewVersionAvailable() {
+        if (!this.checkingNewVersion && this.showNeedUpdateNotify) {
+            this.checkingNewVersion = true;
+            try {
+                await utils.sleep(15*1000); //подождем 15 секунд, чтобы прогрузился ServiceWorker при выходе новой версии
+                const config = await miscApi.loadConfig();
+                this.commit('config/setConfig', config);
+
+                let againMes = '';
+                if (this.isFirstNeedUpdateNotify) {
+                    againMes = ' еще один раз';
+                }
+
+                if (this.version != this.clientVersion)
+                    this.$root.notify.info(`Вышла новая версия (v${this.version}) читалки.<br>Пожалуйста, обновите страницу${againMes}.`, 'Обновление');
+            } catch(e) {
+                console.error(e);
+            } finally {
+                this.checkingNewVersion = false;
+            }        
+            this.isFirstNeedUpdateNotify = false;
+        }
+    }
+
     updateHeaderMinWidth() {
         const showButtonCount = Object.values(this.showToolButton).reduce((a, b) => a + (b ? 1 : 0), 0);
         if (this.$refs.buttons)
@@ -410,64 +412,6 @@ class Reader extends Vue {
         }
     }
 
-    async showWhatsNew() {
-        await utils.sleep(2000);
-
-        const whatsNew = versionHistory[0];
-        if (this.showWhatsNewDialog &&
-            whatsNew.showUntil >= utils.formatDate(new Date(), 'coDate') &&
-            whatsNew.header != this.whatsNewContentHash) {
-            this.whatsNewContent = 'Версия ' + whatsNew.header + whatsNew.content;
-            this.whatsNewVisible = true;
-        }
-    }
-
-    async showDonation() {
-        await utils.sleep(3000);
-        const today = utils.formatDate(new Date(), 'coDate');
-
-        if ((this.mode == 'omnireader' || this.mode == 'liberama.top') && today < '2020-03-01' && this.showDonationDialog2020 && this.donationRemindDate != today) {
-            this.donationVisible = true;
-        }
-    }
-
-    donationDialogDisable() {
-        this.donationVisible = false;
-        if (this.showDonationDialog2020) {
-            const newSettings = Object.assign({}, this.settings, { showDonationDialog2020: false });
-            this.commit('reader/setSettings', newSettings);
-        }
-    }
-
-    donationDialogRemind() {
-        this.donationVisible = false;
-        this.commit('reader/setDonationRemindDate', utils.formatDate(new Date(), 'coDate'));
-    }
-
-    openDonate() {
-        this.donationVisible = false;
-        this.donateToggle();
-    }
-
-    async copyLink(link) {
-        const result = await utils.copyTextToClipboard(link);
-        if (result)
-            this.$root.notify.success(`Ссылка ${link} успешно скопирована в буфер обмена`);
-        else
-            this.$root.notify.error('Копирование не удалось');
-    }
-
-    openVersionHistory() {
-        this.whatsNewVisible = false;
-        this.versionHistoryToggle();
-    }
-
-    whatsNewDisable() {
-        this.whatsNewVisible = false;
-        const whatsNew = versionHistory[0];
-        this.commit('reader/setWhatsNewContentHash', whatsNew.header);
-    }
-
     get routeParamPos() {
         let result = undefined;
         const q = this.$route.query;
@@ -497,6 +441,16 @@ class Reader extends Vue {
         return this.$store.state.config.mode;
     }
 
+    get version() {
+        return this.$store.state.config.version;
+    }
+
+    get clientVersion() {
+        let v = versionHistory[0].header;
+        v = v.split(' ')[0];
+        return v;
+    }
+
     get routeParamUrl() {
         let result = '';
         const path = this.$route.fullPath;
@@ -571,14 +525,6 @@ class Reader extends Vue {
         return this.$store.state.reader.settings;
     }
 
-    get whatsNewContentHash() {
-        return this.$store.state.reader.whatsNewContentHash;
-    }
-
-    get donationRemindDate() {
-        return this.$store.state.reader.donationRemindDate;
-    }
-
     addAction(pos) {
         let a = this.actionList;
         if (!a.length || a[a.length - 1] != pos) {
@@ -611,6 +557,7 @@ class Reader extends Vue {
         this.stopScrolling();
         this.stopSearch();
         this.helpActive = false;
+        this.contentsActive = false;
     }
 
     loaderToggle() {
@@ -703,12 +650,6 @@ class Reader extends Vue {
         }
     }
 
-    refreshBookSplitToPara() {
-        if (this.mostRecentBook()) {
-            this.loadBook({url: this.mostRecentBook().url, skipCheck: true, isText: true, force: true});
-        }
-    }
-
     recentBooksClose() {
         this.recentBooksActive = false;
     }
@@ -724,6 +665,21 @@ class Reader extends Vue {
         }
     }
 
+    contentsPageToggle() {
+        this.contentsActive = !this.contentsActive;
+        const page = this.$refs.page;
+        if (this.contentsActive && this.activePage == 'TextPage' && page.parsed) {
+            this.closeAllWindows();
+            this.contentsActive = true;
+
+            this.$nextTick(() => {
+                this.$refs.contentsPage.init(this.mostRecentBook(), page.parsed);
+            });
+        } else {
+            this.contentsActive = false;
+        }
+    }
+
     libsClose() {
         if (this.libsActive)
             this.libsToogle();
@@ -757,6 +713,12 @@ class Reader extends Vue {
         }
     }
 
+    convOptionsToggle() {
+        this.settingsToggle();
+        if (this.settingsActive)
+            this.$refs.settingsPage.selectedTab = 'convert';
+    }
+
     helpToggle() {
         this.helpActive = !this.helpActive;
         if (this.helpActive) {
@@ -784,9 +746,8 @@ class Reader extends Vue {
     }
 
     refreshBook() {
-        if (this.mostRecentBook()) {
-            this.loadBook({url: this.mostRecentBook().url, force: true});
-        }
+        const mrb = this.mostRecentBook();
+        this.loadBook({url: mrb.url, uploadFileName: mrb.uploadFileName, force: true});
     }
 
     undoAction() {
@@ -823,11 +784,11 @@ class Reader extends Vue {
             case 'loader':
             case 'fullScreen':
             case 'setPosition':
-            case 'scrolling':
             case 'search':
             case 'copyText':
-            case 'splitToPara':
+            case 'convOptions':
             case 'refresh':
+            case 'contents':
             case 'libs':
             case 'recentBooks':
             case 'offlineMode':
@@ -838,6 +799,13 @@ class Reader extends Vue {
                     classResult = classActive;
                 }
                 break;
+            case 'scrolling':
+                if (this.progressActive || this.dualPageMode) {
+                    classResult = classDisabled;
+                } else if (this[`${action}Active`]) {
+                    classResult = classActive;
+                }
+                break;
             case 'undoAction':
                 if (this.actionCur <= 0)
                     classResult = classDisabled;
@@ -856,9 +824,9 @@ class Reader extends Vue {
                 case 'scrolling':
                 case 'search':
                 case 'copyText':
+                case 'contents':
                     classResult = classDisabled;
                     break;
-                case 'splitToPara':
                 case 'refresh':
                 case 'recentBooks':
                     if (!this.mostRecentBookReactive)
@@ -939,8 +907,12 @@ class Reader extends Vue {
 
         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('file://') != 0))
+            (url.indexOf('disk://') != 0))
             url = 'http://' + url;
 
         // уже просматривается сейчас
@@ -971,6 +943,7 @@ class Reader extends Vue {
             wasOpened = (wasOpened ? wasOpened : {});
             const bookPos = (opts.bookPos !== undefined ? opts.bookPos : wasOpened.bookPos);
             const bookPosSeen = (opts.bookPos !== undefined ? opts.bookPos : wasOpened.bookPosSeen);
+            const uploadFileName = (opts.uploadFileName ? opts.uploadFileName : '');
 
             let book = null;
 
@@ -1015,9 +988,13 @@ class Reader extends Vue {
             if (!book) {
                 book = await readerApi.loadBook({
                         url,
-                        skipCheck: (opts.skipCheck ? true : false),
-                        isText: (opts.isText ? true : false),
-                        enableSitesFilter: this.enableSitesFilter
+                        uploadFileName,
+                        enableSitesFilter: this.enableSitesFilter,
+                        skipHtmlCheck: (this.splitToPara ? true : false),
+                        isText: (this.splitToPara ? true : false),
+                        djvuQuality: this.djvuQuality,
+                        pdfAsText: this.pdfAsText,
+                        pdfQuality: this.pdfQuality,
                     },
                     (state) => {
                         progress.setState(state);
@@ -1033,7 +1010,7 @@ class Reader extends Vue {
             });
 
             // добавляем в историю
-            await bookManager.setRecentBook(Object.assign({bookPos, bookPosSeen}, addedBook));
+            await bookManager.setRecentBook(Object.assign({bookPos, bookPosSeen, uploadFileName}, addedBook));
             this.mostRecentBook();
             this.addAction(bookPos);
             this.updateRoute(true);
@@ -1051,6 +1028,8 @@ class Reader extends Vue {
             progress.hide(); this.progressActive = false;
             this.loaderActive = true;
             this.$root.stdDialog.alert(e.message, 'Ошибка', {color: 'negative'});
+        } finally {
+            this.checkNewVersionAvailable();
         }
     }
 
@@ -1070,7 +1049,7 @@ class Reader extends Vue {
 
             progress.hide(); this.progressActive = false;
 
-            await this.loadBook({url});
+            await this.loadBook({url, uploadFileName: opts.file.name, force: true});
         } catch (e) {
             progress.hide(); this.progressActive = false;
             this.loaderActive = true;
@@ -1141,12 +1120,15 @@ class Reader extends Vue {
             case 'copyText':
                 this.copyTextToggle();
                 break;
-            case 'splitToPara':
-                this.refreshBookSplitToPara();
+            case 'convOptions':
+                this.convOptionsToggle();
                 break;
             case 'refresh':
                 this.refreshBook();
                 break;
+            case 'contents':
+                this.contentsPageToggle();
+                break;
             case 'libs':
                 this.libsToogle();
                 break;
@@ -1222,9 +1204,12 @@ class Reader extends Vue {
     keyHook(event) {
         let result = false;
         if (this.$root.rootRoute() == '/reader') {
-            if (this.$root.stdDialog.active || this.$refs.dialog1.active || this.$refs.dialog2.active)
+            if (this.$root.stdDialog.active)
                 return result;
 
+            if (!result)
+                result = this.$refs.dialogs.keyHook(event);
+
             if (!result && this.helpActive)
                 result = this.$refs.helpPage.keyHook(event);
 
@@ -1243,6 +1228,9 @@ class Reader extends Vue {
             if (!result && this.copyTextActive)
                 result = this.$refs.copyTextPage.keyHook(event);
 
+            if (!result && this.contentsActive)
+                result = this.$refs.contentsPage.keyHook(event);
+
             if (!result && this.$refs.page && this.$refs.page.keyHook)
                 result = this.$refs.page.keyHook(event);
 
@@ -1333,16 +1321,4 @@ class Reader extends Vue {
 .clear {
     color: rgba(0,0,0,0);
 }
-
-.clickable {
-    color: blue;
-    text-decoration: underline;
-    cursor: pointer;
-}
-
-.copy-icon {
-    cursor: pointer;
-    font-size: 120%;
-    color: blue;
-}
 </style>

client/components/Reader/ReaderDialogs/ReaderDialogs.vue

@@ -0,0 +1,199 @@
+<template>
+    <div>
+        <Dialog ref="dialog1" v-model="whatsNewVisible">
+            <template slot="header">
+                Что нового:
+            </template>
+
+            <div style="line-height: 20px" v-html="whatsNewContent"></div>
+
+            <span class="clickable" @click="openVersionHistory">Посмотреть историю версий</span>
+            <span slot="footer">
+                <q-btn class="q-px-md" dense no-caps @click="whatsNewDisable">Больше не показывать</q-btn>
+            </span>
+        </Dialog>
+
+        <Dialog ref="dialog2" v-model="donationVisible">
+            <template slot="header">
+                Здравствуйте, уважаемые читатели!
+            </template>
+
+            <div style="word-break: normal">
+                Стартовала ежегодная акция "Оплатим хостинг вместе".<br><br>
+
+                Для оплаты годового хостинга читалки, необходимо собрать около 2000 рублей.
+                В настоящий момент у автора эта сумма есть в наличии. Однако будет справедливо, если каждый
+                сможет проголосовать рублем за то, чтобы читалка так и оставалась:
+
+                <ul>
+                    <li>непрерывно улучшаемой</li>
+                    <li>без рекламы</li>
+                    <li>без регистрации</li>
+                    <li>Open Source</li>
+                </ul>
+
+                Автор также обращается с просьбой о помощи в распространении 
+                <a href="https://omnireader.ru" target="_blank">ссылки</a>
+                <q-icon class="copy-icon" name="la la-copy" @click="copyLink('https://omnireader.ru')">
+                    <q-tooltip :delay="1000" anchor="top middle" self="center middle" content-style="font-size: 80%">Скопировать</q-tooltip>                    
+                </q-icon>
+                на читалку через тематические форумы, соцсети, мессенджеры и пр.
+                Чем нас больше, тем легче оставаться на плаву и тем больше мотивации у разработчика, чтобы продолжать работать над проектом.
+
+                <br><br>
+                Если соберется бóльшая сумма, то разработка децентрализованной библиотеки для свободного обмена книгами будет по возможности ускорена.
+                <br><br>
+                P.S. При необходимости можно воспользоваться подходящим обменником на <a href="https://www.bestchange.ru" target="_blank">bestchange.ru</a>
+
+                <br><br>
+                <div class="row justify-center">
+                    <q-btn class="q-px-sm" color="primary" dense no-caps rounded @click="openDonate">Помочь проекту</q-btn>
+                </div>
+            </div>
+
+            <span slot="footer">
+                <span class="clickable row justify-end" style="font-size: 60%; color: grey" @click="donationDialogDisable">Больше не показывать</span>                        
+                <br>
+                <q-btn class="q-px-sm" dense no-caps @click="donationDialogRemind">Напомнить позже</q-btn>
+            </span>
+        </Dialog>
+    </div>
+</template>
+
+<script>
+//-----------------------------------------------------------------------------
+import Vue from 'vue';
+import Component from 'vue-class-component';
+
+import Dialog from '../../share/Dialog.vue';
+import * as utils from '../../../share/utils';
+import {versionHistory} from '../versionHistory';
+
+export default @Component({
+    components: {
+        Dialog
+    },
+    watch: {
+        settings: function() {
+            this.loadSettings();
+        },
+    },
+})
+class ReaderDialogs extends Vue {
+    whatsNewVisible = false;
+    whatsNewContent = '';
+    donationVisible = false;
+
+    created() {
+        this.commit = this.$store.commit;
+        this.loadSettings();
+    }
+
+    mounted() {
+    }
+
+    async init() {
+        await this.showWhatsNew();
+        await this.showDonation();
+    }
+
+    loadSettings() {
+        const settings = this.settings;
+        this.showWhatsNewDialog = settings.showWhatsNewDialog;
+        this.showDonationDialog2020 = settings.showDonationDialog2020;
+    }
+
+    async showWhatsNew() {
+        const whatsNew = versionHistory[0];
+        if (this.showWhatsNewDialog &&
+            whatsNew.showUntil >= utils.formatDate(new Date(), 'coDate') &&
+            whatsNew.header != this.whatsNewContentHash) {
+            await utils.sleep(2000);
+            this.whatsNewContent = 'Версия ' + whatsNew.header + whatsNew.content;
+            this.whatsNewVisible = true;
+        }
+    }
+
+    async showDonation() {
+        const today = utils.formatDate(new Date(), 'coDate');
+
+        if ((this.mode == 'omnireader' || this.mode == 'liberama.top') && today < '2020-03-01' && this.showDonationDialog2020 && this.donationRemindDate != today) {
+            await utils.sleep(3000);
+            this.donationVisible = true;
+        }
+    }
+
+    donationDialogDisable() {
+        this.donationVisible = false;
+        if (this.showDonationDialog2020) {
+            this.commit('reader/setSettings', { showDonationDialog2020: false });
+        }
+    }
+
+    donationDialogRemind() {
+        this.donationVisible = false;
+        this.commit('reader/setDonationRemindDate', utils.formatDate(new Date(), 'coDate'));
+    }
+
+    openDonate() {
+        this.donationVisible = false;
+        this.$emit('donate-toggle');
+    }
+
+    async copyLink(link) {
+        const result = await utils.copyTextToClipboard(link);
+        if (result)
+            this.$root.notify.success(`Ссылка ${link} успешно скопирована в буфер обмена`);
+        else
+            this.$root.notify.error('Копирование не удалось');
+    }
+
+    openVersionHistory() {
+        this.whatsNewVisible = false;
+        this.$emit('version-history-toggle');
+    }
+
+    whatsNewDisable() {
+        this.whatsNewVisible = false;
+        const whatsNew = versionHistory[0];
+        this.commit('reader/setWhatsNewContentHash', whatsNew.header);
+    }
+
+    get mode() {
+        return this.$store.state.config.mode;
+    }
+
+    get settings() {
+        return this.$store.state.reader.settings;
+    }
+
+    get whatsNewContentHash() {
+        return this.$store.state.reader.whatsNewContentHash;
+    }
+
+    get donationRemindDate() {
+        return this.$store.state.reader.donationRemindDate;
+    }
+
+    keyHook() {
+        if (this.$refs.dialog1.active || this.$refs.dialog2.active)
+            return true;
+        return false;
+    }
+}
+//-----------------------------------------------------------------------------
+</script>
+
+<style scoped>
+.clickable {
+    color: blue;
+    text-decoration: underline;
+    cursor: pointer;
+}
+
+.copy-icon {
+    cursor: pointer;
+    font-size: 120%;
+    color: blue;
+}
+</style>

client/components/Reader/RecentBooksPage/RecentBooksPage.vue

@@ -27,8 +27,11 @@
                             placeholder="Найти"
                             v-model="search"
                             @click.stop
-                        />
-
+                        >
+                            <template v-slot:append>
+                                <q-icon v-if="search !== ''" name="la la-times" class="cursor-pointer" @click.stop="resetSearch"/>
+                            </template>
+                        </q-input>
                         <span v-html="props.cols[2].label"></span>
                     </q-th>
                 </q-tr>
@@ -53,13 +56,14 @@
                         <div class="break-word" style="width: 332px; font-size: 90%">
                             <div style="color: green">{{ props.row.desc.author }}</div>
                             <div>{{ props.row.desc.title }}</div>
+                            <div class="read-bar" :style="`width: ${332*props.row.readPart}px`"></div>
                         </div>
                     </q-td>
 
                     <q-td key="links" :props="props" class="td-mp" auto-width>
                         <div class="break-word" style="width: 75px; font-size: 90%">
                             <a v-show="isUrl(props.row.url)" :href="props.row.url" target="_blank">Оригинал</a><br>
-                            <a :href="props.row.path" @click.prevent="downloadBook(props.row.path)">Скачать FB2</a>
+                            <a :href="props.row.path" @click.prevent="downloadBook(props.row.path, props.row.fullTitle)">Скачать FB2</a>
                         </div>
                     </q-td>
 
@@ -87,7 +91,7 @@
 import Vue from 'vue';
 import Component from 'vue-class-component';
 import path from 'path';
-import _ from 'lodash';
+//import _ from 'lodash';
 
 import * as utils from '../../../share/utils';
 import Window from '../../share/Window.vue';
@@ -106,12 +110,13 @@ export default @Component({
 })
 class RecentBooksPage extends Vue {
     loading = false;
-    search = null;
+    search = '';
     tableData = [];
     columns = [];
     pagination = {};
 
     created() {
+        this.firstInit = true;
         this.pagination = {rowsPerPage: 0};
 
         this.columns = [
@@ -167,26 +172,11 @@ class RecentBooksPage extends Vue {
             this.initing = true;
 
 
-            if (!bookManager.loaded) {
-                await this.updateTableData(10);
-                //для отзывчивости
-                await utils.sleep(100);
-                let i = 0;
-                let j = 5;
-                while (i < 500 && !bookManager.loaded) {
-                    if (i % j == 0) {
-                        bookManager.sortedRecentCached = null;
-                        await this.updateTableData(20);
-                        j *= 2;
-                    }
-
-                    await utils.sleep(100);
-                    i++;
-                }
-            } else {
-                //для отзывчивости
-                await utils.sleep(100);
+            if (this.firstInit) {//для отзывчивости
+                await this.updateTableData(20);
+                this.firstInit = false;
             }
+            await utils.sleep(50);
             await this.updateTableData();
             this.initing = false;
         })();
@@ -214,38 +204,21 @@ class RecentBooksPage extends Vue {
             d.setTime(book.touchTime);
             const t = utils.formatDate(d).split(' ');
 
+            let readPart = 0;
             let perc = '';
             let textLen = '';
             const p = (book.bookPosSeen ? book.bookPosSeen : (book.bookPos ? book.bookPos : 0));
             if (book.textLength) {
-                perc = ` [${((p/book.textLength)*100).toFixed(2)}%]`;
+                readPart = p/book.textLength;
+                perc = ` [${(readPart*100).toFixed(2)}%]`;
                 textLen = ` ${Math.round(book.textLength/1000)}k`;
             }
 
-            const fb2 = (book.fb2 ? book.fb2 : {});
+            const bt = utils.getBookTitle(book.fb2);
 
-            let title = fb2.bookTitle;
-            if (title)
-                title = `"${title}"`;
-            else
-                title = '';
-
-            let author = '';
-            if (fb2.author) {
-                const authorNames = fb2.author.map(a => _.compact([
-                    a.lastName,
-                    a.firstName,
-                    a.middleName
-                ]).join(' '));
-                author = authorNames.join(', ');
-            } else {//TODO: убрать в будущем
-                author = _.compact([
-                    fb2.lastName,
-                    fb2.firstName,
-                    fb2.middleName
-                ]).join(' ');
-            }
-            author = (author ? author : (fb2.bookTitle ? fb2.bookTitle : book.url));
+            let title = bt.bookTitle;
+            title = (title ? `"${title}"`: '');
+            const author = (bt.author ? bt.author : (bt.bookTitle ? bt.bookTitle : book.url));
 
             result.push({
                 num,
@@ -256,9 +229,11 @@ class RecentBooksPage extends Vue {
                     author,
                     title: `${title}${perc}${textLen}`,
                 },
-                descString: `${author}${title}${perc}${textLen}`,
+                readPart,
+                descString: `${author}${title}${perc}${textLen}`,//для сортировки
                 url: book.url,
                 path: book.path,
+                fullTitle: bt.fullTitle,
                 key: book.key,
             });
         }
@@ -276,6 +251,11 @@ class RecentBooksPage extends Vue {
         this.updating = false;
     }
 
+    resetSearch() {
+        this.search = '';
+        this.$refs.input.focus();
+    }
+
     wordEnding(num) {
         const endings = ['', 'а', 'и', 'и', 'и', '', '', '', '', ''];
         const deci = num % 100;
@@ -291,13 +271,18 @@ class RecentBooksPage extends Vue {
         return `${(this.search ? 'Найдено' : 'Всего')} ${len} книг${this.wordEnding(len)}`;
     }
 
-    async downloadBook(fb2path) {
+    async downloadBook(fb2path, fullTitle) {
         try {
             await readerApi.checkCachedBook(fb2path);
 
             const d = this.$refs.download;
             d.href = fb2path;
-            d.download = path.basename(fb2path).substr(0, 10) + '.fb2';
+            try {
+                const fn = utils.makeValidFilename(fullTitle);
+                d.download = fn.substring(0, 100) + '.fb2';
+            } catch(e) {
+                d.download = path.basename(fb2path).substr(0, 10) + '.fb2';
+            }
 
             d.click();
         } catch (e) {
@@ -308,14 +293,6 @@ class RecentBooksPage extends Vue {
         }
     }
 
-    openOriginal(url) {
-        window.open(url, '_blank');
-    }
-
-    openFb2(path) {
-        window.open(path, '_blank');
-    }
-
     async handleDel(key) {
         await bookManager.delRecentBook({key});
         //this.updateTableData();//обновление уже происходит Reader.bookManagerEvent
@@ -331,7 +308,7 @@ class RecentBooksPage extends Vue {
 
     isUrl(url) {
         if (url)
-            return (url.indexOf('file://') != 0);
+            return (url.indexOf('disk://') != 0);
         else
             return false;
     }
@@ -381,6 +358,10 @@ class RecentBooksPage extends Vue {
     white-space: normal;
 }
 
+.read-bar {
+    height: 3px;
+    background-color: #aaaaaa;
+}
 </style>
 
 <style>

client/components/Reader/ServerStorage/ServerStorage.vue

@@ -216,8 +216,15 @@ class ServerStorage extends Vue {
     }
 
     error(message) {
-        if (this.showServerStorageMessages && !this.offlineModeActive)
-            this.$root.notify.error(message);
+        if (this.showServerStorageMessages && !this.offlineModeActive) {
+            this.errorMessageCounter = (this.errorMessageCounter ? this.errorMessageCounter + 1 : 1);
+            const hint = (this.errorMessageCounter < 2 ? '' :
+                '<div><br>Надоело это сообщение? Добавьте в настройках кнопку "Автономный режим" ' +
+                '<i class="la la-unlink" style="font-size: 20px; color: white"></i> на панель инструментов и активируйте ее.</div>'
+            );
+
+            this.$root.notify.error(message + hint);
+        }
     }
 
     async loadSettings(force = false, doNotifySuccess = true) {
@@ -505,12 +512,12 @@ class ServerStorage extends Vue {
 
                 const md = newRecentMod.data;
                 if (md.key && result[md.key])
-                    result[md.key] = utils.applyObjDiff(result[md.key], md.mod, true);
+                    result[md.key] = utils.applyObjDiff(result[md.key], md.mod, {isAddChanged: true});
 
-                if (!bookManager.loaded) {
+                /*if (!bookManager.loaded) {
                     this.warning('Ожидание загрузки списка книг перед синхронизацией');
                     while (!bookManager.loaded) await utils.sleep(100);
-                }
+                }*/
 
                 if (newRecent.rev != this.cachedRecent.rev)
                     await this.setCachedRecent(newRecent);
@@ -569,7 +576,7 @@ class ServerStorage extends Vue {
 
                 let applyMod = this.cachedRecentMod.data;
                 if (applyMod && applyMod.key && newRecentPatch.data[applyMod.key])
-                    newRecentPatch.data[applyMod.key] = utils.applyObjDiff(newRecentPatch.data[applyMod.key], applyMod.mod, true);
+                    newRecentPatch.data[applyMod.key] = utils.applyObjDiff(newRecentPatch.data[applyMod.key], applyMod.mod, {isAddChanged: true});
 
                 newRecentMod = {rev: this.cachedRecentMod.rev + 1, data: {}};
                 needSaveRecentPatch = true;
@@ -580,8 +587,8 @@ class ServerStorage extends Vue {
             let newRecent = {};
             if (!itemKey || (needSaveRecentPatch && Object.keys(newRecentPatch.data).length > 10)) {
                 //ждем весь bm.recent
-                while (!bookManager.loaded)
-                    await utils.sleep(100);
+                /*while (!bookManager.loaded)
+                    await utils.sleep(100);*/
 
                 newRecent = {rev: this.cachedRecent.rev + 1, data: _.cloneDeep(bm.recent)};
                 newRecentPatch = {rev: this.cachedRecentPatch.rev + 1, data: {}};

client/components/Reader/SettingsPage/SettingsPage.vue

@@ -26,6 +26,7 @@
                     <q-tab class="tab" name="buttons" 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="Конвертир." />
                     <q-tab class="tab" name="others" icon="la la-list-ul" label="Прочее" />
                     <q-tab class="tab" name="reset" icon="la la-broom" label="Сброс" />
                     <div v-show="tabsScrollable" class="q-pt-lg"/>
@@ -53,6 +54,10 @@
                 <div v-if="selectedTab == 'pagemove'" class="fit tab-panel">
                     @@include('./include/PageMoveTab.inc');
                 </div>
+                <!-- Конвертирование ------------------------------------------------------------->
+                <div v-if="selectedTab == 'convert'" class="fit tab-panel">
+                    @@include('./include/ConvertTab.inc');
+                </div>
                 <!-- Прочее ---------------------------------------------------------------------->
                 <div v-if="selectedTab == 'others'" class="fit tab-panel">
                     @@include('./include/OthersTab.inc');
@@ -77,6 +82,7 @@ import * as utils from '../../../share/utils';
 import Window from '../../share/Window.vue';
 import NumInput from '../../share/NumInput.vue';
 import UserHotKeys from './UserHotKeys/UserHotKeys.vue';
+import wallpaperStorage from '../share/wallpaperStorage';
 
 import rstore from '../../../store/modules/reader';
 import defPalette from './defPalette';
@@ -108,8 +114,10 @@ export default @Component({
         },
         vertShift: function(newValue) {
             const font = (this.webFontName ? this.webFontName : this.fontName);
-            this.fontShifts = Object.assign({}, this.fontShifts, {[font]: newValue});
-            this.fontVertShift = newValue;
+            if (this.fontShifts[font] != newValue || this.fontVertShift != newValue) {
+                this.fontShifts = Object.assign({}, this.fontShifts, {[font]: newValue});
+                this.fontVertShift = newValue;
+            }
         },
         fontName: function(newValue) {
             const font = (this.webFontName ? this.webFontName : newValue);
@@ -123,6 +131,10 @@ export default @Component({
             if (newValue != '' && this.pageChangeAnimation == 'flip')
                 this.pageChangeAnimation = '';
         },
+        dualPageMode(newValue) {
+            if (newValue && this.pageChangeAnimation == 'flip' || this.pageChangeAnimation == 'rightShift')
+                this.pageChangeAnimation = '';
+        },
         textColor: function(newValue) {
             this.textColorFiltered = newValue;
         },
@@ -137,11 +149,25 @@ export default @Component({
             if (hex.test(newValue))
                 this.backgroundColor = newValue;
         },
+        dualDivColor(newValue) {
+            this.dualDivColorFiltered = newValue;
+        },
+        dualDivColorFiltered(newValue) {
+            if (hex.test(newValue))
+                this.dualDivColor = newValue;
+        },
+        statusBarColor(newValue) {
+            this.statusBarColorFiltered = newValue;
+        },
+        statusBarColorFiltered(newValue) {
+            if (hex.test(newValue))
+                this.statusBarColor = newValue;
+        },
     },
 })
 class SettingsPage extends Vue {
     selectedTab = 'profiles';
-    selectedViewTab = 'color';
+    selectedViewTab = 'mode';
     selectedKeysTab = 'mouse';
     form = {};
     fontBold = false;
@@ -150,6 +176,7 @@ class SettingsPage extends Vue {
     tabsScrollable = false;
     textColorFiltered = '';
     bgColorFiltered = '';
+    dualDivColorFiltered = '';
 
     webFonts = [];
     fonts = [];
@@ -185,10 +212,18 @@ class SettingsPage extends Vue {
     settingsChanged() {
         if (_.isEqual(this.form, this.settings))
             return;
+
         this.form = Object.assign({}, this.settings);
+        if (!this.unwatch)
+            this.unwatch = {};
+
         for (let prop in rstore.settingDefaults) {
+            if (this.unwatch && this.unwatch[prop])
+                this.unwatch[prop]();
+
             this[prop] = this.form[prop];
-            this.$watch(prop, (newValue) => {
+
+            this.unwatch[prop] = this.$watch(prop, (newValue) => {
                 this.form = Object.assign({}, this.form, {[prop]: newValue});
             });
         }
@@ -202,12 +237,18 @@ class SettingsPage extends Vue {
         this.vertShift = this.fontShifts[font] || 0;
         this.textColorFiltered = this.textColor;
         this.bgColorFiltered = this.backgroundColor;
+        this.dualDivColorFiltered = this.dualDivColor;
+        this.statusBarColorFiltered = this.statusBarColor;
     }
 
     get mode() {
         return this.$store.state.config.mode;
     }
 
+    get isExternalConverter() {
+        return this.$store.state.config.useExternalBookConverter;
+    }
+
     get settings() {
         return this.$store.state.reader.settings;
     }
@@ -237,9 +278,15 @@ class SettingsPage extends Vue {
 
     get wallpaperOptions() {
         let result = [{label: 'Нет', value: ''}];
-        for (let i = 1; i < 10; i++) {
+
+        for (const wp of this.userWallpapers) {
+            result.push({label: wp.label, value: wp.cssClass});
+        }
+
+        for (let i = 1; i <= 17; i++) {
             result.push({label: i, value: `paper${i}`});
         }
+
         return result;
     }
 
@@ -263,13 +310,15 @@ class SettingsPage extends Vue {
         let result = [
             {label: 'Нет', value: ''},
             {label: 'Вверх-вниз', value: 'downShift'},
-            {label: 'Вправо-влево', value: 'rightShift'},
+            (!this.dualPageMode ? {label: 'Вправо-влево', value: 'rightShift'} : null),
             {label: 'Протаивание', value: 'thaw'},
             {label: 'Мерцание', value: 'blink'},
             {label: 'Вращение', value: 'rotate'},
-        ];
-        if (this.wallpaper == '')
-            result.push({label: 'Листание', value: 'flip'});
+            (this.wallpaper == '' && !this.dualPageMode ? {label: 'Листание', value: 'flip'} : null),
+        ];        
+
+        result = result.filter(v => v);
+
         return result;
     }
 
@@ -332,6 +381,12 @@ class SettingsPage extends Vue {
             case 'bg':
                 result += `background-color: ${this.backgroundColor};`
                 break;
+            case 'div':
+                result += `background-color: ${this.dualDivColor};`
+                break;
+            case 'statusbar':
+                result += `background-color: ${this.statusBarColor};`
+                break;
         }
         return result;
     }
@@ -397,7 +452,7 @@ class SettingsPage extends Vue {
             return;
 
         try {
-            const result = await this.$root.stdDialog.prompt(`<b>Предупреждение!</b> Удаление профиля '${this.currentProfile}' необратимо.` +
+            const result = await this.$root.stdDialog.prompt(`<b>Предупреждение!</b> Удаление профиля '${this.$sanitize(this.currentProfile)}' необратимо.` +
                     `<br>Все настройки профиля будут потеряны, однако список читаемых книг сохранится.` +
                     `<br><br>Введите 'да' для подтверждения удаления:`, ' ', {
                 inputValidator: (str) => { if (str && str.toLowerCase() === 'да') return true; else return 'Удаление не подтверждено'; },
@@ -498,6 +553,71 @@ class SettingsPage extends Vue {
 
     }
 
+    loadWallpaperFileClick() {
+        this.$refs.file.click();
+    }
+
+    loadWallpaperFile() {
+        const file = this.$refs.file.files[0];        
+        if (file.size > 10*1024*1024) {
+            this.$root.stdDialog.alert('Файл обоев не должен превышать в размере 10Mb', 'Ошибка');
+            return;
+        }
+
+        if (file.type != 'image/png' && file.type != 'image/jpeg') {
+            this.$root.stdDialog.alert('Файл обоев должен иметь тип PNG или JPEG', 'Ошибка');
+            return;
+        }
+
+        if (this.userWallpapers.length >= 100) {
+            this.$root.stdDialog.alert('Превышено максимальное количество пользовательских обоев.', 'Ошибка');
+            return;
+        }
+
+        this.$refs.file.value = '';
+        if (file) {
+            const reader = new FileReader();
+
+            reader.onload = (e) => {
+                const newUserWallpapers = _.cloneDeep(this.userWallpapers);
+                let n = 0;
+                for (const wp of newUserWallpapers) {
+                    const newN = parseInt(wp.label.replace(/\D/g, ''), 10);
+                    if (newN > n)
+                        n = newN;
+                }
+                n++;
+
+                const cssClass = `user-paper${n}`;
+                newUserWallpapers.push({label: `#${n}`, cssClass});
+                (async() => {
+                    await wallpaperStorage.setData(cssClass, e.target.result);
+
+                    this.userWallpapers = newUserWallpapers;
+                    this.wallpaper = cssClass;
+                })();
+            }
+
+            reader.readAsDataURL(file);
+        }
+    }
+
+    async delWallpaper() {
+        if (this.wallpaper.indexOf('user-paper') == 0) {
+            const newUserWallpapers = [];
+            for (const wp of this.userWallpapers) {
+                if (wp.cssClass != this.wallpaper) {
+                    newUserWallpapers.push(wp);
+                }
+            }
+
+            await wallpaperStorage.removeData(this.wallpaper);
+
+            this.userWallpapers = newUserWallpapers;
+            this.wallpaper = '';
+        }
+    }
+
     keyHook(event) {
         if (!this.$root.stdDialog.active && event.type == 'keydown' && event.key == 'Escape') {
             this.close();
@@ -534,7 +654,7 @@ class SettingsPage extends Vue {
     margin-bottom: 5px;
 }
 
-.label-1 {
+.label-1, .label-7 {
     width: 75px;
 }
 
@@ -546,7 +666,7 @@ class SettingsPage extends Vue {
     width: 100px;
 }
 
-.label-1, .label-2, .label-3, .label-4, .label-5, .label-6 {
+.label-1, .label-2, .label-3, .label-4, .label-5, .label-6, .label-7 {
     display: flex;
     flex-direction: column;
     justify-content: center;

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

@@ -104,8 +104,12 @@ class UserHotKeys extends UserHotKeysProps {
         this.updateTableData();
     }
 
+    get mode() {
+        return this.$store.state.config.mode;
+    }
+
     updateTableData() {
-        let result = rstore.hotKeys.map(hk => hk.name);
+        let result = rstore.hotKeys.map(hk => hk.name).filter(name => (this.mode == 'liberama.top' || name != 'libs'));
 
         const search = this.search.toLowerCase();
         const codesIncludeSearch = (action) => {

client/components/Reader/SettingsPage/include/ConvertTab.inc

@@ -0,0 +1,87 @@
+<!---------------------------------------------->
+<div class="q-mt-sm column items-center">
+    <span>Настройки конвертирования применяются ко всем</span>
+    <span>вновь загружаемым или обновляемым файлам</span>
+</div>
+
+<!---------------------------------------------->
+<div class="part-header">HTML, XML, TXT</div>
+
+<div class="item row">
+    <div class="label-7">Текст</div>
+    <div class="col row">
+        <q-checkbox v-model="splitToPara" size="xs" label="Попытаться разбить текст на параграфы">
+            <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
+                Опция принудительно включает эвристику разбиения текста на<br>
+                параграфы в случае, если формат файла определен как html,<br>
+                xml или txt. Возможна нечитабельная разметка текста.
+            </q-tooltip>
+        </q-checkbox>
+    </div>
+</div>
+
+<div class="item row">
+    <div class="label-7">Сайты</div>
+    <div class="col row">
+        <q-checkbox v-model="enableSitesFilter" size="xs" label="Включить html-фильтр для сайтов">
+            <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
+                Html-фильтр вырезает лишние элементы со<br>
+                страницы для определенных сайтов, таких как:<br>
+                samlib.ru<br>
+                www.fanfiction.net<br>
+                archiveofourown.org<br>
+                и других
+            </q-tooltip>
+        </q-checkbox>
+    </div>
+</div>
+
+<!---------------------------------------------->
+<div v-if="isExternalConverter">
+    <div class="part-header">PDF</div>
+
+    <div class="item row">
+        <div class="label-7">Формат</div>
+        <div class="col row">
+            <q-checkbox v-model="pdfAsText" size="xs" label="Извлекать текст из PDF">
+                <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
+                    Пытается извлечь текст из pdf-файла и переразбить на параграфы.<br>
+                    Размер получаемого fb2-файла при этом относительно небольшой.<br>
+                    При отключении этой опции, pdf будет представлен как набор<br>
+                    изображений (аналогично ковертированию djvu).
+                </q-tooltip>
+            </q-checkbox>
+        </div>
+    </div>
+
+    <div class="item row">
+        <div class="label-7">Качество</div>
+        <div class="col row">
+            <NumInput class="col-5" v-model="pdfQuality" :min="10" :max="100" :disable="pdfAsText" >
+                <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
+                    Качество конвертирования Pdf в Fb2. Чем значение выше, тем больше<br>
+                    размер итогового файла. Если сервер отказывается конвертировать<br>
+                    слишком большой файл, то попробуйте понизить качество.
+                </q-tooltip>
+            </NumInput>
+        </div>
+    </div>
+</div>
+
+<!---------------------------------------------->
+<div v-if="isExternalConverter">
+    <div class="part-header">DJVU</div>
+
+    <div class="item row">
+        <div class="label-7">Качество</div>
+        <div class="col row">
+            <NumInput class="col-5" v-model="djvuQuality" :min="10" :max="100">
+                <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
+                    Качество конвертирования Djvu в Fb2. Чем значение выше, тем больше<br>
+                    размер итогового файла. Если сервер отказывается конвертировать<br>
+                    слишком большой файл, то попробуйте понизить качество.
+                </q-tooltip>
+            </NumInput>
+        </div>
+    </div>
+</div>

client/components/Reader/SettingsPage/include/OthersTab.inc

@@ -36,7 +36,18 @@
         Показывать уведомление "Что нового"
         <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
             Показывать уведомления "Что нового"<br>
-            при каждом выходе новой версии читалки
+            при появлении новой версии читалки
+        </q-tooltip>
+    </q-checkbox>
+</div>
+
+<div class="item row">
+    <div class="label-6">Уведомление</div>
+    <q-checkbox size="xs" v-model="showNeedUpdateNotify">
+        Показывать уведомление о новой версии
+        <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
+            Напоминать о необходимости обновления страницы<br>
+            при появлении новой версии читалки
         </q-tooltip>
     </q-checkbox>
 </div>
@@ -54,22 +65,6 @@
 <!---------------------------------------------->
 <div class="part-header">Другое</div>
 
-<div class="item row">
-    <div class="label-6">Обработка</div>
-    <div class="col row">
-        <q-checkbox v-model="enableSitesFilter" @input="needTextReload" size="xs" label="Включить html-фильтр для сайтов">
-            <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
-                Html-фильтр вырезает лишние элементы со<br>
-                страницы для определенных сайтов, таких как:<br>
-                samlib.ru<br>
-                www.fanfiction.net<br>
-                archiveofourown.org<br>
-                и других
-            </q-tooltip>
-        </q-checkbox>
-    </div>
-</div>
-
 <div class="item row">
     <div class="label-6">Обработка</div>
     <q-checkbox size="xs" v-model="lazyParseEnabled" label="Предварительная подготовка текста">

client/components/Reader/SettingsPage/include/ProfilesTab.inc

@@ -22,7 +22,7 @@
             <q-select v-model="currentProfile" :options="currentProfileOptions"
                 style="width: 275px"
                 dropdown-icon="la la-angle-down la-sm"
-                outlined dense emit-value map-options
+                outlined dense emit-value map-options display-value-sanitize options-sanitize
             />
         </div>
     </div>

client/components/Reader/SettingsPage/include/ViewTab.inc

@@ -7,6 +7,7 @@
     no-caps
     class="no-mp bg-grey-4 text-grey-7"
 >
+    <q-tab name="mode" label="Режим" />
     <q-tab name="color" label="Цвет" />
     <q-tab name="font" label="Шрифт" />
     <q-tab name="text" label="Текст" />
@@ -16,6 +17,10 @@
 <div class="q-mb-sm"/>
 
 <div class="col tab-panel">
+    <div v-if="selectedViewTab == 'mode'">
+        @@include('./ViewTab/Mode.inc');
+    </div>
+
     <div v-if="selectedViewTab == 'color'">
         @@include('./ViewTab/Color.inc');
     </div>

client/components/Reader/SettingsPage/include/ViewTab/Color.inc

@@ -22,8 +22,6 @@
                 </q-icon>
             </template>
         </q-input>
-
-        <span class="col" style="position: relative; top: 35px; left: 15px;">Обои:</span>
     </div>
 </div>
 
@@ -36,7 +34,6 @@
             v-model="bgColorFiltered"
             :rules="['hexColor']"
             style="max-width: 150px"
-            :disable="wallpaper != ''"
         >
             <template v-slot:prepend>
                 <q-icon name="la la-angle-down la-xs" class="cursor-pointer text-white" :style="colorPanStyle('bg')">
@@ -48,11 +45,51 @@
                 </q-icon>
             </template>
         </q-input>
-
-        <div class="q-px-sm"/>
-        <q-select class="col" v-model="wallpaper" :options="wallpaperOptions"
-            dropdown-icon="la la-angle-down la-sm"
-            outlined dense emit-value map-options
-        />
     </div>
 </div>
+
+<div class="q-mt-md"/>
+<div class="item row">
+    <div class="label-2">Обои</div>
+    <div class="col row items-center">
+        <q-select class="col-left no-mp" v-model="wallpaper" :options="wallpaperOptions"
+            dropdown-icon="la la-angle-down la-sm"
+            outlined dense emit-value map-options
+        >
+            <template v-slot:selected-item="scope">
+                <div >{{ scope.opt.label }}</div>
+                <div v-show="scope.opt.value" class="q-ml-sm" :class="scope.opt.value" style="width: 50px; height: 30px;"></div>
+            </template>
+
+            <template v-slot:option="scope">
+                <q-item
+                    v-bind="scope.itemProps"
+                    v-on="scope.itemEvents"
+                >
+                    <q-item-section>
+                        <q-item-label v-html="scope.opt.label" />
+                    </q-item-section>
+                    <q-item-section v-show="scope.opt.value" :class="scope.opt.value" style="min-width: 70px; min-height: 50px"/>
+                </q-item>
+            </template>
+        </q-select>
+
+        <div class="q-px-xs"/>
+        <q-btn class="q-ml-sm" round dense color="blue" icon="la la-plus" @click.stop="loadWallpaperFileClick">
+            <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Добавить файл обоев</q-tooltip>
+        </q-btn>
+        <q-btn class="q-ml-sm" round dense color="blue" icon="la la-minus" @click.stop="delWallpaper" :disable="wallpaper.indexOf('user-paper') != 0">
+            <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Удалить выбранные обои</q-tooltip>
+        </q-btn>
+    </div>
+</div>
+
+<div class="q-mt-sm"/>
+<div class="item row">
+    <div class="label-2"></div>
+    <div class="col row items-center">
+        <q-checkbox v-model="wallpaperIgnoreStatusBar" size="xs" label="Не включать строку статуса в обои" />
+    </div>
+</div>
+
+<input type="file" ref="file" @change="loadWallpaperFile" style='display: none;'/>

client/components/Reader/SettingsPage/include/ViewTab/Mode.inc

@@ -0,0 +1,124 @@
+<!---------------------------------------------->
+<div class="hidden part-header">Режим</div>
+
+<div class="item row">
+    <div class="label-2"></div>
+    <div class="col row">
+        <q-checkbox v-model="dualPageMode" size="xs" label="Двухстраничный режим" />
+    </div>
+</div>
+
+<div class="part-header">Страницы</div>
+<div class="item row">
+    <div class="label-2">Отступ границ</div>
+    <div class="col row">
+        <NumInput class="col-left" v-model="indentLR" :min="0" :max="2000">
+            <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
+                Слева/справа от края экрана
+            </q-tooltip>
+        </NumInput>
+        <div class="q-px-sm"/>
+        <NumInput class="col" v-model="indentTB" :min="0" :max="2000">
+            <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
+                Сверху/снизу от края экрана
+            </q-tooltip>
+        </NumInput>
+    </div>
+</div>
+
+<div v-show="dualPageMode" class="item row">
+    <div class="label-2">Отступ внутри</div>
+    <div class="col row">
+        <NumInput class="col-left" v-model="dualIndentLR" :min="0" :max="2000">
+            <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
+                Слева/справа внутри страницы
+            </q-tooltip>
+        </NumInput>
+    </div>
+</div>
+
+<div v-show="dualPageMode">
+    <div class="part-header">Разделитель</div>
+
+    <div class="item row no-wrap">
+        <div class="label-2">Цвет</div>
+        <div class="col-left row">
+            <q-input class="col-left no-mp"
+                outlined dense
+                v-model="dualDivColorFiltered"
+                :rules="['hexColor']"
+                style="max-width: 150px"
+                :disable="dualDivColorAsText"
+            >
+                <template v-slot:prepend>
+                    <q-icon name="la la-angle-down la-xs" class="cursor-pointer text-white" :style="colorPanStyle('div')">
+                        <q-popup-proxy anchor="bottom middle" self="top middle">
+                            <div>
+                                <q-color v-model="dualDivColor"
+                                    no-header default-view="palette" :palette="predefineTextColors"
+                                />
+                            </div>
+                        </q-popup-proxy>
+                    </q-icon>
+                </template>
+            </q-input>
+        </div>
+        
+        <div class="q-px-xs"/>
+        <q-checkbox v-model="dualDivColorAsText" size="xs" label="Как у текста" />
+    </div>
+
+    <div class="item row">
+        <div class="label-2">Прозрачность</div>
+        <div class="col row">
+            <NumInput class="col-left" v-model="dualDivColorAlpha" :min="0" :max="1" :digits="2" :step="0.1"/>
+        </div>
+    </div>
+
+    <div class="item row">
+        <div class="label-2">Ширина (px)</div>
+        <div class="col row">
+            <NumInput class="col-left" v-model="dualDivWidth" :min="0" :max="100">
+                <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
+                    Ширина разделителя
+                </q-tooltip>
+            </NumInput>
+        </div>
+    </div>
+
+    <div class="item row">
+        <div class="label-2">Высота (%)</div>
+        <div class="col row">
+            <NumInput class="col-left" v-model="dualDivHeight" :min="0" :max="100">
+                <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
+                    Высота разделителя
+                </q-tooltip>
+            </NumInput>
+        </div>
+    </div>
+
+    <div class="item row">
+        <div class="label-2">Пунктир</div>
+        <div class="col row">
+            <NumInput class="col-left" v-model="dualDivStrokeFill" :min="0" :max="2000">
+                <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
+                    Заполнение пунктира
+                </q-tooltip>
+            </NumInput>
+            <div class="q-px-sm"/>
+            <NumInput class="col" v-model="dualDivStrokeGap" :min="0" :max="2000">
+                <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
+                    Промежуток пунктира
+                </q-tooltip>
+            </NumInput>
+        </div>
+    </div>
+
+    <div class="item row">
+        <div class="label-2">Ширина тени</div>
+        <div class="col row">
+            <NumInput class="col-left" v-model="dualDivShadowWidth" :min="0" :max="100"/>
+        </div>
+    </div>    
+
+</div>

client/components/Reader/SettingsPage/include/ViewTab/Status.inc

@@ -5,25 +5,53 @@
     <div class="label-2">Статус</div>
     <div class="col row">
         <q-checkbox v-model="showStatusBar" size="xs" label="Показывать" />
-        <q-checkbox class="q-ml-sm" v-model="statusBarTop" size="xs" :disable="!showStatusBar" label="Вверху/внизу" />
+        <q-checkbox v-show="showStatusBar" class="q-ml-sm" v-model="statusBarTop" size="xs" label="Вверху/внизу" />
     </div>
 </div>
 
-<div class="item row">
-    <div class="label-2">Высота</div>
-    <div class="col row">
-        <NumInput class="col-left" v-model="statusBarHeight" :min="5" :max="100" :disable="!showStatusBar"/>
+<div v-show="showStatusBar" class="item row no-wrap">
+    <div class="label-2">Цвет</div>
+    <div class="col-left row">
+        <q-input class="col-left no-mp"
+            outlined dense
+            v-model="statusBarColorFiltered"
+            :rules="['hexColor']"
+            style="max-width: 150px"
+            :disable="statusBarColorAsText"
+        >
+            <template v-slot:prepend>
+                <q-icon name="la la-angle-down la-xs" class="cursor-pointer text-white" :style="colorPanStyle('statusbar')">
+                    <q-popup-proxy anchor="bottom middle" self="top middle">
+                        <div>
+                            <q-color v-model="statusBarColor"
+                                no-header default-view="palette" :palette="predefineTextColors"
+                            />
+                        </div>
+                    </q-popup-proxy>
+                </q-icon>
+            </template>
+        </q-input>
     </div>
+    
+    <div class="q-px-xs"/>
+    <q-checkbox v-model="statusBarColorAsText" size="xs" label="Как у текста"/>
 </div>
 
-<div class="item row">
+<div v-show="showStatusBar" class="item row">
     <div class="label-2">Прозрачность</div>
     <div class="col row">
-        <NumInput class="col-left" v-model="statusBarColorAlpha" :min="0" :max="1" :digits="2" :step="0.1" :disable="!showStatusBar"/>
+        <NumInput class="col-left" v-model="statusBarColorAlpha" :min="0" :max="1" :digits="2" :step="0.1"/>
     </div>
 </div>
 
-<div class="item row">
+<div v-show="showStatusBar" class="item row">
+    <div class="label-2">Высота</div>
+    <div class="col row">
+        <NumInput class="col-left" v-model="statusBarHeight" :min="5" :max="100"/>
+    </div>
+</div>
+
+<div v-show="showStatusBar" class="item row">
     <div class="label-2"></div>
     <div class="col row">
         <q-checkbox v-model="statusBarClickOpen" size="xs" label="Открывать оригинал по клику">

client/components/Reader/SettingsPage/include/ViewTab/Text.inc

@@ -15,23 +15,6 @@
     </div>
 </div>
 
-<div class="item row">
-    <div class="label-2">Отступ</div>
-    <div class="col row">
-        <NumInput class="col-left" v-model="indentLR" :min="0" :max="2000">
-            <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
-                Слева/справа
-            </q-tooltip>
-        </NumInput>
-        <div class="q-px-sm"/>
-        <NumInput class="col" v-model="indentTB" :min="0" :max="2000">
-            <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
-                Сверху/снизу
-            </q-tooltip>
-        </NumInput>
-    </div>
-</div>
-
 <div class="item row">
     <div class="label-2">Сдвиг</div>
     <div class="col row">
@@ -123,7 +106,7 @@
 <div class="item row">
     <div class="label-2"></div>
     <div class="col row">
-        <q-checkbox v-model="imageFitWidth" :disable="!showImages" size="xs" label="Ширина не более размера экрана" />
+        <q-checkbox v-model="imageFitWidth" size="xs" label="Ширина не более размера страницы" :disable="!showImages || dualPageMode"/>
     </div>
 </div>
 

client/components/Reader/TextPage/DrawHelper.js

@@ -19,6 +19,109 @@ export default class DrawHelper {
         return this.context.measureText(text).width;
     }
 
+    drawLine(line, lineIndex, baseLineIndex, sel, imageDrawn) {
+        /* line:
+        {
+            begin: Number,
+            end: Number,
+            first: Boolean,
+            last: Boolean,
+            parts: array of {
+                style: {bold: Boolean, italic: Boolean, center: Boolean},
+                image: {local: Boolean, inline: Boolean, id: String, imageLine: Number, lineCount: Number, paraIndex: Number},
+                text: String,
+            }            
+        }*/
+
+        let out = '<div>';
+
+        let lineText = '';
+        let center = false;
+        let space = 0;
+        let j = 0;
+        //формируем строку
+        for (const part of line.parts) {
+            let tOpen = '';
+            tOpen += (part.style.bold ? '<b>' : '');
+            tOpen += (part.style.italic ? '<i>' : '');
+            tOpen += (part.style.sup ? '<span style="vertical-align: baseline; position: relative; line-height: 0; top: -0.3em">' : '');
+            tOpen += (part.style.sub ? '<span style="vertical-align: baseline; position: relative; line-height: 0; top: 0.3em">' : '');
+            let tClose = '';
+            tClose += (part.style.sub ? '</span>' : '');
+            tClose += (part.style.sup ? '</span>' : '');
+            tClose += (part.style.italic ? '</i>' : '');
+            tClose += (part.style.bold ? '</b>' : '');
+
+            let text = '';
+            if (lineIndex == 0 && this.searching) {
+                for (let k = 0; k < part.text.length; k++) {
+                    text += (sel.has(j) ? `<ins>${part.text[k]}</ins>` : part.text[k]);
+                    j++;
+                }
+            } else
+                text = part.text;
+
+            if (text && text.trim() == '')
+                text = `<span style="white-space: pre">${text}</span>`;
+
+            lineText += `${tOpen}${text}${tClose}`;
+
+            center = center || part.style.center;
+            space = (part.style.space > space ? part.style.space : space);
+
+            //избражения
+            //image: {local: Boolean, inline: Boolean, id: String, imageLine: Number, lineCount: Number, paraIndex: Number, w: Number, h: Number},
+            const img = part.image;
+            if (img && img.id && !img.inline && !imageDrawn.has(img.paraIndex)) {
+                const bin = this.parsed.binary[img.id];
+                if (bin) {
+                    let resize = '';                        
+                    if (bin.h > img.h) {
+                        resize = `height: ${img.h}px`;
+                    }
+
+                    const left = (this.w - img.w)/2;
+                    const top = ((img.lineCount*this.lineHeight - img.h)/2) + (lineIndex - baseLineIndex - img.imageLine)*this.lineHeight;
+                    if (img.local) {
+                        lineText += `<img src="data:${bin.type};base64,${bin.data}" style="position: absolute; left: ${left}px; top: ${top}px; ${resize}"/>`;
+                    } else {
+                        lineText += `<img src="${img.id}" style="position: absolute; left: ${left}px; top: ${top}px; ${resize}"/>`;
+                    }
+                }
+                imageDrawn.add(img.paraIndex);
+            }
+
+            if (img && img.id && img.inline) {
+                if (img.local) {
+                    const bin = this.parsed.binary[img.id];
+                    if (bin) {
+                        let resize = '';
+                        if (bin.h > this.fontSize) {
+                            resize = `height: ${this.fontSize - 3}px`;
+                        }
+                        lineText += `<img src="data:${bin.type};base64,${bin.data}" style="${resize}"/>`;
+                    }
+                } else {
+                    //
+                }
+            }
+        }
+
+        const centerStyle = (center ? `text-align: center; text-align-last: center; width: ${this.w}px` : '')
+        if ((line.first || space) && !center) {
+            let p = (line.first ? this.p : 0);
+            p = (space ? p + this.p*space : p);
+            lineText = `<span style="display: inline-block; margin-left: ${p}px"></span>${lineText}`;
+        }
+
+        if (line.last || center)
+            lineText = `<span style="display: inline-block; ${centerStyle}">${lineText}</span>`;
+
+        out += lineText + '</div>';
+
+        return out;
+    }
+
     drawPage(lines, isScrolling) {
         if (!this.lastBook || this.pageLineCount < 1 || !this.book || !lines || !this.parsed.textLength)
             return '';
@@ -26,140 +129,78 @@ export default class DrawHelper {
         const font = this.fontByStyle({});
         const justify = (this.textAlignJustify ? 'text-align: justify; text-align-last: justify;' : '');
 
-        let out = `<div style="width: ${this.w}px; height: ${this.h + (isScrolling ? this.lineHeight : 0)}px;` + 
+        const boxH = this.h + (isScrolling ? this.lineHeight : 0);
+        let out = `<div class="row no-wrap" style="width: ${this.boxW}px; height: ${boxH}px;` + 
             ` position: absolute; top: ${this.fontSize*this.textShift}px; color: ${this.textColor}; font: ${font}; ${justify}` +
             ` line-height: ${this.lineHeight}px; white-space: nowrap;">`;
 
-        let imageDrawn = new Set();
+        let imageDrawn1 = new Set();
+        let imageDrawn2 = new Set();
         let len = lines.length;
         const lineCount = this.pageLineCount + (isScrolling ? 1 : 0);
         len = (len > lineCount ? lineCount : len);
 
-        for (let i = 0; i < len; i++) {
-            const line = lines[i];
-            /* line:
-            {
-                begin: Number,
-                end: Number,
-                first: Boolean,
-                last: Boolean,
-                parts: array of {
-                    style: {bold: Boolean, italic: Boolean, center: Boolean},
-                    image: {local: Boolean, inline: Boolean, id: String, imageLine: Number, lineCount: Number, paraIndex: Number},
-                    text: String,
-                }
-            }*/
-            let sel = new Set();
-            //поиск
-            if (i == 0 && this.searching) {
-                let pureText = '';
-                for (const part of line.parts) {
-                    pureText += part.text;
-                }
-
-                pureText = pureText.toLowerCase();
-                let j = 0;
-                while (1) {// eslint-disable-line no-constant-condition
-                    j = pureText.indexOf(this.needle, j);
-                    if (j >= 0) {
-                        for (let k = 0; k < this.needle.length; k++) {
-                            sel.add(j + k);
-                        }
-                    } else
-                        break;
-                    j++;
-                }
+        //поиск
+        let sel = new Set();
+        if (len > 0 && this.searching) {
+            const line = lines[0];
+            let pureText = '';
+            for (const part of line.parts) {
+                pureText += part.text;
             }
 
-            let lineText = '';
-            let center = false;
-            let space = 0;
+            pureText = pureText.toLowerCase();
             let j = 0;
-            //формируем строку
-            for (const part of line.parts) {
-                let tOpen = (part.style.bold ? '<b>' : '');
-                tOpen += (part.style.italic ? '<i>' : '');
-                let tClose = (part.style.italic ? '</i>' : '');
-                tClose += (part.style.bold ? '</b>' : '');
-
-                let text = '';
-                if (i == 0 && this.searching) {
-                    for (let k = 0; k < part.text.length; k++) {
-                        text += (sel.has(j) ? `<ins>${part.text[k]}</ins>` : part.text[k]);
-                        j++;
+            while (1) {// eslint-disable-line no-constant-condition
+                j = pureText.indexOf(this.needle, j);
+                if (j >= 0) {
+                    for (let k = 0; k < this.needle.length; k++) {
+                        sel.add(j + k);
                     }
                 } else
-                    text = part.text;
-
-                if (text && text.trim() == '')
-                    text = `<span style="white-space: pre">${text}</span>`;
-
-                lineText += `${tOpen}${text}${tClose}`;
-
-                center = center || part.style.center;
-                space = (part.style.space > space ? part.style.space : space);
-
-                //избражения
-                //image: {local: Boolean, inline: Boolean, id: String, imageLine: Number, lineCount: Number, paraIndex: Number, w: Number, h: Number},
-                const img = part.image;
-                if (img && img.id && !img.inline && !imageDrawn.has(img.paraIndex)) {
-                    const bin = this.parsed.binary[img.id];
-                    if (bin) {
-                        let resize = '';                        
-                        if (bin.h > img.h) {
-                            resize = `height: ${img.h}px`;
-                        }
-
-                        const left = (this.w - img.w)/2;
-                        const top = ((img.lineCount*this.lineHeight - img.h)/2) + (i - img.imageLine)*this.lineHeight;
-                        if (img.local) {
-                            lineText += `<img src="data:${bin.type};base64,${bin.data}" style="position: absolute; left: ${left}px; top: ${top}px; ${resize}"/>`;
-                        } else {
-                            lineText += `<img src="${img.id}" style="position: absolute; left: ${left}px; top: ${top}px; ${resize}"/>`;
-                        }
-                    }
-                    imageDrawn.add(img.paraIndex);
-                }
-
-                if (img && img.id && img.inline) {
-                    if (img.local) {
-                        const bin = this.parsed.binary[img.id];
-                        if (bin) {
-                            let resize = '';
-                            if (bin.h > this.fontSize) {
-                                resize = `height: ${this.fontSize - 3}px`;
-                            }
-                            lineText += `<img src="data:${bin.type};base64,${bin.data}" style="${resize}"/>`;
-                        }
-                    } else {
-                        //
-                    }
-                }
+                    break;
+                j++;
             }
+        }
 
-            const centerStyle = (center ? `text-align: center; text-align-last: center; width: ${this.w}px` : '')
-            if ((line.first || space) && !center) {
-                let p = (line.first ? this.p : 0);
-                p = (space ? p + this.p*space : p);
-                lineText = `<span style="display: inline-block; margin-left: ${p}px"></span>${lineText}`;
+        //отрисовка строк
+        if (!this.dualPageMode) {
+            out += `<div class="fit">`;
+            for (let i = 0; i < len; i++) {
+                out += this.drawLine(lines[i], i, 0, sel, imageDrawn1);
             }
+            out += `</div>`;
+        } else {
+            //левая страница
+            out += `<div style="width: ${this.w}px; margin-left: ${this.dualIndentLR}px; position: relative;">`;
+            const l2 = (this.pageRowsCount > len ? len : this.pageRowsCount);
+            for (let i = 0; i < l2; i++) {
+                out += this.drawLine(lines[i], i, 0, sel, imageDrawn1);
+            }
+            out += '</div>';
 
-            if (line.last || center)
-                lineText = `<span style="display: inline-block; ${centerStyle}">${lineText}</span>`;
+            //разделитель
+            out += `<div style="width: ${this.dualIndentLR*2}px;"></div>`;
 
-            out += (i > 0 ? '<br>' : '') + lineText;
+            //правая страница
+            out += `<div style="width: ${this.w}px; margin-right: ${this.dualIndentLR}px; position: relative;">`;
+            for (let i = l2; i < len; i++) {
+                out += this.drawLine(lines[i], i, l2, sel, imageDrawn2);
+            }
+            out += '</div>';
         }
 
         out += '</div>';
         return out;
     }
 
-    drawPercentBar(x, y, w, h, font, fontSize, bookPos, textLength) {
+    drawPercentBar(x, y, w, h, font, fontSize, bookPos, textLength, imageNum, imageLength) {
         const pad = 3;
         const fh = h - 2*pad;
         const fh2 = fh/2;
 
-        const t1 = `${Math.floor((bookPos + 1)/1000)}k/${Math.floor(textLength/1000)}k`;
+        const tImg = (imageNum > 0 ? ` (${imageNum}/${imageLength})` : '');
+        const t1 = `${Math.floor((bookPos + 1)/1000)}/${Math.floor(textLength/1000)}${tImg}`;
         const w1 = this.measureTextFont(t1, font) + fh2;
         const read = (bookPos + 1)/textLength;
         const t2 = `${(read*100).toFixed(2)}%`;
@@ -172,8 +213,8 @@ export default class DrawHelper {
         
         if (w1 + w2 + w3 <= w && w3 > (10 + fh2)) {
             const barWidth = w - w1 - w2 - fh2;
-            out += this.strokeRect(x + w1, y + pad, barWidth, fh - 2, this.statusBarColor);
-            out += this.fillRect(x + w1 + 2, y + pad + 2, (barWidth - 4)*read, fh - 6, this.statusBarColor);
+            out += this.strokeRect(x + w1, y + pad, barWidth, fh - 2, this.statusBarRgbaColor);
+            out += this.fillRect(x + w1 + 2, y + pad + 2, (barWidth - 4)*read, fh - 6, this.statusBarRgbaColor);
         }
 
         if (w1 <= w)
@@ -182,16 +223,16 @@ export default class DrawHelper {
         return out;
     }
 
-    drawStatusBar(statusBarTop, statusBarHeight, bookPos, textLength, title) {
+    drawStatusBar(statusBarTop, statusBarHeight, bookPos, textLength, title, imageNum, imageLength) {
 
         let out = `<div class="layout" style="` + 
             `width: ${this.realWidth}px; height: ${statusBarHeight}px; ` + 
-            `color: ${this.statusBarColor}">`;
+            `color: ${this.statusBarRgbaColor}">`;
 
         const fontSize = statusBarHeight*0.75;
         const font = 'bold ' + this.fontBySize(fontSize);
 
-        out += this.fillRect(0, (statusBarTop ? statusBarHeight : 0), this.realWidth, 1, this.statusBarColor);
+        out += this.fillRect(0, (statusBarTop ? statusBarHeight : 0), this.realWidth, 1, this.statusBarRgbaColor);
 
         const date = new Date();
         const time = `${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}`;
@@ -200,7 +241,7 @@ export default class DrawHelper {
 
         out += this.fillTextShift(this.fittingString(title, this.realWidth/2 - fontSize - 3, font), fontSize, 2, font, fontSize);
 
-        out += this.drawPercentBar(this.realWidth/2, 2, this.realWidth/2 - timeW - 2*fontSize, statusBarHeight, font, fontSize, bookPos, textLength);
+        out += this.drawPercentBar(this.realWidth/2 + fontSize, 2, this.realWidth/2 - timeW - 3*fontSize, statusBarHeight, font, fontSize, bookPos, textLength, imageNum, imageLength);
         
         out += '</div>';
         return out;
@@ -267,7 +308,7 @@ export default class DrawHelper {
     }
 
     async doPageAnimationRightShift(page1, page2, duration, isDown, animation1Finish) {
-        const s = this.w + this.fontSize;
+        const s = this.boxW + this.fontSize;
 
         if (isDown) {
             page1.style.transform = `translateX(${s}px)`;

client/components/Reader/TextPage/TextPage.css

@@ -0,0 +1,93 @@
+@keyframes page1-animation-thaw {
+    0%   { opacity: 0; }
+    100% { opacity: 1; }
+}
+
+@keyframes page2-animation-thaw {
+    0%   { opacity: 1; }
+    100% { opacity: 0; }
+}
+
+.paper1 {
+    background: url("images/paper1.jpg") center;
+    background-size: 100% 100%;
+}
+
+.paper2 {
+    background: url("images/paper2.jpg") center;
+    background-size: 100% 100%;
+}
+
+.paper3 {
+    background: url("images/paper3.jpg") center;
+    background-size: 100% 100%;
+}
+
+.paper4 {
+    background: url("images/paper4.jpg") center;
+    background-size: 100% 100%;
+}
+
+.paper5 {
+    background: url("images/paper5.jpg") center;
+    background-size: 100% 100%;
+}
+
+.paper6 {
+    background: url("images/paper6.jpg") center;
+    background-size: 100% 100%;
+}
+
+.paper7 {
+    background: url("images/paper7.jpg") center;
+    background-size: 100% 100%;
+}
+
+.paper8 {
+    background: url("images/paper8.jpg") center;
+    background-size: 100% 100%;
+}
+
+.paper9 {
+    background: url("images/paper9.jpg");
+}
+
+.paper10 {
+    background: url("images/paper10.png") center;
+    background-size: 100% 100%;
+}
+
+.paper11 {
+    background: url("images/paper11.png") center;
+    background-size: 100% 100%;
+}
+
+.paper12 {
+    background: url("images/paper12.png") center;
+    background-size: 100% 100%;
+}
+
+.paper13 {
+    background: url("images/paper13.png") center;
+    background-size: 100% 100%;
+}
+
+.paper14 {
+    background: url("images/paper14.png") center;
+    background-size: 100% 100%;
+}
+
+.paper15 {
+    background: url("images/paper15.png") center;
+    background-size: 100% 100%;
+}
+
+.paper16 {
+    background: url("images/paper16.png") center;
+    background-size: 100% 100%;
+}
+
+.paper17 {
+    background: url("images/paper17.png") center;
+    background-size: 100% 100%;
+}

client/components/Reader/TextPage/TextPage.vue

@@ -1,8 +1,8 @@
 <template>
     <div ref="main" class="main">
         <div class="layout back" @wheel.prevent.stop="onMouseWheel">
-            <div v-html="background"></div>
-            <!-- img -->
+            <div class="absolute" v-html="background"></div>
+            <div class="absolute" v-html="pageDivider"></div>
         </div>
         <div ref="scrollBox1" class="layout over-hidden" @wheel.prevent.stop="onMouseWheel">
             <div ref="scrollingPage1" class="layout over-hidden" @transitionend="onPage1TransitionEnd" @animationend="onPage1AnimationEnd">
@@ -27,7 +27,7 @@
         <div v-show="!clickControl && showStatusBar && statusBarClickOpen" class="layout" v-html="statusBarClickable" @mousedown.prevent.stop @touchstart.stop
             @click.prevent.stop="onStatusBarClick">
         </div>
-        <!-- невидимым делать нельзя, вовремя не подгружаютя шрифты -->
+        <!-- невидимым делать нельзя (display: none), вовремя не подгружаютя шрифты -->
         <canvas ref="offscreenCanvas" class="layout" style="visibility: hidden"></canvas>
         <div ref="measureWidth" style="position: absolute; visibility: hidden"></div>
     </div>
@@ -40,8 +40,13 @@ import Component from 'vue-class-component';
 import {loadCSS} from 'fg-loadcss';
 import _ from 'lodash';
 
-import {sleep} from '../../../share/utils';
+import './TextPage.css';
+
+import * as utils from '../../../share/utils';
+import dynamicCss from '../../../share/dynamicCss';
+
 import bookManager from '../share/bookManager';
+import wallpaperStorage from '../share/wallpaperStorage';
 import DrawHelper from './DrawHelper';
 import rstore from '../../../store/modules/reader';
 import {clickMap} from '../share/clickMap';
@@ -74,6 +79,7 @@ class TextPage extends Vue {
     clickControl = true;
 
     background = null;
+    pageDivider = null;
     page1 = null;
     page2 = null;
     statusBar = null;
@@ -110,7 +116,11 @@ class TextPage extends Vue {
 
         this.debouncedDrawStatusBar = _.throttle(() => {
             this.drawStatusBar();
-        }, 60);        
+        }, 60);
+
+        this.debouncedDrawPageDividerAndOrnament = _.throttle(() => {
+            this.drawPageDividerAndOrnament();
+        }, 65);
 
         this.debouncedLoadSettings = _.debounce(() => {
             this.loadSettings();
@@ -134,7 +144,7 @@ class TextPage extends Vue {
 
         this.$root.$on('resize', async() => {
             this.$nextTick(this.onResize);
-            await sleep(500);
+            await utils.sleep(500);
             this.$nextTick(this.onResize);
         });
     }
@@ -161,14 +171,16 @@ class TextPage extends Vue {
         this.$refs.layoutEvents.style.width = this.realWidth + 'px';
         this.$refs.layoutEvents.style.height = this.realHeight + 'px';
 
-        this.w = this.realWidth - 2*this.indentLR;
+        const dual = (this.dualPageMode ? 2 : 1);
+        this.boxW = this.realWidth - 2*this.indentLR;
+        this.w = this.boxW/dual - (this.dualPageMode ? 2*this.dualIndentLR : 0);
+
         this.scrollHeight = this.realHeight - (this.showStatusBar ? this.statusBarHeight : 0);
         this.h = this.scrollHeight - 2*this.indentTB;
-        this.lineHeight = this.fontSize + this.lineInterval;
-        this.pageLineCount = 1 + Math.floor((this.h - this.lineHeight + this.lineInterval/2)/this.lineHeight);
 
-        this.$refs.scrollingPage1.style.width = this.w + 'px';
-        this.$refs.scrollingPage2.style.width = this.w + 'px';
+        this.lineHeight = this.fontSize + this.lineInterval;
+        this.pageRowsCount = 1 + Math.floor((this.h - this.lineHeight + this.lineInterval/2)/this.lineHeight);
+        this.pageLineCount = (this.dualPageMode ? this.pageRowsCount*2 : this.pageRowsCount)
 
         //stuff
         this.currentAnimation = '';
@@ -180,7 +192,10 @@ class TextPage extends Vue {
         this.$refs.statusBar.style.left = '0px';
         this.$refs.statusBar.style.top = (this.statusBarTop ? 1 : this.realHeight - this.statusBarHeight) + 'px';
 
-        this.statusBarColor = this.hex2rgba(this.textColor || '#000000', this.statusBarColorAlpha);
+        const sbColor = (this.statusBarColorAsText ? this.textColor : this.statusBarColor);
+        this.statusBarRgbaColor = this.hex2rgba(sbColor || '#000000', this.statusBarColorAlpha);
+        const ddColor = (this.dualDivColorAsText ? this.textColor : this.dualDivColor);
+        this.dualDivRgbaColor = this.hex2rgba(ddColor || '#000000', this.dualDivColorAlpha);
 
         //drawHelper
         this.drawHelper.realWidth = this.realWidth;
@@ -188,10 +203,20 @@ class TextPage extends Vue {
         this.drawHelper.lastBook = this.lastBook;
         this.drawHelper.book = this.book;
         this.drawHelper.parsed = this.parsed;
+        this.drawHelper.pageRowsCount = this.pageRowsCount;
         this.drawHelper.pageLineCount = this.pageLineCount;
 
+        this.drawHelper.dualPageMode = this.dualPageMode;
+        this.drawHelper.dualIndentLR = this.dualIndentLR;
+        /*this.drawHelper.dualDivWidth = this.dualDivWidth;
+        this.drawHelper.dualDivHeight = this.dualDivHeight;
+        this.drawHelper.dualDivRgbaColor = this.dualDivRgbaColor;
+        this.drawHelper.dualDivStrokeFill = this.dualDivStrokeFill;
+        this.drawHelper.dualDivStrokeGap = this.dualDivStrokeGap;
+        this.drawHelper.dualDivShadowWidth = this.dualDivShadowWidth;*/
+
         this.drawHelper.backgroundColor = this.backgroundColor;
-        this.drawHelper.statusBarColor = this.statusBarColor;
+        this.drawHelper.statusBarRgbaColor = this.statusBarRgbaColor;
         this.drawHelper.fontStyle = this.fontStyle;
         this.drawHelper.fontWeight = this.fontWeight;
         this.drawHelper.fontSize = this.fontSize;
@@ -200,6 +225,7 @@ class TextPage extends Vue {
         this.drawHelper.textColor = this.textColor;
         this.drawHelper.textShift = this.textShift;
         this.drawHelper.p = this.p;
+        this.drawHelper.boxW = this.boxW;
         this.drawHelper.w = this.w;
         this.drawHelper.h = this.h;
         this.drawHelper.indentLR = this.indentLR;
@@ -226,34 +252,57 @@ class TextPage extends Vue {
         //statusBar
         this.statusBarClickable = this.drawHelper.statusBarClickable(this.statusBarTop, this.statusBarHeight);
 
+        //wallpaper css, асинхронно
+        (async() => {
+            const wallpaperDataLength = await wallpaperStorage.getLength();
+            if (wallpaperDataLength !== this.wallpaperDataLength) {//оптимизация
+                this.wallpaperDataLength = wallpaperDataLength;
+
+                let newCss = '';
+                for (const wp of this.userWallpapers) {
+                    const data = await wallpaperStorage.getData(wp.cssClass);
+
+                    if (!data) {
+                        //здесь будем восстанавливать данные с сервера
+                    }
+
+                    if (data) {
+                        newCss += `.${wp.cssClass} {background: url(${data}) center; background-size: 100% 100%;}`;                
+                    }
+                }
+                dynamicCss.replace('wallpapers', newCss);
+            }
+        })();
+
         //parsed
         if (this.parsed) {
-            this.parsed.p = this.p;
-            this.parsed.w = this.w;// px, ширина текста
-            this.parsed.font = this.font;
-            this.parsed.fontSize = this.fontSize;
-            this.parsed.wordWrap = this.wordWrap;
-            this.parsed.cutEmptyParagraphs = this.cutEmptyParagraphs;
-            this.parsed.addEmptyParagraphs = this.addEmptyParagraphs;
-            let t = wideLetter;
-            if (!this.drawHelper.measureText(t, {}))
+            let wideLine = wideLetter;
+            if (!this.drawHelper.measureText(wideLine, {}))
                 throw new Error('Ошибка measureText');
-            while (this.drawHelper.measureText(t, {}) < this.w) t += wideLetter;
-            this.parsed.maxWordLength = t.length - 1;
-            this.parsed.measureText = this.drawHelper.measureText.bind(this.drawHelper);
-            this.parsed.lineHeight = this.lineHeight;
-            this.parsed.showImages = this.showImages;
-            this.parsed.showInlineImagesInCenter = this.showInlineImagesInCenter;
-            this.parsed.imageHeightLines = this.imageHeightLines;
-            this.parsed.imageFitWidth = this.imageFitWidth;
-            this.parsed.compactTextPerc = this.compactTextPerc;
+            while (this.drawHelper.measureText(wideLine, {}) < this.w) wideLine += wideLetter;
 
-            this.parsed.testText = 'Это тестовый текст. Его ширина выдается системой неверно некоторое время.';
-            this.parsed.testWidth = this.drawHelper.measureText(this.parsed.testText, {});
+            this.parsed.setSettings({
+                p: this.p,
+                w: this.w,
+                font: this.font,
+                fontSize: this.fontSize,
+                wordWrap: this.wordWrap,
+                cutEmptyParagraphs: this.cutEmptyParagraphs,
+                addEmptyParagraphs: this.addEmptyParagraphs,
+                maxWordLength: wideLine.length - 1,
+                lineHeight: this.lineHeight,
+                showImages: this.showImages,
+                showInlineImagesInCenter: this.showInlineImagesInCenter,
+                imageHeightLines: this.imageHeightLines,
+                imageFitWidth: this.imageFitWidth,
+                compactTextPerc: this.compactTextPerc,
+                testWidth: 0,
+                measureText: this.drawHelper.measureText.bind(this.drawHelper),
+            });
         }
 
         //scrolling page
-        const pageSpace = this.scrollHeight - this.pageLineCount*this.lineHeight;
+        const pageSpace = this.scrollHeight - this.pageRowsCount*this.lineHeight;
         let top = pageSpace/2;
         if (this.showStatusBar)
             top += this.statusBarHeight*(this.statusBarTop ? 1 : 0);
@@ -262,14 +311,14 @@ class TextPage extends Vue {
         
         page1.perspective = page2.perspective = '3072px';
 
-        page1.width = page2.width = this.w + this.indentLR + 'px';
+        page1.width = page2.width = this.boxW + this.indentLR + 'px';
         page1.height = page2.height = this.scrollHeight - (pageSpace > 0 ? pageSpace : 0) + 'px';
         page1.top = page2.top = top + 'px';
         page1.left = page2.left = this.indentLR + 'px';
 
         page1 = this.$refs.scrollingPage1.style;
         page2 = this.$refs.scrollingPage2.style;
-        page1.width = page2.width = this.w + this.indentLR + 'px';
+        page1.width = page2.width = this.boxW + this.indentLR + 'px';
         page1.height = page2.height = this.scrollHeight + this.lineHeight + 'px';
     }
 
@@ -285,7 +334,7 @@ class TextPage extends Vue {
 
         let close = null;
         (async() => {
-            await sleep(500);
+            await utils.sleep(500);
             if (this.fontsLoading)
                 close = this.$root.notify.info('Загрузка шрифта &nbsp;<i class="la la-snowflake icon-rotate" style="font-size: 150%"></i>');
         })();
@@ -333,20 +382,36 @@ class TextPage extends Vue {
         if (!omitLoadFonts)
             await this.loadFonts();
 
-        this.draw();
+        if (omitLoadFonts) {
+            this.draw();
+        } else {
+            // ширина шрифта некоторое время выдается неверно,
+            // не удалось событийно отловить этот момент, поэтому костыль
+            while (this.checkingFont) {
+                this.stopCheckingFont = true;
+                await utils.sleep(100);
+            }
 
-        // ширина шрифта некоторое время выдается неверно, поэтому
-        if (!omitLoadFonts) {
-            const parsed = this.parsed;
+            this.checkingFont = true;
+            this.stopCheckingFont = false;
+            try {
+                const parsed = this.parsed;
 
-            let i = 0;
-            const t = this.parsed.testText;
-            while (i++ < 50 && this.parsed === parsed && this.drawHelper.measureText(t, {}) === this.parsed.testWidth)
-                await sleep(100);
-
-            if (this.parsed === parsed) {
-                this.parsed.testWidth = this.drawHelper.measureText(t, {});
-                this.draw();
+                let i = 0;
+                const t = 'Это тестовый текст. Его ширина выдается системой неправильно некоторое время.';
+                let twprev = 0;
+                //5 секунд проверяем изменения шрифта
+                while (!this.stopCheckingFont && i++ < 50 && this.parsed === parsed) {
+                    const tw = this.drawHelper.measureText(t, {});
+                    if (tw !== twprev) {
+                        this.parsed.setSettings({testWidth: tw});
+                        this.draw();
+                        twprev = tw;
+                    }
+                    await utils.sleep(100);
+                }
+            } finally {
+                this.checkingFont = false;
             }
         }
     }
@@ -366,7 +431,6 @@ class TextPage extends Vue {
         this.updateLayout();
         this.book = null;
         this.meta = null;
-        this.fb2 = null;
         this.parsed = null;
 
         this.linesUp = null;
@@ -383,7 +447,7 @@ class TextPage extends Vue {
                 try {
                     //подождем ленивый парсинг
                     this.stopLazyParse = true;
-                    while (this.doingLazyParse) await sleep(10);
+                    while (this.doingLazyParse) await utils.sleep(10);
 
                     const isParsed = await bookManager.hasBookParsed(this.lastBook);
                     if (!isParsed) {
@@ -392,21 +456,9 @@ class TextPage extends Vue {
 
                     this.book = await bookManager.getBook(this.lastBook);
                     this.meta = bookManager.metaOnly(this.book);
-                    this.fb2 = this.meta.fb2;
+                    const bt = utils.getBookTitle(this.meta.fb2);
 
-                    let authorNames = [];
-                    if (this.fb2.author) {
-                        authorNames = this.fb2.author.map(a => _.compact([
-                            a.lastName,
-                            a.firstName,
-                            a.middleName
-                        ]).join(' '));
-                    }
-
-                    this.title = _.compact([
-                        authorNames.join(', '),
-                        this.fb2.bookTitle
-                    ]).join(' - ');
+                    this.title = bt.fullTitle;
 
                     this.$root.$emit('set-app-title', this.title);
 
@@ -443,8 +495,18 @@ class TextPage extends Vue {
     }
 
     setBackground() {
-        this.background = `<div class="layout ${this.wallpaper}" style="width: ${this.realWidth}px; height: ${this.realHeight}px;` + 
-            ` background-color: ${this.backgroundColor}"></div>`;
+        if (this.wallpaperIgnoreStatusBar) {
+            this.background = `<div class="layout" style="width: ${this.realWidth}px; height: ${this.realHeight}px;` +
+                ` background-color: ${this.backgroundColor}">` +
+                `<div class="layout ${this.wallpaper}" style="width: ${this.realWidth}px; height: ${this.scrollHeight}px; ` +
+                    `top: ${(this.showStatusBar && this.statusBarTop ? this.statusBarHeight + 1 : 0)}px; position: relative;">` +
+                `</div>` +
+            `</div>`;
+        } else {
+            this.background = `<div class="layout ${this.wallpaper}" style="width: ${this.realWidth}px; height: ${this.realHeight}px;` +
+                ` background-color: ${this.backgroundColor}"></div>`;
+        }
+
     }
 
     async onResize() {
@@ -493,7 +555,7 @@ class TextPage extends Vue {
                 let wait = (timeout + 201)/100;
                 while (wait > 0 && !this[stopPropertyName]) {
                     wait--;
-                    await sleep(100);
+                    await utils.sleep(100);
                 }
                 resolve();
             })().catch(reject); });
@@ -503,13 +565,13 @@ class TextPage extends Vue {
 
     async startTextScrolling() {
         if (this.doingScrolling || !this.book || !this.parsed.textLength || !this.linesDown || this.pageLineCount < 1 ||
-            this.linesDown.length <= this.pageLineCount) {
+            this.linesDown.length <= this.pageLineCount || this.dualPageMode) {
             this.doStopScrolling();
             return;
         }
 
         //ждем анимацию
-        while (this.inAnimation) await sleep(10);
+        while (this.inAnimation) await utils.sleep(10);
 
         this.stopScrolling = false;
         this.doingScrolling = true;
@@ -520,7 +582,7 @@ class TextPage extends Vue {
             this.page1 = this.page2;
         this.toggleLayout = true;
         await this.$nextTick();
-        await sleep(50);
+        await utils.sleep(50);
 
         this.cachedPos = -1;
         this.draw();
@@ -557,7 +619,7 @@ class TextPage extends Vue {
         page.style.transform = 'none';
         page.offsetHeight;
 
-        while (this.doingScrolling) await sleep(10);
+        while (this.doingScrolling) await utils.sleep(10);
     }
 
     draw() {
@@ -621,6 +683,7 @@ class TextPage extends Vue {
         if (!this.pageChangeAnimation)
             this.debouncedPrepareNextPage();
         this.debouncedDrawStatusBar();
+        this.debouncedDrawPageDividerAndOrnament();
 
         if (this.book && this.linesDown && this.linesDown.length < this.pageLineCount) {
             this.doEnd(true);
@@ -735,8 +798,24 @@ class TextPage extends Vue {
                     message = this.statusBarMessage;
                 if (!message)
                     message = this.title;
+
+                //check image num
+                let imageNum = 0;
+                const len = (lines.length > 2 ? 2 : lines.length);
+                loop:
+                for (let j = 0; j < len; j++) {
+                    const line = lines[j];
+                    for (const part of line.parts) {
+                        if (part.image) {
+                            imageNum = part.image.num;
+                            break loop;
+                        }
+                    }
+                }
+                //drawing
                 this.statusBar = this.drawHelper.drawStatusBar(this.statusBarTop, this.statusBarHeight, 
-                    lines[i].end, this.parsed.textLength, message);
+                    lines[i].end, this.parsed.textLength, message, imageNum, this.parsed.images.length);
+
                 this.bookPosSeen = lines[i].end;
             }
         } else {
@@ -744,6 +823,25 @@ class TextPage extends Vue {
         }
     }
 
+    drawPageDividerAndOrnament() {
+        if (this.dualPageMode) {
+            this.pageDivider = `<div class="layout" style="width: ${this.realWidth}px; height: ${this.scrollHeight}px; ` + 
+                `top: ${(this.showStatusBar && this.statusBarTop ? this.statusBarHeight + 1 : 0)}px; position: relative;">` +
+                `<div class="fit row justify-center items-center no-wrap">` +
+                    `<div style="height: ${Math.round(this.scrollHeight*this.dualDivHeight/100)}px; width: ${this.dualDivWidth}px; ` +
+                        `box-shadow: 0 0 ${this.dualDivShadowWidth}px ${this.dualDivRgbaColor}; ` + 
+                        `background-image: url(&quot;data:image/svg+xml;utf8,<svg width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'>` +
+                            `<line x1='${this.dualDivWidth/2}' y1='0' x2='${this.dualDivWidth/2}' y2='100%' stroke='${this.dualDivRgbaColor}' ` +
+                                `stroke-width='${this.dualDivWidth}' stroke-dasharray='${this.dualDivStrokeFill} ${this.dualDivStrokeGap}'/>` +
+                        `</svg>&quot;);">` +
+                    `</div>` +
+                `</div>` +
+            `</div>`;
+        } else {
+            this.pageDivider = null;
+        }
+    }
+
     blinkCachedLoadMessage(state) {
         if (state === 'finish') {
             this.statusBarMessage = '';
@@ -766,7 +864,7 @@ class TextPage extends Vue {
         for (let i = 0; i < this.parsed.para.length; i++) {
             j++;
             if (j > 1) {
-                await sleep(1);
+                await utils.sleep(1);
                 j = 0;
             }
             if (this.stopLazyParse)
@@ -788,7 +886,7 @@ class TextPage extends Vue {
     async refreshTime() {
         if (!this.timeRefreshing) {
             this.timeRefreshing = true;
-            await sleep(60*1000);
+            await utils.sleep(60*1000);
 
             if (this.book && this.parsed.textLength) {
                 this.debouncedDrawStatusBar();
@@ -904,9 +1002,8 @@ class TextPage extends Vue {
         if (!this.settingsChanging) {
             this.settingsChanging = true;
             const newSize = (this.settings.fontSize + 1 < 200 ? this.settings.fontSize + 1 : 100);
-            const newSettings = Object.assign({}, this.settings, {fontSize: newSize});
-            this.commit('reader/setSettings', newSettings);
-            await sleep(50);
+            this.commit('reader/setSettings', {fontSize: newSize});
+            await utils.sleep(50);
             this.settingsChanging = false;
         }
     }
@@ -915,9 +1012,8 @@ class TextPage extends Vue {
         if (!this.settingsChanging) {
             this.settingsChanging = true;
             const newSize = (this.settings.fontSize - 1 > 5 ? this.settings.fontSize - 1 : 5);
-            const newSettings = Object.assign({}, this.settings, {fontSize: newSize});
-            this.commit('reader/setSettings', newSettings);
-            await sleep(50);
+            this.commit('reader/setSettings', {fontSize: newSize});
+            await utils.sleep(50);
             this.settingsChanging = false;
         }
     }
@@ -926,9 +1022,8 @@ class TextPage extends Vue {
         if (!this.settingsChanging) {
             this.settingsChanging = true;
             const newDelay = (this.settings.scrollingDelay - 50 > 1 ? this.settings.scrollingDelay - 50 : 1);
-            const newSettings = Object.assign({}, this.settings, {scrollingDelay: newDelay});
-            this.commit('reader/setSettings', newSettings);
-            await sleep(50);
+            this.commit('reader/setSettings', {scrollingDelay: newDelay});
+            await utils.sleep(50);
             this.settingsChanging = false;
         }
     }
@@ -937,9 +1032,8 @@ class TextPage extends Vue {
         if (!this.settingsChanging) {
             this.settingsChanging = true;
             const newDelay = (this.settings.scrollingDelay + 50 < 10000 ? this.settings.scrollingDelay + 50 : 10000);
-            const newSettings = Object.assign({}, this.settings, {scrollingDelay: newDelay});
-            this.commit('reader/setSettings', newSettings);
-            await sleep(50);
+            this.commit('reader/setSettings', {scrollingDelay: newDelay});
+            await utils.sleep(50);
             this.settingsChanging = false;
         }
     }
@@ -953,7 +1047,7 @@ class TextPage extends Vue {
             let delay = 400;
             while (this.repDoing) {
                 this.handleClick(pointX, pointY);
-                await sleep(delay);
+                await utils.sleep(delay);
                 if (delay > 15)
                     delay *= 0.8;
             }
@@ -1070,7 +1164,7 @@ class TextPage extends Vue {
 
     onStatusBarClick() {
         const url = this.meta.url;
-        if (url && url.indexOf('file://') != 0) {
+        if (url && url.indexOf('disk://') != 0) {
             window.open(url, '_blank');
         } else {
             this.$root.stdDialog.alert('Оригинал недоступен, т.к. файл книги был загружен с локального диска.', ' ', {color: 'info'});
@@ -1162,60 +1256,3 @@ class TextPage extends Vue {
 }
 
 </style>
-
-<style>
-.paper1 {
-    background: url("images/paper1.jpg") center;
-    background-size: cover;
-}
-
-.paper2 {
-    background: url("images/paper2.jpg") center;
-    background-size: cover;
-}
-
-.paper3 {
-    background: url("images/paper3.jpg") center;
-    background-size: cover;
-}
-
-.paper4 {
-    background: url("images/paper4.jpg") center;
-    background-size: cover;
-}
-
-.paper5 {
-    background: url("images/paper5.jpg") center;
-    background-size: cover;
-}
-
-.paper6 {
-    background: url("images/paper6.jpg") center;
-    background-size: cover;
-}
-
-.paper7 {
-    background: url("images/paper7.jpg") center;
-    background-size: cover;
-}
-
-.paper8 {
-    background: url("images/paper8.jpg") center;
-    background-size: cover;
-}
-
-.paper9 {
-    background: url("images/paper9.jpg");
-}
-
-@keyframes page1-animation-thaw {
-    0%   { opacity: 0; }
-    100% { opacity: 1; }
-}
-
-@keyframes page2-animation-thaw {
-    0%   { opacity: 1; }
-    100% { opacity: 0; }
-}
-
-</style>

client/components/Reader/share/BookParser.js

@@ -1,26 +1,58 @@
 import he from 'he';
 import sax from '../../../../server/core/sax';
-import {sleep} from '../../../share/utils';
+import * as utils from '../../../share/utils';
 
 const maxImageLineCount = 100;
 
+// defaults
+const defaultSettings = {
+    p: 30,  //px, отступ параграфа
+    w: 500, //px, ширина страницы
+
+    font: '', //css описание шрифта
+    fontSize: 20, //px, размер шрифта
+    wordWrap: false, //перенос по слогам
+    cutEmptyParagraphs: false, //убирать пустые параграфы
+    addEmptyParagraphs: 0, //добавлять n пустых параграфов перед непустым
+    maxWordLength: 500, //px, максимальная длина слова без пробелов
+    lineHeight: 26, //px, высота строки
+    showImages: true, //показыввать изображения
+    showInlineImagesInCenter: true, //выносить изображения в центр, работает на этапе первичного парсинга (parse)
+    imageHeightLines: 100, //кол-во строк, максимальная высота изображения
+    imageFitWidth: true, //ширина изображения не более ширины страницы
+    dualPageMode: false, //двухстраничный режим
+    compactTextPerc: 0, //проценты, степень компактности текста
+    testWidth: 0, //ширина тестовой строки, пересчитывается извне при изменении шрифта браузером
+    isTesting: false, //тестовый режим
+
+    //заглушка, измеритель ширины текста
+    measureText: (text, style) => {// eslint-disable-line no-unused-vars
+        return text.length*20;
+    },
+};
+
+//for splitToSlogi()
+const glas = new Set(['а', 'А', 'о', 'О', 'и', 'И', 'е', 'Е', 'ё', 'Ё', 'э', 'Э', 'ы', 'Ы', 'у', 'У', 'ю', 'Ю', 'я', 'Я']);
+const soglas = new Set([
+    'б', 'в', 'г', 'д', 'ж', 'з', 'й', 'к', 'л', 'м', 'н', 'п', 'р', 'с', 'т', 'ф', 'х', 'ц', 'ч', 'ш', 'щ',
+    'Б', 'В', 'Г', 'Д', 'Ж', 'З', 'Й', 'К', 'Л', 'М', 'Н', 'П', 'Р', 'С', 'Т', 'Ф', 'Х', 'Ч', 'Ц', 'Ш', 'Щ'
+]);
+const znak = new Set(['ь', 'Ь', 'ъ', 'Ъ', 'й', 'Й']);
+const alpha = new Set([...glas, ...soglas, ...znak]);
+
 export default class BookParser {
-    constructor(settings) {
-        if (settings) {
-            this.showInlineImagesInCenter = settings.showInlineImagesInCenter;
-        }
+    constructor(settings = {}) {
+        this.sets = {};
 
-        // defaults
-        this.p = 30;// px, отступ параграфа
-        this.w = 300;// px, ширина страницы
-        this.wordWrap = false;// перенос по слогам
-
-        //заглушка
-        this.measureText = (text, style) => {// eslint-disable-line no-unused-vars
-            return text.length*20;
-        };
+        this.setSettings(defaultSettings);
+        this.setSettings(settings);
     }
 
+    setSettings(settings = {}) {
+        this.sets = Object.assign({}, this.sets, settings);
+        this.measureText = this.sets.measureText;
+    }
+    
     async parse(data, callback) {
         if (!callback)
             callback = () => {};
@@ -46,11 +78,23 @@ export default class BookParser {
         let isFirstSection = true;
         let isFirstTitlePara = false;
 
+        //изображения
         this.binary = {};
         let binaryId = '';
         let binaryType = '';
         let dimPromises = [];
 
+        //оглавление
+        this.contents = [];
+        this.images = [];
+        let curTitle = {paraIndex: -1, title: '', subtitles: []};
+        let curSubtitle = {paraIndex: -1, title: ''};
+        let inTitle = false;
+        let inSubtitle = false;
+        let sectionLevel = 0;
+        let bodyIndex = 0;
+        let imageNum = 0;
+
         let paraIndex = -1;
         let paraOffset = 0;
         let para = []; /*array of
@@ -64,6 +108,7 @@ export default class BookParser {
         */
         const getImageDimensions = (binaryId, binaryType, data) => {
             return new Promise ((resolve, reject) => { (async() => {
+                data = data.replace(/[\n\r\s]/g, '');
                 const i = new Image();
                 let resolved = false;
                 i.onload = () => {
@@ -80,7 +125,7 @@ export default class BookParser {
                 i.onerror = reject;
 
                 i.src = `data:${binaryType};base64,${data}`;
-                await sleep(30*1000);
+                await utils.sleep(30*1000);
                 if (!resolved)
                     reject('Не удалось получить размер изображения');
             })().catch(reject); });
@@ -102,57 +147,94 @@ export default class BookParser {
                 i.onerror = reject;
 
                 i.src = src;
-                await sleep(30*1000);
+                await utils.sleep(30*1000);
                 if (!resolved)
                     reject('Не удалось получить размер изображения');
             })().catch(reject); });
         };
 
-        const newParagraph = (text, len, addIndex) => {
+        const correctCurrentPara = () => {
+            //коррекция текущего параграфа
+            if (paraIndex >= 0) {
+                const prevParaIndex = paraIndex;
+                let p = para[paraIndex];
+                paraOffset -= p.length;
+                //добавление пустых (addEmptyParagraphs) параграфов перед текущим непустым
+                if (p.text.trim() != '') {
+                    for (let i = 0; i < 2; i++) {
+                        para[paraIndex] = {
+                            index: paraIndex,
+                            offset: paraOffset,
+                            length: 1,
+                            text: ' ',
+                            addIndex: i + 1,
+                        };
+                        paraIndex++;
+                        paraOffset++;
+                    }
+
+                    if (curTitle.paraIndex == prevParaIndex)
+                        curTitle.paraIndex = paraIndex;
+                    if (curSubtitle.paraIndex == prevParaIndex)
+                        curSubtitle.paraIndex = paraIndex;
+                }
+
+                //уберем пробелы с концов параграфа, минимум 1 пробел должен быть у пустого параграфа
+                let newParaText = p.text.trim();
+                newParaText = (newParaText.length ? newParaText : ' ');
+                const ldiff = p.text.length - newParaText.length;
+                if (ldiff != 0) {
+                    p.text = newParaText;
+                    p.length -= ldiff;
+                }
+
+                p.index = paraIndex;
+                p.offset = paraOffset;
+                para[paraIndex] = p;
+                paraOffset += p.length;
+            }
+        };
+
+        const newParagraph = (text = '', len = 0) => {
+            correctCurrentPara();
+
+            //новый параграф
             paraIndex++;
             let p = {
                 index: paraIndex,
                 offset: paraOffset,
                 length: len,
                 text: text,
-                addIndex: (addIndex ? addIndex : 0),
+                addIndex: 0,
             };
 
+            if (inSubtitle) {
+                curSubtitle.title += '<p>';
+            } else if (inTitle) {
+                curTitle.title += '<p>';
+            }
+
             para[paraIndex] = p;
-            paraOffset += p.length;
+            paraOffset += len;
         };
 
         const growParagraph = (text, len) => {
             if (paraIndex < 0) {
-                newParagraph(' ', 1);
+                newParagraph();
                 growParagraph(text, len);
                 return;
             }
 
-            let p = para[paraIndex];
-            paraOffset -= p.length;
-            //добавление пустых (addEmptyParagraphs) параграфов перед текущим
-            if (p.length == 1 && p.text[0] == ' ' && len > 0) {
-                paraIndex--;
-                for (let i = 0; i < 2; i++) {
-                    newParagraph(' ', 1, i + 1);
-                }
-
-                paraIndex++;
-                p.index = paraIndex;
-                p.offset = paraOffset;
-                para[paraIndex] = p;
-
-                //уберем начальный пробел
-                p.length = 0;
-                p.text = p.text.substr(1);
+            if (inSubtitle) {
+                curSubtitle.title += text;
+            } else if (inTitle) {
+                curTitle.title += text;
             }
 
+            const p = para[paraIndex];
             p.length += len;
             p.text += text;
-
-            para[paraIndex] = p;
-            paraOffset += p.length;
+            paraOffset += len;
         };
 
         const onStartNode = (elemName, tail) => {// eslint-disable-line no-unused-vars
@@ -160,12 +242,13 @@ export default class BookParser {
                 return;
 
             tag = elemName;
-            path += '/' + elemName;
+            path += '/' + tag;
 
             if (tag == 'binary') {
                 let attrs = sax.getAttrsSync(tail);
                 binaryType = (attrs['content-type'] && attrs['content-type'].value ? attrs['content-type'].value : '');
-                if (binaryType == 'image/jpeg' || binaryType == 'image/png' || binaryType == 'application/octet-stream')
+                binaryType = (binaryType == 'image/jpg' || binaryType == 'application/octet-stream' ? 'image/jpeg' : binaryType);
+                if (binaryType == 'image/jpeg' || binaryType == 'image/png')
                     binaryId = (attrs.id.value ? attrs.id.value : '');
             }
 
@@ -173,53 +256,111 @@ export default class BookParser {
                 let attrs = sax.getAttrsSync(tail);
                 if (attrs.href && attrs.href.value) {
                     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 (inPara && !this.showInlineImagesInCenter && !center)
-                            growParagraph(`<image-inline href="${href}"></image-inline>`, 0);
+                        imageNum++;
+
+                        if (inPara && !this.sets.showInlineImagesInCenter && !center)
+                            growParagraph(`<image-inline href="${href}" num="${imageNum}"></image-inline>`, 0);
                         else
-                            newParagraph(`<image href="${href}">${' '.repeat(maxImageLineCount)}</image>`, maxImageLineCount);
-                        if (inPara && this.showInlineImagesInCenter)
-                            newParagraph(' ', 1);
+                            newParagraph(`<image href="${href}" num="${imageNum}">${' '.repeat(maxImageLineCount)}</image>`, maxImageLineCount);
+
+                        this.images.push({paraIndex, num: imageNum, id, local, alt});
+
+                        if (inPara && this.sets.showInlineImagesInCenter)
+                            newParagraph();
                     } else {//external
-                        dimPromises.push(getExternalImageDimensions(href));
-                        newParagraph(`<image href="${href}">${' '.repeat(maxImageLineCount)}</image>`, maxImageLineCount);
+                        imageNum++;
+
+                        if (!this.sets.isTesting) {
+                            dimPromises.push(getExternalImageDimensions(href));
+                        } else {
+                            dimPromises.push(this.sets.getExternalImageDimensions(this, href));
+                        }
+                        newParagraph(`<image href="${href}" num="${imageNum}">${' '.repeat(maxImageLineCount)}</image>`, maxImageLineCount);
+
+                        this.images.push({paraIndex, num: imageNum, id, local, alt});
                     }
                 }
             }
 
-            if (elemName == 'author' && path.indexOf('/fictionbook/description/title-info/author') == 0) {
+            if (path == '/fictionbook/description/title-info/author') {
                 if (!fb2.author)
                     fb2.author = [];
+
                 fb2.author.push({});
             }
 
+            const isPublishSequence = (path == '/fictionbook/description/publish-info/sequence');
+            if (path == '/fictionbook/description/title-info/sequence' || isPublishSequence) {
+                if (!fb2.sequence)
+                    fb2.sequence = [];
+
+                if (!isPublishSequence || !fb2.sequence.length) {
+                    const attrs = sax.getAttrsSync(tail);
+                    const seq = {};
+                    if (attrs.name && attrs.name.value) {
+                        seq.name = attrs.name.value;
+                    }
+                    if (attrs.number && attrs.number.value) {
+                        seq.number = attrs.number.value;
+                    }
+
+                    fb2.sequence.push(seq);
+                }
+            }
+
             if (path.indexOf('/fictionbook/body') == 0) {
                 if (tag == 'body') {
+                    if (isFirstBody && fb2.annotation) {
+                        const ann = fb2.annotation.split('<p>').filter(v => v).map(v => utils.removeHtmlTags(v));
+                        ann.forEach(a => {
+                            newParagraph(`<emphasis><space w="1">${a}</space></emphasis>`, a.length);
+                        });
+                        if (ann.length)
+                            newParagraph();
+                    }
+
+                    if (isFirstBody && fb2.sequence && fb2.sequence.length) {
+                        const bt = utils.getBookTitle(fb2);
+                        if (bt.sequence) {
+                            newParagraph(bt.sequence, bt.sequence.length);
+                            newParagraph();
+                        }
+                    }
+
                     if (!isFirstBody)
-                        newParagraph(' ', 1);
+                        newParagraph();
                     isFirstBody = false;
+                    bodyIndex++;
                 }
 
                 if (tag == 'title') {
-                    newParagraph(' ', 1);
+                    newParagraph();
                     isFirstTitlePara = true;
                     bold = true;
                     center = true;
+
+                    inTitle = true;
+                    curTitle = {paraIndex, title: '', inset: sectionLevel, bodyIndex, subtitles: []};
+                    this.contents.push(curTitle);
                 }
 
                 if (tag == 'section') {
                     if (!isFirstSection)
-                        newParagraph(' ', 1);
+                        newParagraph();
                     isFirstSection = false;
+                    sectionLevel++;
                 }
 
-                if (tag == 'emphasis' || tag == 'strong') {
+                if (tag == 'emphasis' || tag == 'strong' || tag == 'sup' || tag == 'sub') {
                     growParagraph(`<${tag}>`, 0);
                 }
 
                 if ((tag == 'p' || tag == 'empty-line' || tag == 'v')) {
                     if (!(tag == 'p' && isFirstTitlePara))
-                        newParagraph(' ', 1);
+                        newParagraph();
                     if (tag == 'p') {
                         inPara = true;
                         isFirstTitlePara = false;
@@ -227,23 +368,33 @@ export default class BookParser {
                 }
 
                 if (tag == 'subtitle') {
-                    newParagraph(' ', 1);
+                    newParagraph();
                     isFirstTitlePara = true;
                     bold = true;
                     center = true;
+
+                    if (curTitle.paraIndex < 0) {
+                        curTitle = {paraIndex, title: 'Оглавление', inset: sectionLevel, bodyIndex, subtitles: []};
+                        this.contents.push(curTitle);
+                    }
+
+                    inSubtitle = true;
+                    curSubtitle = {paraIndex, inset: sectionLevel, title: ''};
+                    curTitle.subtitles.push(curSubtitle);
                 }
 
-                if (tag == 'epigraph') {
+                if (tag == 'epigraph' || tag == 'annotation') {
                     italic = true;
                     space += 1;
                 }
 
                 if (tag == 'poem') {
-                    newParagraph(' ', 1);
+                    newParagraph();
                 }
 
                 if (tag == 'text-author') {
-                    newParagraph(' ', 1);
+                    newParagraph();
+                    bold = true;
                     space += 1;
                 }
             }
@@ -260,9 +411,14 @@ export default class BookParser {
                         isFirstTitlePara = false;
                         bold = false;
                         center = false;
+                        inTitle = false;
                     }
 
-                    if (tag == 'emphasis' || tag == 'strong') {
+                    if (tag == 'section') {
+                        sectionLevel--;
+                    }
+
+                    if (tag == 'emphasis' || tag == 'strong' || tag == 'sup' || tag == 'sub') {
                         growParagraph(`</${tag}>`, 0);
                     }
 
@@ -274,18 +430,21 @@ export default class BookParser {
                         isFirstTitlePara = false;
                         bold = false;
                         center = false;
+                        inSubtitle = false;
                     }
 
-                    if (tag == 'epigraph') {
+                    if (tag == 'epigraph' || tag == 'annotation') {
                         italic = false;
                         space -= 1;
+                        newParagraph();
                     }
 
                     if (tag == 'stanza') {
-                        newParagraph(' ', 1);
+                        newParagraph();
                     }
 
                     if (tag == 'text-author') {
+                        bold = false;
                         space -= 1;
                     }
                 }
@@ -302,17 +461,14 @@ export default class BookParser {
 
         const onTextNode = (text) => {// eslint-disable-line no-unused-vars
             text = he.decode(text);
-            text = text.replace(/>/g, '&gt;');
-            text = text.replace(/</g, '&lt;');
+            text = text.replace(/>/g, '&gt;').replace(/</g, '&lt;').replace(/[\t\n\r\xa0]/g, ' ');
 
             if (text && text.trim() == '')
-                text = (text.indexOf(' ') >= 0 ? ' ' : '');
+                text = ' ';
 
             if (!text)
                 return;
 
-            text = text.replace(/[\t\n\r\xa0]/g, ' ');
-
             const authorLength = (fb2.author && fb2.author.length ? fb2.author.length : 0);
             switch (path) {
                 case '/fictionbook/description/title-info/author/first-name':
@@ -350,35 +506,43 @@ export default class BookParser {
                     fb2.annotation += text;
             }
 
-            let tOpen = (center ? '<center>' : '');
-            tOpen += (bold ? '<strong>' : '');
-            tOpen += (italic ? '<emphasis>' : '');
-            tOpen += (space ? `<space w="${space}">` : '');
-            let tClose = (space ? '</space>' : '');
-            tClose += (italic ? '</emphasis>' : '');
-            tClose += (bold ? '</strong>' : '');
-            tClose += (center ? '</center>' : '');
+            if (binaryId) {
+                if (!this.sets.isTesting) {
+                    dimPromises.push(getImageDimensions(binaryId, binaryType, text));
+                } else {
+                    dimPromises.push(this.sets.getImageDimensions(this, binaryId, binaryType, text));
+                }
+            }
 
             if (path.indexOf('/fictionbook/body/title') == 0 ||
                 path.indexOf('/fictionbook/body/section') == 0 ||
                 path.indexOf('/fictionbook/body/epigraph') == 0
                 ) {
-                growParagraph(`${tOpen}${text}${tClose}`, text.length);
-            }
+                let tOpen = (center ? '<center>' : '');
+                tOpen += (bold ? '<strong>' : '');
+                tOpen += (italic ? '<emphasis>' : '');
+                tOpen += (space ? `<space w="${space}">` : '');
+                let tClose = (space ? '</space>' : '');
+                tClose += (italic ? '</emphasis>' : '');
+                tClose += (bold ? '</strong>' : '');
+                tClose += (center ? '</center>' : '');
 
-            if (binaryId) {
-                dimPromises.push(getImageDimensions(binaryId, binaryType, text));
+                if (text != ' ')
+                    growParagraph(`${tOpen}${text}${tClose}`, text.length);
+                else
+                    growParagraph(' ', 1);
             }
         };
 
         const onProgress = async(prog) => {
-            await sleep(1);
+            await utils.sleep(1);
             callback(prog);
         };
 
         await sax.parse(data, {
             onStartNode, onEndNode, onTextNode, onProgress
         });
+        correctCurrentPara();
 
         if (dimPromises.length) {
             try {
@@ -394,11 +558,20 @@ export default class BookParser {
         this.textLength = paraOffset;
 
         callback(100);
-        await sleep(10);
+        await utils.sleep(10);
 
         return {fb2};
     }
 
+    imageHrefToId(id) {
+        let local = false;
+        if (id[0] == '#') {
+            id = id.substr(1);
+            local = true;
+        }
+        return {id, local};
+    }
+
     findParaIndex(bookPos) {
         let result = undefined;
         //дихотомия
@@ -423,16 +596,26 @@ export default class BookParser {
 
     splitToStyle(s) {
         let result = [];/*array of {
-            style: {bold: Boolean, italic: Boolean, center: Boolean, space: Number},
+            style: {bold: Boolean, italic: Boolean, sup: Boolean, sub: Boolean, center: Boolean, space: Number},
             image: {local: Boolean, inline: Boolean, id: String},
             text: String,
         }*/
         let style = {};
         let image = {};
 
+        //оптимизация по памяти
+        const copyStyle = (s) => {
+            const r = {};
+            for (const prop in s) {
+                if (s[prop])
+                    r[prop] = s[prop];
+            }
+            return r;
+        };
+
         const onTextNode = async(text) => {// eslint-disable-line no-unused-vars
             result.push({
-                style: Object.assign({}, style),
+                style: copyStyle(style),
                 image,
                 text
             });
@@ -446,6 +629,12 @@ export default class BookParser {
                 case 'emphasis':
                     style.italic = true;
                     break;
+                case 'sup': 
+                    style.sup = true;
+                    break;
+                case 'sub':
+                    style.sub = true;
+                    break;
                 case 'center':
                     style.center = true;
                     break;
@@ -458,28 +647,21 @@ export default class BookParser {
                 case 'image': {
                     let attrs = sax.getAttrsSync(tail);
                     if (attrs.href && attrs.href.value) {
-                        let id = attrs.href.value;
-                        let local = false;
-                        if (id[0] == '#') {
-                            id = id.substr(1);
-                            local = true;
-                        }
-                        image = {local, inline: false, id};
+                        image = this.imageHrefToId(attrs.href.value);
+                        image.inline = false;
+                        image.num = (attrs.num && attrs.num.value ? attrs.num.value : 0);
                     }
                     break;
                 }
                 case 'image-inline': {
                     let attrs = sax.getAttrsSync(tail);
                     if (attrs.href && attrs.href.value) {
-                        let id = attrs.href.value;
-                        let local = false;
-                        if (id[0] == '#') {
-                            id = id.substr(1);
-                            local = true;
-                        }
+                        const img = this.imageHrefToId(attrs.href.value);
+                        img.inline = true;
+                        img.num = (attrs.num && attrs.num.value ? attrs.num.value : 0);
                         result.push({
-                            style: Object.assign({}, style),
-                            image: {local, inline: true, id},
+                            style: copyStyle(style),
+                            image: img,
                             text: ''
                         });
                     }
@@ -496,6 +678,12 @@ export default class BookParser {
                 case 'emphasis':
                     style.italic = false;
                     break;
+                case 'sup': 
+                    style.sup = false;
+                    break;
+                case 'sub':
+                    style.sub = false;
+                    break;
                 case 'center':
                     style.center = false;
                     break;
@@ -515,7 +703,7 @@ export default class BookParser {
         });
 
         //длинные слова (или белиберду без пробелов) тоже разобьем
-        const maxWordLength = this.maxWordLength;
+        const maxWordLength = this.sets.maxWordLength;
         const parts = result;
         result = [];
         for (const part of parts) {
@@ -528,7 +716,7 @@ export default class BookParser {
                         spaceIndex = i;
 
                     if (i - spaceIndex >= maxWordLength && i < p.text.length - 1 && 
-                        this.measureText(p.text.substr(spaceIndex + 1, i - spaceIndex), p.style) >= this.w - this.p) {
+                        this.measureText(p.text.substr(spaceIndex + 1, i - spaceIndex), p.style) >= this.sets.w - this.sets.p) {
                         result.push({style: p.style, image: p.image, text: p.text.substr(0, i + 1)});
                         p = {style: p.style, image: p.image, text: p.text.substr(i + 1)};
                         spaceIndex = -1;
@@ -546,86 +734,87 @@ export default class BookParser {
     splitToSlogi(word) {
         let result = [];
 
-        const glas = new Set(['а', 'А', 'о', 'О', 'и', 'И', 'е', 'Е', 'ё', 'Ё', 'э', 'Э', 'ы', 'Ы', 'у', 'У', 'ю', 'Ю', 'я', 'Я']);
-        const soglas = new Set([
-            'б', 'в', 'г', 'д', 'ж', 'з', 'й', 'к', 'л', 'м', 'н', 'п', 'р', 'с', 'т', 'ф', 'х', 'ц', 'ч', 'ш', 'щ',
-            'Б', 'В', 'Г', 'Д', 'Ж', 'З', 'Й', 'К', 'Л', 'М', 'Н', 'П', 'Р', 'С', 'Т', 'Ф', 'Х', 'Ч', 'Ц', 'Ш', 'Щ'
-        ]);
-        const znak = new Set(['ь', 'Ь', 'ъ', 'Ъ', 'й', 'Й']);
-        const alpha = new Set([...glas, ...soglas, ...znak]);
-
-        let slog = '';
-        let slogLen = 0;
         const len = word.length;
-        word += '   ';
-        for (let i = 0; i < len; i++) {
-            slog += word[i];
-            if (alpha.has(word[i]))
-                slogLen++;
+        if (len > 3) {
+            let slog = '';
+            let slogLen = 0;
+            word += '   ';
+            for (let i = 0; i < len; i++) {
+                slog += word[i];
+                if (alpha.has(word[i]))
+                    slogLen++;
 
-            if (slogLen > 1 && i < len - 2 && (
-                    //гласная, а следом не 2 согласные буквы
-                    (glas.has(word[i]) && !(soglas.has(word[i + 1]) && 
-                        soglas.has(word[i + 2])) && alpha.has(word[i + 1]) && alpha.has(word[i + 2])
-                    ) ||
-                    //предыдущая не согласная буква, текущая согласная, а следом согласная и согласная|гласная буквы
-                    (alpha.has(word[i - 1]) && !soglas.has(word[i - 1]) && 
-                        soglas.has(word[i]) && soglas.has(word[i + 1]) && 
-                        (glas.has(word[i + 2]) || soglas.has(word[i + 2])) && 
-                        alpha.has(word[i + 1]) && alpha.has(word[i + 2])
-                    ) ||
-                    //мягкий или твердый знак или Й
-                    (znak.has(word[i]) && alpha.has(word[i + 1]) && alpha.has(word[i + 2])) ||
-                    (word[i] == '-')
-                ) &&
-                //нельзя оставлять окончания на ь, ъ, й
-                !(znak.has(word[i + 2]) && !alpha.has(word[i + 3]))
+                if (slogLen > 1 && i < len - 2 && (
+                        //гласная, а следом не 2 согласные буквы
+                        (glas.has(word[i]) && !( soglas.has(word[i + 1]) && soglas.has(word[i + 2]) ) &&
+                            alpha.has(word[i + 1]) && alpha.has(word[i + 2])
+                        ) ||
+                        //предыдущая не согласная буква, текущая согласная, а следом согласная и согласная|гласная буквы
+                        (alpha.has(word[i - 1]) && !soglas.has(word[i - 1]) && soglas.has(word[i]) && soglas.has(word[i + 1]) && 
+                            ( glas.has(word[i + 2]) || soglas.has(word[i + 2]) ) && 
+                            alpha.has(word[i + 1]) && alpha.has(word[i + 2])
+                        ) ||
+                        //мягкий или твердый знак или Й
+                        (znak.has(word[i]) && alpha.has(word[i + 1]) && alpha.has(word[i + 2])) ||
+                        (word[i] == '-')
+                    ) &&
+                    //нельзя оставлять окончания на ь, ъ, й
+                    !(znak.has(word[i + 2]) && !alpha.has(word[i + 3]))
 
-                ) {
-                result.push(slog);
-                slog = '';
-                slogLen = 0;
+                    ) {
+                    result.push(slog);
+                    slog = '';
+                    slogLen = 0;
+                }
             }
+            if (slog)
+                result.push(slog);
+        } else {
+            result.push(word);            
         }
-        if (slog)
-            result.push(slog);
 
         return result;
     }
 
     parsePara(paraIndex) {
         const para = this.para[paraIndex];
+        const s = this.sets;
 
+        //перераспарсиваем только при изменении одного из параметров
         if (!this.force &&
             para.parsed && 
-            para.parsed.testWidth === this.testWidth &&
-            para.parsed.w === this.w &&
-            para.parsed.p === this.p &&
-            para.parsed.wordWrap === this.wordWrap &&
-            para.parsed.maxWordLength === this.maxWordLength &&
-            para.parsed.font === this.font &&
-            para.parsed.cutEmptyParagraphs === this.cutEmptyParagraphs &&
-            para.parsed.addEmptyParagraphs === this.addEmptyParagraphs &&
-            para.parsed.showImages === this.showImages &&
-            para.parsed.imageHeightLines === this.imageHeightLines &&
-            para.parsed.imageFitWidth === this.imageFitWidth &&
-            para.parsed.compactTextPerc === this.compactTextPerc
+            para.parsed.p === s.p &&
+            para.parsed.w === s.w &&
+            para.parsed.font === s.font &&
+            para.parsed.fontSize === s.fontSize &&
+            para.parsed.wordWrap === s.wordWrap &&
+            para.parsed.cutEmptyParagraphs === s.cutEmptyParagraphs &&
+            para.parsed.addEmptyParagraphs === s.addEmptyParagraphs &&
+            para.parsed.maxWordLength === s.maxWordLength &&
+            para.parsed.lineHeight === s.lineHeight &&
+            para.parsed.showImages === s.showImages &&
+            para.parsed.imageHeightLines === s.imageHeightLines &&
+            para.parsed.imageFitWidth === (s.imageFitWidth || s.dualPageMode) &&
+            para.parsed.compactTextPerc === s.compactTextPerc &&
+            para.parsed.testWidth === s.testWidth
             )
             return para.parsed;
 
         const parsed = {
-            testWidth: this.testWidth,
-            w: this.w,
-            p: this.p,
-            wordWrap: this.wordWrap,
-            maxWordLength: this.maxWordLength,
-            font: this.font,
-            cutEmptyParagraphs: this.cutEmptyParagraphs,
-            addEmptyParagraphs: this.addEmptyParagraphs,
-            showImages: this.showImages,
-            imageHeightLines: this.imageHeightLines,
-            imageFitWidth: this.imageFitWidth,
-            compactTextPerc: this.compactTextPerc,
+            p: s.p,
+            w: s.w,
+            font: s.font,
+            fontSize: s.fontSize,
+            wordWrap: s.wordWrap,
+            cutEmptyParagraphs: s.cutEmptyParagraphs,
+            addEmptyParagraphs: s.addEmptyParagraphs,
+            maxWordLength: s.maxWordLength,
+            lineHeight: s.lineHeight,
+            showImages: s.showImages,
+            imageHeightLines: s.imageHeightLines,
+            imageFitWidth: (s.imageFitWidth || s.dualPageMode),
+            compactTextPerc: s.compactTextPerc,
+            testWidth: s.testWidth,
             visible: true, //вычисляется позже
         };
 
@@ -657,7 +846,7 @@ export default class BookParser {
         let ofs = 0;//смещение от начала параграфа para.offset
         let imgW = 0;
         let imageInPara = false;
-        const compactWidth = this.measureText('W', {})*this.compactTextPerc/100;
+        const compactWidth = this.measureText('W', {})*parsed.compactTextPerc/100;
         // тут начинается самый замес, перенос по слогам и стилизация, а также изображения
         for (const part of parts) {
             style = part.style;
@@ -670,14 +859,14 @@ export default class BookParser {
                 if (!bin)
                     bin = {h: 1, w: 1};
 
-                let lineCount = this.imageHeightLines;
-                let c = Math.ceil(bin.h/this.lineHeight);
+                let lineCount = parsed.imageHeightLines;
+                let c = Math.ceil(bin.h/parsed.lineHeight);
 
-                const maxH = lineCount*this.lineHeight;
+                const maxH = lineCount*parsed.lineHeight;
                 let maxH2 = maxH;
-                if (this.imageFitWidth && bin.w > this.w) {
-                    maxH2 = bin.h*this.w/bin.w;
-                    c = Math.ceil(maxH2/this.lineHeight);
+                if (parsed.imageFitWidth && bin.w > parsed.w) {
+                    maxH2 = bin.h*parsed.w/bin.w;
+                    c = Math.ceil(maxH2/parsed.lineHeight);
                 }
                 lineCount = (c < lineCount ? c : lineCount);
 
@@ -700,6 +889,7 @@ export default class BookParser {
                         paraIndex,
                         w: imageWidth,
                         h: imageHeight,
+                        num: part.image.num
                     }});
                     lines.push(line);
                     line = {begin: line.end + 1, parts: []};
@@ -710,19 +900,19 @@ export default class BookParser {
                 line.last = true;
                 line.parts.push({style, text: ' ',
                     image: {local: part.image.local, inline: false, id: part.image.id,
-                        imageLine: i, lineCount, paraIndex, w: imageWidth, h: imageHeight}
+                        imageLine: i, lineCount, paraIndex, w: imageWidth, h: imageHeight, num: part.image.num}
                 });
                 
                 continue;
             }
 
-            if (part.image.id && part.image.inline && this.showImages) {
+            if (part.image.id && part.image.inline && parsed.showImages) {
                 const bin = this.binary[part.image.id];
                 if (bin) {
-                    let imgH = (bin.h > this.fontSize ? this.fontSize : bin.h);
+                    let imgH = (bin.h > parsed.fontSize ? parsed.fontSize : bin.h);
                     imgW += bin.w*imgH/bin.h;
                     line.parts.push({style, text: '',
-                        image: {local: part.image.local, inline: true, id: part.image.id}});
+                        image: {local: part.image.local, inline: true, id: part.image.id, num: part.image.num}});
                 }
             }
 
@@ -834,11 +1024,11 @@ export default class BookParser {
 
         //parsed.visible
         if (imageInPara) {
-            parsed.visible = this.showImages;
+            parsed.visible = parsed.showImages;
         } else {
             parsed.visible = !(
-                (para.addIndex > this.addEmptyParagraphs) ||
-                (para.addIndex == 0 && this.cutEmptyParagraphs && paragraphText.trim() == '')
+                (para.addIndex > parsed.addEmptyParagraphs) ||
+                (para.addIndex == 0 && parsed.cutEmptyParagraphs && paragraphText.trim() == '')
             );
         }
 

client/components/Reader/share/bookManager.js

@@ -4,19 +4,25 @@ import _ from 'lodash';
 import * as utils from '../../../share/utils';
 import BookParser from './BookParser';
 
-const maxDataSize = 300*1024*1024;//compressed bytes
+const maxDataSize = 500*1024*1024;//compressed bytes
 
+//локальный кэш метаданных книг, ограничение maxDataSize
 const bmMetaStore = localForage.createInstance({
     name: 'bmMetaStore'
 });
 
+//локальный кэш самих книг, ограничение maxDataSize
 const bmDataStore = localForage.createInstance({
     name: 'bmDataStore'
 });
 
-const bmRecentStore = localForage.createInstance({
+//список недавно открытых книг
+const bmRecentStoreOld = localForage.createInstance({
     name: 'bmRecentStore'
 });
+const bmRecentStoreNew = localForage.createInstance({
+    name: 'bmRecentStoreNew'
+});
 
 class BookManager {
     async init(settings) {
@@ -25,15 +31,80 @@ class BookManager {
 
         this.eventListeners = [];
         this.books = {};
-        this.recent = {};
 
-        this.recentLast = await bmRecentStore.getItem('recent-last');
-        if (this.recentLast) {
-            this.recent[this.recentLast.key] = this.recentLast;
-            const meta = await bmMetaStore.getItem(`bmMeta-${this.recentLast.key}`);
-            if (_.isObject(meta)) {
-                this.books[meta.key] = meta;
+        this.recent = {};
+        this.saveRecent = _.debounce(() => {
+            bmRecentStoreNew.setItem('recent', this.recent);
+        }, 300, {maxWait: 800});
+
+        this.saveRecentItem = _.debounce(() => {
+            bmRecentStoreNew.setItem('recent-item', this.recentItem);
+            this.recentRev = (this.recentRev < 1000 ? this.recentRev + 1 : 1);
+            bmRecentStoreNew.setItem('rev', this.recentRev);
+        }, 200, {maxWait: 300});
+
+        //загрузка bmRecentStore
+        this.recentRev = await bmRecentStoreNew.getItem('rev') || 0;
+        if (this.recentRev) {
+            this.recent = await bmRecentStoreNew.getItem('recent');
+            if (!this.recent)
+                this.recent = {};
+
+            this.recentItem = await bmRecentStoreNew.getItem('recent-item');
+            if (this.recentItem)
+                this.recent[this.recentItem.key] = this.recentItem;
+
+            this.recentLastKey = await bmRecentStoreNew.getItem('recent-last-key');
+            if (this.recentLastKey) {
+                const meta = await bmMetaStore.getItem(`bmMeta-${this.recentLastKey}`);
+                if (_.isObject(meta)) {
+                    this.books[meta.key] = meta;
+                }
             }
+
+            await this.cleanRecentBooks();
+
+            //TODO: убрать после 06.2021, когда bmRecentStoreOld устареет
+            {
+                await this.convertFileToDiskPrefix();
+                if (this.recentRev > 10)
+                    await bmRecentStoreOld.clear();
+            }
+        } else {//TODO: убрать после 06.2021, когда bmRecentStoreOld устареет
+            this.recentLast = await bmRecentStoreOld.getItem('recent-last');
+            if (this.recentLast) {
+                this.recent[this.recentLast.key] = this.recentLast;
+                const meta = await bmMetaStore.getItem(`bmMeta-${this.recentLast.key}`);
+                if (_.isObject(meta)) {
+                    this.books[meta.key] = meta;
+                }
+            }
+
+            let key = null;
+            const len = await bmRecentStoreOld.length();
+            for (let i = len - 1; i >= 0; i--) {
+                key = await bmRecentStoreOld.key(i);
+                if (key) {
+                    let r = await bmRecentStoreOld.getItem(key);
+                    if (_.isObject(r) && r.key) {
+                        this.recent[r.key] = r;
+                    }
+                } else  {
+                    await bmRecentStoreOld.removeItem(key);
+                }
+            }
+
+            //размножение для дебага
+            /*if (key) {
+                for (let i = 0; i < 1000; i++) {
+                    const k = this.keyFromUrl(i.toString());
+                    this.recent[k] = Object.assign({}, _.cloneDeep(this.recent[key]), {key: k, touchTime: Date.now() - 1000000, url: utils.randomHexString(300)});
+                }
+            }*/
+
+            await bmRecentStoreNew.setItem('recent', this.recent);
+            this.recentRev = 1;
+            await bmRecentStoreNew.setItem('rev', this.recentRev);
         }
 
         this.recentChanged = true;
@@ -41,9 +112,7 @@ class BookManager {
         this.loadStored();//no await
     }
 
-    //Долгая асинхронная загрузка из хранилища.
-    //Хранение в отдельных записях дает относительно
-    //нормальное поведение при нескольких вкладках с читалкой в браузере.
+    //Ленивая асинхронная загрузка bmMetaStore
     async loadStored() {
         //даем время для загрузки последней читаемой книги, чтобы не блокировать приложение
         await utils.sleep(2000);
@@ -70,32 +139,7 @@ class BookManager {
             }
         }
 
-        let key = null;
-        len = await bmRecentStore.length();
-        for (let i = len - 1; i >= 0; i--) {
-            key = await bmRecentStore.key(i);
-            if (key) {
-                let r = await bmRecentStore.getItem(key);
-                if (_.isObject(r) && r.key) {
-                    this.recent[r.key] = r;
-                }
-            } else  {
-                await bmRecentStore.removeItem(key);
-            }
-        }
-
-        //размножение для дебага
-        /*if (key) {
-            for (let i = 0; i < 1000; i++) {
-                const k = this.keyFromUrl(i.toString());
-                this.recent[k] = Object.assign({}, _.cloneDeep(this.recent[key]), {key: k, touchTime: Date.now() - 1000000, url: utils.randomHexString(300)});
-            }
-        }*/
-        
         await this.cleanBooks();
-        await this.cleanRecentBooks();
-
-        this.recentChanged = true;
         this.loaded = true;
         this.emit('load-stored-finish');
     }
@@ -125,7 +169,7 @@ class BookManager {
     }
 
     async deflateWithProgress(data, callback) {
-        const chunkSize = 128*1024;
+        const chunkSize = 512*1024;
         const deflator = new utils.pako.Deflate({level: 5});
 
         let chunkTotal = 1 + Math.floor(data.length/chunkSize);
@@ -159,7 +203,7 @@ class BookManager {
     }
 
     async inflateWithProgress(data, callback) {
-        const chunkSize = 64*1024;
+        const chunkSize = 512*1024;
         const inflator = new utils.pako.Inflate({to: 'string'});
 
         let chunkTotal = 1 + Math.floor(data.length/chunkSize);
@@ -238,7 +282,7 @@ class BookManager {
         let book = this.books[meta.key];
 
         if (!book && !this.loaded) {
-            book = await bmDataStore.getItem(`bmMeta-${meta.key}`);
+            book = await bmMetaStore.getItem(`bmMeta-${meta.key}`);
             if (book)
                 this.books[meta.key] = book;
         }
@@ -254,7 +298,7 @@ class BookManager {
         result = this.books[meta.key];
 
         if (!result) {
-            result = await bmDataStore.getItem(`bmMeta-${meta.key}`);
+            result = await bmMetaStore.getItem(`bmMeta-${meta.key}`);
             if (result)
                 this.books[meta.key] = result;
         }
@@ -328,51 +372,71 @@ class BookManager {
     }
 
     //-- recent --------------------------------------------------------------
+    async recentSetItem(item = null, skipCheck = false) {
+        const rev = await bmRecentStoreNew.getItem('rev');
+        if (rev != this.recentRev && !skipCheck) {
+            const newRecent = await bmRecentStoreNew.getItem('recent');
+            Object.assign(this.recent, newRecent);
+            this.recentItem = await bmRecentStoreNew.getItem('recent-item');
+            this.recentRev = rev;
+        }
+
+        const prevKey = (this.recentItem ? this.recentItem.key : '');
+        if (item) {
+            this.recent[item.key] = item;
+            this.recentItem = item;
+        } else {
+            this.recentItem = null;
+        }
+
+        this.saveRecentItem();
+
+        if (!item || prevKey != item.key) {
+            this.saveRecent();
+        }
+
+        this.recentChanged = true;
+
+        if (item) {
+            this.emit('recent-changed', item.key);
+        } else {
+            this.emit('recent-changed');
+        }
+    }
+
+    async recentSetLastKey(key) {
+        this.recentLastKey = key;
+        await bmRecentStoreNew.setItem('recent-last-key', this.recentLastKey);
+    }
+
     async setRecentBook(value) {
-        const result = this.metaOnly(value);
+        let result = this.metaOnly(value);
         result.touchTime = Date.now();
         result.deleted = 0;
 
-        if (this.recent[result.key] && this.recent[result.key].deleted) {
-            //восстановим из небытия пользовательские данные
-            if (!result.bookPos)
-                result.bookPos = this.recent[result.key].bookPos;
-            if (!result.bookPosSeen)
-                result.bookPosSeen = this.recent[result.key].bookPosSeen;
+        if (this.recent[result.key]) {
+            result = Object.assign({}, this.recent[result.key], result);
         }
 
-        this.recent[result.key] = result;
-
-        await bmRecentStore.setItem(result.key, result);
-
-        this.recentLast = result;
-        await bmRecentStore.setItem('recent-last', this.recentLast);
-
-        this.recentChanged = true;
-        this.emit('recent-changed', result.key);
+        await this.recentSetLastKey(result.key);
+        await this.recentSetItem(result);
         return result;
     }
 
     async getRecentBook(value) {
-        let result = this.recent[value.key];
-        if (!result) {
-            result = await bmRecentStore.getItem(value.key);
-            if (result)
-                this.recent[value.key] = result;
-        }
-        return result;
+        return this.recent[value.key];
     }
 
     async delRecentBook(value) {
-        this.recent[value.key].deleted = 1;
-        await bmRecentStore.setItem(value.key, this.recent[value.key]);
+        const item = this.recent[value.key];
+        item.deleted = 1;
 
-        if (this.recentLast.key == value.key) {
-            this.recentLast = null;
-            await bmRecentStore.setItem('recent-last', this.recentLast);
+        if (this.recentLastKey == value.key) {
+            await this.recentSetLastKey(null);
         }
+
+        await this.recentSetItem(item);
         this.emit('recent-deleted', value.key);
-        this.emit('recent-changed', value.key);
     }
 
     async cleanRecentBooks() {
@@ -380,24 +444,49 @@ class BookManager {
 
         let isDel = false;
         for (let i = 1000; i < sorted.length; i++) {
-            await bmRecentStore.removeItem(sorted[i].key);
             delete this.recent[sorted[i].key];
-            await bmRecentStore.removeItem(sorted[i].key);
             isDel = true;
         }
 
         this.sortedRecentCached = null;
 
         if (isDel)
-            this.emit('recent-changed');
+            await this.recentSetItem();
         return isDel;
     }
 
-    mostRecentBook() {
-        if (this.recentLast) {
-            return this.recentLast;
+    async convertFileToDiskPrefix() {
+        let isConverted = false;
+
+        const newRecent = {};
+        for (let key of Object.keys(this.recent)) {
+            let newKey = key;
+            let newUrl = this.recent[key].url;
+
+            if (newKey.indexOf('66696c65') == 0) {
+                newKey = newKey.replace(/^66696c65/, '6469736b');
+                if (newUrl)
+                    newUrl = newUrl.replace(/^file/, 'disk');
+                isConverted = true;
+            }
+
+            newRecent[newKey] = this.recent[key];
+            newRecent[newKey].key = newKey;
+            if (newUrl)
+                newRecent[newKey].url = newUrl;
         }
-        const oldRecentLast = this.recentLast;
+        if (isConverted) {
+            this.recent = newRecent;
+            await this.recentSetItem(null, true);
+        }
+        return isConverted;
+    }
+
+    mostRecentBook() {
+        if (this.recentLastKey) {
+            return this.recent[this.recentLastKey];
+        }
+        const oldKey = this.recentLastKey;
 
         let max = 0;
         let result = null;
@@ -408,10 +497,11 @@ class BookManager {
                 result = book;
             }
         }
-        this.recentLast = result;
-        bmRecentStore.setItem('recent-last', this.recentLast);//no await
+        
+        const newRecentLastKey = (result ? result.key : null);
+        this.recentSetLastKey(newRecentLastKey);//no await
 
-        if (this.recentLast !== oldRecentLast)
+        if (newRecentLastKey !== oldKey)
             this.emit('recent-changed');
 
         return result;
@@ -442,24 +532,12 @@ class BookManager {
                 delete mergedRecent[i];
         }
         
-        //"ленивое" обновление хранилища
-        (async() => {
-            for (const rec of Object.values(mergedRecent)) {
-                if (rec.key) {
-                    await bmRecentStore.setItem(rec.key, rec);
-                    await utils.sleep(1);
-                }
-            }
-        })();
-
         this.recent = mergedRecent;
 
-        this.recentLast = null;
-        await bmRecentStore.setItem('recent-last', this.recentLast);
+        await this.recentSetLastKey(null);
+        await this.recentSetItem(null, true);
 
-        this.recentChanged = true;
         this.emit('set-recent');
-        this.emit('recent-changed');
     }
 
     addEventListener(listener) {

client/components/Reader/share/wallpaperStorage.js

@@ -0,0 +1,27 @@
+import localForage from 'localforage';
+//import _ from 'lodash';
+
+const wpStore = localForage.createInstance({
+    name: 'wallpaperStorage'
+});
+
+class WallpaperStorage {
+
+    async getLength() {
+        return await wpStore.length();
+    }
+
+    async setData(key, data) {
+        await wpStore.setItem(key, data);
+    }
+
+    async getData(key) {
+        return await wpStore.getItem(key);
+    }
+
+    async removeData(key) {
+        await wpStore.removeItem(key);
+    }
+}
+
+export default new WallpaperStorage();

client/components/Reader/versionHistory.js

@@ -1,4 +1,101 @@
 export const versionHistory = [
+{
+    showUntil: '2021-02-16',
+    header: '0.10.0 (2021-02-09)',
+    content:
+`
+<ul>
+    <li>добавлен двухстраничный режим</li>
+    <li>в настройки добавлены все кириллические веб-шрифты от google</li>
+    <li>в настройки добавлена возможность загрузки пользовательских обоев (пока без синхронизации)</li>
+    <li>немного улучшен парсинг fb2</li>
+</ul>
+`
+},
+
+{
+    showUntil: '2020-12-17',
+    header: '0.9.12 (2020-12-18)',
+    content:
+`
+<ul>
+    <li>добавлена вкладка "Изображения" в окно оглавления</li>
+    <li>настройки конвертирования вынесены в отдельную вкладку</li>
+    <li>добавлена кнопка для быстрого доступа к настройкам конвертирования</li>
+    <li>улучшения работы конвертеров</li>
+</ul>
+`
+},
+
+{
+    showUntil: '2020-12-08',
+    header: '0.9.11 (2020-12-09)',
+    content:
+`
+<ul>
+    <li>оптимизации, улучшения работы конвертеров</li>
+</ul>
+`
+},
+
+{
+    showUntil: '2020-12-10',
+    header: '0.9.10 (2020-12-03)',
+    content:
+`
+<ul>
+    <li>добавлена частичная поддержка формата Djvu</li>
+    <li>добавлена поддержка Rar-архивов</li>
+    <li>исправления багов</li>
+</ul>
+`
+},
+
+{
+    showUntil: '2020-11-20',
+    header: '0.9.9 (2020-11-21)',
+    content:
+`
+<ul>
+    <li>оптимизации, исправления багов</li>
+</ul>
+`
+},
+
+{
+    showUntil: '2020-11-12',
+    header: '0.9.8 (2020-11-13)',
+    content:
+`
+<ul>
+    <li>добавлено окно "Оглавление/закладки"</li>
+</ul>
+`
+},
+
+{
+    showUntil: '2020-11-11',
+    header: '0.9.7 (2020-11-12)',
+    content:
+`
+<ul>
+    <li>исправления багов</li>
+</ul>
+`
+},
+
+{
+    showUntil: '2020-11-05',
+    header: '0.9.6 (2020-11-06)',
+    content:
+`
+<ul>
+    <li>завершена работа над новым окном "Библиотека"</li>
+    <li>исправления багов</li>
+</ul>
+`
+},
+
 {
     showUntil: '2020-10-31',
     header: '0.9.5 (2020-11-01)',

client/components/share/Dialog.vue

@@ -1,5 +1,5 @@
 <template>
-    <q-dialog v-model="active">
+    <q-dialog v-model="active" no-route-dismiss>
         <div class="column bg-white no-wrap">
             <div class="header row">
                 <div class="caption col row items-center q-ml-md">
@@ -32,7 +32,7 @@ const DialogProps = Vue.extend({
     props: {
         value: Boolean,
     }
-})
+});
 
 export default @Component({
 })

client/components/share/StdDialog.vue

@@ -1,12 +1,12 @@
 <template>
-    <q-dialog ref="dialog" v-model="active" @show="onShow" @hide="onHide">
+    <q-dialog ref="dialog" v-model="active" @show="onShow" @hide="onHide" no-route-dismiss>
         <slot></slot>
 
         <!--------------------------------------------------->
         <div v-show="type == 'alert'" 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="las la-exclamation-circle" size="28px"></q-icon>
+                    <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">
@@ -29,7 +29,7 @@
         <div v-show="type == 'confirm'" 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="las la-exclamation-circle" size="28px"></q-icon>
+                    <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">
@@ -53,7 +53,7 @@
         <div v-show="type == 'prompt'" 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="las la-exclamation-circle" size="28px"></q-icon>
+                    <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">
@@ -79,7 +79,7 @@
         <div v-show="type == 'hotKey'" 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="las la-exclamation-circle" size="28px"></q-icon>
+                    <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">
@@ -127,6 +127,7 @@ class StdDialog extends Vue {
     inputValue = '';
     error = '';
     iconColor = '';
+    iconName = '';
     hotKeyCode = '';
 
     created() {
@@ -144,12 +145,18 @@ class StdDialog extends Vue {
         this.inputValidator = null;
         this.inputValue = '';
         this.error = '';
+        this.showed = false;
 
         this.iconColor = 'text-warning';
         if (opts && opts.color) {
             this.iconColor = `text-${opts.color}`;
         }
 
+        this.iconName = 'las la-exclamation-circle';
+        if (opts && opts.iconName) {
+            this.iconName = opts.iconName;
+        }
+
         this.hotKeyCode = '';
         if (opts && opts.hotKeyCode) {
             this.hotKeyCode = opts.hotKeyCode;
@@ -161,6 +168,7 @@ class StdDialog extends Vue {
             this.hideTrigger();
             this.hideTrigger = null;
         }
+        this.showed = false;
     }
 
     onShow() {
@@ -170,6 +178,7 @@ class StdDialog extends Vue {
                 this.validate(this.inputValue);
             this.$refs.input.focus();
         }
+        this.showed = true;
     }
 
     validate(value) {
@@ -276,7 +285,7 @@ class StdDialog extends Vue {
     }
 
     keyHook(event) {
-        if (this.active) {
+        if (this.active && this.showed) {
             let handled = false;
             if (this.type == 'hotKey') {
                 if (event.type == 'keydown') {

client/components/share/Window.vue

@@ -32,6 +32,9 @@ export default @Component({
 class Window extends Vue {
     init() {
         this.$nextTick(() => {
+            this.$refs.main.style.top = 0;
+            this.$refs.main.style.left = 0;
+
             this.$refs.windowBox.style.height = this.height;
             this.$refs.windowBox.style.width = this.width;
             if (this.maxWidth)

client/main.js

@@ -4,6 +4,9 @@ import router from './router';
 import store from './store';
 import './quasar';
 
+import vueSanitize from 'vue-sanitize';
+Vue.use(vueSanitize);
+
 import App from './components/App.vue';
 //Vue.config.productionTip = false;
 Vue.prototype.$isMobileDevice = /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent);

client/quasar.js

@@ -21,7 +21,8 @@ import {QSlider} from 'quasar/src/components/slider';
 import {QTabs, QTab} from 'quasar/src/components/tabs';
 //import {QTabPanels, QTabPanel} from 'quasar/src/components/tab-panels';
 import {QSeparator} from 'quasar/src/components/separator';
-import {QList, QItem, QItemSection, QItemLabel} from 'quasar/src/components/item';
+//import {QList} from 'quasar/src/components/item';
+import {QItem, QItemSection, QItemLabel} from 'quasar/src/components/item';
 import {QTooltip} from 'quasar/src/components/tooltip';
 import {QSpinner} from 'quasar/src/components/spinner';
 import {QTable, QTh, QTr, QTd} from 'quasar/src/components/table';
@@ -31,6 +32,8 @@ import {QColor} from 'quasar/src/components/color';
 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 {QExpansionItem} from 'quasar/src/components/expansion-item';
 
 const components = {
     //QLayout,
@@ -47,7 +50,8 @@ const components = {
     QTabs, QTab,
     //QTabPanels, QTabPanel,
     QSeparator,
-    QList, QItem, QItemSection, QItemLabel,
+    //QList,
+    QItem, QItemSection, QItemLabel,
     QTooltip,
     QSpinner,
     QTable, QTh, QTr, QTd,
@@ -57,6 +61,8 @@ const components = {
     QPopupProxy,
     QDialog,
     QChip,
+    QTree,
+    //QExpansionItem,
 };
 
 //directives 

client/share/dynamicCss.js

@@ -0,0 +1,22 @@
+class DynamicCss {
+    constructor() {
+        this.cssNodes = {};
+    }
+
+    replace(name, cssText) {
+        const style = document.createElement('style');
+        style.type = 'text/css';
+        style.innerHTML = cssText;
+
+        const parent = document.getElementsByTagName('head')[0];
+
+        if (this.cssNodes[name]) {
+            parent.removeChild(this.cssNodes[name]);
+            delete this.cssNodes[name];
+        }
+
+        this.cssNodes[name] = parent.appendChild(style);
+    }
+}
+
+export default new DynamicCss();

client/share/utils.js

@@ -103,47 +103,107 @@ export function fromBase64(data) {
     ));
 }
 
-export function getObjDiff(oldObj, newObj) {
-    const result = {__isDiff: true, change: {}, add: {}, del: []};
+export function getObjDiff(oldObj, newObj, opts = {}) {
+    const {
+        exclude = [],
+        excludeAdd = [],
+        excludeDel = [],
+    } = opts;
 
-    for (const key of Object.keys(oldObj)) {
-        if (newObj.hasOwnProperty(key)) {
-            if (!_.isEqual(oldObj[key], newObj[key])) {
-                if (_.isObject(oldObj[key]) && _.isObject(newObj[key])) {
-                    result.change[key] = getObjDiff(oldObj[key], newObj[key]);
-                } else {
-                    result.change[key] = _.cloneDeep(newObj[key]);
+    const ex = new Set(exclude);
+    const exAdd = new Set(excludeAdd);
+    const exDel = new Set(excludeDel);
+
+    const makeObjDiff = (oldObj, newObj, keyPath) => {
+        const result = {__isDiff: true, change: {}, add: {}, del: []};
+
+        keyPath = `${keyPath}${keyPath ? '/' : ''}`;
+
+        for (const key of Object.keys(oldObj)) {
+            const kp = `${keyPath}${key}`;
+
+            if (newObj.hasOwnProperty(key)) {
+                if (ex.has(kp))
+                    continue;
+
+                if (!_.isEqual(oldObj[key], newObj[key])) {
+                    if (_.isObject(oldObj[key]) && _.isObject(newObj[key])) {
+                        result.change[key] = makeObjDiff(oldObj[key], newObj[key], kp);
+                    } else {
+                        result.change[key] = _.cloneDeep(newObj[key]);
+                    }
                 }
+            } else {
+                if (exDel.has(kp))
+                    continue;
+                result.del.push(key);
             }
-        } else {
-            result.del.push(key);
         }
+
+        for (const key of Object.keys(newObj)) {
+            const kp = `${keyPath}${key}`;
+            if (exAdd.has(kp))
+                continue;
+
+            if (!oldObj.hasOwnProperty(key)) {
+                result.add[key] = _.cloneDeep(newObj[key]);
+            }
+        }
+
+        return result;
     }
 
-    for (const key of Object.keys(newObj)) {
-        if (!oldObj.hasOwnProperty(key)) {
-            result.add[key] = _.cloneDeep(newObj[key]);
-        }
-    }
-
-    return result;
+    return makeObjDiff(oldObj, newObj, '');
 }
 
 export function isObjDiff(diff) {
-    return (_.isObject(diff) && diff.__isDiff);
+    return (_.isObject(diff) && diff.__isDiff && diff.change && diff.add && diff.del);
 }
 
 export function isEmptyObjDiff(diff) {
-    return (!_.isObject(diff) || !diff.__isDiff ||
-        (!Object.keys(diff.change).length &&
-            !Object.keys(diff.add).length &&
-            !diff.del.length
+    return (!isObjDiff(diff) ||
+        !(Object.keys(diff.change).length ||
+          Object.keys(diff.add).length ||
+          diff.del.length
         )
     );
 }
 
-export function applyObjDiff(obj, diff, isAddChanged) {
-    const result = _.cloneDeep(obj);
+export function isEmptyObjDiffDeep(diff, opts = {}) {
+    if (!isObjDiff(diff))
+        return true;
+
+    const {
+        isApplyChange = true,
+        isApplyAdd = true,
+        isApplyDel = true,
+    } = opts;
+
+    let notEmptyDeep = false;
+    const change = diff.change;
+    for (const key of Object.keys(change)) {
+        if (_.isObject(change[key]))
+            notEmptyDeep |= !isEmptyObjDiffDeep(change[key], opts);
+        else if (isApplyChange)
+            notEmptyDeep = true;
+    }
+
+    return !(
+        notEmptyDeep ||
+        (isApplyAdd && Object.keys(diff.add).length) ||
+        (isApplyDel && diff.del.length)
+    );
+}
+
+export function applyObjDiff(obj, diff, opts = {}) {
+    const {
+        isAddChanged = false,
+        isApplyChange = true,
+        isApplyAdd = true,
+        isApplyDel = true,
+    } = opts;
+
+    let result = _.cloneDeep(obj);
     if (!diff.__isDiff)
         return result;
 
@@ -151,21 +211,28 @@ export function applyObjDiff(obj, diff, isAddChanged) {
     for (const key of Object.keys(change)) {
         if (result.hasOwnProperty(key)) {
             if (_.isObject(change[key])) {
-                result[key] = applyObjDiff(result[key], change[key], isAddChanged);
+                result[key] = applyObjDiff(result[key], change[key], opts);
             } else {
-                result[key] = _.cloneDeep(change[key]);
+                if (isApplyChange)
+                    result[key] = _.cloneDeep(change[key]);
             }
         } else if (isAddChanged) {
             result[key] = _.cloneDeep(change[key]);
         }
     }
 
-    for (const key of Object.keys(diff.add)) {
-        result[key] = _.cloneDeep(diff.add[key]);
+    if (isApplyAdd) {
+        for (const key of Object.keys(diff.add)) {
+            result[key] = _.cloneDeep(diff.add[key]);
+        }
     }
 
-    for (const key of diff.del) {
-        delete result[key];
+    if (isApplyDel && diff.del.length) {
+        for (const key of diff.del) {
+            delete result[key];
+        }
+        if (_.isArray(result))
+            result = result.filter(v => v);
     }
 
     return result;
@@ -237,3 +304,55 @@ export function userHotKeysObjectSwap(userHotKeys) {
     }
     return result;
 }
+
+export function removeHtmlTags(s) {
+    return s.replace(/(<([^>]+)>)/ig, '');
+}
+
+export function makeValidFilename(filename, repl = '_') {
+    let f = filename.replace(/[\x00\\/:*"<>|]/g, repl); // eslint-disable-line no-control-regex
+    f = f.trim();
+    while (f.length && (f[f.length - 1] == '.' || f[f.length - 1] == '_')) {
+        f = f.substring(0, f.length - 1);
+    }
+
+    if (f)
+        return f;
+    else
+        throw new Error('Invalid filename');
+}
+
+export function getBookTitle(fb2) {
+    fb2 = (fb2 ? fb2 : {});
+    const result = {};
+
+   if (fb2.author) {
+        const authorNames = fb2.author.map(a => _.compact([
+            a.lastName,
+            a.firstName,
+            a.middleName
+        ]).join(' '));
+
+        result.author = authorNames.join(', ');
+    }
+
+    if (fb2.sequence) {
+        const seqs = fb2.sequence.map(s => _.compact([
+            s.name,
+            (s.number ? `#${s.number}` : null),
+        ]).join(' '));
+
+        result.sequence = seqs.join(', ');
+        if (result.sequence)
+            result.sequenceTitle = `(${result.sequence})`;
+    }
+
+    result.bookTitle = _.compact([result.sequenceTitle, fb2.bookTitle]).join(' ');
+
+    result.fullTitle = _.compact([
+        result.author,
+        result.bookTitle
+    ]).join(' - ');
+
+    return result;
+}

client/store/modules/config.js

@@ -10,18 +10,7 @@ const state = {
 const getters = {};
 
 // actions
-const actions = {
-    async loadConfig({ commit, state }) {
-        commit('setApiError', null, { root: true });
-        commit('setConfig', {});
-        try {
-            const config = await miscApi.loadConfig();
-            commit('setConfig', config);
-        } catch (e) {
-            commit('setApiError', e, { root: true });
-        }
-    },
-};
+const actions = {};
 
 // mutations
 const mutations = {

client/store/modules/fonts/fonts.json

@@ -0,0 +1 @@
+["Alegreya","Alegreya SC","Alegreya Sans","Alegreya Sans SC","Alice","Amatic SC","Andika","Anonymous Pro","Arimo","Arsenal","Bad Script","Balsamiq Sans","Bellota","Bellota Text","Bitter","Caveat","Comfortaa","Commissioner","Cormorant","Cormorant Garamond","Cormorant Infant","Cormorant SC","Cormorant Unicase","Cousine","Cuprum","Didact Gothic","EB Garamond","El Messiri","Exo 2","Fira Code","Fira Mono","Fira Sans","Fira Sans Condensed","Fira Sans Extra Condensed","Forum","Gabriela","Hachi Maru Pop","IBM Plex Mono","IBM Plex Sans","IBM Plex Serif","Inter","Istok Web","JetBrains Mono","Jost","Jura","Kelly Slab","Kosugi","Kosugi Maru","Kurale","Ledger","Literata","Lobster","Lora","M PLUS 1p","M PLUS Rounded 1c","Manrope","Marck Script","Marmelad","Merriweather","Montserrat","Montserrat Alternates","Neucha","Noto Sans","Noto Serif","Nunito","Old Standard TT","Open Sans","Open Sans Condensed","Oranienbaum","Oswald","PT Mono","PT Sans","PT Sans Caption","PT Sans Narrow","PT Serif","PT Serif Caption","Pacifico","Pangolin","Pattaya","Philosopher","Piazzolla","Play","Playfair Display","Playfair Display SC","Podkova","Poiret One","Prata","Press Start 2P","Prosto One","Raleway","Roboto","Roboto Condensed","Roboto Mono","Roboto Slab","Rubik","Rubik Mono One","Ruda","Ruslan Display","Russo One","Sawarabi Gothic","Scada","Seymour One","Source Code Pro","Source Sans Pro","Source Serif Pro","Spectral","Spectral SC","Stalinist One","Tenor Sans","Tinos","Ubuntu","Ubuntu Condensed","Ubuntu Mono","Underdog","Viaoda Libre","Vollkorn","Vollkorn SC","Yanone Kaffeesatz","Yeseva One"]

client/store/modules/fonts/fonts2list.js

@@ -0,0 +1,13 @@
+const fs = require('fs-extra');
+
+async function main() {
+    const webfonts = await fs.readFile('webfonts.json');
+    let fonts = JSON.parse(webfonts);
+
+    fonts = fonts.items.filter(item => item.subsets.includes('cyrillic'));
+    fonts = fonts.map(item => item.family);
+    fonts.sort();
+
+    await fs.writeFile('fonts.json', JSON.stringify(fonts));
+}
+main();

client/store/modules/reader.js

@@ -1,3 +1,6 @@
+import * as utils from '../../share/utils';
+import googleFonts from './fonts/fonts.json';
+
 const readerActions = {
     'help': 'Вызвать cправку',
     'loader': 'На страницу загрузки',
@@ -10,10 +13,11 @@ const readerActions = {
     'setPosition': 'Установить позицию',
     'search': 'Найти в тексте',
     'copyText': 'Скопировать текст со страницы',
-    'splitToPara': 'Обновить с разбиением на параграфы',
+    'convOptions': 'Настроить конвертирование',
     'refresh': 'Принудительно обновить книгу',
     'offlineMode': 'Автономный режим (без интернета)',
-    'libs': 'Библиотека',
+    'contents': 'Оглавление/закладки',
+    'libs': 'Сетевая библиотека',
     'recentBooks': 'Открыть недавние',
     'switchToolbar': 'Показать/скрыть панель управления',
     'donate': '',
@@ -38,8 +42,9 @@ const toolButtons = [
     {name: 'setPosition', show: true},
     {name: 'search',      show: true},
     {name: 'copyText',    show: false},
-    {name: 'splitToPara', show: false},
+    {name: 'convOptions', show: true},
     {name: 'refresh',     show: true},
+    {name: 'contents',    show: true},
     {name: 'libs',        show: true},
     {name: 'recentBooks', show: true},
     {name: 'offlineMode', show: false},
@@ -56,12 +61,13 @@ const hotKeys = [
     {name: 'scrolling', codes: ['Z']},
     {name: 'setPosition', codes: ['P']},
     {name: 'search', codes: ['Ctrl+F']},
-    {name: 'copyText', codes: ['Ctrl+C']},
-    {name: 'splitToPara', codes: ['Shift+R']},
+    {name: 'copyText', codes: ['Ctrl+C']},    
+    {name: 'convOptions', codes: ['Ctrl+M']},
     {name: 'refresh', codes: ['R']},
-    {name: 'offlineMode', codes: ['O']},
+    {name: 'contents', codes: ['C']},
     {name: 'libs', codes: ['L']},
     {name: 'recentBooks', codes: ['X']},
+    {name: 'offlineMode', codes: ['O']},
 
     {name: 'switchToolbar', codes: ['Tab', 'Q']},
     {name: 'bookBegin', codes: ['Home']},
@@ -86,125 +92,22 @@ const fonts = [
     {name: 'Rubik', fontVertShift: 0},
 ];
 
-const webFonts = [
-    {css: 'https://fonts.googleapis.com/css?family=Alegreya', name: 'Alegreya', fontVertShift: -5},
-    {css: 'https://fonts.googleapis.com/css?family=Alegreya+Sans', name: 'Alegreya Sans', fontVertShift: 5},
-    {css: 'https://fonts.googleapis.com/css?family=Alegreya+SC', name: 'Alegreya SC', fontVertShift: -5},
-    {css: 'https://fonts.googleapis.com/css?family=Alice', name: 'Alice', fontVertShift: 5},
-    {css: 'https://fonts.googleapis.com/css?family=Amatic+SC', name: 'Amatic SC', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Andika', name: 'Andika', fontVertShift: -35},
-    {css: 'https://fonts.googleapis.com/css?family=Anonymous+Pro', name: 'Anonymous Pro', fontVertShift: 5},
-    {css: 'https://fonts.googleapis.com/css?family=Arsenal', name: 'Arsenal', fontVertShift: 0},
-
-    {css: 'https://fonts.googleapis.com/css?family=Bad+Script', name: 'Bad Script', fontVertShift: -30},
-
-    {css: 'https://fonts.googleapis.com/css?family=Caveat', name: 'Caveat', fontVertShift: -5},
-    {css: 'https://fonts.googleapis.com/css?family=Comfortaa', name: 'Comfortaa', fontVertShift: 10},
-    {css: 'https://fonts.googleapis.com/css?family=Cormorant', name: 'Cormorant', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Cormorant+Garamond', name: 'Cormorant Garamond', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Cormorant+Infant', name: 'Cormorant Infant', fontVertShift: 5},
-    {css: 'https://fonts.googleapis.com/css?family=Cormorant+Unicase', name: 'Cormorant Unicase', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Cousine', name: 'Cousine', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Cuprum', name: 'Cuprum', fontVertShift: 5},
-
-    {css: 'https://fonts.googleapis.com/css?family=Didact+Gothic', name: 'Didact Gothic', fontVertShift: -10},
-
-    {css: 'https://fonts.googleapis.com/css?family=EB+Garamond', name: 'EB Garamond', fontVertShift: -5},
-    {css: 'https://fonts.googleapis.com/css?family=El+Messiri', name: 'El Messiri', fontVertShift: -5},
-
-    {css: 'https://fonts.googleapis.com/css?family=Fira+Mono', name: 'Fira Mono', fontVertShift: 5},
-    {css: 'https://fonts.googleapis.com/css?family=Fira+Sans', name: 'Fira Sans', fontVertShift: 5},
-    {css: 'https://fonts.googleapis.com/css?family=Fira+Sans+Condensed', name: 'Fira Sans Condensed', fontVertShift: 5},
-    {css: 'https://fonts.googleapis.com/css?family=Fira+Sans+Extra+Condensed', name: 'Fira Sans Extra Condensed', fontVertShift: 5},
-    {css: 'https://fonts.googleapis.com/css?family=Forum', name: 'Forum', fontVertShift: 5},
-
-    {css: 'https://fonts.googleapis.com/css?family=Gabriela', name: 'Gabriela', fontVertShift: 5},
-
-    {css: 'https://fonts.googleapis.com/css?family=IBM+Plex+Mono', name: 'IBM Plex Mono', fontVertShift: -5},
-    {css: 'https://fonts.googleapis.com/css?family=IBM+Plex+Sans', name: 'IBM Plex Sans', fontVertShift: -5},
-    {css: 'https://fonts.googleapis.com/css?family=IBM+Plex+Serif', name: 'IBM Plex Serif', fontVertShift: -5},
-    {css: 'https://fonts.googleapis.com/css?family=Istok+Web', name: 'Istok Web', fontVertShift: -5},
-
-    {css: 'https://fonts.googleapis.com/css?family=Jura', name: 'Jura', fontVertShift: 0},
-
-    {css: 'https://fonts.googleapis.com/css?family=Kelly+Slab', name: 'Kelly Slab', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Kosugi', name: 'Kosugi', fontVertShift: 5},
-    {css: 'https://fonts.googleapis.com/css?family=Kosugi+Maru', name: 'Kosugi Maru', fontVertShift: 10},
-    {css: 'https://fonts.googleapis.com/css?family=Kurale', name: 'Kurale', fontVertShift: -15},
-
-    {css: 'https://fonts.googleapis.com/css?family=Ledger', name: 'Ledger', fontVertShift: -5},
-    {css: 'https://fonts.googleapis.com/css?family=Lobster', name: 'Lobster', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Lora', name: 'Lora', fontVertShift: 0},
-
-    {css: 'https://fonts.googleapis.com/css?family=Marck+Script', name: 'Marck Script', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Marmelad', name: 'Marmelad', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Merriweather', name: 'Merriweather', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Montserrat', name: 'Montserrat', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Montserrat+Alternates', name: 'Montserrat Alternates', fontVertShift: 0},
-
-    {css: 'https://fonts.googleapis.com/css?family=Neucha', name: 'Neucha', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Noto+Sans', name: 'Noto Sans', fontVertShift: -10},
-    {css: 'https://fonts.googleapis.com/css?family=Noto+Sans+SC', name: 'Noto Sans SC', fontVertShift: -15},
-    {css: 'https://fonts.googleapis.com/css?family=Noto+Serif', name: 'Noto Serif', fontVertShift: -10},
-    {css: 'https://fonts.googleapis.com/css?family=Noto+Serif+TC', name: 'Noto Serif TC', fontVertShift: -15},
-    
-    {css: 'https://fonts.googleapis.com/css?family=Old+Standard+TT', name: 'Old Standard TT', fontVertShift: 15},
-    {css: 'https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300', name: 'Open Sans Condensed', fontVertShift: -5},
-    {css: 'https://fonts.googleapis.com/css?family=Oranienbaum', name: 'Oranienbaum', fontVertShift: 5},
-    {css: 'https://fonts.googleapis.com/css?family=Oswald', name: 'Oswald', fontVertShift: -20},
-
-    {css: 'https://fonts.googleapis.com/css?family=Pacifico', name: 'Pacifico', fontVertShift: -35},
-    {css: 'https://fonts.googleapis.com/css?family=Pangolin', name: 'Pangolin', fontVertShift: 5},
-    {css: 'https://fonts.googleapis.com/css?family=Pattaya', name: 'Pattaya', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Philosopher', name: 'Philosopher', fontVertShift: 5},
-    {css: 'https://fonts.googleapis.com/css?family=Play', name: 'Play', fontVertShift: 5},
-    {css: 'https://fonts.googleapis.com/css?family=Playfair+Display', name: 'Playfair Display', fontVertShift: -5},
-    {css: 'https://fonts.googleapis.com/css?family=Playfair+Display+SC', name: 'Playfair Display SC', fontVertShift: -5},
-    {css: 'https://fonts.googleapis.com/css?family=Podkova', name: 'Podkova', fontVertShift: 10},
-    {css: 'https://fonts.googleapis.com/css?family=Poiret+One', name: 'Poiret One', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Prata', name: 'Prata', fontVertShift: 5},
-    {css: 'https://fonts.googleapis.com/css?family=Prosto+One', name: 'Prosto One', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=PT+Mono', name: 'PT Mono', fontVertShift: 5},
-    {css: 'https://fonts.googleapis.com/css?family=PT+Sans', name: 'PT Sans', fontVertShift: -10},
-    {css: 'https://fonts.googleapis.com/css?family=PT+Sans+Caption', name: 'PT Sans Caption', fontVertShift: -10},
-    {css: 'https://fonts.googleapis.com/css?family=PT+Sans+Narrow', name: 'PT Sans Narrow', fontVertShift: -10},
-    {css: 'https://fonts.googleapis.com/css?family=PT+Serif', name: 'PT Serif', fontVertShift: -10},
-    {css: 'https://fonts.googleapis.com/css?family=PT+Serif+Caption', name: 'PT Serif Caption', fontVertShift: -10},
-
-    {css: 'https://fonts.googleapis.com/css?family=Roboto+Condensed', name: 'Roboto Condensed', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Roboto+Mono', name: 'Roboto Mono', fontVertShift: -5},
-    {css: 'https://fonts.googleapis.com/css?family=Roboto+Slab', name: 'Roboto Slab', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Ruslan+Display', name: 'Ruslan Display', fontVertShift: 20},
-    {css: 'https://fonts.googleapis.com/css?family=Russo+One', name: 'Russo One', fontVertShift: 5},
-
-    {css: 'https://fonts.googleapis.com/css?family=Sawarabi+Gothic', name: 'Sawarabi Gothic', fontVertShift: -15},
-    {css: 'https://fonts.googleapis.com/css?family=Scada', name: 'Scada', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Seymour+One', name: 'Seymour One', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Source+Sans+Pro', name: 'Source Sans Pro', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Spectral', name: 'Spectral', fontVertShift: -5},
-    {css: 'https://fonts.googleapis.com/css?family=Stalinist+One', name: 'Stalinist One', fontVertShift: 0},
-
-    {css: 'https://fonts.googleapis.com/css?family=Tinos', name: 'Tinos', fontVertShift: 5},
-    {css: 'https://fonts.googleapis.com/css?family=Tenor+Sans', name: 'Tenor Sans', fontVertShift: 5},
-
-    {css: 'https://fonts.googleapis.com/css?family=Underdog', name: 'Underdog', fontVertShift: 10},
-    {css: 'https://fonts.googleapis.com/css?family=Ubuntu+Mono', name: 'Ubuntu Mono', fontVertShift: 0},
-    {css: 'https://fonts.googleapis.com/css?family=Ubuntu+Condensed', name: 'Ubuntu Condensed', fontVertShift: -5},
-
-    {css: 'https://fonts.googleapis.com/css?family=Vollkorn', name: 'Vollkorn', fontVertShift: -5},
-    {css: 'https://fonts.googleapis.com/css?family=Vollkorn+SC', name: 'Vollkorn SC', fontVertShift: 0},
-
-    {css: 'https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz', name: 'Yanone Kaffeesatz', fontVertShift: 20},
-    {css: 'https://fonts.googleapis.com/css?family=Yeseva+One', name: 'Yeseva One', fontVertShift: 10},
-
-
-];
+//webFonts: [{css: 'https://fonts.googleapis.com/css?family=Alegreya', name: 'Alegreya', fontVertShift: 0}, ...],
+const webFonts = [];
+for (const family of googleFonts) {
+    webFonts.push({
+        css: `https://fonts.googleapis.com/css?family=${family.replace(/\s/g, '+')}`,
+        name: family,
+        fontVertShift: 0,
+    });
+}
 
 //----------------------------------------------------------------------------------------------------------
 const settingDefaults = {
     textColor: '#000000',
-    backgroundColor: '#EBE2C9',
+    backgroundColor: '#ebe2c9',
     wallpaper: '',
+    wallpaperIgnoreStatusBar: false,
     fontStyle: '',// 'italic'
     fontWeight: '',// 'bold'
     fontSize: 20,// px
@@ -221,9 +124,22 @@ const settingDefaults = {
     wordWrap: true,//перенос по слогам
     keepLastToFirst: false,// перенос последней строки в первую при листании
 
+    dualPageMode: false,
+    dualIndentLR: 10,// px, отступ слева и справа внутри страницы в двухстраничном режиме
+    dualDivWidth: 2,// px, ширина разделителя
+    dualDivHeight: 100,// процент, высота разделителя
+    dualDivColorAsText: true,//цвет как у текста
+    dualDivColor: '#000000',
+    dualDivColorAlpha: 0.7,// прозрачность разделителя
+    dualDivStrokeFill: 1,// px, заполнение пунктира
+    dualDivStrokeGap: 1,// px, промежуток пунктира
+    dualDivShadowWidth: 0,// px, ширина тени
+
     showStatusBar: true,
     statusBarTop: false,// top, bottom
     statusBarHeight: 19,// px
+    statusBarColorAsText: true,//цвет как у текста
+    statusBarColor: '#000000',
     statusBarColorAlpha: 0.4,
     statusBarClickOpen: true,
 
@@ -246,37 +162,21 @@ const settingDefaults = {
     compactTextPerc: 0,
     imageHeightLines: 100,
     imageFitWidth: true,
+    enableSitesFilter: true,
+    splitToPara: false,
+    djvuQuality: 20,
+    pdfAsText: true,
+    pdfQuality: 20,
+
     showServerStorageMessages: true,
     showWhatsNewDialog: true,
     showDonationDialog2020: true,
-    enableSitesFilter: true,
+    showNeedUpdateNotify: true,
 
     fontShifts: {},
     showToolButton: {},
     userHotKeys: {},
-};
-
-const libsDefaults = {
-    startLink: 'http://flibusta.is',
-    comment: 'Флибуста | Книжное братство',
-    closeAfterSubmit: false,
-    groups: [
-        {r: 'http://flibusta.is', s: 'http://flibusta.is', list: [
-            {l: 'http://flibusta.is', c: 'Флибуста | Книжное братство'},
-        ]},
-        {r: 'http://samlib.ru', s: 'http://samlib.ru', list: [
-            {l: 'http://samlib.ru', c: 'Журнал "Самиздат"'},
-        ]},
-        {r: 'http://lib.ru', s: 'http://lib.ru', list: [
-            {l: 'http://lib.ru', c: 'Библиотека Максима Мошкова'},
-        ]},
-        {r: 'http://fantasy-worlds.org', s: 'http://fantasy-worlds.org', list: [
-            {l: 'http://fantasy-worlds.org', c: 'Миры Фэнтези'},
-        ]},
-        {r: 'https://aldebaran.ru', s: 'https://aldebaran.ru', list: [
-            {l: 'https://aldebaran.ru', c: 'АЛЬДЕБАРАН | Электронная библиотека книг'},
-        ]},
-    ]
+    userWallpapers: [],
 };
 
 for (const font of fonts)
@@ -288,6 +188,48 @@ for (const button of toolButtons)
 for (const hotKey of hotKeys)
     settingDefaults.userHotKeys[hotKey.name] = hotKey.codes;
 
+const diffExclude = [];
+for (const hotKey of hotKeys)
+    diffExclude.push(`userHotKeys/${hotKey.name}`);
+diffExclude.push('userWallpapers');
+
+function addDefaultsToSettings(settings) {
+    const diff = utils.getObjDiff(settings, settingDefaults, {exclude: diffExclude});
+    if (!utils.isEmptyObjDiffDeep(diff, {isApplyChange: false})) {
+        return utils.applyObjDiff(settings, diff, {isApplyChange: false});
+    }
+
+    return false;
+}
+
+const libsDefaults = {
+    startLink: 'http://flibusta.is',
+    comment: 'Флибуста | Книжное братство',
+    closeAfterSubmit: false,
+    openInFrameOnEnter: false,
+    openInFrameOnAdd: false,
+    groups: [
+        {r: 'http://flibusta.is', s: 'http://flibusta.is', list: [
+            {l: 'http://flibusta.is', c: 'Флибуста | Книжное братство'},
+        ]},
+        {r: 'https://flibs.in', s: 'https://flibs.in', list: [
+            {l: 'https://flibs.in', c: 'Flibs'},
+        ]},
+        {r: 'http://fantasy-worlds.org', s: 'http://fantasy-worlds.org', list: [
+            {l: 'http://fantasy-worlds.org', c: 'Миры Фэнтези'},
+        ]},
+        {r: 'http://samlib.ru', s: 'http://samlib.ru', list: [
+            {l: 'http://samlib.ru', c: 'Журнал "Самиздат"'},
+        ]},
+        {r: 'http://lib.ru', s: 'http://lib.ru', list: [
+            {l: 'http://lib.ru', c: 'Библиотека Максима Мошкова'},
+        ]},
+        {r: 'https://aldebaran.ru', s: 'https://aldebaran.ru', list: [
+            {l: 'https://aldebaran.ru', c: 'АЛЬДЕБАРАН | Электронная библиотека книг'},
+        ]},
+    ]
+};
+
 // initial state
 const state = {
     toolBarActive: true,
@@ -341,7 +283,13 @@ const mutations = {
         state.currentProfile = value;
     },
     setSettings(state, value) {
-        state.settings = Object.assign({}, state.settings, value);
+        const newSettings = Object.assign({}, state.settings, value);
+        const added = addDefaultsToSettings(newSettings);
+        if (added) {
+            state.settings = added;
+        } else {
+            state.settings = newSettings;
+        }
     },
     setSettingsRev(state, value) {
         state.settingsRev = Object.assign({}, state.settingsRev, value);
@@ -361,6 +309,7 @@ export default {
     fonts,
     webFonts,
     settingDefaults,
+    addDefaultsToSettings,
     libsDefaults,
 
     namespaced: true,

docs/beta/run_server.sh

@@ -1,3 +1,3 @@
 #!/bin/bash
 
-sudo -H -u www-data /home/beta.liberama/liberama
+sudo -H -u www-data bash -c "cd /var/www; /home/beta.liberama/liberama"

docs/liberama.top/liberama

@@ -126,3 +126,18 @@ server {
     proxy_set_header Referer "";
   }
 }
+
+server {
+  listen 23580;
+  server_name fw_proxy;
+
+  valid_referers liberama.top b.liberama.top;
+
+  if ($invalid_referer) {
+    return 403;
+  }
+
+  location / {
+    proxy_pass http://fantasy-worlds.org;
+  }
+}

docs/omnireader.ru/README.md

@@ -27,15 +27,19 @@ sudo chown www-data.www-data /home/liberama
 
 ### external converter `calibre`, download from https://download.calibre-ebook.com/
 ```
-wget "https://download.calibre-ebook.com/3.39.1/calibre-3.39.1-x86_64.txz"
+wget "https://download.calibre-ebook.com/5.5.0/calibre-5.5.0-x86_64.txz"
 sudo -u www-data mkdir -p /home/liberama/data/calibre
-sudo -u www-data tar xvf calibre-3.39.1-x86_64.txz -C /home/liberama/data/calibre
+sudo -u www-data tar xvf calibre-5.5.0-x86_64.txz -C /home/liberama/data/calibre
 ```
 
 ### external converters
 ```
+sudo apt install rar
 sudo apt install libreoffice
 sudo apt install poppler-utils
+sudo apt install djvulibre-bin
+sudo apt install libtiff-tools
+sudo apt install graphicsmagick-imagemagick-compat
 ```
 
 ### nginx, server config

docs/omnireader.ru/cron_server.sh

@@ -1,7 +1,7 @@
 #!/bin/bash
 
 if ! pgrep -x "liberama" > /dev/null ; then
-    sudo -H -u www-data /home/liberama/liberama
+    sudo -H -u www-data bash -c "cd /var/www; /home/liberama/liberama"
 else
     echo "Process 'liberama' already running"
 fi

docs/omnireader.ru/start_server.sh

@@ -1,4 +1,4 @@
 #!/bin/bash
 
-sudo -H -u www-data /home/liberama/liberama &
+sudo -H -u www-data bash -c "cd /var/www; /home/liberama/liberama" & disown
 sudo service cron start

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "Liberama",
-  "version": "0.9.5",
+  "version": "0.9.11",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -36,12 +36,6 @@
             "pkg-up": "^2.0.0"
           }
         },
-        "caniuse-lite": {
-          "version": "1.0.30001062",
-          "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001062.tgz",
-          "integrity": "sha512-ei9ZqeOnN7edDrb24QfJ0OZicpEbsWxv7WusOiQGz/f2SfvBgHHbOEwBJ8HKGVSyx8Z6ndPjxzR6m0NQq+0bfw==",
-          "dev": true
-        },
         "electron-to-chromium": {
           "version": "1.3.446",
           "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.446.tgz",
@@ -321,12 +315,6 @@
             "pkg-up": "^2.0.0"
           }
         },
-        "caniuse-lite": {
-          "version": "1.0.30001062",
-          "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001062.tgz",
-          "integrity": "sha512-ei9ZqeOnN7edDrb24QfJ0OZicpEbsWxv7WusOiQGz/f2SfvBgHHbOEwBJ8HKGVSyx8Z6ndPjxzR6m0NQq+0bfw==",
-          "dev": true
-        },
         "electron-to-chromium": {
           "version": "1.3.446",
           "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.446.tgz",
@@ -1603,12 +1591,6 @@
             "pkg-up": "^2.0.0"
           }
         },
-        "caniuse-lite": {
-          "version": "1.0.30001062",
-          "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001062.tgz",
-          "integrity": "sha512-ei9ZqeOnN7edDrb24QfJ0OZicpEbsWxv7WusOiQGz/f2SfvBgHHbOEwBJ8HKGVSyx8Z6ndPjxzR6m0NQq+0bfw==",
-          "dev": true
-        },
         "electron-to-chromium": {
           "version": "1.3.446",
           "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.446.tgz",
@@ -4017,9 +3999,9 @@
       }
     },
     "caniuse-lite": {
-      "version": "1.0.30000989",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000989.tgz",
-      "integrity": "sha512-vrMcvSuMz16YY6GSVZ0dWDTJP8jqk3iFQ/Aq5iqblPwxSVVZI+zxDyTX0VPqtQsDnfdrBDcsmhgTEOh5R8Lbpw==",
+      "version": "1.0.30001154",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001154.tgz",
+      "integrity": "sha512-y9DvdSti8NnYB9Be92ddMZQrcOe04kcQtcxtBx4NkB04+qZ+JUWotnXBJTmxlKudhxNTQ3RRknMwNU2YQl/Org==",
       "dev": true
     },
     "caseless": {
@@ -4373,6 +4355,11 @@
         "simple-swizzle": "^0.2.2"
       }
     },
+    "colorette": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.1.tgz",
+      "integrity": "sha512-puCDz0CzydiSYOrnXpz/PKd69zRrribezjtE9yd4zvytoRc8+RY/KJPvtPFKZS3E3wP6neGyMe0vOTlHO5L3Pw=="
+    },
     "combined-stream": {
       "version": "1.0.8",
       "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
@@ -4759,12 +4746,6 @@
             "pkg-up": "^2.0.0"
           }
         },
-        "caniuse-lite": {
-          "version": "1.0.30001062",
-          "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001062.tgz",
-          "integrity": "sha512-ei9ZqeOnN7edDrb24QfJ0OZicpEbsWxv7WusOiQGz/f2SfvBgHHbOEwBJ8HKGVSyx8Z6ndPjxzR6m0NQq+0bfw==",
-          "dev": true
-        },
         "electron-to-chromium": {
           "version": "1.3.446",
           "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.446.tgz",
@@ -8696,6 +8677,11 @@
       "integrity": "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==",
       "dev": true
     },
+    "klona": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/klona/-/klona-2.0.4.tgz",
+      "integrity": "sha512-ZRbnvdg/NxqzC7L9Uyqzf4psi1OM4Cuc+sJAkQPjO6XkQIJTNbfK2Rsmbw8fx1p2mkZdp2FZYo2+LwXYY/uwIA=="
+    },
     "last-call-webpack-plugin": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/last-call-webpack-plugin/-/last-call-webpack-plugin-3.0.0.tgz",
@@ -8790,6 +8776,30 @@
         "immediate": "~3.0.5"
       }
     },
+    "line-column": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/line-column/-/line-column-1.0.2.tgz",
+      "integrity": "sha1-0lryk2tvSEkXKzEuR5LR2Ye8NKI=",
+      "requires": {
+        "isarray": "^1.0.0",
+        "isobject": "^2.0.0"
+      },
+      "dependencies": {
+        "isarray": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+        },
+        "isobject": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
+          "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=",
+          "requires": {
+            "isarray": "1.0.0"
+          }
+        }
+      }
+    },
     "loader-runner": {
       "version": "2.4.0",
       "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-2.4.0.tgz",
@@ -9372,6 +9382,11 @@
       "resolved": "https://registry.npmjs.org/nan/-/nan-2.14.0.tgz",
       "integrity": "sha512-INOFj37C7k3AfaNTtX8RhsTw7qRy7eLET14cROi9+5HAVbbHuIWUHEauBv5qT4Av2tWasiTY1Jw6puUNqRJXQg=="
     },
+    "nanoid": {
+      "version": "3.1.16",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.16.tgz",
+      "integrity": "sha512-+AK8MN0WHji40lj8AEuwLOvLSbWYApQpre/aFJZD71r43wVRLrOYS4FmJOPQYon1TqB462RzrrxlfA74XRES8w=="
+    },
     "nanomatch": {
       "version": "1.2.13",
       "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.13.tgz",
@@ -10010,6 +10025,11 @@
       "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY=",
       "dev": true
     },
+    "parse-srcset": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/parse-srcset/-/parse-srcset-1.0.2.tgz",
+      "integrity": "sha1-8r0iH2zJcKk42IVWq8WJyqqiveE="
+    },
     "parseurl": {
       "version": "1.3.3",
       "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
@@ -10104,6 +10124,21 @@
       "integrity": "sha512-ISBaA8xQNmwELC7eOjqFKMESB2VIqt4PPDD0nsS95b/9dZXvVKOlz9keMSnoGGKcOHXfTvDD6WMaRoSc9UuhRA==",
       "dev": true
     },
+    "pidusage": {
+      "version": "2.0.21",
+      "resolved": "https://registry.npmjs.org/pidusage/-/pidusage-2.0.21.tgz",
+      "integrity": "sha512-cv3xAQos+pugVX+BfXpHsbyz/dLzX+lr44zNMsYiGxUw+kV5sgQCIcLd1z+0vq+KyC7dJ+/ts2PsfgWfSC3WXA==",
+      "requires": {
+        "safe-buffer": "^5.2.1"
+      },
+      "dependencies": {
+        "safe-buffer": {
+          "version": "5.2.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
+          "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ=="
+        }
+      }
+    },
     "pify": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
@@ -13306,6 +13341,97 @@
       "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
       "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
     },
+    "sanitize-html": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/sanitize-html/-/sanitize-html-2.1.1.tgz",
+      "integrity": "sha512-yb+I+K25cn6PzsRJb+kGdlOBC3SkvEwJrr/Xl+6YR42oDZDeu61yWeEMSEi0hCKlRSYlWWE4tUnF2Ds+c/M1Vg==",
+      "requires": {
+        "deepmerge": "^4.2.2",
+        "escape-string-regexp": "^4.0.0",
+        "htmlparser2": "^4.1.0",
+        "is-plain-object": "^5.0.0",
+        "klona": "^2.0.3",
+        "parse-srcset": "^1.0.2",
+        "postcss": "^8.0.2"
+      },
+      "dependencies": {
+        "dom-serializer": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.1.0.tgz",
+          "integrity": "sha512-ox7bvGXt2n+uLWtCRLybYx60IrOlWL/aCebWJk1T0d4m3y2tzf4U3ij9wBMUb6YJZpz06HCCYuyCDveE2xXmzQ==",
+          "requires": {
+            "domelementtype": "^2.0.1",
+            "domhandler": "^3.0.0",
+            "entities": "^2.0.0"
+          }
+        },
+        "domelementtype": {
+          "version": "2.0.2",
+          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.0.2.tgz",
+          "integrity": "sha512-wFwTwCVebUrMgGeAwRL/NhZtHAUyT9n9yg4IMDwf10+6iCMxSkVq9MGCVEH+QZWo1nNidy8kNvwmv4zWHDTqvA=="
+        },
+        "domhandler": {
+          "version": "3.3.0",
+          "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-3.3.0.tgz",
+          "integrity": "sha512-J1C5rIANUbuYK+FuFL98650rihynUOEzRLxW+90bKZRWB6A1X1Tf82GxR1qAWLyfNPRvjqfip3Q5tdYlmAa9lA==",
+          "requires": {
+            "domelementtype": "^2.0.1"
+          }
+        },
+        "domutils": {
+          "version": "2.4.2",
+          "resolved": "https://registry.npmjs.org/domutils/-/domutils-2.4.2.tgz",
+          "integrity": "sha512-NKbgaM8ZJOecTZsIzW5gSuplsX2IWW2mIK7xVr8hTQF2v1CJWTmLZ1HOCh5sH+IzVPAGE5IucooOkvwBRAdowA==",
+          "requires": {
+            "dom-serializer": "^1.0.1",
+            "domelementtype": "^2.0.1",
+            "domhandler": "^3.3.0"
+          }
+        },
+        "entities": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/entities/-/entities-2.1.0.tgz",
+          "integrity": "sha512-hCx1oky9PFrJ611mf0ifBLBRW8lUUVRlFolb5gWRfIELabBlbp9xZvrqZLZAs+NxFnbfQoeGd8wDkygjg7U85w=="
+        },
+        "escape-string-regexp": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz",
+          "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA=="
+        },
+        "htmlparser2": {
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-4.1.0.tgz",
+          "integrity": "sha512-4zDq1a1zhE4gQso/c5LP1OtrhYTncXNSpvJYtWJBtXAETPlMfi3IFNjGuQbYLuVY4ZR0QMqRVvo4Pdy9KLyP8Q==",
+          "requires": {
+            "domelementtype": "^2.0.1",
+            "domhandler": "^3.0.0",
+            "domutils": "^2.0.0",
+            "entities": "^2.0.0"
+          }
+        },
+        "is-plain-object": {
+          "version": "5.0.0",
+          "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-5.0.0.tgz",
+          "integrity": "sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q=="
+        },
+        "postcss": {
+          "version": "8.1.4",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.1.4.tgz",
+          "integrity": "sha512-LfqcwgMq9LOd8pX7K2+r2HPitlIGC5p6PoZhVELlqhh2YGDVcXKpkCseqan73Hrdik6nBd2OvoDPUaP/oMj9hQ==",
+          "requires": {
+            "colorette": "^1.2.1",
+            "line-column": "^1.0.2",
+            "nanoid": "^3.1.15",
+            "source-map": "^0.6.1"
+          }
+        },
+        "source-map": {
+          "version": "0.6.1",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+          "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="
+        }
+      }
+    },
     "sax": {
       "version": "1.2.4",
       "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
@@ -15193,6 +15319,14 @@
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.1.6.tgz",
       "integrity": "sha512-GYhn2ynaZlysZMkFE5oCHRUTqE8BWs/a9YbKpNLi0i7xD6KG1EzDqpHQmv1F5gXjr8kL5iIVS8EOtRaVUEXTqA=="
     },
+    "vue-sanitize": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/vue-sanitize/-/vue-sanitize-0.2.1.tgz",
+      "integrity": "sha512-MhrfAaAqIQ8JXWfdlhK6f+H2WnZ7KQwkOgLNeUyfACI2bq/3HPZ2zeUQDathnLdsXMXAa8pJehOgPYtlaG9Jew==",
+      "requires": {
+        "sanitize-html": "^2.1.1"
+      }
+    },
     "vue-style-loader": {
       "version": "4.1.2",
       "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.2.tgz",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "Liberama",
-  "version": "0.9.5",
+  "version": "0.10.0",
   "author": "Book Pauk <bookpauk@gmail.com>",
   "license": "CC0-1.0",
   "repository": "bookpauk/liberama",
@@ -8,10 +8,10 @@
     "node": ">=10.0.0"
   },
   "scripts": {
-    "dev": "nodemon --inspect --exec 'node server'",
+    "dev": "nodemon --inspect --ignore server/public --ignore server/data --ignore client --exec 'node server'",
     "build:client": "webpack --config build/webpack.prod.config.js",
-    "build:linux": "npm run build:client && node build/linux && pkg -t latest-linux-x64 -o dist/linux/liberama .",
-    "build:win": "npm run build:client && node build/win && pkg -t latest-win-x64 -o dist/win/liberama .",
+    "build:linux": "npm run build:client && node build/linux && pkg -t node12-linux-x64 -o dist/linux/liberama .",
+    "build:win": "npm run build:client && node build/win && pkg -t node12-win-x64 -o dist/win/liberama .",
     "lint": "eslint --ext=.js,.vue client server",
     "build:client-dev": "webpack --config build/webpack.dev.config.js",
     "postinstall": "npm run build:client-dev && node build/linux"
@@ -72,6 +72,7 @@
     "multer": "^1.4.2",
     "pako": "^1.0.11",
     "path-browserify": "^1.0.0",
+    "pidusage": "^2.0.21",
     "quasar": "^1.14.3",
     "safe-buffer": "^5.2.0",
     "sjcl": "^1.0.8",
@@ -81,6 +82,7 @@
     "unbzip2-stream": "^1.3.3",
     "vue": "github:bookpauk/vue",
     "vue-router": "^3.1.6",
+    "vue-sanitize": "^0.2.1",
     "vuex": "^3.1.2",
     "vuex-persistedstate": "^2.7.1",
     "webdav": "^2.10.2",

server/config/base.js

@@ -18,7 +18,7 @@ module.exports = {
     loggingEnabled: true,
 
     maxUploadFileSize: 50*1024*1024,//50Мб
-    maxTempPublicDirSize: 512*1024*1024,//512Мб
+    maxTempPublicDirSize: 512*1024*1024,//512Мб + 20% квота если проблема с remoteWebDavStorage
     maxUploadPublicDirSize: 200*1024*1024,//100Мб
 
     useExternalBookConverter: false,

server/controllers/ReaderController.js

@@ -20,8 +20,12 @@ class ReaderController extends BaseController {
             const workerId = this.readerWorker.loadBookUrl({
                 url: request.url, 
                 enableSitesFilter: (request.hasOwnProperty('enableSitesFilter') ? request.enableSitesFilter : true),
-                skipCheck: (request.hasOwnProperty('skipCheck') ? request.skipCheck : false),
+                skipHtmlCheck: (request.hasOwnProperty('skipHtmlCheck') ? request.skipHtmlCheck : false),
                 isText: (request.hasOwnProperty('isText') ? request.isText : false),
+                uploadFileName: (request.hasOwnProperty('uploadFileName') ? request.uploadFileName : false),
+                djvuQuality: (request.hasOwnProperty('djvuQuality') ? request.djvuQuality : false),
+                pdfAsText: (request.hasOwnProperty('pdfAsText') ? request.pdfAsText : false),
+                pdfQuality: (request.hasOwnProperty('pdfQuality') ? request.pdfQuality : false),
             });
             const state = this.workerState.getState(workerId);
             return (state ? state : {});

server/controllers/WebSocketController.js

@@ -50,8 +50,14 @@ class WebSocketController {
                 log(`WebSocket-IN:  ${message.substr(0, 4000)}`);
             }
 
-            ws.lastActivity = Date.now();
             req = JSON.parse(message);
+
+            ws.lastActivity = Date.now();
+            
+            //pong for WebSocketConnection
+            if (req._rpo === 1)
+                this.send({_rok: 1}, req, ws);
+
             switch (req.action) {
                 case 'test':
                     await this.test(req, ws); break;
@@ -136,8 +142,9 @@ class WebSocketController {
                 break;
 
             i++;
-            if (i > 2*60*1000/refreshPause) {//2 мин ждем телодвижений воркера
+            if (i > 3*60*1000/refreshPause) {//3 мин ждем телодвижений воркера
                 this.send({state: 'error', error: 'Время ожидания процесса истекло'}, req, ws);
+                break;
             }
             i = (prevProgress != state.progress || prevState != state.state ? 1 : i);
         }        

server/core/FileDecompressor.js

@@ -15,6 +15,13 @@ class FileDecompressor {
     constructor(limitFileSize = 0) {
         this.detector = new FileDetector();
         this.limitFileSize = limitFileSize;
+
+        this.rarPath = '/usr/bin/rar';
+        this.rarExists = false;
+        (async() => {
+            if (await fs.pathExists(this.rarPath))
+                this.rarExists = true;
+        })();
     }
 
     async decompressNested(filename, outputDir) {
@@ -30,7 +37,11 @@ class FileDecompressor {
             files: []
         };
 
-        if (!fileType || !(fileType.ext == 'zip' || fileType.ext == 'bz2' || fileType.ext == 'gz' || fileType.ext == 'tar')) {
+        if (!fileType || !(
+                    fileType.ext == 'zip' || fileType.ext == 'bz2' || fileType.ext == 'gz'
+                    || fileType.ext == 'tar' || (this.rarExists && fileType.ext == 'rar')
+                )
+            ) {
             return result;
         }
 
@@ -94,6 +105,11 @@ class FileDecompressor {
     async decompress(fileExt, filename, outputDir) {
         let files = [];
 
+        if (fileExt == 'rar' && this.rarExists) {
+            files = await this.unRar(filename, outputDir);
+            return files;
+        }
+
         switch (fileExt) {
             case 'zip':
                 files = await this.unZip(filename, outputDir);
@@ -119,17 +135,16 @@ class FileDecompressor {
         try {
             return await zip.unpack(filename, outputDir, {
                 limitFileSize: this.limitFileSize, 
-                limitFileCount: 1000,
+                limitFileCount: 10000,
                 decodeEntryNameCallback: (nameRaw) => {
                     return utils.bufferRemoveZeroes(nameRaw);
                 }
-            }
-);
+            });
         } catch (e) {
             fs.emptyDir(outputDir);
             return await zip.unpack(filename, outputDir, {
                 limitFileSize: this.limitFileSize, 
-                limitFileCount: 1000,
+                limitFileCount: 10000,
                 decodeEntryNameCallback: (nameRaw) => {
                     nameRaw = utils.bufferRemoveZeroes(nameRaw);
                     const enc = textUtils.getEncodingLite(nameRaw);
@@ -156,7 +171,7 @@ class FileDecompressor {
 
             if (this.limitFileSize) {
                 if ((await fs.stat(filename)).size > this.limitFileSize) {
-                    reject('Файл слишком большой');
+                    reject(new Error('Файл слишком большой'));
                     return;
                 }
             }
@@ -222,7 +237,39 @@ class FileDecompressor {
         
             inputStream.pipe(stream).pipe(outputStream);
         })().catch(reject); });
-   }
+    }
+
+    async unRar(filename, outputDir) {
+        try {
+            const args = ['x', '-p-', '-y', filename, `${outputDir}`];
+            const result = await utils.spawnProcess(this.rarPath, {
+                killAfter: 60,
+                args
+            });
+
+            if (result.code == 0) {
+                const files = [];
+                await utils.findFiles(async(file) => {
+                    const stat = await fs.stat(file);
+                    files.push({path: path.relative(outputDir, file), size: stat.size});
+                }, outputDir);
+
+                return files;
+
+            } else {
+                const error = `${result.code}|FORLOG|, exec: ${this.rarPath}, args: ${args.join(' ')}, stdout: ${result.stdout}, stderr: ${result.stderr}`;
+                throw new Error(`Архиватор Rar завершился с ошибкой: ${error}`);
+            }
+        } catch(e) {
+            if (e.status == 'killed') {
+                throw new Error('Слишком долгое ожидание архиватора Rar');
+            } else if (e.status == 'error') {
+                throw new Error(e.error);
+            } else {
+                throw new Error(e);
+            }
+        }
+    }
 
     async gzipBuffer(buf) {
         return new Promise((resolve, reject) => {

server/core/FileDetector/index.js

@@ -54,7 +54,7 @@ class FileDetector {
 
     fromBuffer(buffer, callback) {
         let result = null;
-
+        //console.log(buffer);
         const invalidSignaturesList = this.validateSigantures();
         if (invalidSignaturesList.length) {
             return callback(invalidSignaturesList);

server/core/FileDetector/signatures.json

@@ -676,7 +676,9 @@
         { "type": "equal", "end": 19, "bytes": "3c3f786d6c2076657273696f6e3d22312e3022" },
         { "type": "equal", "end": 22, "bytes": "efbbbf3c3f786d6c2076657273696f6e3d22312e3022" },
         { "type": "equal", "end": 19, "bytes": "3c3f786d6c2076657273696f6e3d27312e3027" },
-        { "type": "equal", "end": 22, "bytes": "efbbbf3c3f786d6c2076657273696f6e3d27312e3027" }
+        { "type": "equal", "end": 22, "bytes": "efbbbf3c3f786d6c2076657273696f6e3d27312e3027" },
+        { "type": "equal", "end": 40, "bytes": "fffe3c003f0078006d006c002000760065007200730069006f006e003d00220031002e0030002200" },
+        { "type": "equal", "end": 40, "bytes": "fffe3c003f0078006d006c002000760065007200730069006f006e003d00270031002e0030002700" }
       ]
       }
     ]

server/core/LimitedQueue.js

@@ -28,7 +28,7 @@ class LimitedQueue {
     get(onPlaceChange) {
         return new Promise((resolve, reject) => {
             if (this.destroyed)
-                reject('destroyed');
+                reject(new Error('destroyed'));
 
             const take = () => {
                 if (this.freed <= 0)
@@ -73,7 +73,7 @@ class LimitedQueue {
                     if (onPlaceChange)
                         onPlaceChange(this.listeners.length);
                 } else {
-                    reject('Превышен размер очереди ожидания');
+                    reject(new Error('Превышен размер очереди ожидания'));
                 }
             }
         });

server/core/Reader/BookConverter/.gitignore

@@ -1 +0,0 @@
-test

server/core/Reader/BookConverter/ConvertBase.js

@@ -5,8 +5,9 @@ const he = require('he');
 const LimitedQueue = require('../../LimitedQueue');
 const textUtils = require('./textUtils');
 const utils = require('../../utils');
+const xmlParser = require('../../xmlParser');
 
-const queue = new LimitedQueue(2, 20, 3*60*1000);//3 минуты ожидание подвижек
+const queue = new LimitedQueue(3, 20, 2*60*1000);//2 минуты ожидание подвижек
 
 class ConvertBase {
     constructor(config) {
@@ -14,7 +15,6 @@ class ConvertBase {
 
         this.calibrePath = `${config.dataDir}/calibre/ebook-convert`;
         this.sofficePath = '/usr/bin/soffice';
-        this.pdfToHtmlPath = '/usr/bin/pdftohtml';
     }
 
     async run(data, opts) {// eslint-disable-line no-unused-vars
@@ -27,9 +27,6 @@ class ConvertBase {
 
         if (!await fs.pathExists(this.sofficePath))
             throw new Error('Внешний конвертер LibreOffice не найден');
-
-        if (!await fs.pathExists(this.pdfToHtmlPath))
-            throw new Error('Внешний конвертер pdftohtml не найден');
     }
 
     async execConverter(path, args, onData, abort) {
@@ -42,22 +39,38 @@ class ConvertBase {
             throw new Error('Слишком большая очередь конвертирования. Пожалуйста, попробуйте позже.');
         }
 
+        abort = (abort ? abort : () => false);
+        const myAbort = () => {
+            return q.abort() || abort();
+        }
+
         try {
+            if (myAbort())
+                throw new Error('abort');
+
             const result = await utils.spawnProcess(path, {
-                killAfter: 600,
+                killAfter: 3600,//1 час
                 args, 
                 onData: (data) => {
-                    q.resetTimeout();
+                    if (queue.freed > 0)
+                        q.resetTimeout();
                     onData(data);
                 },
-                abort
+                //будем периодически проверять работу конвертера и если очереди нет, то разрешаем работу пинком onData
+                onUsage: (stats) => {
+                    if (queue.freed > 0 && stats.cpu >= 10) {
+                        q.resetTimeout();
+                        onData('.');
+                    }
+                },
+                onUsageInterval: 10,
+                abort: myAbort
             });
             if (result.code != 0) {
-                let error = result.code;
-                if (this.config.branch == 'development')
-                    error = `exec: ${path}, stdout: ${result.stdout}, stderr: ${result.stderr}`;
+                const error = `${result.code}|FORLOG|, exec: ${path}, args: ${args.join(' ')}, stdout: ${result.stdout}, stderr: ${result.stderr}`;
                 throw new Error(`Внешний конвертер завершился с ошибкой: ${error}`);
             }
+            return result;
         } catch(e) {
             if (e.status == 'killed') {
                 throw new Error('Слишком долгое ожидание конвертера');
@@ -90,62 +103,20 @@ class ConvertBase {
         return he.escape(he.decode(text.replace(/ /g, ' ')));
     }
 
-    formatFb2(fb2) {
-        let out = '<?xml version="1.0" encoding="utf-8"?>';
-        out += '<FictionBook xmlns="http://www.gribuser.ru/xml/fictionbook/2.0" xmlns:l="http://www.w3.org/1999/xlink">';
-        out += this.formatFb2Node(fb2);
-        out += '</FictionBook>';
-        return out;
+    isDataXml(data) {
+        const str = data.slice(0, 100).toString().trim();
+        return (str.indexOf('<?xml version="1.0"') == 0 || str.indexOf('<?xml version=\'1.0\'') == 0 );
     }
 
-    formatFb2Node(node, name) {
-        let out = '';
-
-        if (Array.isArray(node)) {
-            for (const n of node) {
-                out += this.formatFb2Node(n);
+    formatFb2(fb2) {
+        const out = xmlParser.formatXml({
+            FictionBook: {
+                _attrs: {xmlns: 'http://www.gribuser.ru/xml/fictionbook/2.0', 'xmlns:l': 'http://www.w3.org/1999/xlink'},
+                _a: [fb2],
             }
-        } else if (typeof node == 'string') {
-            if (name)
-                out += `<${name}>${this.repSpaces(node)}</${name}>`;
-            else
-                out += this.repSpaces(node);
-        } else {
-            if (node._n)
-                name = node._n;
+        }, 'utf-8', this.repSpaces);
 
-            let attrs = '';
-            if (node._attrs) {
-                for (let attrName in node._attrs) {
-                    attrs += ` ${attrName}="${node._attrs[attrName]}"`;
-                }
-            }
-
-            let tOpen = '';
-            let tBody = '';
-            let tClose = '';
-            if (name)
-                tOpen += `<${name}${attrs}>`;
-            if (node.hasOwnProperty('_t'))
-                tBody += this.repSpaces(node._t);
-
-            for (let nodeName in node) {
-                if (nodeName && nodeName[0] == '_' && nodeName != '_a')
-                    continue;
-
-                const n = node[nodeName];
-                tBody += this.formatFb2Node(n, nodeName);
-            }
-            
-            if (name)
-                tClose += `</${name}>`;
-
-            if (attrs == '' && name == 'p' && tBody.trim() == '')
-                out += '<empty-line/>'
-            else
-                out += `${tOpen}${tBody}${tClose}`;
-        }
-        return out;
+        return out.replace(/<p>\s*?<\/p>/g, '<empty-line/>');
     }
 }
 

server/core/Reader/BookConverter/ConvertDjvu.js

@@ -0,0 +1,119 @@
+const fs = require('fs-extra');
+const path = require('path');
+const utils = require('../../utils');
+
+const ConvertJpegPng = require('./ConvertJpegPng');
+
+class ConvertDjvu extends ConvertJpegPng {
+    check(data, opts) {
+        const {inputFiles} = opts;
+
+        return this.config.useExternalBookConverter && 
+            inputFiles.sourceFileType && inputFiles.sourceFileType.ext == 'djvu';
+    }
+
+    async run(data, opts) {
+        if (!this.check(data, opts))
+            return false;
+
+        let {inputFiles, callback, abort, djvuQuality} = opts;
+
+        djvuQuality = (djvuQuality && djvuQuality <= 100 && djvuQuality >= 10 ? djvuQuality : 20);
+        let jpegQuality = djvuQuality;
+        let tiffQuality = djvuQuality + 30;
+        tiffQuality = (tiffQuality < 85 ? tiffQuality : 85);
+
+        const ddjvuPath = '/usr/bin/ddjvu';
+        if (!await fs.pathExists(ddjvuPath))
+            throw new Error('Внешний конвертер ddjvu не найден');
+
+        const djvusedPath = '/usr/bin/djvused';
+        if (!await fs.pathExists(djvusedPath))
+            throw new Error('Внешний конвертер djvused не найден');
+
+        const tiffsplitPath = '/usr/bin/tiffsplit';
+        if (!await fs.pathExists(tiffsplitPath))
+            throw new Error('Внешний конвертер tiffsplitPath не найден');
+
+        const mogrifyPath = '/usr/bin/mogrify';
+        if (!await fs.pathExists(mogrifyPath))
+            throw new Error('Внешний конвертер mogrifyPath не найден');
+
+        const dir = `${inputFiles.filesDir}/`;
+        const baseFile = `${dir}${path.basename(inputFiles.sourceFile)}`;
+        const tifFile = `${baseFile}.tif`;
+
+        //конвертируем в tiff
+        let perc = 0;
+        await this.execConverter(ddjvuPath, ['-format=tiff', `-quality=${tiffQuality}`, '-verbose', inputFiles.sourceFile, tifFile], () => {
+            perc = (perc < 100 ? perc + 1 : 40);
+            callback(perc);
+        }, abort);
+
+        const tifFileSize = (await fs.stat(tifFile)).size;
+        let limitSize = 4*this.config.maxUploadFileSize;
+        if (tifFileSize > limitSize) {
+            throw new Error(`Файл для конвертирования слишком большой|FORLOG| tifFileSize: ${tifFileSize} > ${limitSize}`);
+        }
+
+        //разбиваем на файлы
+        await this.execConverter(tiffsplitPath, [tifFile, dir], null, abort);
+
+        await fs.remove(tifFile);
+
+        //конвертируем в jpg
+        await this.execConverter(mogrifyPath, ['-quality', jpegQuality, '-scale', '2048>', '-verbose', '-format', 'jpg', `${dir}*.tif`], () => {
+            perc = (perc < 100 ? perc + 1 : 40);
+            callback(perc);
+        }, abort);
+
+        limitSize = 2*this.config.maxUploadFileSize;
+        let jpgFilesSize = 0;
+        //ищем изображения
+        let files = [];
+        await utils.findFiles(async(file) => {
+            if (path.extname(file) == '.jpg') {
+                jpgFilesSize += (await fs.stat(file)).size;
+                if (jpgFilesSize > limitSize) {
+                    throw new Error(`Файл для конвертирования слишком большой|FORLOG| jpgFilesSize: ${jpgFilesSize} > ${limitSize}`);
+                }
+
+                files.push({name: file, base: path.basename(file)});
+            }
+        }, dir);
+
+        files.sort((a, b) => a.base.localeCompare(b.base));
+
+        //схема документа (outline)
+        const djvusedResult = await this.execConverter(djvusedPath, ['-u', '-e', 'print-outline', inputFiles.sourceFile], null, abort);
+
+        const outline = [];
+        const lines = djvusedResult.stdout.match(/\(\s*".*"\s*?"#\d+"/g);
+        if (lines) {
+            lines.forEach(l => {
+                const m = l.match(/"(.*)"\s*?"#(\d+)"/);
+                if (m) {
+                    const pageNum = m[2];
+                    let s = outline[pageNum];
+                    if (!s)
+                        s = m[1].trim();
+                    else
+                        s += `${(s[s.length - 1] != '.' ? '.' : '')} ${m[1].trim()}`;
+
+                    outline[pageNum] = s;
+                }
+            });
+        }
+
+        await utils.sleep(100);
+        let i = 0;
+        const imageFiles = files.map(f => {
+            i++;
+            let alt = (outline[i] ? outline[i] : '');
+            return {src: f.name, alt};
+        });
+        return await super.run(data, Object.assign({}, opts, {imageFiles}));
+    }
+}
+
+module.exports = ConvertDjvu;

server/core/Reader/BookConverter/ConvertFb2.js

@@ -1,34 +1,71 @@
 const ConvertBase = require('./ConvertBase');
 const iconv = require('iconv-lite');
+const textUtils = require('./textUtils');
 
 class ConvertFb2 extends ConvertBase {
     check(data, opts) {
         const {dataType} = opts;
 
-        return (dataType && dataType.ext == 'xml' && data.toString().indexOf('<FictionBook') >= 0);
+        return (
+            ( (dataType && dataType.ext == 'xml') || this.isDataXml(data) ) && 
+            data.toString().indexOf('<FictionBook') >= 0
+        );
     }
 
     async run(data, opts) {
-        if (!this.check(data, opts))
+        let newData = data.slice(0, 1024);
+
+        //Корректируем кодировку для проверки, 16-битные кодировки должны стать utf-8
+        const encoding = textUtils.getEncoding(newData);
+        if (encoding.indexOf('UTF-16') == 0) {
+            newData = Buffer.from(iconv.decode(newData, encoding));
+        }
+
+        //Проверяем
+        if (!this.check(newData, opts))
             return false;
 
-        return this.checkEncoding(data);
+        //Корректируем кодировку всего объема
+        newData = data;
+        if (encoding.indexOf('UTF-16') == 0) {
+            newData = Buffer.from(iconv.decode(newData, encoding));
+        }
+
+        //Корректируем пробелы, всякие файлы попадаются :(
+        if (newData[0] == 32) {
+            newData = Buffer.from(newData.toString().trim());
+        }
+
+        //Окончательно корректируем кодировку
+        return this.checkEncoding(newData);
     }
 
     checkEncoding(data) {
         let result = data;
 
-        const left = data.indexOf('<?xml version="1.0"');
+        let q = '"';
+        let left = data.indexOf('<?xml version="1.0"');
+        if (left < 0) {
+            left = data.indexOf('<?xml version=\'1.0\'');
+            q = '\'';
+        }
+
         if (left >= 0) {
             const right = data.indexOf('?>', left);
             if (right >= 0) {
                 const head = data.slice(left, right + 2).toString();
-                const m = head.match(/encoding="(.*?)"/);
+                const m = head.match(/encoding=['"](.*?)['"]/);
                 if (m) {
                     let encoding = m[1].toLowerCase();
                     if (encoding != 'utf-8') {
-                        result = iconv.decode(data, encoding);
-                        result = Buffer.from(result.toString().replace(m[0], 'encoding="utf-8"'));
+                        //encoding может не соответсвовать реальной кодировке файла, поэтому:
+                        let calcEncoding = textUtils.getEncoding(data);
+                        if (calcEncoding.indexOf('ISO-8859') >= 0) {
+                            calcEncoding = encoding;
+                        }
+
+                        result = iconv.decode(data, calcEncoding);
+                        result = Buffer.from(result.toString().replace(m[0], `encoding=${q}utf-8${q}`));
                     }
                 }
             }

server/core/Reader/BookConverter/ConvertFb3.js

@@ -2,7 +2,7 @@ const fs = require('fs-extra');
 
 const ConvertHtml = require('./ConvertHtml');
 
-class ConvertDocX extends ConvertHtml {
+class ConvertFb3 extends ConvertHtml {
     async check(data, opts) {
         const {inputFiles} = opts;
         if (this.config.useExternalBookConverter && 
@@ -39,13 +39,14 @@ class ConvertDocX extends ConvertHtml {
         const title = this.getTitle(text)
             .replace(/<\/?p>/g, '')
         ;
-        text = `<title>${title}</title>` + text
+        text = `<fb2-title>${title}</fb2-title>` + text
             .replace(/<title>/g, '<br><b>')
             .replace(/<\/title>/g, '</b><br>')
-            .replace(/<subtitle>/g, '<br><br><subtitle>')
+            .replace(/<subtitle>/g, '<br><br><fb2-subtitle>')
+            .replace(/<\/subtitle>/g, '</fb2-subtitle>')
         ;
-        return await super.run(Buffer.from(text), {skipCheck: true, cutTitle: true});
+        return await super.run(Buffer.from(text), {skipHtmlCheck: true});
     }
 }
 
-module.exports = ConvertDocX;
+module.exports = ConvertFb3;

server/core/Reader/BookConverter/ConvertHtml.js

@@ -7,7 +7,7 @@ class ConvertHtml extends ConvertBase {
         const {dataType} = opts;
 
         //html?
-        if (dataType && (dataType.ext == 'html' || dataType.ext == 'xml')) 
+        if ( ( (dataType && (dataType.ext == 'html' || dataType.ext == 'xml')) ) || this.isDataXml(data) )
             return {isText: false};
 
         //может это чистый текст?
@@ -16,7 +16,7 @@ class ConvertHtml extends ConvertBase {
         }
 
         //из буфера обмена?
-        if (data.toString().indexOf('<buffer>') == 0) {
+        if (data.slice(0, 50).toString().indexOf('<buffer>') == 0) {
             return {isText: false};
         }
 
@@ -24,17 +24,14 @@ class ConvertHtml extends ConvertBase {
     }
 
     async run(data, opts) {
-        let isText = false;
-        if (!opts.skipCheck) {
+        let {isText = false, uploadFileName = ''} = opts;
+        if (!opts.skipHtmlCheck) {
             const checkResult = this.check(data, opts);
             if (!checkResult)
                 return false;
 
             isText = checkResult.isText;
-        } else {
-            isText = opts.isText;
         }
-        let {cutTitle} = opts;
 
         let titleInfo = {};
         let desc = {_n: 'description', 'title-info': titleInfo};
@@ -44,12 +41,17 @@ class ConvertHtml extends ConvertBase {
         let fb2 = [desc, body, binary];
 
         let title = '';
+        let author = '';
         let inTitle = false;
+        let inSectionTitle = false;
+        let inAuthor = false;
         let inSubTitle = false;
         let inImage = false;
         let image = {};
         let bold = false;
         let italic = false;
+        let superscript = false;
+        let subscript = false;
         let begining = true;
 
         let spaceCounter = [];
@@ -62,7 +64,7 @@ class ConvertHtml extends ConvertBase {
         };
 
         const growParagraph = (text) => {
-            if (!pars.length)
+            if (!pars.length || pars[pars.length - 1]._n != 'p')
                 newParagraph();
 
             const l = pars.length;
@@ -94,12 +96,16 @@ class ConvertHtml extends ConvertBase {
         const onTextNode = (text, cutCounter, cutTag) => {// eslint-disable-line no-unused-vars
             text = this.escapeEntities(text);
 
-            if (!cutCounter && !(cutTitle && inTitle)) {
+            if (!(cutCounter || inTitle || inSectionTitle || inSubTitle)) {
                 let tOpen = '';
                 tOpen += (inSubTitle ? '<subtitle>' : '');
                 tOpen += (bold ? '<strong>' : '');
                 tOpen += (italic ? '<emphasis>' : '');
+                tOpen += (superscript ? '<sup>' : '');
+                tOpen += (subscript ? '<sub>' : '');
                 let tClose = ''
+                tClose += (subscript ? '</sub>' : '');
+                tClose += (superscript ? '</sup>' : '');
                 tClose +=  (italic ? '</emphasis>' : '');
                 tClose += (bold ? '</strong>' : '');
                 tClose += (inSubTitle ? '</subtitle>' : '');
@@ -110,12 +116,22 @@ class ConvertHtml extends ConvertBase {
             if (inTitle && !title)
                 title = text;
 
+            if (inAuthor && !author)
+                author = text;
+
+            if (inSectionTitle) {
+                pars.unshift({_n: 'title', _t: text});
+            }
+
+            if (inSubTitle) {
+                pars.push({_n: 'subtitle', _t: text});
+            }
+
             if (inImage) {
                 image._t = text;
                 binary.push(image);
 
                 pars.push({_n: 'image', _attrs: {'l:href': '#' + image._attrs.id}, _t: ''});
-                newParagraph();
             }
 
         };
@@ -140,15 +156,27 @@ class ConvertHtml extends ConvertBase {
                         bold = true;
                         break;
                 }
+
+                if (tag == 'sup')
+                    superscript = true;
+        
+                if (tag == 'sub')
+                    subscript = true;
             }
 
-            if (tag == 'title' || tag == 'cut-title') {
+            if (tag == 'title' || tag == 'fb2-title') {
                 inTitle = true;
-                if (tag == 'cut-title')
-                    cutTitle = true;
             }
 
-            if (tag == 'subtitle') {
+            if (tag == 'fb2-author') {
+                inAuthor = true;
+            }
+
+            if (tag == 'fb2-section-title') {
+                inSectionTitle = true;
+            }
+
+            if (tag == 'fb2-subtitle') {
                 inSubTitle = true;
             }
 
@@ -156,7 +184,7 @@ class ConvertHtml extends ConvertBase {
                 inImage = true;
                 const attrs = sax.getAttrsSync(tail);
                 image = {_n: 'binary', _attrs: {id: attrs.name.value, 'content-type': attrs.type.value}, _t: ''};
-            }
+            }            
         };
 
         const onEndNode = (tag, tail, singleTag, cutCounter, cutTag) => {// eslint-disable-line no-unused-vars
@@ -179,12 +207,26 @@ class ConvertHtml extends ConvertBase {
                         bold = false;
                         break;
                 }
+
+                if (tag == 'sup')
+                    superscript = false;
+        
+                if (tag == 'sub')
+                    subscript = false;
             }
 
-            if (tag == 'title' || tag == 'cut-title')
+            if (tag == 'title' || tag == 'fb2-title')
                 inTitle = false;
 
-            if (tag == 'subtitle')
+            if (tag == 'fb2-author') {
+                inAuthor = false;
+            }
+
+            if (tag == 'fb2-section-title') {
+                inSectionTitle = false;
+            }
+
+            if (tag == 'fb2-subtitle')
                 inSubTitle = false;
 
             if (tag == 'fb2-image')
@@ -195,10 +237,20 @@ class ConvertHtml extends ConvertBase {
 
         sax.parseSync(buf, {
             onStartNode, onEndNode, onTextNode,
-            innerCut: new Set(['head', 'script', 'style', 'binary', 'fb2-image'])
+            innerCut: new Set(['head', 'script', 'style', 'binary', 'fb2-image', 'fb2-title', 'fb2-author'])
         });
 
+        if (!title)
+            title = uploadFileName;
+        
         titleInfo['book-title'] = title;
+        if (author)
+            titleInfo.author = {'last-name': author};
+
+        body.section._a[0] = pars;
+
+        //console.log(JSON.stringify(fb2, null, 2));
+
         //подозрение на чистый текст, надо разбить на параграфы
         if (isText || (buf.length > 30*1024 && pars.length < buf.length/2000)) {
             let total = 0;
@@ -218,7 +270,7 @@ class ConvertHtml extends ConvertBase {
 
             let i = 0;
             //если разброс не слишком большой, выделяем параграфы
-            if (d < 10 && spaceCounter.length) {
+            if (d < 20 && spaceCounter.length) {
                 total /= 20;
                 i = spaceCounter.length - 1;
                 while (i > 0 && (!spaceCounter[i] || spaceCounter[i] < total)) i--;
@@ -228,56 +280,49 @@ class ConvertHtml extends ConvertBase {
             if (parIndent > 2) parIndent--;
 
             let newPars = [];
+            let curPar = {};
             const newPar = () => {
-                newPars.push({_n: 'p', _t: ''});
+                curPar = {_n: 'p', _t: ''};
+                newPars.push(curPar);
             };
 
-            const growPar = (text) => {
-                if (!newPars.length)
-                    newPar();
-
-                const l = newPars.length;
-                newPars[l - 1]._t += text;
-            }
-
-            i = 0;
             for (const par of pars) {
                 if (par._n != 'p') {
                     newPars.push(par);
                     continue;
                 }
 
-                if (i > 0)
-                    newPar();
-                i++;
-
-                let j = 0;
+                newPar();
+                
                 const lines = par._t.split('\n');
-                for (let line of lines) {
-                    line = repCrLfTab(line);
+                for (let j = 0; j < lines.length; j++) {
+                    const line = repCrLfTab(lines[j]);
 
                     let l = 0;
                     while (l < line.length && line[l] == ' ') {
                         l++;
                     }
 
-                    if (l >= parIndent || line == '') {
-                        if (j > 0)
-                            newPar();
-                        j++;
+                    if (j > 0 &&
+                        (l >= parIndent ||
+                            (j < lines.length - 1 && line == '')
+                        )
+                    ) {
+                        newPar();
                     }
-                    growPar(line.trim() + ' ');
+
+                    curPar._t += line.trim() + ' ';
                 }
             }
 
             body.section._a[0] = newPars;
-        } else {
-            body.section._a[0] = pars;
         }
 
         //убираем лишнее, делаем валидный fb2, т.к. в рез-те разбиения на параграфы бьются теги
         bold = false;
         italic = false;
+        superscript = false;
+        subscript = false;
         inSubTitle = false;
         pars = body.section._a[0];
         for (let i = 0; i < pars.length; i++) {
@@ -297,7 +342,11 @@ class ConvertHtml extends ConvertBase {
                     tOpen += (inSubTitle ? '<subtitle>' : '');
                     tOpen += (bold ? '<strong>' : '');
                     tOpen += (italic ? '<emphasis>' : '');
+                    tOpen += (superscript ? '<sup>' : '');
+                    tOpen += (subscript ? '<sub>' : '');
                     let tClose = ''
+                    tClose += (subscript ? '</sub>' : '');
+                    tClose += (superscript ? '</sup>' : '');
                     tClose +=  (italic ? '</emphasis>' : '');
                     tClose += (bold ? '</strong>' : '');
                     tClose += (inSubTitle ? '</subtitle>' : '');
@@ -313,6 +362,10 @@ class ConvertHtml extends ConvertBase {
                         bold = true;
                     if (tag == 'emphasis')
                         italic = true;
+                    if (tag == 'sup')
+                        superscript = true;
+                    if (tag == 'sub')
+                        subscript = true;
                     if (tag == 'subtitle')
                         inSubTitle = true;
                 }
@@ -322,6 +375,10 @@ class ConvertHtml extends ConvertBase {
                         bold = false;
                     if (tag == 'emphasis')
                         italic = false;
+                    if (tag == 'sup')
+                        superscript = false;
+                    if (tag == 'sub')
+                        subscript = false;
                     if (tag == 'subtitle')
                         inSubTitle = false;
                 }

server/core/Reader/BookConverter/ConvertJpegPng.js

@@ -0,0 +1,100 @@
+const fs = require('fs-extra');
+const path = require('path');
+//const utils = require('../../utils');
+
+const ConvertBase = require('./ConvertBase');
+
+class ConvertJpegPng extends ConvertBase {
+    check(data, opts) {
+        const {inputFiles} = opts;
+
+        return this.config.useExternalBookConverter && 
+            inputFiles.sourceFileType && 
+            (inputFiles.sourceFileType.ext == 'jpg' || inputFiles.sourceFileType.ext == 'png' );
+    }
+
+    async run(data, opts) {
+        const {inputFiles, uploadFileName, imageFiles} = opts;
+
+        if (!imageFiles) {
+            if (!this.check(data, opts))
+                return false;
+        }
+
+        let files = [];
+        if (imageFiles) {
+            files = imageFiles;
+        } else {
+            const imageFile = `${inputFiles.filesDir}/${path.basename(inputFiles.sourceFile)}.${inputFiles.sourceFileType.ext}`;
+            await fs.copy(inputFiles.sourceFile, imageFile);
+            files.push({src: imageFile});
+        }
+
+        //читаем изображения
+        const limitSize = 2*this.config.maxUploadFileSize;
+        let imagesSize = 0;
+
+        const loadImage = async(image) => {
+            const src = path.parse(image.src);
+            let type = 'unknown';
+            switch (src.ext) {
+                case '.jpg': type = 'image/jpeg'; break;
+                case '.png': type = 'image/png'; break;
+            }
+            if (type != 'unknown') {
+                image.data = (await fs.readFile(image.src)).toString('base64');
+                image.type = type;
+                image.name = src.base;
+
+                imagesSize += image.data.length;
+                if (imagesSize > limitSize) {
+                    throw new Error(`Файл для конвертирования слишком большой|FORLOG| imagesSize: ${imagesSize} > ${limitSize}`);
+                }
+            }
+        }
+
+        let images = [];
+        let loading = [];
+        files.forEach(img => {
+            images.push(img);
+            loading.push(loadImage(img));
+        });
+
+        await Promise.all(loading);
+
+        //формируем fb2
+        let titleInfo = {};
+        let desc = {_n: 'description', 'title-info': titleInfo};
+        let pars = [];
+        let body = {_n: 'body', section: {_a: [pars]}};
+        let binary = [];
+        let fb2 = [desc, body, binary];
+
+        let title = '';
+        if (uploadFileName)
+            title = uploadFileName;
+
+        titleInfo['book-title'] = title;
+
+        for (const image of images) {
+            if (image.type) {
+                const img = {_n: 'binary', _attrs: {id: image.name, 'content-type': image.type}, _t: image.data};
+                binary.push(img);
+
+                const attrs = {'l:href': `#${image.name}`};
+                if (image.alt) {
+                    image.alt = (image.alt.length > 256 ? image.alt.substring(0, 256) : image.alt);
+                    attrs.alt = image.alt;
+                }
+
+                pars.push({_n: 'p', _t: ''});
+                pars.push({_n: 'image', _attrs: attrs});
+            }
+        }
+        pars.push({_n: 'p', _t: ''});
+        
+        return this.formatFb2(fb2);
+    }
+}
+
+module.exports = ConvertJpegPng;

server/core/Reader/BookConverter/ConvertPdf.js

@@ -1,3 +1,4 @@
+//const _ = require('lodash');
 const fs = require('fs-extra');
 const path = require('path');
 
@@ -14,17 +15,24 @@ class ConvertPdf extends ConvertHtml {
     }
 
     async run(notUsed, opts) {
-        if (!this.check(notUsed, opts))
+        if (!opts.pdfAsText || !this.check(notUsed, opts))
             return false;
+
         await this.checkExternalConverterPresent();
 
-        const {inputFiles, callback, abort} = opts;
+        const {inputFiles, callback, abort, uploadFileName} = opts;
 
-        const outFile = `${inputFiles.filesDir}/${utils.randomHexString(10)}.xml`;
+        const inpFile = inputFiles.sourceFile;
+        const outBasename = `${inputFiles.filesDir}/${utils.randomHexString(10)}`;
+        const outFile = `${outBasename}.xml`;
+
+        const pdftohtmlPath = '/usr/bin/pdftohtml';
+        if (!await fs.pathExists(pdftohtmlPath))
+            throw new Error('Внешний конвертер pdftohtml не найден');
 
         //конвертируем в xml
         let perc = 0;
-        await this.execConverter(this.pdfToHtmlPath, ['-c', '-s', '-xml', inputFiles.sourceFile, outFile], () => {
+        await this.execConverter(pdftohtmlPath, ['-nodrm', '-c', '-s', '-xml', inpFile, outFile], () => {
             perc = (perc < 80 ? perc + 10 : 40);
             callback(perc);
         }, abort);
@@ -33,17 +41,24 @@ class ConvertPdf extends ConvertHtml {
         const data = await fs.readFile(outFile);
         callback(90);
 
+        await utils.sleep(100);
+
         //парсим xml
         let lines = [];
+        let pagelines = [];
+        let line = {text: ''};
+        let page = {};
+        let fonts = {};
+        let sectionTitleFound = false;
+
         let images = [];
         let loading = [];
+
         let inText = false;
         let bold = false;
         let italic = false;
-        let title = '';
-        let prevTop = 0;
+
         let i = -1;
-        let titleCount = 0;
 
         const loadImage = async(image) => {
             const src = path.parse(image.src);
@@ -57,7 +72,7 @@ class ConvertPdf extends ConvertHtml {
                 image.type = type;
                 image.name = src.base;
             }
-        }
+        };
 
         const putImage = (curTop) => {
             if (!isNaN(curTop) && images.length) {
@@ -67,7 +82,72 @@ class ConvertPdf extends ConvertHtml {
                     images.shift();
                 }
             }
-        }
+        };
+
+        const isTextBold = (text) => {
+            const m = text.trim().match(/^<b>(.*)<\/b>$/);
+            return m && !m[1].match(/<b>|<\/b>|<i>|<\/i>/g);
+        };
+
+        const isTextEmpty = (text) => {
+            return text.replace(/<b>|<\/b>|<i>|<\/i>/g, '').trim() == '';
+        };
+
+        const putPageLines = () => {
+            pagelines.sort((a, b) => (Math.abs(a.top - b.top) > 3 ? a.top - b.top : 0)*10000 + (a.left - b.left))
+            
+            //объединяем в одну строку равные по высоте
+            const pl = [];
+            let pt = 0;
+            let j = -1;
+            pagelines.forEach(line => {
+                if (isTextEmpty(line.text))
+                    return;
+
+                //проверим, возможно это заголовок
+                if (line.fontId && line.pageWidth) {
+                    const centerLeft = (line.pageWidth - line.width)/2;
+                    if (isTextBold(line.text) && Math.abs(centerLeft - line.left) < 10) {
+                        if (!sectionTitleFound) {
+                            line.isSectionTitle = true;
+                            sectionTitleFound = true;
+                        } else {
+                            line.isSubtitle = true;
+                        }
+                    }
+                }
+
+                //объединяем
+                if (pt == 0 || Math.abs(pt - line.top) > 3) {
+                    j++;
+                    pl[j] = line;
+                } else {
+                    pl[j].text += ` ${line.text}`;
+                }
+                pt = line.top;
+            });
+
+            //заполняем lines
+            const lastIndex = i;
+            pl.forEach(line => {
+                putImage(line.top);
+
+                //добавим пустую строку, если надо
+                const prevLine = (i > lastIndex ? lines[i] : {fonts: [], top: 0});
+                if (prevLine && !prevLine.isImage) {
+                    const f = (prevLine.fontId ? fonts[prevLine.fontId] : (line.fontId ? fonts[line.fontId] : null));
+                    if (f && f.fontSize && !line.isImage && line.top - prevLine.top > f.fontSize * 1.8) {
+                        i++;
+                        lines[i] = {text: '<br>'};
+                    }
+                }
+
+                i++;
+                lines[i] = line;
+            });
+            pagelines = [];
+            putImage(100000);
+        };
 
         const onTextNode = (text, cutCounter, cutTag) => {// eslint-disable-line no-unused-vars
             if (!cutCounter && inText) {
@@ -76,67 +156,80 @@ class ConvertPdf extends ConvertHtml {
                 let tClose = (italic ? '</i>' : '');
                 tClose += (bold ? '</b>' : '');
 
-                lines[i].text += `${tOpen}${text}${tClose} `;
-                if (titleCount < 2 && text.trim() != '') {
-                    title += text + (titleCount ? '' : ' - ');
-                    titleCount++;
-                }
+                line.text += ` ${tOpen}${text}${tClose}`;
             }
         };
 
         const onStartNode = (tag, tail, singleTag, cutCounter, cutTag) => {// eslint-disable-line no-unused-vars
-            if (!cutCounter) {
-                if (inText) {
-                    switch (tag) {
-                        case 'i':
-                            italic = true;
-                            break;
-                        case 'b':
-                            bold = true;
-                            break;
-                    }
+            if (inText) {
+                switch (tag) {
+                    case 'i':
+                        italic = true;
+                        break;
+                    case 'b':
+                        bold = true;
+                        break;
                 }
+            }
 
-                if (tag == 'text' && !inText) {
-                    let attrs = sax.getAttrsSync(tail);
-                    const line = {
-                        text: '',
-                        top: parseInt((attrs.top && attrs.top.value ? attrs.top.value : null), 10),
-                        left: parseInt((attrs.left && attrs.left.value ? attrs.left.value : null), 10),
-                        width: parseInt((attrs.width && attrs.width.value ? attrs.width.value : null), 10),
-                        height: parseInt((attrs.height && attrs.height.value ? attrs.height.value : null), 10),
+            if (tag == 'page') {
+                const attrs = sax.getAttrsSync(tail);
+                page = {
+                    width: parseInt((attrs.width && attrs.width.value ? attrs.width.value : null), 10),
+                };
+
+                putPageLines();
+            }
+
+            if (tag == 'fontspec') {
+                const attrs = sax.getAttrsSync(tail);
+                const fontId = (attrs.id && attrs.id.value ? attrs.id.value : '');
+                const fontSize = (attrs.size && attrs.size.value ? attrs.size.value : '');
+
+                if (fontId) {
+                    fonts[fontId] = {fontSize};
+
+                }
+            }
+
+            if (tag == 'text' && !inText) {
+                const attrs = sax.getAttrsSync(tail);
+                line = {
+                    text: '',
+                    top: parseInt((attrs.top && attrs.top.value ? attrs.top.value : null), 10),
+                    left: parseInt((attrs.left && attrs.left.value ? attrs.left.value : null), 10),
+                    width: parseInt((attrs.width && attrs.width.value ? attrs.width.value : null), 10),
+                    height: parseInt((attrs.height && attrs.height.value ? attrs.height.value : null), 10),
+                    isSectionTitle: false,
+                    isSubtitle: false,
+                    pageWidth: page.width,
+                    fontId: (attrs.font && attrs.font.value ? attrs.font.value : ''),
+                };
+
+                if (line.width != 0 || line.height != 0) {
+                    inText = true;
+                    pagelines.push(line);
+                }
+            }
+
+            if (tag == 'image') {
+                const attrs = sax.getAttrsSync(tail);
+                let src = (attrs.src && attrs.src.value ? attrs.src.value : '');
+                if (src) {
+                    const image = {
+                        isImage: true,
+                        src,
+                        data: '',
+                        type: '',
+                        top: parseInt((attrs.top && attrs.top.value ? attrs.top.value : null), 10) || 0,
+                        left: parseInt((attrs.left && attrs.left.value ? attrs.left.value : null), 10) || 0,
+                        width: parseInt((attrs.width && attrs.width.value ? attrs.width.value : null), 10) || 0,
+                        height: parseInt((attrs.height && attrs.height.value ? attrs.height.value : null), 10) || 0,
                     };
 
-                    if (line.width != 0 || line.height != 0) {
-                        inText = true;
-                        if (isNaN(line.top) || isNaN(prevTop) || (Math.abs(prevTop - line.top) > 3)) {
-                            putImage(line.top);
-                            i++;
-                            lines[i] = line;
-                        }
-                        prevTop = line.top;
-                    }
-                }
-
-                if (tag == 'image') {
-                    const attrs = sax.getAttrsSync(tail);
-                    const src = (attrs.src && attrs.src.value ? attrs.src.value : '');
-                    if (src) {
-                        const image = {
-                            isImage: true,
-                            src,
-                            data: '',
-                            type: '',
-                            top: parseInt((attrs.top && attrs.top.value ? attrs.top.value : null), 10) || 0,
-                        };
-                        loading.push(loadImage(image));
-                        images.push(image);
-                        images.sort((a, b) => a.top - b.top)
-                    }
-                }
-
-                if (tag == 'page') {
-                    putImage(100000);
+                    loading.push(loadImage(image));
+                    images.push(image);
+                    images.sort((a, b) => (a.top - b.top)*10000 + (a.left - b.left));
                 }
             }
         };
@@ -162,9 +255,10 @@ class ConvertPdf extends ConvertHtml {
             onStartNode, onEndNode, onTextNode
         });
 
-        putImage(100000);
+        putPageLines();
 
         await Promise.all(loading);
+        await utils.sleep(100);
 
         //найдем параграфы и отступы
         const indents = [];
@@ -185,16 +279,49 @@ class ConvertPdf extends ConvertHtml {
         }
         indents[0] = 0;
 
+        //author & title
+        let {author, title} = await this.getPdfTitleAndAuthor(inpFile);
+
+        if (!title && uploadFileName)
+            title = uploadFileName;
+
+        //console.log(JSON.stringify(lines, null, 2));
         //формируем текст
-        let text = `<title>${title}</title>`;
+        const limitSize = 2*this.config.maxUploadFileSize;
+        let text = '';
+        if (title)
+            text += `<fb2-title>${title}</fb2-title>`;
+        if (author)
+            text += `<fb2-author>${author}</fb2-author>`;
+
         let concat = '';
         let sp = '';
+        let firstLine = true;
         for (const line of lines) {
+            if (text.length > limitSize) {
+                throw new Error(`Файл для конвертирования слишком большой|FORLOG| text.length: ${text.length} > ${limitSize}`);
+            }
+            
             if (line.isImage) {
                 text += `<fb2-image type="${line.type}" name="${line.name}">${line.data}</fb2-image>`;
                 continue;
             }
 
+            if (line.isSectionTitle) {
+                if (firstLine)
+                    text += `<fb2-section-title>${line.text.trim()}</fb2-section-title>`;
+                else
+                    text += `<fb2-subtitle>${line.text.trim()}</fb2-subtitle>`;
+                continue;
+            }
+
+            firstLine = false;
+
+            if (line.isSubtitle) {
+                text += `<br><fb2-subtitle>${line.text.trim()}</fb2-subtitle>`;
+                continue;
+            }
+
             if (concat == '') {
                 const left = line.left || 0;
                 sp = ' '.repeat(indents[left]);
@@ -212,8 +339,36 @@ class ConvertPdf extends ConvertHtml {
         if (concat)
             text += sp + concat + "\n";
 
-        return await super.run(Buffer.from(text), {skipCheck: true, isText: true, cutTitle: true});
+        //console.log(text);
+        await utils.sleep(100);
+        return await super.run(Buffer.from(text), {skipHtmlCheck: true, isText: true});
+    }
+
+    async getPdfTitleAndAuthor(pdfFile) {
+        const result = {author: '', title: ''};
+
+        const pdfinfoPath = '/usr/bin/pdfinfo';
+
+        if (!await fs.pathExists(pdfinfoPath))
+            throw new Error('Внешний конвертер pdfinfo не найден');
+
+        const execResult = await this.execConverter(pdfinfoPath, [pdfFile]);
+
+        const titlePrefix = 'Title:';
+        const authorPrefix = 'Author:';
+
+        const stdout = execResult.stdout.split("\n");
+        stdout.forEach(line => {
+            if (line.indexOf(titlePrefix) == 0) 
+                result.title = line.substring(titlePrefix.length).trim();
+
+            if (line.indexOf(authorPrefix) == 0)
+                result.author = line.substring(authorPrefix.length).trim();
+        });
+
+        return result;
     }
 }
 
+
 module.exports = ConvertPdf;

server/core/Reader/BookConverter/ConvertPdfImages.js

@@ -0,0 +1,115 @@
+const fs = require('fs-extra');
+const path = require('path');
+const utils = require('../../utils');
+
+const sax = require('../../sax');
+
+const ConvertJpegPng = require('./ConvertJpegPng');
+
+class ConvertPdfImages extends ConvertJpegPng {
+    check(data, opts) {
+        const {inputFiles} = opts;
+
+        return this.config.useExternalBookConverter && 
+            inputFiles.sourceFileType && inputFiles.sourceFileType.ext == 'pdf';
+    }
+
+    async run(data, opts) {
+        if (!this.check(data, opts))
+            return false;
+
+        let {inputFiles, callback, abort, pdfQuality} = opts;
+        
+        pdfQuality = (pdfQuality && pdfQuality <= 100 && pdfQuality >= 10 ? pdfQuality : 20);
+
+        const pdftoppmPath = '/usr/bin/pdftoppm';
+        if (!await fs.pathExists(pdftoppmPath))
+            throw new Error('Внешний конвертер pdftoppm не найден');
+
+        const pdftohtmlPath = '/usr/bin/pdftohtml';
+        if (!await fs.pathExists(pdftohtmlPath))
+            throw new Error('Внешний конвертер pdftohtml не найден');
+
+        const inpFile = inputFiles.sourceFile;
+        const dir = `${inputFiles.filesDir}/`;
+        const outBasename = `${dir}${utils.randomHexString(10)}`;
+        const outFile = `${outBasename}.tmp`;
+
+        //конвертируем в jpeg
+        let perc = 0;
+        await this.execConverter(pdftoppmPath, ['-jpeg', '-jpegopt', `quality=${pdfQuality},progressive=y`, inpFile, outFile], () => {
+            perc = (perc < 100 ? perc + 1 : 40);
+            callback(perc);
+        }, abort);
+
+        const limitSize = 2*this.config.maxUploadFileSize;
+        let jpgFilesSize = 0;
+
+        //ищем изображения
+        let files = [];
+        await utils.findFiles(async(file) => {
+            if (path.extname(file) == '.jpg') {
+                jpgFilesSize += (await fs.stat(file)).size;
+                if (jpgFilesSize > limitSize) {
+                    throw new Error(`Файл для конвертирования слишком большой|FORLOG| jpgFilesSize: ${jpgFilesSize} > ${limitSize}`);
+                }
+
+                files.push({name: file, base: path.basename(file)});
+            }
+        }, dir);
+
+        files.sort((a, b) => a.base.localeCompare(b.base));
+
+        //схема документа (outline)
+        const outXml = `${outBasename}.xml`;
+        await this.execConverter(pdftohtmlPath, ['-nodrm', '-i', '-c', '-s', '-xml', inpFile, outXml], null, abort);
+        const outline = [];
+
+        let inOutline = 0;
+        let inItem = false;
+        let pageNum = 0;
+
+        const onTextNode = (text, cutCounter, cutTag) => {// eslint-disable-line no-unused-vars
+            if (inOutline > 0 && inItem && pageNum) {
+                outline[pageNum] = text;
+            }
+        };
+
+        const onStartNode = (tag, tail, singleTag, cutCounter, cutTag) => {// eslint-disable-line no-unused-vars
+            if (tag == 'outline')
+                inOutline++;
+
+            if (inOutline > 0 && tag == 'item') {
+                const attrs = sax.getAttrsSync(tail);
+                pageNum = (attrs.page && attrs.page.value ? attrs.page.value : 0);
+                inItem = true;
+            }
+        };
+
+        const onEndNode = (tag, tail, singleTag, cutCounter, cutTag) => {// eslint-disable-line no-unused-vars
+            if (tag == 'outline')
+                inOutline--;
+            if (tag == 'item')
+                inItem = false;
+        };
+
+        const dataXml = await fs.readFile(outXml);
+        const buf = this.decode(dataXml).toString();
+        sax.parseSync(buf, {
+            onStartNode, onEndNode, onTextNode
+        });
+
+
+        await utils.sleep(100);
+        //формируем список файлов
+        let i = 0;
+        const imageFiles = files.map(f => {
+            i++;
+            let alt = (outline[i] ? outline[i] : '');
+            return {src: f.name, alt};
+        });
+        return await super.run(data, Object.assign({}, opts, {imageFiles}));
+    }
+}
+
+module.exports = ConvertPdfImages;

server/core/Reader/BookConverter/ConvertSites.js

@@ -48,7 +48,7 @@ class ConvertSites extends ConvertHtml {
         if (text === false)
             return false;
 
-        return await super.run(Buffer.from(text), {skipCheck: true, cutTitle: true});
+        return await super.run(Buffer.from(text), {skipHtmlCheck: true});
     }
 
     getTitle(text) {
@@ -79,7 +79,7 @@ class ConvertSites extends ConvertHtml {
         let book = this.getTitle(text);
         book = book.replace(' (fb2) | Флибуста', '');
 
-        const title = `<title>${author}${(author ? ' - ' : '')}${book}</title>`;
+        const title = `<fb2-title>${author}${(author ? ' - ' : '')}${book}</fb2-title>`;
 
         let begin = '<h3 class="book">';
         if (text.indexOf(begin) <= 0)
@@ -95,12 +95,12 @@ class ConvertSites extends ConvertHtml {
         return text.substring(l, r)
             .replace(/blockquote class="?book"?/g, 'p')
             .replace(/<br\/?>\s*<\/h3>/g, '</h3>')
-            .replace(/<h3 class="?book"?>/g, '<br><br><subtitle>')
-            .replace(/<h5 class="?book"?>/g, '<br><br><subtitle>')
-            .replace(/<h3>/g, '<br><br><subtitle>')
-            .replace(/<h5>/g, '<br><br><subtitle>')
-            .replace(/<\/h3>/g, '</subtitle><br>')
-            .replace(/<\/h5>/g, '</subtitle><br>')
+            .replace(/<h3 class="?book"?>/g, '<br><br><fb2-subtitle>')
+            .replace(/<h5 class="?book"?>/g, '<br><br><fb2-subtitle>')
+            .replace(/<h3>/g, '<br><br><fb2-subtitle>')
+            .replace(/<h5>/g, '<br><br><fb2-subtitle>')
+            .replace(/<\/h3>/g, '</fb2-subtitle><br>')
+            .replace(/<\/h5>/g, '</fb2-subtitle><br>')
             .replace(/<div class="?stanza"?>/g, '<br>')
             .replace(/<div>/g, '<br>')
             + title;

server/core/Reader/BookConverter/index.js

@@ -3,8 +3,11 @@ const FileDetector = require('../../FileDetector');
 
 //порядок важен
 const convertClassFactory = [
+    require('./ConvertJpegPng'),
     require('./ConvertEpub'),
+    require('./ConvertDjvu'),
     require('./ConvertPdf'),
+    require('./ConvertPdfImages'),
     require('./ConvertRtf'),
     require('./ConvertDocX'),
     require('./ConvertFb3'),

server/core/Reader/ReaderWorker.js

@@ -12,7 +12,7 @@ const utils = require('../utils');
 const log = new (require('../AppLogger'))().log;//singleton
 
 const cleanDirPeriod = 60*60*1000;//1 раз в час
-const queue = new LimitedQueue(5, 100, 5*60*1000);//5 минут ожидание подвижек
+const queue = new LimitedQueue(5, 100, 2*60*1000 + 15000);//2 минуты ожидание подвижек
 
 let instance = null;
 
@@ -30,13 +30,13 @@ class ReaderWorker {
 
             this.workerState = new WorkerState();
             this.down = new FileDownloader(config.maxUploadFileSize);
-            this.decomp = new FileDecompressor(2*config.maxUploadFileSize);
+            this.decomp = new FileDecompressor(3*config.maxUploadFileSize);
             this.bookConverter = new BookConverter(this.config);
 
             this.remoteWebDavStorage = false;
             if (config.remoteWebDavStorage) {
                 this.remoteWebDavStorage = new RemoteWebDavStorage(
-                    Object.assign({maxContentLength: config.maxUploadFileSize}, config.remoteWebDavStorage)
+                    Object.assign({maxContentLength: 3*config.maxUploadFileSize}, config.remoteWebDavStorage)
                 );
             }
 
@@ -81,7 +81,7 @@ class ReaderWorker {
             const decompDirname = utils.randomHexString(30);
 
             //download or use uploaded
-            if (url.indexOf('file://') != 0) {//download
+            if (url.indexOf('disk://') != 0) {//download
                 const downdata = await this.down.load(url, (progress) => {
                     wState.set({progress});
                 }, q.abort);
@@ -130,6 +130,8 @@ class ReaderWorker {
             convertFilename = `${this.config.tempDownloadDir}/${tempFilename2}`;
             await this.bookConverter.convertToFb2(decompFiles, convertFilename, opts, progress => {
                 wState.set({progress});
+                if (queue.freed > 0)
+                    q.resetTimeout();
             }, q.abort);
 
             //сжимаем файл в tmp, если там уже нет с тем же именем-sha256
@@ -171,9 +173,15 @@ class ReaderWorker {
 
         } catch (e) {
             log(LM_ERR, e.stack);
-            if (e.message == 'abort')
-                e.message = overLoadMes;
-            wState.set({state: 'error', error: e.message});
+            let mes = e.message.split('|FORLOG|');
+            if (mes[1])
+                log(LM_ERR, mes[0] + mes[1]);
+            log(LM_ERR, `downloadedFilename: ${downloadedFilename}`);
+
+            mes = mes[0];
+            if (mes == 'abort')
+                mes = overLoadMes;
+            wState.set({state: 'error', error: mes});
         } finally {
             //clean
             if (q)
@@ -208,7 +216,7 @@ class ReaderWorker {
             await fs.remove(file.path);
         }
 
-        return `file://${hash}`;
+        return `disk://${hash}`;
     }
 
     async restoreRemoteFile(filename) {
@@ -266,30 +274,38 @@ class ReaderWorker {
                     files.push({name, stat});
                 }
             }
-            log(`clean dir ${dir}, maxSize=${maxSize}, found ${files.length} files`);
+            log(`clean dir ${dir}, maxSize=${maxSize}, found ${files.length} files, total size=${size}`);
 
             files.sort((a, b) => a.stat.mtimeMs - b.stat.mtimeMs);
 
             let i = 0;
+            let j = 0;
             while (i < files.length && size > maxSize) {
                 const file = files[i];
                 const oldFile = `${dir}/${file.name}`;
 
+                let remoteSuccess = true;
                 //отправляем только this.config.tempPublicDir
-                //TODO: убрать в будущем, т.к. уже делается ленивое сохранение compFilename в удаленном хранилище
                 if (this.remoteWebDavStorage && dir === this.config.tempPublicDir) {
+                    remoteSuccess = false;
                     try {
                         //log(`remoteWebDavStorage.putFile ${path.basename(oldFile)}`);
                         await this.remoteWebDavStorage.putFile(oldFile);
+                        remoteSuccess = true;
                     } catch (e) {
                         log(LM_ERR, e.stack);
                     }
                 }
-                await fs.remove(oldFile);
+                //реально удаляем только если сохранили в хранилище
+                if (remoteSuccess || size > maxSize*1.2) {
+                    await fs.remove(oldFile);
+                    j++;
+                }
+                
                 size -= file.stat.size;
                 i++;
             }
-            log(`removed ${i} files`);
+            log(`removed ${j} files`);
         } catch(e) {
             log(LM_ERR, e.stack);
         } finally {

server/core/WebSocketConnection.js

@@ -0,0 +1,237 @@
+const isBrowser = (typeof window !== 'undefined');
+
+const utils = {
+    sleep: (ms) => { return new Promise(resolve => setTimeout(resolve, ms)); }
+};
+
+const cleanPeriod = 5*1000;//5 секунд
+
+class WebSocketConnection {
+    //messageLifeTime в секундах (проверка каждый cleanPeriod интервал)
+    constructor(url, openTimeoutSecs = 10, messageLifeTimeSecs = 30) {
+        this.WebSocket = (isBrowser ? WebSocket : require('ws'));
+        this.url = url;
+        this.ws = null;
+        this.listeners = [];
+        this.messageQueue = [];
+        this.messageLifeTime = messageLifeTimeSecs*1000;
+        this.openTimeout = openTimeoutSecs*1000;
+        this.requestId = 0;
+
+        this.wsErrored = false;
+        this.closed = false;
+
+        this.connecting = false;
+        this.periodicClean();//no await
+    }
+
+    //рассылаем сообщение и удаляем те обработчики, которые его получили
+    emit(mes, isError) {
+        const len = this.listeners.length;
+        if (len > 0) {
+            let newListeners = [];
+            for (const listener of this.listeners) {
+                let emitted = false;
+                if (isError) {
+                    listener.onError(mes);
+                    emitted = true;
+                } else {
+                    if ( (listener.requestId && mes.requestId && listener.requestId === mes.requestId) ||
+                        (!listener.requestId && !mes.requestId) ) {
+                        listener.onMessage(mes);
+                        emitted = true;
+                    }
+                }
+
+                if (!emitted)
+                    newListeners.push(listener);
+            }
+            this.listeners = newListeners;
+        }
+        
+        return this.listeners.length != len;
+    }
+
+    get isOpen() {
+        return (this.ws && this.ws.readyState == this.WebSocket.OPEN);
+    }
+
+    processMessageQueue() {
+        let newMessageQueue = [];
+        for (const message of this.messageQueue) {
+            if (!this.emit(message.mes)) {
+                newMessageQueue.push(message);
+            }
+        }
+
+        this.messageQueue = newMessageQueue;
+    }
+
+    _open() {
+        return new Promise((resolve, reject) => { (async() => {
+            if (this.closed)
+                reject(new Error('Этот экземпляр класса уничтожен. Пожалуйста, создайте новый.'));
+
+            if (this.connecting) {
+                let i = this.openTimeout/100;
+                while (i-- > 0 && this.connecting) {
+                    await utils.sleep(100);
+                }
+            }
+
+            //проверим подключение, и если нет, то подключимся заново
+            if (this.isOpen) {
+                resolve(this.ws);
+            } else {
+                this.connecting = true;
+                this.terminate();
+
+                if (isBrowser) {
+                    const protocol = (window.location.protocol == 'https:' ? 'wss:' : 'ws:');
+                    const url = this.url || `${protocol}//${window.location.host}/ws`;
+                    this.ws = new this.WebSocket(url);
+                } else {
+                    this.ws = new this.WebSocket(this.url);
+                }
+
+                const onopen = (e) => {
+                    this.connecting = false;
+                    resolve(this.ws);
+                };
+
+                const onmessage = (data) => {
+                    try {
+                        if (isBrowser)
+                            data = data.data;
+                        const mes = JSON.parse(data);
+                        this.messageQueue.push({regTime: Date.now(), mes});
+
+                        this.processMessageQueue();
+                    } catch (e) {
+                        this.emit(e.message, true);
+                    }
+                };
+
+                const onerror = (e) => {
+                    this.emit(e.message, true);
+                    reject(new Error(e.message));
+                };
+
+                const onclose = (e) => {
+                    this.emit(e.message, true);
+                    reject(new Error(e.message));
+                };
+
+                if (isBrowser) {
+                    this.ws.onopen = onopen;
+                    this.ws.onmessage = onmessage;
+                    this.ws.onerror = onerror;
+                    this.ws.onclose = onclose;
+                } else {
+                    this.ws.on('open', onopen);
+                    this.ws.on('message', onmessage);
+                    this.ws.on('error', onerror);
+                    this.ws.on('close', onclose);
+                }
+
+                await utils.sleep(this.openTimeout);
+                reject(new Error('Соединение не удалось'));
+            }
+        })() });
+    }
+
+    //timeout в секундах (проверка каждый cleanPeriod интервал)
+    message(requestId, timeoutSecs = 4) {
+        return new Promise((resolve, reject) => {
+            this.listeners.push({
+                regTime: Date.now(),
+                requestId,
+                timeout: timeoutSecs*1000,
+                onMessage: (mes) => {
+                    resolve(mes);
+                },
+                onError: (mes) => {
+                    reject(new Error(mes));
+                }
+            });
+            
+            this.processMessageQueue();
+        });
+    }
+
+    async send(req, timeoutSecs = 4) {
+        await this._open();
+        if (this.isOpen) {
+            this.requestId = (this.requestId < 1000000 ? this.requestId + 1 : 1);
+            const requestId = this.requestId;//реентерабельность!!!
+
+            this.ws.send(JSON.stringify(Object.assign({requestId, _rpo: 1}, req)));//_rpo: 1 - ждем в ответ _rok: 1
+
+            let resp = {};
+            try {
+                resp = await this.message(requestId, timeoutSecs);
+            } catch(e) {
+                this.terminate();
+                throw new Error('WebSocket не отвечает');
+            }
+
+            if (resp._rok) {                
+                return requestId;
+            } else {
+                throw new Error('Запрос не принят сервером');
+            }
+        } else {
+            throw new Error('WebSocket коннект закрыт');
+        }
+    }
+
+    terminate() {
+        if (this.ws) {
+            if (isBrowser) {
+                this.ws.close();
+            } else {
+                this.ws.terminate();
+            }
+        }
+        this.ws = null;
+    }
+
+    close() {
+        this.terminate();
+        this.closed = true;
+    }
+
+    async periodicClean() {
+        while (!this.closed) {
+            try {
+                const now = Date.now();
+                //чистка listeners
+                let newListeners = [];
+                for (const listener of this.listeners) {
+                    if (now - listener.regTime < listener.timeout) {
+                        newListeners.push(listener);
+                    } else {
+                        if (listener.onError)
+                            listener.onError('Время ожидания ответа истекло');
+                    }
+                }
+                this.listeners = newListeners;
+
+                //чистка messageQueue
+                let newMessageQueue = [];
+                for (const message of this.messageQueue) {
+                    if (now - message.regTime < this.messageLifeTime) {
+                        newMessageQueue.push(message);
+                    }
+                }
+                this.messageQueue = newMessageQueue;
+            } catch(e) {
+                //
+            }
+
+            await utils.sleep(cleanPeriod);
+        }
+    }
+}
+
+module.exports = WebSocketConnection;

server/core/Zip/ZipStreamer.js

@@ -76,13 +76,13 @@ class ZipStreamer {
                 if (limitFileCount || limitFileSize || decodeEntryNameCallback) {
                     const entries = Object.values(unzip.entries());
                     if (limitFileCount && entries.length > limitFileCount) {
-                        reject('Слишком много файлов');
+                        reject(new Error('Слишком много файлов'));
                         return;
                     }
 
                     for (const entry of entries) {
                         if (limitFileSize && !entry.isDirectory && entry.size > limitFileSize) {
-                            reject('Файл слишком большой');
+                            reject(new Error('Файл слишком большой'));
                             return;
                         }
 

server/core/sax.js

@@ -6,7 +6,8 @@ function parseSync(xstr, options) {
         onCdata: _onCdata = dummy,
         onComment: _onComment = dummy,
         onProgress: _onProgress = dummy,
-        innerCut = new Set()
+        innerCut = new Set(),
+        lowerCase = true,
     } = options;
 
     let i = 0;
@@ -91,7 +92,8 @@ function parseSync(xstr, options) {
             } else {
                 tag = tagData;
             }
-            tag = tag.toLowerCase();
+            if (lowerCase)
+                tag = tag.toLowerCase();
 
             if (innerCut.has(tag) && (!cutCounter || cutTag === tag)) {
                 if (!cutCounter)
@@ -146,7 +148,8 @@ async function parse(xstr, options) {
         onCdata: _onCdata = dummy,
         onComment: _onComment = dummy,
         onProgress: _onProgress = dummy,
-        innerCut = new Set()
+        innerCut = new Set(),
+        lowerCase = true,
     } = options;
 
     let i = 0;
@@ -231,7 +234,8 @@ async function parse(xstr, options) {
             } else {
                 tag = tagData;
             }
-            tag = tag.toLowerCase();
+            if (lowerCase)
+                tag = tag.toLowerCase();
 
             if (innerCut.has(tag) && (!cutCounter || cutTag === tag)) {
                 if (!cutCounter)
@@ -276,7 +280,7 @@ async function parse(xstr, options) {
     await _onProgress(100);
 }
 
-function getAttrsSync(tail) {
+function getAttrsSync(tail, lowerCase = true) {
     let result = {};
     let name = '';    
     let value = '';
@@ -287,13 +291,16 @@ function getAttrsSync(tail) {
     let waitEq = false;
 
     const pushResult = () => {
+        if (lowerCase)
+            name = name.toLowerCase();
         if (name != '') {
+            const fn = name;
             let ns = '';
-            if (name.indexOf(':') >= 0) {
-                [ns, name] = name.split(':');
+            if (fn.indexOf(':') >= 0) {
+                [ns, name] = fn.split(':');
             }
 
-            result[name] = {value, ns};
+            result[name] = {value, ns, fn};
         }
         name = '';
         value = '';

server/core/utils.js

@@ -1,7 +1,9 @@
 const { spawn } = require('child_process');
 const fs = require('fs-extra');
+const path = require('path');
 const crypto = require('crypto');
 const baseX = require('base-x');
+const pidusage = require('pidusage');
 
 const BASE36 = '0123456789abcdefghijklmnopqrstuvwxyz';
 const bs36 = baseX(BASE36);
@@ -45,10 +47,11 @@ async function touchFile(filename) {
 }
 
 function spawnProcess(cmd, opts) {
-    let {args, killAfter, onData, abort} = opts;
+    let {args, killAfter, onData, onUsage, onUsageInterval, abort} = opts;
     killAfter = (killAfter ? killAfter : 120);//seconds
     onData = (onData ? onData : () => {});
     args = (args ? args : []);
+    onUsageInterval = (onUsageInterval ? onUsageInterval : 30);//seconds
 
     return new Promise((resolve, reject) => { (async() => {
         let resolved = false;
@@ -75,9 +78,19 @@ function spawnProcess(cmd, opts) {
             reject({status: 'error', error, stdout, stderr});
         });
 
+        //ждем процесс, контролируем его работу раз в секунду
+        let onUsageCounter = onUsageInterval;
         while (!resolved) {
             await sleep(1000);
-            killAfter -= 1;
+
+            onUsageCounter--;
+            if (onUsage && onUsageCounter <= 0) {
+                const stats = await pidusage(proc.pid);
+                onUsage(stats);
+                onUsageCounter = onUsageInterval;
+            }
+
+            killAfter--;
             if (killAfter <= 0 || (abort && abort())) {
                 process.kill(proc.pid);
                 if (killAfter <= 0) {
@@ -91,6 +104,22 @@ function spawnProcess(cmd, opts) {
     })().catch(reject); });
 }
 
+async function findFiles(callback, dir) {
+    if (!(callback && dir))
+        return;
+    let result = true;
+    const files = await fs.readdir(dir, { withFileTypes: true });
+
+    for (const file of files) {
+        const found = path.resolve(dir, file.name);
+        if (file.isDirectory())
+            result = await findFiles(callback, found);
+        else
+            await callback(found);
+    }
+    return result;
+}
+
 module.exports = {
     toBase36,
     fromBase36,
@@ -99,5 +128,6 @@ module.exports = {
     sleep,
     randomHexString,
     touchFile,
-    spawnProcess
+    spawnProcess,
+    findFiles
 };

server/core/xmlParser.js

@@ -0,0 +1,143 @@
+const sax = require('./sax');
+
+function formatXml(xmlParsed, encoding = 'utf-8', textFilterFunc) {
+    let out = `<?xml version="1.0" encoding="${encoding}"?>`;
+    out += formatXmlNode(xmlParsed, textFilterFunc);
+    return out;
+}
+
+function formatXmlNode(node, textFilterFunc) {
+    textFilterFunc = (textFilterFunc ? textFilterFunc : text => text);
+
+    const formatNode = (node, name) => {
+        let out = '';
+
+        if (Array.isArray(node)) {
+            for (const n of node) {
+                out += formatNode(n);
+            }
+        } else if (typeof node == 'string') {
+            if (name)
+                out += `<${name}>${textFilterFunc(node)}</${name}>`;
+            else
+                out += textFilterFunc(node);
+        } else {
+            if (node._n)
+                name = node._n;
+
+            let attrs = '';
+            if (node._attrs) {
+                for (let attrName in node._attrs) {
+                    attrs += ` ${attrName}="${node._attrs[attrName]}"`;
+                }
+            }
+
+            let tOpen = '';
+            let tBody = '';
+            let tClose = '';
+            if (name)
+                tOpen += `<${name}${attrs}>`;
+            if (node.hasOwnProperty('_t'))
+                tBody += textFilterFunc(node._t);
+
+            for (let nodeName in node) {
+                if (nodeName && nodeName[0] == '_' && nodeName != '_a')
+                    continue;
+
+                const n = node[nodeName];
+                tBody += formatNode(n, nodeName);
+            }
+            
+            if (name)
+                tClose += `</${name}>`;
+
+            out += `${tOpen}${tBody}${tClose}`;
+        }
+        return out;
+    }
+
+    return formatNode(node);
+}
+
+function parseXml(xmlString, lowerCase = true) {
+    let result = {};
+    let node = result;
+
+    const onTextNode = (text, cutCounter, cutTag) => {// eslint-disable-line no-unused-vars
+        node._t = text;
+    };
+
+    const onStartNode = (tag, tail, singleTag, cutCounter, cutTag) => {// eslint-disable-line no-unused-vars
+        if (tag == '?xml')
+            return;
+        
+        const newNode = {_n: tag, _p: node};
+
+        if (tail) {
+            const parsedAttrs = sax.getAttrsSync(tail, lowerCase);
+            const atKeys = Object.keys(parsedAttrs);
+            if (atKeys.length) {
+                const attrs = {};
+                for (let i = 0; i < atKeys.length; i++) {
+                    const attrName = atKeys[i];
+                    attrs[parsedAttrs[attrName].fn] = parsedAttrs[attrName].value;
+                }
+
+                newNode._attrs = attrs;
+            }
+        }
+
+        if (!node._a)
+            node._a = [];
+        node._a.push(newNode);
+        node = newNode;
+    };
+
+    const onEndNode = (tag, tail, singleTag, cutCounter, cutTag) => {// eslint-disable-line no-unused-vars
+        if (node._p && node._n == tag)
+            node = node._p;
+    };
+
+    sax.parseSync(xmlString, {
+        onStartNode, onEndNode, onTextNode, lowerCase
+    });
+
+    if (result._a)
+        result = result._a[0];
+    
+    return result;
+}
+
+function simplifyXmlParsed(node) {
+    
+    const simplifyNodeArray = (a) => {
+        const result = {};
+
+        for (let i = 0; i < a.length; i++) {
+            const child = a[i];
+            if (child._n && !result[child._n]) {
+                result[child._n] = {};
+                if (child._a) {
+                    result[child._n] = simplifyNodeArray(child._a);
+                }
+                if (child._t) {
+                    result[child._n]._t = child._t;
+                }
+                if (child._attrs) {
+                    result[child._n]._attrs = child._attrs;
+                }
+            }
+        }
+
+        return result;
+    };
+
+    return simplifyNodeArray([node]);
+}
+
+module.exports = {
+    formatXml,
+    formatXmlNode,
+    parseXml,
+    simplifyXmlParsed
+}

server/db/ConnManager.js

@@ -4,8 +4,6 @@ const SqliteConnectionPool = require('./SqliteConnectionPool');
 const log = new (require('../core/AppLogger'))().log;//singleton
 
 const migrations = {
-    'app': require('./migrations/app'),
-    'readerStorage': require('./migrations/readerStorage'),
 };
 
 let instance = null;
@@ -32,11 +30,11 @@ class ConnManager {
             const dbFileName = this.config.dataDir + '/' + poolConfig.fileName;
 
             //бэкап
-            if (await fs.pathExists(dbFileName))
+            if (!poolConfig.noBak && await fs.pathExists(dbFileName))
                 await fs.copy(dbFileName, `${dbFileName}.bak`);
 
             const connPool = new SqliteConnectionPool();
-            await connPool.open(poolConfig.connCount, dbFileName);
+            await connPool.open(poolConfig, dbFileName);
 
             log(`Opened database "${poolConfig.poolName}"`);
             //миграции

server/db/SqliteConnectionPool.js

@@ -1,27 +1,32 @@
 const sqlite = require('sqlite');
 const SQL = require('sql-template-strings');
 
-const utils = require('../core/utils');
-
-const waitingDelay = 100; //ms
-
 class SqliteConnectionPool {
     constructor() {
         this.closed = true;
     }
 
-    async open(connCount, dbFileName) {
-        if (!Number.isInteger(connCount) || connCount <= 0)
-            return;
+    async open(poolConfig, dbFileName) {
+        const connCount = poolConfig.connCount || 1;
+        const busyTimeout = poolConfig.busyTimeout || 60*1000;
+        const cacheSize = poolConfig.cacheSize || 2000;
+
+        this.dbFileName = dbFileName;
         this.connections = [];
         this.freed = new Set();
+        this.waitingQueue = [];
 
         for (let i = 0; i < connCount; i++) {
             let client = await sqlite.open(dbFileName);
-            client.configure('busyTimeout', 10000); //ms
+
+            client.configure('busyTimeout', busyTimeout); //ms
+            await client.exec(`PRAGMA cache_size = ${cacheSize}`);
 
             client.ret = () => {
                 this.freed.add(i);
+                if (this.waitingQueue.length) {
+                    this.waitingQueue.shift().onFreed(i);
+                }
             };
 
             this.freed.add(i);
@@ -30,30 +35,27 @@ class SqliteConnectionPool {
         this.closed = false;
     }
 
-    _setImmediate() {
+    get() {
         return new Promise((resolve) => {
-            setImmediate(() => {
-                return resolve();
+            if (this.closed)
+                throw new Error('Connection pool closed');
+
+            const freeConnIndex = this.freed.values().next().value;
+            if (freeConnIndex !== undefined) {
+                this.freed.delete(freeConnIndex);
+                resolve(this.connections[freeConnIndex]);
+                return;
+            }
+
+            this.waitingQueue.push({
+                onFreed: (connIndex) => {
+                    this.freed.delete(connIndex);
+                    resolve(this.connections[connIndex]);
+                },
             });
         });
     }
 
-    async get() {
-        if (this.closed)
-            return;
-
-        let freeConnIndex = this.freed.values().next().value;
-        if (freeConnIndex == null) {
-            if (waitingDelay)
-                await utils.sleep(waitingDelay);
-            return await this._setImmediate().then(() => this.get());
-        }
-
-        this.freed.delete(freeConnIndex);
-
-        return this.connections[freeConnIndex];
-    }
-
     async run(query) {
         const dbh = await this.get();
         try {