Merge branch 'release/0.6.7'

- некоторые кнопки на панели управления были скрыты по-умолчанию

client/api/reader.js

@@ -5,11 +5,11 @@ import {Buffer} from 'safe-buffer';
 import * as utils from '../share/utils';
 
 const api = axios.create({
-  baseURL: '/api/reader'
+    baseURL: '/api/reader'
 });
 
 const workerApi = axios.create({
-  baseURL: '/api/worker'
+    baseURL: '/api/worker'
 });
 
 class Reader {

client/components/App.vue

@@ -113,10 +113,13 @@ class App extends Vue {
         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.$notify.error({
                     title: 'Ошибка API',
                     dangerouslyUseHTMLString: true,
-                    message: newError.response.config.url + '<br>' + newError.response.statusText
+                    message: mes
                 });
             }
         });

client/components/Reader/HelpPage/CommonHelpPage/CommonHelpPage.vue

@@ -18,9 +18,15 @@
             <li>поддерживаемые браузеры: Google Chrome, Mozilla Firefox последних версий</li>
         </ul>
 
-        <p>В качестве URL можно задавать html-страничку с книгой, либо прямую ссылку 
+        <p>В качестве URL книги можно задавать html-страничку с книгой, либо прямую ссылку 
         на файл из онлайн-библиотеки (например, скопировав адрес ссылки или кнопки "скачать fb2").</p>
-        <p>Поддерживаемые форматы: <b>fb2, fb2.zip, html, txt</b> и другие</p>
+        <p>Поддерживаемые форматы: <b>fb2, fb2.zip, html, txt</b> и другие.</p>
+
+        <p>Для автономной загрузки читалки (без интернета):<br>
+        В Google Chrome можно установить флаг <span class="clickable" @click="copyText('chrome://flags/#show-saved-copy')">chrome://flags/#show-saved-copy</span>
+           в значение "Primary". В этом случае на стандартной странице "нет соединения" появится кнопка для автономной загрузки сайта из кэша.<br>
+        В Mozilla Firefox в автономном режиме сайт загружается из кэша автоматически. Если этого не происходит, можно установить опцию
+        "Веб-разработка" -> "Работать автономно".</p>
 
         <div v-html="automationHtml"></div>
         <p>Связаться с разработчиком: <a href="mailto:bookpauk@gmail.com">bookpauk@gmail.com</a></p>
@@ -32,6 +38,8 @@
 import Vue from 'vue';
 import Component from 'vue-class-component';
 
+import {copyTextToClipboard} from '../../../../share/utils';
+
 export default @Component({
 })
 class CommonHelpPage extends Vue {
@@ -41,13 +49,22 @@ class CommonHelpPage extends Vue {
 
     get automationHtml() {
         if (this.config.mode == 'omnireader') {
-            return `<p>Вы можете добавить в свой браузер закладку, указав в ее свойствах вместо адреса следующий код:
+            return `<p>Вы также можете добавить в свой браузер закладку, указав в ее свойствах вместо адреса следующий код:
                     <br><strong>javascript:location.href='http://omnireader.ru/?url='+location.href;</strong>
                     <br>Тогда, нажав на получившуюся кнопку на любой странице интернета, вы автоматически откроете ее в Omni Reader.</p>`;
         } else {
             return '';
         }
     }
+
+    async copyText(text) {
+        const result = await copyTextToClipboard(text);
+        const msg = (result ? `Ссылка на флаг успешно скопирована в буфер обмена. Можно открыть ее в новой вкладке.` : 'Копирование не удалось');
+        if (result)
+            this.$notify.success({message: msg});
+        else
+            this.$notify.error({message: msg});
+    }
 }
 //-----------------------------------------------------------------------------
 </script>
@@ -64,4 +81,10 @@ class CommonHelpPage extends Vue {
 h4 {
     margin: 0;
 }
+
+.clickable {
+    color: blue;
+    text-decoration: underline;
+    cursor: pointer;
+}
 </style>

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

@@ -53,11 +53,10 @@ class DonateHelpPage extends Vue {
 
     async copyAddress(address, prefix) {
         const result = await copyTextToClipboard(address);
-        const msg = (result ? `${prefix}-адрес ${address} успешно скопирован в буфер обмена` : 'Копирование не удалось');
         if (result)
-            this.$notify.success({message: msg});
+            this.$notify.success({message: `${prefix}-адрес ${address} успешно скопирован в буфер обмена`});
         else
-            this.$notify.error({message: msg});
+            this.$notify.error({message: 'Копирование не удалось'});
     }
 }
 //-----------------------------------------------------------------------------

client/components/Reader/HelpPage/HelpPage.vue

@@ -16,6 +16,9 @@
                     <el-tab-pane label="Мышь/тачпад">
                         <MouseHelpPage></MouseHelpPage>
                     </el-tab-pane>
+                    <el-tab-pane label="История версий" name="releases">
+                        <VersionHistoryPage></VersionHistoryPage>
+                    </el-tab-pane>
                     <el-tab-pane label="Помочь проекту" name="donate">
                         <DonateHelpPage></DonateHelpPage>
                     </el-tab-pane>
@@ -36,6 +39,7 @@ import CommonHelpPage from './CommonHelpPage/CommonHelpPage.vue';
 import HotkeysHelpPage from './HotkeysHelpPage/HotkeysHelpPage.vue';
 import MouseHelpPage from './MouseHelpPage/MouseHelpPage.vue';
 import DonateHelpPage from './DonateHelpPage/DonateHelpPage.vue';
+import VersionHistoryPage from './VersionHistoryPage/VersionHistoryPage.vue';
 
 export default @Component({
     components: {
@@ -44,6 +48,7 @@ export default @Component({
         HotkeysHelpPage,
         MouseHelpPage,
         DonateHelpPage,
+        VersionHistoryPage,
     },
 })
 class HelpPage extends Vue {
@@ -57,6 +62,10 @@ class HelpPage extends Vue {
         this.selectedTab = 'donate';
     }
 
+    activateVersionHistoryHelpPage() {
+        this.selectedTab = 'releases';
+    }
+
     keyHook(event) {
         if (event.type == 'keydown' && (event.code == 'Escape')) {
             this.close();

client/components/Reader/HelpPage/VersionHistoryPage/VersionHistoryPage.vue

@@ -0,0 +1,81 @@
+<template>
+    <div id="versionHistoryPage" class="page">
+        <span class="clickable" v-for="(item, index) in versionHeader" :key="index" @click="showRelease(item)">
+            <p>
+            {{ item }}
+            </p>
+        </span>
+
+        <br>
+        <h4>История версий:</h4>
+        <br>
+
+        <div v-for="item in versionContent" :id="item.key" :key="item.key">
+            <span v-html="item.content"></span>
+            <br>
+        </div>
+    </div>
+</template>
+
+<script>
+//-----------------------------------------------------------------------------
+import Vue from 'vue';
+import Component from 'vue-class-component';
+import {versionHistory} from '../../versionHistory';
+
+export default @Component({
+})
+class VersionHistoryPage extends Vue {
+    versionHeader = [];
+    versionContent = [];
+
+    created() {
+    }
+
+    mounted() {
+        let vh = [];
+        for (const version of versionHistory) {
+            vh.push(version.header);
+        }
+        this.versionHeader = vh;
+
+        let vc = [];
+        for (const version of versionHistory) {
+            vc.push({key: version.header, content: 'Версия ' + version.header + version.content});
+        }
+        this.versionContent = vc;
+    }
+
+    showRelease(id) {
+        let el = document.getElementById(id);
+        if (el) {
+            document.getElementById('versionHistoryPage').scrollTop = el.offsetTop;
+        }
+    }
+}
+//-----------------------------------------------------------------------------
+</script>
+
+<style scoped>
+.page {
+    flex: 1;
+    padding: 15px;
+    overflow-y: auto;
+    font-size: 120%;
+    line-height: 130%;
+}
+
+h4 {
+    margin: 0;
+}
+
+p {
+    line-height: 15px;
+}
+
+.clickable {
+    color: blue;
+    text-decoration: underline;
+    cursor: pointer;
+}
+</style>

client/components/Reader/LoaderPage/LoaderPage.vue

@@ -18,6 +18,10 @@
                 Загрузить файл с диска
             </el-button>
             <div class="space"></div>
+            <el-button size="mini" @click="loadBufferClick">
+                Из буфера обмена
+            </el-button>
+            <div class="space"></div>
             <span v-if="mode == 'omnireader'" class="bottom-span clickable" @click="openComments">Комментарии</span>
         </div>
 
@@ -26,6 +30,8 @@
             <span class="bottom-span clickable" @click="openDonate">Помочь проекту</span>
             <span class="bottom-span">{{ version }}</span>
         </div>
+
+        <PasteTextPage v-if="pasteTextActive" ref="pasteTextPage" @paste-text-toggle="pasteTextToggle" @load-buffer="loadBuffer"></PasteTextPage>
     </div>
 </template>
 
@@ -33,12 +39,17 @@
 //-----------------------------------------------------------------------------
 import Vue from 'vue';
 import Component from 'vue-class-component';
+import PasteTextPage from './PasteTextPage/PasteTextPage.vue';
 
 export default @Component({
+    components: {
+        PasteTextPage,
+    },
 })
 class LoaderPage extends Vue {
     bookUrl = null;
     loadPercent = 0;
+    pasteTextActive = false;
 
     created() {
         this.commit = this.$store.commit;
@@ -83,12 +94,27 @@ class LoaderPage extends Vue {
     }
 
     loadFile() {
-        const file = this.$refs.file.files[0];
+        const file = this.$refs.file.files[0];        
         this.$refs.file.value = '';
         if (file)
             this.$emit('load-file', {file});
     }
 
+    loadBufferClick() {
+        this.pasteTextToggle();
+    }
+
+    loadBuffer(opts) {
+        if (opts.buffer.length) {
+            const file = new File([opts.buffer], 'dummyName-PasteFromClipboard');
+            this.$emit('load-file', {file});
+        }
+    }
+
+    pasteTextToggle() {
+        this.pasteTextActive = !this.pasteTextActive;
+    }
+
     openHelp() {
         this.$emit('help-toggle');
     }
@@ -102,6 +128,10 @@ class LoaderPage extends Vue {
     }
 
     keyHook(event) {
+        if (this.pasteTextActive) {
+            return this.$refs.pasteTextPage.keyHook(event);
+        }
+
         //недостатки сторонних ui
         const input = this.$refs.input.$refs.input;
         if (document.activeElement === input && event.type == 'keydown' && event.code == 'Enter') {

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

@@ -0,0 +1,133 @@
+<template>
+    <div ref="main" class="main" @click="close">
+        <div class="mainWindow" @click.stop>
+            <Window @close="close">
+                <template slot="header">
+                    Вставьте текст и нажмите
+                    <el-button size="mini" style="font-size: 120%; color: blue" @click="loadBuffer">Загрузить</el-button>
+
+                    или F2
+                </template>
+
+                <div>
+                    <el-input placeholder="Введите название текста" class="input" v-model="bookTitle"></el-input>
+                </div>
+                <hr/>
+                <textarea ref="textArea" class="text" @paste="calcTitle"></textarea>
+            </Window>
+        </div>
+    </div>
+</template>
+
+<script>
+//-----------------------------------------------------------------------------
+import Vue from 'vue';
+import Component from 'vue-class-component';
+
+import Window from '../../../share/Window.vue';
+import _ from 'lodash';
+
+export default @Component({
+    components: {
+        Window,
+    },
+})
+class PasteTextPage extends Vue {
+    bookTitle = '';
+
+    created() {
+    }
+
+    mounted() {
+        this.$refs.textArea.focus();
+    }
+
+    getNonEmptyLine(text, count) {
+        let result = '';
+        const lines = text.split("\n");
+        let i = 0;
+        while (i < lines.length) {
+            if (lines[i].trim() != '') {
+                count--;
+                if (count <= 0) {
+                    result = lines[i];
+                    break;
+                }
+            }
+            i++;
+        }
+        return result;
+    }
+
+    calcTitle(event) {
+        if (this.bookTitle == '') {
+            let text = event.clipboardData.getData('text');
+            this.bookTitle = _.compact([
+                this.getNonEmptyLine(text, 1),
+                this.getNonEmptyLine(text, 2)
+            ]).join(' - ');
+        }
+    }
+
+    loadBuffer() {
+        this.$emit('load-buffer', {buffer: `<title>${this.bookTitle}</title>${this.$refs.textArea.value}`});
+        this.close();
+    }
+
+    close() {
+        this.$emit('paste-text-toggle');
+    }
+
+    keyHook(event) {
+        if (event.type == 'keydown') {
+            switch (event.code) {
+                case 'F2':
+                    this.loadBuffer();
+                    break;
+                case 'Escape':
+                    this.close();
+                    break;
+            }
+        }
+        return true;
+    }
+}
+//-----------------------------------------------------------------------------
+</script>
+
+<style scoped>
+.main {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    z-index: 40;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+}
+
+.mainWindow {
+    width: 100%;
+    height: 100%;
+    display: flex;
+}
+
+.text {
+    flex: 1;
+    overflow-wrap: anywhere;
+    overflow-y: auto;
+    padding: 0 10px 0 10px;
+    position: relative;
+    font-size: 120%;
+}
+
+.text:focus {
+    outline: none;
+}
+
+hr {
+    margin: 0;
+    padding: 0;
+}
+</style>

client/components/Reader/Reader.vue

@@ -7,35 +7,35 @@
                 </el-tooltip>
 
                 <div>
-                    <el-tooltip content="Действие назад" :open-delay="1000" effect="light">
+                    <el-tooltip v-show="showToolButton['undoAction']" content="Действие назад" :open-delay="1000" effect="light">
                         <el-button ref="undoAction" class="tool-button" :class="buttonActiveClass('undoAction')" @click="buttonClick('undoAction')" ><i class="el-icon-arrow-left"></i></el-button>
                     </el-tooltip>
-                    <el-tooltip content="Действие вперед" :open-delay="1000" effect="light">
+                    <el-tooltip v-show="showToolButton['redoAction']" content="Действие вперед" :open-delay="1000" effect="light">
                         <el-button ref="redoAction" class="tool-button" :class="buttonActiveClass('redoAction')" @click="buttonClick('redoAction')" ><i class="el-icon-arrow-right"></i></el-button>
                     </el-tooltip>
                     <div class="space"></div>
-                    <el-tooltip content="На весь экран" :open-delay="1000" effect="light">
+                    <el-tooltip v-show="showToolButton['fullScreen']" content="На весь экран" :open-delay="1000" effect="light">
                         <el-button ref="fullScreen" class="tool-button" :class="buttonActiveClass('fullScreen')" @click="buttonClick('fullScreen')"><i class="el-icon-rank"></i></el-button>
                     </el-tooltip>
-                    <el-tooltip content="Плавный скроллинг" :open-delay="1000" effect="light">
+                    <el-tooltip v-show="showToolButton['scrolling']" content="Плавный скроллинг" :open-delay="1000" effect="light">
                         <el-button ref="scrolling" class="tool-button" :class="buttonActiveClass('scrolling')" @click="buttonClick('scrolling')"><i class="el-icon-sort"></i></el-button>
                     </el-tooltip>
-                    <el-tooltip content="Перелистнуть" :open-delay="1000" effect="light">
+                    <el-tooltip v-show="showToolButton['setPosition']" content="На страницу" :open-delay="1000" effect="light">
                         <el-button ref="setPosition" class="tool-button" :class="buttonActiveClass('setPosition')" @click="buttonClick('setPosition')"><i class="el-icon-d-arrow-right"></i></el-button>
                     </el-tooltip>
-                    <el-tooltip content="Найти в тексте" :open-delay="1000" effect="light">
+                    <el-tooltip v-show="showToolButton['search']" content="Найти в тексте" :open-delay="1000" effect="light">
                         <el-button ref="search" class="tool-button" :class="buttonActiveClass('search')" @click="buttonClick('search')"><i class="el-icon-search"></i></el-button>
                     </el-tooltip>
-                    <el-tooltip content="Скопировать текст со страницы" :open-delay="1000" effect="light">
+                    <el-tooltip v-show="showToolButton['copyText']" content="Скопировать текст со страницы" :open-delay="1000" effect="light">
                         <el-button ref="copyText" class="tool-button" :class="buttonActiveClass('copyText')" @click="buttonClick('copyText')"><i class="el-icon-edit-outline"></i></el-button>
                     </el-tooltip>
-                    <el-tooltip content="Принудительно обновить книгу в обход кэша" :open-delay="1000" effect="light">
+                    <el-tooltip v-show="showToolButton['refresh']" content="Принудительно обновить книгу в обход кэша" :open-delay="1000" effect="light">
                         <el-button ref="refresh" class="tool-button" :class="buttonActiveClass('refresh')" @click="buttonClick('refresh')">
                             <i class="el-icon-refresh" :class="{clear: !showRefreshIcon}"></i>
                         </el-button>
                     </el-tooltip>
                     <div class="space"></div>
-                    <el-tooltip content="Открыть недавние" :open-delay="1000" effect="light">
+                    <el-tooltip v-show="showToolButton['history']" content="Открыть недавние" :open-delay="1000" effect="light">
                         <el-button ref="history" class="tool-button" :class="buttonActiveClass('history')" @click="buttonClick('history')"><i class="el-icon-document"></i></el-button>
                     </el-tooltip>
                 </div>
@@ -68,13 +68,27 @@
                 @start-text-search="startTextSearch"
                 @stop-text-search="stopTextSearch">
             </SearchPage>
-            <CopyTextPage v-if="copyTextActive" ref="copyTextPage" @copy-text-toggle="copyTextToggle"></CopyTextPage>            
+            <CopyTextPage v-if="copyTextActive" ref="copyTextPage" @copy-text-toggle="copyTextToggle"></CopyTextPage>
             <HistoryPage v-show="historyActive" ref="historyPage" @load-book="loadBook" @history-toggle="historyToggle"></HistoryPage>
             <SettingsPage v-if="settingsActive" ref="settingsPage" @settings-toggle="settingsToggle"></SettingsPage>
             <HelpPage v-if="helpActive" ref="helpPage" @help-toggle="helpToggle"></HelpPage>
             <ClickMapPage v-show="clickMapActive" ref="clickMapPage"></ClickMapPage>
             <ServerStorage v-show="hidden" ref="serverStorage"></ServerStorage>
+
+            <el-dialog
+                title="Что нового:"
+                :visible.sync="whatsNewVisible"
+                width="80%">
+                <div style="line-height: 20px" v-html="whatsNewContent"></div>
+
+                <span class="clickable" @click="openVersionHistory">Посмотреть историю версий</span>
+                <span slot="footer" class="dialog-footer">
+                    <el-button @click="whatsNewDisable">Больше не показывать</el-button>
+                </span>
+            </el-dialog>
+
         </el-main>
+
     </el-container>
 </template>
 
@@ -101,6 +115,7 @@ import ServerStorage from './ServerStorage/ServerStorage.vue';
 import bookManager from './share/bookManager';
 import readerApi from '../../api/reader';
 import * as utils from '../../share/utils';
+import {versionHistory} from './versionHistory';
 
 export default @Component({
     components: {
@@ -167,11 +182,15 @@ class Reader extends Vue {
     allowUrlParamBookPos = false;
     showRefreshIcon = true;
     mostRecentBookReactive = null;
+    showToolButton = {};
 
     actionList = [];
     actionCur = -1;
     hidden = false;
 
+    whatsNewVisible = false;
+    whatsNewContent = '';
+
     created() {
         this.loading = true;
         this.commit = this.$store.commit;
@@ -223,14 +242,17 @@ class Reader extends Vue {
 
             if (this.$root.rootRoute == '/reader') {
                 if (this.routeParamUrl) {
-                    await this.loadBook({url: this.routeParamUrl, bookPos: this.routeParamPos});
+                    await this.loadBook({url: this.routeParamUrl, bookPos: this.routeParamPos, force: this.routeParamRefresh});
                 } else {
                     this.loaderActive = true;
                 }
             }
 
             this.checkSetStorageAccessKey();
+            this.checkActivateDonateHelpPage();
             this.loading = false;
+
+            await this.showWhatsNew();
         })();
     }
 
@@ -241,6 +263,8 @@ class Reader extends Vue {
         this.showClickMapPage = settings.showClickMapPage;
         this.clickControl = settings.clickControl;
         this.blinkCachedLoad = settings.blinkCachedLoad;
+        this.showWhatsNewDialog = settings.showWhatsNewDialog;
+        this.showToolButton = settings.showToolButton;
     }
 
     checkSetStorageAccessKey() {
@@ -257,6 +281,56 @@ class Reader extends Vue {
         }
     }
 
+    checkActivateDonateHelpPage() {
+        const q = this.$route.query;
+
+        if (q['donate']) {
+            this.$router.replace(`/reader`);
+            this.helpToggle();
+            this.$nextTick(() => {
+                this.$refs.helpPage.activateDonateHelpPage();
+            });
+        }
+    }
+
+    checkBookPosPercent() {
+        const q = this.$route.query;
+        if (q['__pp']) {
+            let pp = q['__pp'];
+            if (pp) {
+                pp = parseFloat(pp) || 0;
+                const recent = this.mostRecentBook();
+                (async() => {
+                    await utils.sleep(100);
+                    this.bookPos = Math.floor(recent.textLength*pp/100);
+                })();
+            }
+        }
+    }
+
+    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;
+        }
+    }
+
+    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;
@@ -293,6 +367,11 @@ class Reader extends Vue {
         return decodeURIComponent(result);
     }
 
+    get routeParamRefresh() {
+        const q = this.$route.query;
+        return !!q['__refresh'];
+    }
+
     bookPosChanged(event) {
         if (event.bookPosSeen !== undefined)
             this.bookPosSeen = event.bookPosSeen;
@@ -353,6 +432,10 @@ class Reader extends Vue {
         return this.$store.state.reader.settings;
     }
 
+    get whatsNewContentHash() {
+        return this.$store.state.reader.whatsNewContentHash;
+    }
+
     addAction(pos) {
         let a = this.actionList;
         if (!a.length || a[a.length - 1] != pos) {
@@ -523,6 +606,15 @@ class Reader extends Vue {
         }
     }
 
+    versionHistoryToggle() {
+        this.helpToggle();
+        if (this.helpActive) {
+            this.$nextTick(() => {
+                this.$refs.helpPage.activateVersionHistoryHelpPage();
+            });
+        }
+    }
+
     refreshBook() {
         if (this.mostRecentBook()) {
             this.loadBook({url: this.mostRecentBook().url, force: true});
@@ -708,7 +800,7 @@ class Reader extends Vue {
 
         this.progressActive = true;
 
-        await this.$nextTick()
+        await this.$nextTick();
 
         const progress = this.$refs.page;
 
@@ -743,6 +835,7 @@ class Reader extends Vue {
                     progress.hide(); this.progressActive = false;
                     this.blinkCachedLoadMessage();
 
+                    this.checkBookPosPercent();
                     await this.activateClickMapPage();
                     return;
                 }
@@ -791,6 +884,7 @@ class Reader extends Vue {
             } else
                 this.stopBlink = true;
 
+            this.checkBookPosPercent();
             await this.activateClickMapPage();
         } catch (e) {
             progress.hide(); this.progressActive = false;
@@ -1010,4 +1104,10 @@ i {
 .clear {
     color: rgba(0,0,0,0);
 }
-</style>
+
+.clickable {
+    color: blue;
+    text-decoration: underline;
+    cursor: pointer;
+}
+</style>

client/components/Reader/ServerStorage/ServerStorage.vue

@@ -50,6 +50,7 @@ class ServerStorage extends Vue {
         this.oldSettings = {};
         this.oldRecent = {};
         this.oldRecentLast = {};
+        this.oldRecentLastDiff = {};
     }
 
     async init() {
@@ -353,13 +354,15 @@ class ServerStorage extends Vue {
 
         const oldRev = bookManager.recentRev;
         const oldLastRev = bookManager.recentLastRev;
+        const oldLastDiffRev = bookManager.recentLastDiffRev;
         //проверим ревизию на сервере
         let revs = null;
         if (!force) {
             try {
-                revs = await this.storageCheck({recent: {}, recentLast: {}});
+                revs = await this.storageCheck({recent: {}, recentLast: {}, recentLastDiff: {}});
                 if (revs.state == 'success' && revs.items.recent.rev == oldRev &&
-                    revs.items.recentLast.rev == oldLastRev) {
+                    revs.items.recentLast.rev == oldLastRev &&
+                    revs.items.recentLastDiff.rev == oldLastDiffRev) {
                     return;
                 }
             } catch(e) {
@@ -391,24 +394,32 @@ class ServerStorage extends Vue {
             }
         }
 
-        if (force || revs.items.recentLast.rev != oldLastRev) {
+        if (force || revs.items.recentLast.rev != oldLastRev || revs.items.recentLastDiff.rev != oldLastDiffRev) {
             let recentLast = null;
             try {
-                recentLast = await this.storageGet({recentLast: {}});
+                recentLast = await this.storageGet({recentLast: {}, recentLastDiff: {}});
             } catch(e) {
                 this.error(`Ошибка соединения с сервером: ${e.message}`);
                 return;
             }
 
             if (recentLast.state == 'success') {
+                const recentLastDiff = recentLast.items.recentLastDiff;
                 recentLast = recentLast.items.recentLast;
 
                 if (recentLast.rev == 0)
                     recentLast.data = {};
+                if (recentLastDiff.rev == 0)
+                    recentLastDiff.data = {};
 
+                this.oldRecentLastDiff = _.cloneDeep(recentLastDiff.data);
                 this.oldRecentLast = _.cloneDeep(recentLast.data);
+
+                recentLast.data = utils.applyObjDiff(recentLast.data, recentLastDiff.data);
+
                 await bookManager.setRecentLast(recentLast.data);
                 await bookManager.setRecentLastRev(recentLast.rev);
+                await bookManager.setRecentLastDiffRev(recentLastDiff.rev);
             } else {
                 this.warning(`Неверный ответ сервера: ${recentLast.state}`);
             }
@@ -476,6 +487,11 @@ class ServerStorage extends Vue {
         if (utils.isEmptyObjDiff(diff))
             return;
 
+        if (this.oldRecentLast.key == recentLast.key && JSON.stringify(recentLast) > JSON.stringify(diff)) {
+            await this.saveRecentLastDiff(diff, force);
+            return;
+        }
+
         this.savingRecentLast = true;
         try {
             let result = {state: ''};
@@ -515,12 +531,69 @@ class ServerStorage extends Vue {
             } else {
                 this.oldRecentLast = _.cloneDeep(recentLast);
                 await bm.setRecentLastRev(lastRev + 1);
+                await this.saveRecentLastDiff({}, true);
             }
         } finally {
             this.savingRecentLast = false;
         }
     }
 
+    async saveRecentLastDiff(diff, force = false) {
+        if (!this.keyInited || !this.serverSyncEnabled || this.savingRecentLastDiff)
+            return;
+
+        const bm = bookManager;
+        let lastRev = bm.recentLastDiffRev;
+
+        const d = utils.getObjDiff(this.oldRecentLastDiff, diff);
+        if (utils.isEmptyObjDiff(d))
+            return;
+
+        this.savingRecentLastDiff = true;
+        try {
+            let result = {state: ''};
+            let tries = 0;
+            while (result.state != 'success' && tries < maxSetTries) {
+                if (force) {
+                    try {
+                        const revs = await this.storageCheck({recentLastDiff: {}});
+                        if (revs.items.recentLastDiff.rev)
+                            lastRev = revs.items.recentLastDiff.rev;
+                    } catch(e) {
+                        this.error(`Ошибка соединения с сервером: ${e.message}`);
+                        return;
+                    }
+                }
+
+                try {
+                    result = await this.storageSet({recentLastDiff: {rev: lastRev + 1, data: diff}}, force);
+                } catch(e) {
+                    this.savingRecentLastDiff = false;
+                    this.error(`Ошибка соединения с сервером: (${e.message}). Изменения не сохранены.`);
+                    return;
+                }
+
+                if (result.state == 'reject') {
+                    await this.loadRecent(false);
+                    this.savingRecentLastDiff = false;
+                    return;
+                }
+
+                tries++;
+            }
+
+            if (tries >= maxSetTries) {
+                console.error(result);
+                this.error('Не удалось отправить данные на сервер. Данные не сохранены и могут быть перезаписаны.');
+            } else {
+                this.oldRecentLastDiff = _.cloneDeep(diff);
+                await bm.setRecentLastDiffRev(lastRev + 1);
+            }
+        } finally {
+            this.savingRecentLastDiff = false;
+        }
+    }
+
     async storageCheck(items) {
         return await this.storageApi('check', items);
     }

client/components/Reader/SettingsPage/SettingsPage.vue

@@ -106,6 +106,7 @@
                         </el-form>
                         </div>
                     </el-tab-pane>
+
                     <!-- Вид ------------------------------------------------------------------------->                    
                     <el-tab-pane label="Вид">
 
@@ -345,6 +346,28 @@
                         </el-form>
                     </el-tab-pane>
 
+                    <!-- Кнопки ------------------------------------------------------------------------->
+                    <el-tab-pane label="Кнопки">
+                        <el-form :model="form" size="mini" label-width="120px" @submit.native.prevent>
+                            <div class="partHeader">Показывать кнопки панели</div>
+
+                            <el-form-item label="" v-for="item in toolButtons" :key="item.name">
+                                <el-checkbox @change="changeShowToolButton(item.name)" :value="showToolButton[item.name]">{{item.text}}</el-checkbox>
+                            </el-form-item>
+                        </el-form>
+                    </el-tab-pane>
+
+                    <!-- Управление ------------------------------------------------------------------------->
+                    <el-tab-pane label="Управление">
+                        <el-form :model="form" size="mini" label-width="120px" @submit.native.prevent>
+                            <div class="partHeader">Управление</div>
+
+                            <el-form-item label="">
+                                <el-checkbox v-model="clickControl">Включить управление кликом</el-checkbox>
+                            </el-form-item>
+                        </el-form>
+                    </el-tab-pane>
+
                     <!-- Листание ------------------------------------------------------------------------->
                     <el-tab-pane label="Листание">
                         <el-form :model="form" size="mini" label-width="120px" @submit.native.prevent>
@@ -380,14 +403,12 @@
                                 </el-tooltip>
                             </el-form-item>
                         </el-form>
-                        
                     </el-tab-pane>
+
                     <!-- Прочее ------------------------------------------------------------------------->
                     <el-tab-pane label="Прочее">
                         <el-form :model="form" size="mini" label-width="120px" @submit.native.prevent>
-                            <el-form-item label="Управление">
+                            <div class="partHeader">Подсказки, уведомления</div>
-                                <el-checkbox v-model="clickControl">Включить управление кликом</el-checkbox>
-                            </el-form-item>
 
                             <el-form-item label="Подсказка">
                                 <el-tooltip :open-delay="500" effect="light">
@@ -406,7 +427,7 @@
                                     <el-checkbox v-model="blinkCachedLoad">Предупреждать о загрузке из кэша</el-checkbox>
                                 </el-tooltip>
                             </el-form-item>
-                            <el-form-item label="Уведомления">
+                            <el-form-item label="Уведомление">
                                 <el-tooltip :open-delay="500" effect="light">
                                     <template slot="content">
                                         Показывать уведомления и ошибки от<br>
@@ -415,8 +436,21 @@
                                     <el-checkbox v-model="showServerStorageMessages">Показывать сообщения синхронизации</el-checkbox>
                                 </el-tooltip>
                             </el-form-item>
+                            <el-form-item label="Уведомление">
+                                <el-tooltip :open-delay="500" effect="light">
+                                    <template slot="content">
+                                        Показывать уведомления "Что нового"<br>
+                                        при каждом выходе новой версии читалки
+                                    </template>
+                                    <el-checkbox v-model="showWhatsNewDialog">Показывать уведомление "Что нового"</el-checkbox>
+                                </el-tooltip>
+                            </el-form-item>
+                        </el-form>
 
-                            <el-form-item label="URL">
+                        <el-form :model="form" size="mini" label-width="120px" @submit.native.prevent>
+                            <div class="partHeader">Прочее</div>
+
+                            <el-form-item label="Парам. в URL">
                                 <el-tooltip :open-delay="500" effect="light">
                                     <template slot="content">
                                         Добавление параметра "__p" в строке браузера<br>
@@ -450,6 +484,7 @@
                             </el-form-item>
                         </el-form>
                     </el-tab-pane>
+
                     <!-- Сброс ------------------------------------------------------------------------->
                     <el-tab-pane label="Сброс">
                         <el-button @click="setDefaults">Установить по умолчанию</el-button>
@@ -517,12 +552,14 @@ class SettingsPage extends Vue {
     fonts = [];
 
     serverStorageKeyVisible = false;
+    toolButtons = [];
 
     created() {
         this.commit = this.$store.commit;
         this.reader = this.$store.state.reader;
 
         this.form = {};
+        this.toolButtons = rstore.toolButtons;
         this.settingsChanged();
     }
 
@@ -536,6 +573,7 @@ class SettingsPage extends Vue {
                 this.form = Object.assign({}, this.form, {[prop]: newValue});
             });
         }
+
         this.fontBold = (this.fontWeight == 'bold');
         this.fontItalic = (this.fontStyle == 'italic');
 
@@ -642,6 +680,10 @@ class SettingsPage extends Vue {
         }
     }
 
+    changeShowToolButton(buttonName) {
+        this.showToolButton = Object.assign({}, this.showToolButton, {[buttonName]: !this.showToolButton[buttonName]});
+    }
+
     async addProfile() {
         try {
             if (Object.keys(this.profiles).length >= 100) {

client/components/Reader/TextPage/TextPage.vue

@@ -171,6 +171,13 @@ class TextPage extends Vue {
         this.fontShift = this.fontVertShift/100;
         this.textShift = this.textVertShift/100 + this.fontShift;
 
+        //statusBar
+        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);
+        this.statusBarClickable = this.drawHelper.statusBarClickable(this.statusBarTop, this.statusBarHeight);
+
         //drawHelper
         this.drawHelper.realWidth = this.realWidth;
         this.drawHelper.realHeight = this.realHeight;
@@ -197,13 +204,19 @@ class TextPage extends Vue {
         this.drawHelper.context = this.context;
 
         //сообщение "Загрузка шрифтов..."
-        const flText = 'Загрузка шрифта...';
+        this.$refs.fontsLoading.innerHTML = '';
-        this.$refs.fontsLoading.innerHTML = flText;
+        (async() => {
-        const fontsLoadingStyle = this.$refs.fontsLoading.style;
+            await sleep(500);
-        fontsLoadingStyle.position = 'absolute';
+            const flText = 'Загрузка шрифта';
-        fontsLoadingStyle.fontSize = this.fontSize + 'px';
+            this.$refs.fontsLoading.innerHTML = flText + ' &nbsp;<i class="el-icon-loading"></i>';
-        fontsLoadingStyle.top = (this.realHeight/2 - 2*this.fontSize) + 'px';
+            const fontsLoadingStyle = this.$refs.fontsLoading.style;
-        fontsLoadingStyle.left = (this.realWidth - this.drawHelper.measureText(flText, {}))/2 + 'px';
+            fontsLoadingStyle.position = 'absolute';
+            fontsLoadingStyle.fontSize = this.fontSize + 'px';
+            fontsLoadingStyle.top = (this.realHeight/2 - 2*this.fontSize) + 'px';
+            fontsLoadingStyle.left = (this.realWidth - this.drawHelper.measureText(flText, {}))/2 + 'px';
+            await sleep(10500);
+            this.$refs.fontsLoading.innerHTML = '';
+        })();
 
         //parsed
         if (this.parsed) {
@@ -225,13 +238,6 @@ class TextPage extends Vue {
             this.parsed.imageFitWidth = this.imageFitWidth;
         }
 
-        //statusBar
-        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);
-        this.statusBarClickable = this.drawHelper.statusBarClickable(this.statusBarTop, this.statusBarHeight);
-
         //scrolling page
         const pageSpace = this.scrollHeight - this.pageLineCount*this.lineHeight;
         let y = pageSpace/2;

client/components/Reader/share/bookManager.js

@@ -38,6 +38,7 @@ class BookManager {
             this.recent[this.recentLast.key] = this.recentLast;
         this.recentRev = await bmRecentStore.getItem('recent-rev') || 0;
         this.recentLastRev = await bmRecentStore.getItem('recent-last-rev') || 0;
+        this.recentLastDiffRev = await bmRecentStore.getItem('recent-last-diff-rev') || 0;
         this.books = Object.assign({}, this.booksCached);
 
         this.recentChanged2 = true;
@@ -428,10 +429,15 @@ class BookManager {
     }
 
     async setRecentLastRev(value) {
-        bmRecentStore.setItem('recent-last-rev', value);
+        await bmRecentStore.setItem('recent-last-rev', value);
         this.recentLastRev = value;
     }
 
+    async setRecentLastDiffRev(value) {
+        await bmRecentStore.setItem('recent-last-diff-rev', value);
+        this.recentLastDiffRev = value;
+    }
+
     addEventListener(listener) {
         if (this.eventListeners.indexOf(listener) < 0)
             this.eventListeners.push(listener);        

client/components/Reader/versionHistory.js

@@ -0,0 +1,97 @@
+export const versionHistory = [
+{
+    showUntil: '2019-06-05',
+    header: '0.6.7 (2019-05-30)',
+    content:
+`
+<ul>
+    <li>добавлен диалог "Что нового"</li>
+    <li>в справку добавлена история версий проекта</li>
+    <li>добавлена возможность настройки отображаемых кнопок на панели управления</li>
+    <li>некоторые кнопки на панели управления были скрыты по умолчанию</li>
+    <li>на страницу загрузки добавлена возможность загрузки книги из буфера обмена</li>
+    <li>добавлен GET-параметр вида "/reader?__refresh=1&url=..." для принудительного обновления загружаемого текста</li>
+    <li>добавлен GET-параметр вида "/reader?__pp=50.5&url=..." для указания позиции в книге в процентах</li>
+    <li>исправления багов и недочетов</li>
+</ul>
+`
+},
+
+{
+    showUntil: '2019-03-29',
+    header: '0.6.6 (2019-03-29)',
+    content:
+`
+<ul>
+    <li>в справку добавлено описание настройки браузеров для автономной работы читалки (без доступа к интернету)</li>
+    <li>оптимизации процесса синхронизации, внутренние переделки</li>
+</ul>
+`
+},
+
+{
+    showUntil: '2019-03-24',
+    header: '0.6.4 (2019-03-24)',
+    content:
+`
+<ul>
+    <li>исправления багов, оптимизации</li>
+    <li>добавлена возможность синхронизации данных между устройствами</li>
+</ul>
+`
+},
+
+{
+    showUntil: '2019-03-04',
+    header: '0.5.4 (2019-03-04)',
+    content:
+`
+<ul>
+    <li>добавлена поддержка форматов pdf, epub, mobi</li>
+    <li>(0.5.2) добавлена поддержка форматов rtf, doc, docx</li>
+    <li>(0.4.2) фильтр для СИ больше не вырезает изображения</li>
+    <li>(0.4.0) добавлено отображение картинок в fb2</li>
+</ul>
+`
+},
+
+{
+    showUntil: '2019-02-17',
+    header: '0.3.0 (2019-02-17)',
+    content:
+`
+<ul>
+    <li>поправки багов</li>
+    <li>улучшено распознавание текста</li>
+    <li>изменена верстка страницы - убрано позиционирование каждого слова</li>
+</ul>
+`
+},
+
+{
+    showUntil: '2019-02-14',
+    header: '0.1.7 (2019-02-14)',
+    content:
+`
+<ul>
+    <li>увеличены верхние границы отступов и др.размеров</li>
+    <li>добавлена настройка для удаления/вставки пустых параграфов</li>
+    <li>добавлена настройка включения/отключения управления кликом</li>
+    <li>добавлена возможность сброса настроек</li>
+    <li>убран автоматический редирект на последнюю загруженную книгу, если не задан url в маршруте</li>
+</ul>
+`
+},
+
+{
+    showUntil: '2019-02-12',
+    header: '0.1.0 (2019-02-12)',
+    content:
+`
+<ul>
+    <li>первый деплой проекта, длительность разработки - 2 месяца</li>
+</ul>
+`
+},
+
+]

client/element.js

@@ -86,8 +86,8 @@ import './theme/form-item.css';
 import ElColorPicker from 'element-ui/lib/color-picker';
 import './theme/color-picker.css';
 
-//import ElDialog from 'element-ui/lib/dialog';
+import ElDialog from 'element-ui/lib/dialog';
-//import './theme/dialog.css';
+import './theme/dialog.css';
 
 import Notification from 'element-ui/lib/notification';
 import './theme/notification.css';
@@ -106,7 +106,7 @@ const components = {
     ElCol, ElContainer, ElAside, ElMain, ElHeader,
     ElInput, ElInputNumber, ElSelect, ElOption, ElTable, ElTableColumn,
     ElProgress, ElSlider, ElForm, ElFormItem,
-    ElColorPicker,
+    ElColorPicker, ElDialog,
 };
 
 for (let name in components) {

client/share/utils.js

@@ -39,6 +39,8 @@ export function formatDate(d, format) {
         case 'normal':
             return `${d.getDate().toString().padStart(2, '0')}.${(d.getMonth() + 1).toString().padStart(2, '0')}.${d.getFullYear()} ` + 
                 `${d.getHours().toString().padStart(2, '0')}:${d.getMinutes().toString().padStart(2, '0')}`;
+        case 'coDate':
+            return `${d.getFullYear()}-${(d.getMonth() + 1).toString().padStart(2, '0')}-${d.getDate().toString().padStart(2, '0')}`;
     }
     
 }

client/store/modules/reader.js

@@ -1,3 +1,16 @@
+//занчение toolButtons.name не должно совпадать с settingDefaults-propertyName
+const toolButtons = [
+    {name: 'undoAction',  show: true, text: 'Действие назад'},
+    {name: 'redoAction',  show: true, text: 'Действие вперед'},
+    {name: 'fullScreen',  show: true, text: 'На весь экран'},
+    {name: 'scrolling',   show: false, text: 'Плавный скроллинг'},
+    {name: 'setPosition', show: true, text: 'На страницу'},
+    {name: 'search',      show: true, text: 'Найти в тексте'},
+    {name: 'copyText',    show: false, text: 'Скопировать текст со страницы'},
+    {name: 'refresh',     show: true, text: 'Принудительно обновить книгу'},
+    {name: 'history',     show: true, text: 'Открыть недавние'},
+];
+
 const fonts = [
     {name: 'ReaderDefault', label: 'По-умолчанию', fontVertShift: 0},
     {name: 'GEO_1', label: 'BPG Arial', fontVertShift: 10},
@@ -166,14 +179,18 @@ const settingDefaults = {
     imageHeightLines: 100,
     imageFitWidth: true,
     showServerStorageMessages: true,
+    showWhatsNewDialog: true,
 
     fontShifts: {},
+    showToolButton: {},
 };
 
 for (const font of fonts)
     settingDefaults.fontShifts[font.name] = font.fontVertShift;
 for (const font of webFonts)
     settingDefaults.fontShifts[font.name] = font.fontVertShift;
+for (const button of toolButtons)
+    settingDefaults.showToolButton[button.name] = button.show;
 
 // initial state
 const state = {
@@ -183,6 +200,7 @@ const state = {
     profiles: {},
     profilesRev: 0,
     allowProfilesSave: false,//подстраховка для разработки
+    whatsNewContentHash: '',
     currentProfile: '',
     settings: Object.assign({}, settingDefaults),
     settingsRev: {},
@@ -214,6 +232,9 @@ const mutations = {
     setAllowProfilesSave(state, value) {
         state.allowProfilesSave = value;
     },
+    setWhatsNewContentHash(state, value) {
+        state.whatsNewContentHash = value;
+    },
     setCurrentProfile(state, value) {
         state.currentProfile = value;
     },
@@ -226,6 +247,7 @@ const mutations = {
 };
 
 export default {
+    toolButtons,
     fonts,
     webFonts,
     settingDefaults,

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "Liberama",
-  "version": "0.5.6",
+  "version": "0.6.5",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "Liberama",
-  "version": "0.6.5",
+  "version": "0.6.7",
   "engines": {
     "node": ">=10.0.0"
   },

server/core/ReaderWorker.js

@@ -131,32 +131,34 @@ class ReaderWorker {
         return `file://${hash}`;
     }
 
-    async periodicCleanDir(dir, maxSize, timeout) {        
+    async periodicCleanDir(dir, maxSize, timeout) {
-        const list = await fs.readdir(dir);
+        try {
+            const list = await fs.readdir(dir);
 
-        let size = 0;
+            let size = 0;
-        let files = [];
+            let files = [];
-        for (const name of list) {
+            for (const name of list) {
-            const stat = await fs.stat(`${dir}/${name}`);
+                const stat = await fs.stat(`${dir}/${name}`);
-            if (!stat.isDirectory()) {
+                if (!stat.isDirectory()) {
-                size += stat.size;
+                    size += stat.size;
-                files.push({name, stat});
+                    files.push({name, stat});
+                }
             }
+
+            files.sort((a, b) => a.stat.mtimeMs - b.stat.mtimeMs);
+
+            let i = 0;
+            while (i < files.length && size > maxSize) {
+                const file = files[i];
+                await fs.remove(`${dir}/${file.name}`);
+                size -= file.stat.size;
+                i++;
+            }
+        } finally {
+            setTimeout(() => {
+                this.periodicCleanDir(dir, maxSize, timeout);
+            }, timeout);
         }
-
-        files.sort((a, b) => a.stat.mtimeMs - b.stat.mtimeMs);
-
-        let i = 0;
-        while (i < files.length && size > maxSize) {
-            const file = files[i];
-            await fs.remove(`${dir}/${file.name}`);
-            size -= file.stat.size;
-            i++;
-        }
-
-        setTimeout(() => {
-            this.periodicCleanDir(dir, maxSize, timeout);
-        }, timeout);
     }
 }