Compare commits
56 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
cfcee9eb99 | ||
|
|
e93c873c17 | ||
|
|
3d7c039fd4 | ||
|
|
9971f1d4bf | ||
|
|
59702d3d50 | ||
|
|
736e6ec075 | ||
|
|
abdd6d4142 | ||
|
|
16edc85e39 | ||
|
|
bbeb92a9da | ||
|
|
daaf9ac70b | ||
|
|
0805353a9e | ||
|
|
594ff954b1 | ||
|
|
cf5203687e | ||
|
|
55ad2d664d | ||
|
|
4d1485a61f | ||
|
|
f260378c93 | ||
|
|
08f9175705 | ||
|
|
ca7cc322d7 | ||
|
|
a631befdf9 | ||
|
|
b7875644bc | ||
|
|
9d8507a1e4 | ||
|
|
50042aa36d | ||
|
|
d21cf6286a | ||
|
|
b0709abfa2 | ||
|
|
dedb729dfe | ||
|
|
27e2f26d5d | ||
|
|
ae30c3865d | ||
|
|
b3453af0fe | ||
|
|
550dcbc081 | ||
|
|
5af1f81bc3 | ||
|
|
d306f972cc | ||
|
|
0f6747f2db | ||
|
|
559b96d56f | ||
|
|
69606429b8 | ||
|
|
824fe68194 | ||
|
|
b056feda59 | ||
|
|
32635dedb0 | ||
|
|
835f9374f6 | ||
|
|
edece5e17f | ||
|
|
298317d352 | ||
|
|
c7637eb941 | ||
|
|
c8f9e0ac9d | ||
|
|
3e3f259920 | ||
|
|
c88baf3c2c | ||
|
|
0d27dabd62 | ||
|
|
5c29594b3d | ||
|
|
1e71d0ae2f | ||
|
|
a4c72481d1 | ||
|
|
23ecb433fb | ||
|
|
6b9ad4a947 | ||
|
|
9a44f53e5f | ||
|
|
bce31df7e6 | ||
|
|
4bdd33b44f | ||
|
|
7ab5d4e113 | ||
|
|
92c454b3e9 | ||
|
|
a7f588b724 |
@@ -6,7 +6,7 @@ const api = axios.create({
|
||||
|
||||
class Misc {
|
||||
async loadConfig() {
|
||||
const response = await api.post('/config', {params: ['name', 'version', 'mode']});
|
||||
const response = await api.post('/config', {params: ['name', 'version', 'mode', 'maxUploadFileSize']});
|
||||
return response.data;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
import axios from 'axios';
|
||||
import {sleep} from '../share/utils';
|
||||
|
||||
const maxFileUploadSize = 50*1024*1024;
|
||||
const api = axios.create({
|
||||
baseURL: '/api/reader'
|
||||
});
|
||||
@@ -75,9 +74,11 @@ class Reader {
|
||||
return await axios.get(url, options);
|
||||
}
|
||||
|
||||
async uploadFile(file, callback) {
|
||||
if (file.size > maxFileUploadSize)
|
||||
throw new Error(`Размер файла превышает ${maxFileUploadSize} байт`);
|
||||
async uploadFile(file, maxUploadFileSize, callback) {
|
||||
if (!maxUploadFileSize)
|
||||
maxUploadFileSize = 10*1024*1024;
|
||||
if (file.size > maxUploadFileSize)
|
||||
throw new Error(`Размер файла превышает ${maxUploadFileSize} байт`);
|
||||
|
||||
let formData = new FormData();
|
||||
formData.append('file', file);
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<li>кэширование файлов книг на клиенте и на сервере</li>
|
||||
<li>открытие книг с локального диска</li>
|
||||
<li>плавный скроллинг текста</li>
|
||||
<li>анимация перелистывания (скоро)</li>
|
||||
<li>анимация перелистывания</li>
|
||||
<li>поиск по тексту и копирование фрагмента</li>
|
||||
<li>запоминание недавних книг, скачивание книги из читалки в формате fb2</li>
|
||||
<li>управление кликом и с клавиатуры</li>
|
||||
|
||||
@@ -9,6 +9,7 @@
|
||||
<li><b>ПКМ</b> - показать/скрыть панель управления</li>
|
||||
<li><b>СКМ</b> - вкл./выкл. плавный скроллинг текста</li>
|
||||
</ul>
|
||||
* Для управления с помощью мыши/тачпада необходимо установить галочку "Включить управление кликом" в настройках
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -141,17 +141,27 @@ class HistoryPage extends Vue {
|
||||
}
|
||||
|
||||
const fb2 = (book.fb2 ? book.fb2 : {});
|
||||
|
||||
let title = fb2.bookTitle;
|
||||
if (title)
|
||||
title = `"${title}"`;
|
||||
else
|
||||
title = '';
|
||||
|
||||
let author = _.compact([
|
||||
fb2.lastName,
|
||||
fb2.firstName,
|
||||
fb2.middleName
|
||||
]).join(' ');
|
||||
author = (author ? author : (fb2.bookTitle ? fb2.bookTitle : book.url));
|
||||
|
||||
result.push({
|
||||
touchDateTime: book.touchTime,
|
||||
touchDate: t[0],
|
||||
touchTime: t[1],
|
||||
desc: {
|
||||
title: `"${fb2.bookTitle}"${perc}${textLen}`,
|
||||
author: _.compact([
|
||||
fb2.lastName,
|
||||
fb2.firstName,
|
||||
fb2.middleName
|
||||
]).join(' '),
|
||||
title: `${title}${perc}${textLen}`,
|
||||
author,
|
||||
},
|
||||
url: book.url,
|
||||
path: book.path,
|
||||
|
||||
@@ -133,12 +133,16 @@ export default @Component({
|
||||
this.loadBook({url: newValue, bookPos: this.routeParamPos});
|
||||
}
|
||||
},
|
||||
settings: function(newValue) {
|
||||
this.allowUrlParamBookPos = newValue.allowUrlParamBookPos;
|
||||
this.copyFullText = newValue.copyFullText;
|
||||
this.showClickMapPage = newValue.showClickMapPage;
|
||||
settings: function() {
|
||||
this.loadSettings();
|
||||
this.updateRoute();
|
||||
},
|
||||
loaderActive: function(newValue) {
|
||||
const recent = this.mostRecentBook();
|
||||
if (!newValue && !this.loading && recent && !bookManager.hasBookParsed(recent)) {
|
||||
this.loadBook(recent);
|
||||
}
|
||||
},
|
||||
},
|
||||
})
|
||||
class Reader extends Vue {
|
||||
@@ -168,6 +172,7 @@ class Reader extends Vue {
|
||||
this.commit = this.$store.commit;
|
||||
this.dispatch = this.$store.dispatch;
|
||||
this.reader = this.$store.state.reader;
|
||||
this.config = this.$store.state.config;
|
||||
|
||||
this.$root.addKeyHook(this.keyHook);
|
||||
|
||||
@@ -179,7 +184,7 @@ class Reader extends Vue {
|
||||
|
||||
this.debouncedSetRecentBook = _.debounce(async(newValue) => {
|
||||
const recent = this.mostRecentBook();
|
||||
if (recent && recent.bookPos != newValue) {
|
||||
if (recent && (recent.bookPos != newValue || recent.bookPosSeen !== this.bookPosSeen)) {
|
||||
await bookManager.setRecentBook(Object.assign({}, recent, {bookPos: newValue, bookPosSeen: this.bookPosSeen}));
|
||||
|
||||
if (this.actionCur < 0 || (this.actionCur >= 0 && this.actionList[this.actionCur] != newValue))
|
||||
@@ -191,21 +196,17 @@ class Reader extends Vue {
|
||||
this.fullScreenActive = (document.fullscreenElement !== null);
|
||||
});
|
||||
|
||||
this.allowUrlParamBookPos = this.settings.allowUrlParamBookPos;
|
||||
this.copyFullText = this.settings.copyFullText;
|
||||
this.showClickMapPage = this.settings.showClickMapPage;
|
||||
this.loadSettings();
|
||||
}
|
||||
|
||||
mounted() {
|
||||
(async() => {
|
||||
await bookManager.init();
|
||||
await bookManager.init(this.settings);
|
||||
await restoreOldSettings(this.settings, bookManager, this.commit);
|
||||
|
||||
if (this.$root.rootRoute == '/reader') {
|
||||
if (this.routeParamUrl) {
|
||||
this.loadBook({url: this.routeParamUrl, bookPos: this.routeParamPos});
|
||||
} else if (this.mostRecentBook()) {
|
||||
this.loadBook({url: this.mostRecentBook().url});
|
||||
} else {
|
||||
this.loaderActive = true;
|
||||
}
|
||||
@@ -214,6 +215,15 @@ class Reader extends Vue {
|
||||
})();
|
||||
}
|
||||
|
||||
loadSettings() {
|
||||
const settings = this.settings;
|
||||
this.allowUrlParamBookPos = settings.allowUrlParamBookPos;
|
||||
this.copyFullText = settings.copyFullText;
|
||||
this.showClickMapPage = settings.showClickMapPage;
|
||||
this.clickControl = settings.clickControl;
|
||||
this.blinkCachedLoad = settings.blinkCachedLoad;
|
||||
}
|
||||
|
||||
get routeParamPos() {
|
||||
let result = undefined;
|
||||
const q = this.$route.query;
|
||||
@@ -438,53 +448,61 @@ class Reader extends Vue {
|
||||
}
|
||||
}
|
||||
|
||||
refreshBook() {
|
||||
if (this.mostRecentBook()) {
|
||||
this.loadBook({url: this.mostRecentBook().url, force: true});
|
||||
}
|
||||
}
|
||||
|
||||
buttonClick(button) {
|
||||
const activeClass = this.buttonActiveClass(button);
|
||||
if (!activeClass['tool-button-disabled'])
|
||||
switch (button) {
|
||||
case 'loader':
|
||||
this.loaderToggle();
|
||||
break;
|
||||
case 'undoAction':
|
||||
if (this.actionCur > 0) {
|
||||
this.actionCur--;
|
||||
this.bookPosChanged({bookPos: this.actionList[this.actionCur]});
|
||||
}
|
||||
break;
|
||||
case 'redoAction':
|
||||
if (this.actionCur < this.actionList.length - 1) {
|
||||
this.actionCur++;
|
||||
this.bookPosChanged({bookPos: this.actionList[this.actionCur]});
|
||||
}
|
||||
break;
|
||||
case 'fullScreen':
|
||||
this.fullScreenToggle();
|
||||
break;
|
||||
case 'setPosition':
|
||||
this.setPositionToggle();
|
||||
break;
|
||||
case 'scrolling':
|
||||
this.scrollingToggle();
|
||||
break;
|
||||
case 'search':
|
||||
this.searchToggle();
|
||||
break;
|
||||
case 'copyText':
|
||||
this.copyTextToggle();
|
||||
break;
|
||||
case 'history':
|
||||
this.historyToggle();
|
||||
break;
|
||||
case 'refresh':
|
||||
if (this.mostRecentBook()) {
|
||||
this.loadBook({url: this.mostRecentBook().url, force: true});
|
||||
}
|
||||
break;
|
||||
case 'settings':
|
||||
this.settingsToggle();
|
||||
break;
|
||||
}
|
||||
|
||||
this.$refs[button].$el.blur();
|
||||
|
||||
if (activeClass['tool-button-disabled'])
|
||||
return;
|
||||
|
||||
switch (button) {
|
||||
case 'loader':
|
||||
this.loaderToggle();
|
||||
break;
|
||||
case 'undoAction':
|
||||
if (this.actionCur > 0) {
|
||||
this.actionCur--;
|
||||
this.bookPosChanged({bookPos: this.actionList[this.actionCur]});
|
||||
}
|
||||
break;
|
||||
case 'redoAction':
|
||||
if (this.actionCur < this.actionList.length - 1) {
|
||||
this.actionCur++;
|
||||
this.bookPosChanged({bookPos: this.actionList[this.actionCur]});
|
||||
}
|
||||
break;
|
||||
case 'fullScreen':
|
||||
this.fullScreenToggle();
|
||||
break;
|
||||
case 'setPosition':
|
||||
this.setPositionToggle();
|
||||
break;
|
||||
case 'scrolling':
|
||||
this.scrollingToggle();
|
||||
break;
|
||||
case 'search':
|
||||
this.searchToggle();
|
||||
break;
|
||||
case 'copyText':
|
||||
this.copyTextToggle();
|
||||
break;
|
||||
case 'history':
|
||||
this.historyToggle();
|
||||
break;
|
||||
case 'refresh':
|
||||
this.refreshBook();
|
||||
break;
|
||||
case 'settings':
|
||||
this.settingsToggle();
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
buttonActiveClass(button) {
|
||||
@@ -538,8 +556,8 @@ class Reader extends Vue {
|
||||
return classResult;
|
||||
}
|
||||
|
||||
async acivateClickMapPage() {
|
||||
if (this.showClickMapPage && !this.clickMapActive) {
|
||||
async activateClickMapPage() {
|
||||
if (this.clickControl && this.showClickMapPage && !this.clickMapActive) {
|
||||
this.clickMapActive = true;
|
||||
await this.$refs.clickMapPage.slowDisappear();
|
||||
this.clickMapActive = false;
|
||||
@@ -591,14 +609,19 @@ class Reader extends Vue {
|
||||
}
|
||||
|
||||
loadBook(opts) {
|
||||
if (!opts) {
|
||||
if (!opts || !opts.url) {
|
||||
this.mostRecentBook();
|
||||
return;
|
||||
}
|
||||
|
||||
let url = opts.url;
|
||||
if ((url.indexOf('http://') != 0) && (url.indexOf('https://') != 0) &&
|
||||
(url.indexOf('file://') != 0))
|
||||
url = 'http://' + url;
|
||||
|
||||
// уже просматривается сейчас
|
||||
const lastBook = (this.$refs.page ? this.$refs.page.lastBook : null);
|
||||
if (!opts.force && lastBook && lastBook.url == opts.url && bookManager.hasBookParsed(lastBook)) {
|
||||
if (!opts.force && lastBook && lastBook.url == url && bookManager.hasBookParsed(lastBook)) {
|
||||
this.loaderActive = false;
|
||||
return;
|
||||
}
|
||||
@@ -615,7 +638,7 @@ class Reader extends Vue {
|
||||
progress.setState({state: 'parse'});
|
||||
|
||||
// есть ли среди недавних
|
||||
const key = bookManager.keyFromUrl(opts.url);
|
||||
const key = bookManager.keyFromUrl(url);
|
||||
let wasOpened = await bookManager.getRecentBook({key});
|
||||
wasOpened = (wasOpened ? wasOpened : {});
|
||||
const bookPos = (opts.bookPos !== undefined ? opts.bookPos : wasOpened.bookPos);
|
||||
@@ -626,7 +649,7 @@ class Reader extends Vue {
|
||||
|
||||
if (!opts.force) {
|
||||
// пытаемся загрузить и распарсить книгу в менеджере из локального кэша
|
||||
const bookParsed = await bookManager.getBook({url: opts.url}, (prog) => {
|
||||
const bookParsed = await bookManager.getBook({url}, (prog) => {
|
||||
progress.setState({progress: prog});
|
||||
});
|
||||
|
||||
@@ -639,7 +662,7 @@ class Reader extends Vue {
|
||||
progress.hide(); this.progressActive = false;
|
||||
this.blinkCachedLoadMessage();
|
||||
|
||||
await this.acivateClickMapPage();
|
||||
await this.activateClickMapPage();
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -662,7 +685,7 @@ class Reader extends Vue {
|
||||
// не удалось, скачиваем книгу полностью с конвертацией
|
||||
let loadCached = true;
|
||||
if (!book) {
|
||||
book = await readerApi.loadBook(opts.url, (state) => {
|
||||
book = await readerApi.loadBook(url, (state) => {
|
||||
progress.setState(state);
|
||||
});
|
||||
loadCached = false;
|
||||
@@ -687,7 +710,7 @@ class Reader extends Vue {
|
||||
} else
|
||||
this.stopBlink = true;
|
||||
|
||||
await this.acivateClickMapPage();
|
||||
await this.activateClickMapPage();
|
||||
} catch (e) {
|
||||
progress.hide(); this.progressActive = false;
|
||||
this.loaderActive = true;
|
||||
@@ -704,7 +727,7 @@ class Reader extends Vue {
|
||||
progress.show();
|
||||
progress.setState({state: 'upload'});
|
||||
|
||||
const url = await readerApi.uploadFile(opts.file, (state) => {
|
||||
const url = await readerApi.uploadFile(opts.file, this.config.maxUploadFileSize, (state) => {
|
||||
progress.setState(state);
|
||||
});
|
||||
|
||||
@@ -720,6 +743,9 @@ class Reader extends Vue {
|
||||
}
|
||||
|
||||
blinkCachedLoadMessage() {
|
||||
if (!this.blinkCachedLoad)
|
||||
return;
|
||||
|
||||
this.blinkCount = 30;
|
||||
if (!this.inBlink) {
|
||||
this.inBlink = true;
|
||||
@@ -780,6 +806,9 @@ class Reader extends Vue {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
break;
|
||||
case 'KeyZ':
|
||||
this.scrollingToggle();
|
||||
break;
|
||||
case 'KeyP':
|
||||
this.setPositionToggle();
|
||||
break;
|
||||
@@ -797,8 +826,8 @@ class Reader extends Vue {
|
||||
event.stopPropagation();
|
||||
}
|
||||
break;
|
||||
case 'KeyZ':
|
||||
this.scrollingToggle();
|
||||
case 'KeyR':
|
||||
this.refreshBook();
|
||||
break;
|
||||
case 'KeyX':
|
||||
this.historyToggle();
|
||||
|
||||
@@ -81,7 +81,7 @@
|
||||
</el-form-item>
|
||||
<el-form-item label="Размер">
|
||||
<el-col :span="17">
|
||||
<el-input-number v-model="fontSize" :min="5" :max="100"></el-input-number>
|
||||
<el-input-number v-model="fontSize" :min="5" :max="200"></el-input-number>
|
||||
</el-col>
|
||||
<el-col :span="1">
|
||||
<a href="https://fonts.google.com/?subset=cyrillic" target="_blank">Примеры</a>
|
||||
@@ -112,10 +112,10 @@
|
||||
<div class="partHeader">Текст</div>
|
||||
|
||||
<el-form-item label="Интервал">
|
||||
<el-input-number v-model="lineInterval" :min="0" :max="100"></el-input-number>
|
||||
<el-input-number v-model="lineInterval" :min="0" :max="200"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="Параграф">
|
||||
<el-input-number v-model="p" :min="0" :max="200"></el-input-number>
|
||||
<el-input-number v-model="p" :min="0" :max="2000"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="Отступ">
|
||||
<el-col :span="11">
|
||||
@@ -123,7 +123,7 @@
|
||||
<template slot="content">
|
||||
Слева/справа
|
||||
</template>
|
||||
<el-input-number v-model="indentLR" :min="0" :max="200"></el-input-number>
|
||||
<el-input-number v-model="indentLR" :min="0" :max="2000"></el-input-number>
|
||||
</el-tooltip>
|
||||
</el-col>
|
||||
<el-col :span="1">
|
||||
@@ -134,7 +134,7 @@
|
||||
<template slot="content">
|
||||
Сверху/снизу
|
||||
</template>
|
||||
<el-input-number v-model="indentTB" :min="0" :max="200"></el-input-number>
|
||||
<el-input-number v-model="indentTB" :min="0" :max="2000"></el-input-number>
|
||||
</el-tooltip>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
@@ -184,6 +184,16 @@
|
||||
<el-checkbox v-model="textAlignJustify">По ширине</el-checkbox>
|
||||
<el-checkbox v-model="wordWrap">Перенос по слогам</el-checkbox>
|
||||
</el-form-item>
|
||||
<el-form-item label="Обработка">
|
||||
<el-checkbox v-model="cutEmptyParagraphs" @change="needReload">Убирать пустые параграфы</el-checkbox>
|
||||
</el-form-item>
|
||||
<el-form-item label="">
|
||||
<el-col :span="12">
|
||||
Добавлять пустые
|
||||
</el-col>
|
||||
<el-input-number v-model="addEmptyParagraphs" :min="0" :max="2" @change="needReload"></el-input-number>
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
|
||||
<el-form :model="form" size="mini" label-width="120px" @submit.native.prevent>
|
||||
@@ -194,7 +204,7 @@
|
||||
<el-checkbox v-model="statusBarTop" :disabled="!showStatusBar">Вверху/внизу</el-checkbox>
|
||||
</el-form-item>
|
||||
<el-form-item label="Высота">
|
||||
<el-input-number v-model="statusBarHeight" :min="5" :max="50" :disabled="!showStatusBar"></el-input-number>
|
||||
<el-input-number v-model="statusBarHeight" :min="5" :max="100" :disabled="!showStatusBar"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="Прозрачность">
|
||||
<el-input-number v-model="statusBarColorAlpha" :min="0" :max="1" :precision="2" :step="0.1" :disabled="!showStatusBar"></el-input-number>
|
||||
@@ -208,11 +218,19 @@
|
||||
<div class="partHeader">Анимация</div>
|
||||
|
||||
<el-form-item label="Вид">
|
||||
не готово
|
||||
<el-col :span="11">
|
||||
<el-select v-model="pageChangeAnimation">
|
||||
<el-option label="Нет" value=""></el-option>
|
||||
<el-option label="Вверх-вниз" value="downShift"></el-option>
|
||||
<el-option label="Вправо-влево" value="rightShift"></el-option>
|
||||
<el-option label="Протаивание" value="thaw"></el-option>
|
||||
<el-option label="Мерцание" value="blink"></el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="Скорость">
|
||||
не готово
|
||||
<el-input-number v-model="pageChangeAnimationSpeed" :min="0" :max="100" :disabled="pageChangeAnimation == ''"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
@@ -234,14 +252,26 @@
|
||||
<!--------------------------------------------------------------------------->
|
||||
<el-tab-pane label="Прочее">
|
||||
<el-form :model="form" size="mini" label-width="120px" @submit.native.prevent>
|
||||
<el-form-item label="Управление">
|
||||
<el-checkbox v-model="clickControl">Включить управление кликом</el-checkbox>
|
||||
</el-form-item>
|
||||
<el-form-item label="Подсказка">
|
||||
<el-tooltip :open-delay="500" effect="light">
|
||||
<template slot="content">
|
||||
Показывать или нет подсказку при каждой загрузке книги
|
||||
</template>
|
||||
<el-checkbox v-model="showClickMapPage">Показывать области управления кликом</el-checkbox>
|
||||
<el-checkbox v-model="showClickMapPage" :disabled="!clickControl">Показывать области управления кликом</el-checkbox>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
</el-form-item>
|
||||
<el-form-item label="Подсказка">
|
||||
<el-tooltip :open-delay="500" effect="light">
|
||||
<template slot="content">
|
||||
Мерцать сообщением в строке статуса и на кнопке<br>
|
||||
обновления при загрузке книги из кэша
|
||||
</template>
|
||||
<el-checkbox v-model="blinkCachedLoad">Предупреждать о загрузке из кэша</el-checkbox>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
<el-form-item label="URL">
|
||||
<el-tooltip :open-delay="500" effect="light">
|
||||
<template slot="content">
|
||||
@@ -274,9 +304,11 @@
|
||||
<el-checkbox v-model="copyFullText">Загружать весь текст</el-checkbox>
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
|
||||
</el-tab-pane>
|
||||
<!--------------------------------------------------------------------------->
|
||||
<el-tab-pane label="Сброс">
|
||||
<el-button @click="setDefaults">Установить по-умолчанию</el-button>
|
||||
</el-tab-pane>
|
||||
|
||||
</el-tabs>
|
||||
@@ -384,10 +416,31 @@ class SettingsPage extends Vue {
|
||||
];
|
||||
}
|
||||
|
||||
needReload() {
|
||||
this.$notify.warning({message: 'Необходимо обновить страницу (F5), чтобы изменения возымели эффект'});
|
||||
}
|
||||
|
||||
close() {
|
||||
this.$emit('settings-toggle');
|
||||
}
|
||||
|
||||
async setDefaults() {
|
||||
try {
|
||||
if (await this.$confirm('Подтвердите установку настроек по-умолчанию', '', {
|
||||
confirmButtonText: 'OK',
|
||||
cancelButtonText: 'Отмена',
|
||||
type: 'warning'
|
||||
})) {
|
||||
this.form = Object.assign({}, rstore.settingDefaults);
|
||||
for (let prop in rstore.settingDefaults) {
|
||||
this[prop] = this.form[prop];
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
//
|
||||
}
|
||||
}
|
||||
|
||||
keyHook(event) {
|
||||
if (event.type == 'keydown' && event.code == 'Escape') {
|
||||
this.close();
|
||||
|
||||
@@ -1,8 +1,129 @@
|
||||
import {sleep} from '../../../share/utils';
|
||||
|
||||
export default class DrawHelper {
|
||||
fontBySize(size) {
|
||||
return `${size}px ${this.fontName}`;
|
||||
}
|
||||
|
||||
fontByStyle(style) {
|
||||
return `${style.italic ? 'italic' : this.fontStyle} ${style.bold ? 'bold' : this.fontWeight} ${this.fontSize}px ${this.fontName}`;
|
||||
}
|
||||
|
||||
measureText(text, style) {// eslint-disable-line no-unused-vars
|
||||
this.context.font = this.fontByStyle(style);
|
||||
return this.context.measureText(text).width;
|
||||
}
|
||||
|
||||
measureTextFont(text, font) {// eslint-disable-line no-unused-vars
|
||||
this.context.font = font;
|
||||
return this.context.measureText(text).width;
|
||||
}
|
||||
|
||||
drawPage(lines, isScrolling) {
|
||||
if (!this.lastBook || this.pageLineCount < 1 || !this.book || !lines || !this.parsed.textLength)
|
||||
return '';
|
||||
|
||||
const spaceWidth = this.measureText(' ', {});
|
||||
|
||||
let out = `<div class="layout" style="width: ${this.realWidth}px; height: ${this.realHeight}px;` +
|
||||
` color: ${this.textColor}">`;
|
||||
|
||||
let len = lines.length;
|
||||
const lineCount = this.pageLineCount + (isScrolling ? 1 : 0);
|
||||
len = (len > lineCount ? lineCount : len);
|
||||
|
||||
let y = this.fontSize*this.textShift;
|
||||
|
||||
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}
|
||||
text: String,
|
||||
}
|
||||
}*/
|
||||
|
||||
let indent = line.first ? this.p : 0;
|
||||
|
||||
let lineText = '';
|
||||
let center = false;
|
||||
let centerStyle = {};
|
||||
for (const part of line.parts) {
|
||||
lineText += part.text;
|
||||
center = center || part.style.center;
|
||||
if (part.style.center)
|
||||
centerStyle = part.style;
|
||||
}
|
||||
|
||||
let filled = false;
|
||||
// если выравнивание по ширине включено
|
||||
if (this.textAlignJustify && !line.last && !center) {
|
||||
const words = lineText.split(' ');
|
||||
|
||||
if (words.length > 1) {
|
||||
const spaceCount = words.length - 1;
|
||||
|
||||
const space = (this.w - line.width + spaceWidth*spaceCount)/spaceCount;
|
||||
|
||||
let x = indent;
|
||||
for (const part of line.parts) {
|
||||
const font = this.fontByStyle(part.style);
|
||||
let partWords = part.text.split(' ');
|
||||
|
||||
for (let j = 0; j < partWords.length; j++) {
|
||||
let f = font;
|
||||
let style = part.style;
|
||||
let word = partWords[j];
|
||||
if (i == 0 && this.searching && word.toLowerCase().indexOf(this.needle) >= 0) {
|
||||
style = Object.assign({}, part.style, {bold: true});
|
||||
f = this.fontByStyle(style);
|
||||
}
|
||||
out += this.fillText(word, x, y, f);
|
||||
x += this.measureText(word, style) + (j < partWords.length - 1 ? space : 0);
|
||||
}
|
||||
}
|
||||
filled = true;
|
||||
}
|
||||
}
|
||||
|
||||
// просто выводим текст
|
||||
if (!filled) {
|
||||
let x = indent;
|
||||
x = (center ? (this.w - this.measureText(lineText, centerStyle))/2 : x);
|
||||
for (const part of line.parts) {
|
||||
let font = this.fontByStyle(part.style);
|
||||
|
||||
if (i == 0 && this.searching) {//для поиска, разбивка по словам
|
||||
let partWords = part.text.split(' ');
|
||||
for (let j = 0; j < partWords.length; j++) {
|
||||
let f = font;
|
||||
let style = part.style;
|
||||
let word = partWords[j];
|
||||
if (word.toLowerCase().indexOf(this.needle) >= 0) {
|
||||
style = Object.assign({}, part.style, {bold: true});
|
||||
f = this.fontByStyle(style);
|
||||
}
|
||||
out += this.fillText(word, x, y, f);
|
||||
x += this.measureText(word, style) + (j < partWords.length - 1 ? spaceWidth : 0);
|
||||
}
|
||||
} else {
|
||||
out += this.fillText(part.text, x, y, font);
|
||||
x += this.measureText(part.text, part.style);
|
||||
}
|
||||
}
|
||||
}
|
||||
y += this.lineHeight;
|
||||
}
|
||||
|
||||
out += '</div>';
|
||||
return out;
|
||||
}
|
||||
|
||||
drawPercentBar(x, y, w, h, font, fontSize, bookPos, textLength) {
|
||||
const pad = 3;
|
||||
const fh = h - 2*pad;
|
||||
@@ -95,4 +216,75 @@ export default class DrawHelper {
|
||||
return `<div style="position: absolute; left: ${x}px; top: ${y}px; ` +
|
||||
`width: ${w}px; height: ${h}px; box-sizing: border-box; border: 1px solid ${color}"></div>`;
|
||||
}
|
||||
|
||||
async doPageAnimationThaw(page1, page2, duration, isDown, animation1Finish) {
|
||||
page1.style.animation = `page1-animation-thaw ${duration}ms ease-in 1`;
|
||||
page2.style.animation = `page2-animation-thaw ${duration}ms ease-in 1`;
|
||||
await animation1Finish(duration);
|
||||
}
|
||||
|
||||
async doPageAnimationBlink(page1, page2, duration, isDown, animation1Finish, animation2Finish) {
|
||||
page1.style.opacity = '0';
|
||||
page2.style.opacity = '0';
|
||||
page2.style.animation = `page2-animation-thaw ${duration/2}ms ease-out 1`;
|
||||
await animation2Finish(duration/2);
|
||||
|
||||
page1.style.opacity = '1';
|
||||
page1.style.animation = `page1-animation-thaw ${duration/2}ms ease-in 1`;
|
||||
await animation1Finish(duration/2);
|
||||
|
||||
page2.style.opacity = '1';
|
||||
}
|
||||
|
||||
async doPageAnimationRightShift(page1, page2, duration, isDown, animation1Finish) {
|
||||
const s = this.w + this.fontSize;
|
||||
|
||||
if (isDown) {
|
||||
page1.style.transform = `translateX(${s}px)`;
|
||||
await sleep(30);
|
||||
|
||||
page1.style.transition = `${duration}ms ease-in-out`;
|
||||
page1.style.transform = `translateX(0px)`;
|
||||
|
||||
page2.style.transition = `${duration}ms ease-in-out`;
|
||||
page2.style.transform = `translateX(-${s}px)`;
|
||||
await animation1Finish(duration);
|
||||
} else {
|
||||
page1.style.transform = `translateX(-${s}px)`;
|
||||
await sleep(30);
|
||||
|
||||
page1.style.transition = `${duration}ms ease-in-out`;
|
||||
page1.style.transform = `translateX(0px)`;
|
||||
|
||||
page2.style.transition = `${duration}ms ease-in-out`;
|
||||
page2.style.transform = `translateX(${s}px)`;
|
||||
await animation1Finish(duration);
|
||||
}
|
||||
}
|
||||
|
||||
async doPageAnimationDownShift(page1, page2, duration, isDown, animation1Finish) {
|
||||
const s = this.h + this.fontSize/2;
|
||||
|
||||
if (isDown) {
|
||||
page1.style.transform = `translateY(${s}px)`;
|
||||
await sleep(30);
|
||||
|
||||
page1.style.transition = `${duration}ms ease-in-out`;
|
||||
page1.style.transform = `translateY(0px)`;
|
||||
|
||||
page2.style.transition = `${duration}ms ease-in-out`;
|
||||
page2.style.transform = `translateY(-${s}px)`;
|
||||
await animation1Finish(duration);
|
||||
} else {
|
||||
page1.style.transform = `translateY(-${s}px)`;
|
||||
await sleep(30);
|
||||
|
||||
page1.style.transition = `${duration}ms ease-in-out`;
|
||||
page1.style.transform = `translateY(0px)`;
|
||||
|
||||
page2.style.transition = `${duration}ms ease-in-out`;
|
||||
page2.style.transform = `translateY(${s}px)`;
|
||||
await animation1Finish(duration);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -4,18 +4,20 @@
|
||||
<div v-html="background"></div>
|
||||
<!-- img -->
|
||||
</div>
|
||||
<div ref="scrollBox1" class="layout" style="overflow: hidden">
|
||||
<div ref="scrollingPage" class="layout" @transitionend="onScrollingTransitionEnd">
|
||||
<div ref="scrollBox1" class="layout" style="overflow: hidden" @wheel.prevent.stop="onMouseWheel">
|
||||
<div ref="scrollingPage1" class="layout" @transitionend="onPage1TransitionEnd" @animationend="onPage1AnimationEnd">
|
||||
<div v-html="page1"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div ref="scrollBox2" class="layout" style="overflow: hidden">
|
||||
<div v-html="page2"></div>
|
||||
<div ref="scrollBox2" class="layout" style="overflow: hidden" @wheel.prevent.stop="onMouseWheel">
|
||||
<div ref="scrollingPage2" class="layout" @transitionend="onPage2TransitionEnd" @animationend="onPage2AnimationEnd">
|
||||
<div v-html="page2"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-show="showStatusBar" ref="statusBar" class="layout">
|
||||
<div v-html="statusBar"></div>
|
||||
</div>
|
||||
<div ref="layoutEvents" class="layout events" @mousedown.prevent.stop="onMouseDown" @mouseup.prevent.stop="onMouseUp"
|
||||
<div v-show="clickControl" ref="layoutEvents" class="layout events" @mousedown.prevent.stop="onMouseDown" @mouseup.prevent.stop="onMouseUp"
|
||||
@wheel.prevent.stop="onMouseWheel"
|
||||
@touchstart.stop="onTouchStart" @touchend.stop="onTouchEnd" @touchcancel.prevent.stop="onTouchCancel"
|
||||
oncontextmenu="return false;">
|
||||
@@ -23,6 +25,8 @@
|
||||
@click.prevent.stop="onStatusBarClick"></div>
|
||||
<div v-show="fontsLoading" ref="fontsLoading"></div>
|
||||
</div>
|
||||
<div v-show="!clickControl && showStatusBar" class="layout" v-html="statusBarClickable" @mousedown.prevent.stop @touchstart.stop
|
||||
@click.prevent.stop="onStatusBarClick"></div>
|
||||
<!-- невидимым делать нельзя, вовремя не подгружаютя шрифты -->
|
||||
<canvas ref="offscreenCanvas" class="layout" style="width: 0px; height: 0px"></canvas>
|
||||
</div>
|
||||
@@ -45,21 +49,29 @@ const minLayoutWidth = 100;
|
||||
|
||||
export default @Component({
|
||||
watch: {
|
||||
bookPos: function(newValue) {
|
||||
this.$emit('book-pos-changed', {bookPos: newValue, bookPosSeen: this.bookPosSeen});
|
||||
bookPos: function() {
|
||||
this.$emit('book-pos-changed', {bookPos: this.bookPos, bookPosSeen: this.bookPosSeen});
|
||||
this.draw();
|
||||
},
|
||||
bookPosSeen: function() {
|
||||
this.$emit('book-pos-changed', {bookPos: this.bookPos, bookPosSeen: this.bookPosSeen});
|
||||
},
|
||||
settings: function() {
|
||||
this.debouncedLoadSettings();
|
||||
},
|
||||
toggleLayout: function() {
|
||||
this.updateLayout();
|
||||
},
|
||||
inAnimation: function() {
|
||||
this.updateLayout();
|
||||
},
|
||||
},
|
||||
})
|
||||
class TextPage extends Vue {
|
||||
toggleLayout = false;
|
||||
showStatusBar = false;
|
||||
clickControl = true;
|
||||
|
||||
background = null;
|
||||
page1 = null;
|
||||
page2 = null;
|
||||
@@ -69,10 +81,14 @@ class TextPage extends Vue {
|
||||
|
||||
lastBook = null;
|
||||
bookPos = 0;
|
||||
bookPosSeen = null;
|
||||
|
||||
fontStyle = null;
|
||||
fontSize = null;
|
||||
fontName = null;
|
||||
fontWeight = null;
|
||||
|
||||
inAnimation = false;
|
||||
|
||||
meta = null;
|
||||
|
||||
@@ -100,15 +116,20 @@ class TextPage extends Vue {
|
||||
this.loadSettings();
|
||||
}, 50);
|
||||
|
||||
this.debouncedUpdatePage = _.debounce((lines) => {
|
||||
this.toggleLayout = !this.toggleLayout;
|
||||
this.debouncedUpdatePage = _.debounce(async(lines) => {
|
||||
if (!this.pageChangeAnimation)
|
||||
this.toggleLayout = !this.toggleLayout;
|
||||
else {
|
||||
this.page2 = this.page1;
|
||||
this.toggleLayout = true;
|
||||
}
|
||||
|
||||
if (this.toggleLayout)
|
||||
this.page1 = this.drawPage(lines);
|
||||
this.page1 = this.drawHelper.drawPage(lines);
|
||||
else
|
||||
this.page2 = this.drawPage(lines);
|
||||
this.page2 = this.drawHelper.drawPage(lines);
|
||||
|
||||
this.doPageTransition();
|
||||
await this.doPageAnimation();
|
||||
}, 10);
|
||||
|
||||
this.$root.$on('resize', () => {this.$nextTick(this.onResize)});
|
||||
@@ -140,16 +161,39 @@ class TextPage extends Vue {
|
||||
this.lineHeight = this.fontSize + this.lineInterval;
|
||||
this.pageLineCount = 1 + Math.floor((this.h - this.fontSize)/this.lineHeight);
|
||||
|
||||
if (this.parsed) {
|
||||
this.parsed.p = this.p;
|
||||
this.parsed.w = this.w;// px, ширина текста
|
||||
this.parsed.font = this.font;
|
||||
this.parsed.wordWrap = this.wordWrap;
|
||||
let t = '';
|
||||
while (this.measureText(t, {}) < this.w) t += 'Щ';
|
||||
this.parsed.maxWordLength = t.length - 1;
|
||||
this.parsed.measureText = this.measureText;
|
||||
}
|
||||
this.$refs.scrollingPage1.style.width = this.w + 'px';
|
||||
this.$refs.scrollingPage2.style.width = this.w + 'px';
|
||||
|
||||
//stuff
|
||||
this.currentAnimation = '';
|
||||
this.pageChangeDirectionDown = true;
|
||||
this.fontShift = this.fontVertShift/100;
|
||||
this.textShift = this.textVertShift/100 + this.fontShift;
|
||||
|
||||
//drawHelper
|
||||
this.drawHelper.realWidth = this.realWidth;
|
||||
this.drawHelper.realHeight = this.realHeight;
|
||||
this.drawHelper.lastBook = this.lastBook;
|
||||
this.drawHelper.book = this.book;
|
||||
this.drawHelper.parsed = this.parsed;
|
||||
this.drawHelper.pageLineCount = this.pageLineCount;
|
||||
|
||||
this.drawHelper.backgroundColor = this.backgroundColor;
|
||||
this.drawHelper.statusBarColor = this.statusBarColor;
|
||||
this.drawHelper.fontStyle = this.fontStyle;
|
||||
this.drawHelper.fontWeight = this.fontWeight;
|
||||
this.drawHelper.fontSize = this.fontSize;
|
||||
this.drawHelper.fontName = this.fontName;
|
||||
this.drawHelper.fontShift = this.fontShift;
|
||||
this.drawHelper.textColor = this.textColor;
|
||||
this.drawHelper.textShift = this.textShift;
|
||||
this.drawHelper.p = this.p;
|
||||
this.drawHelper.w = this.w;
|
||||
this.drawHelper.h = this.h;
|
||||
this.drawHelper.indentLR = this.indentLR;
|
||||
this.drawHelper.textAlignJustify = this.textAlignJustify;
|
||||
this.drawHelper.lineHeight = this.lineHeight;
|
||||
this.drawHelper.context = this.context;
|
||||
|
||||
//сообщение "Загрузка шрифтов..."
|
||||
const flText = 'Загрузка шрифта...';
|
||||
@@ -158,29 +202,25 @@ class TextPage extends Vue {
|
||||
fontsLoadingStyle.position = 'absolute';
|
||||
fontsLoadingStyle.fontSize = this.fontSize + 'px';
|
||||
fontsLoadingStyle.top = (this.realHeight/2 - 2*this.fontSize) + 'px';
|
||||
fontsLoadingStyle.left = (this.realWidth - this.measureText(flText, {}))/2 + 'px';
|
||||
fontsLoadingStyle.left = (this.realWidth - this.drawHelper.measureText(flText, {}))/2 + 'px';
|
||||
|
||||
//stuff
|
||||
this.statusBarColor = this.hex2rgba(this.textColor || '#000000', this.statusBarColorAlpha);
|
||||
this.currentTransition = '';
|
||||
this.pageChangeDirectionDown = true;
|
||||
this.fontShift = this.fontVertShift/100;
|
||||
this.textShift = this.textVertShift/100 + this.fontShift;
|
||||
|
||||
//drawHelper
|
||||
this.drawHelper.realWidth = this.realWidth;
|
||||
this.drawHelper.realHeight = this.realHeight;
|
||||
|
||||
this.drawHelper.backgroundColor = this.backgroundColor;
|
||||
this.drawHelper.statusBarColor = this.statusBarColor;
|
||||
this.drawHelper.fontName = this.fontName;
|
||||
this.drawHelper.fontShift = this.fontShift;
|
||||
this.drawHelper.measureText = this.measureText;
|
||||
this.drawHelper.measureTextFont = this.measureTextFont;
|
||||
//parsed
|
||||
if (this.parsed) {
|
||||
this.parsed.p = this.p;
|
||||
this.parsed.w = this.w;// px, ширина текста
|
||||
this.parsed.font = this.font;
|
||||
this.parsed.wordWrap = this.wordWrap;
|
||||
let t = '';
|
||||
while (this.drawHelper.measureText(t, {}) < this.w) t += 'Щ';
|
||||
this.parsed.maxWordLength = t.length - 1;
|
||||
this.parsed.measureText = this.drawHelper.measureText.bind(this.drawHelper);
|
||||
}
|
||||
|
||||
//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
|
||||
@@ -200,16 +240,6 @@ class TextPage extends Vue {
|
||||
page2.style.left = this.indentLR + 'px';
|
||||
}
|
||||
|
||||
measureText(text, style) {// eslint-disable-line no-unused-vars
|
||||
this.context.font = this.fontByStyle(style);
|
||||
return this.context.measureText(text).width;
|
||||
}
|
||||
|
||||
measureTextFont(text, font) {// eslint-disable-line no-unused-vars
|
||||
this.context.font = font;
|
||||
return this.context.measureText(text).width;
|
||||
}
|
||||
|
||||
async checkLoadedFonts() {
|
||||
let loaded = await Promise.all(this.fontList.map(font => document.fonts.check(font)));
|
||||
if (loaded.some(r => !r)) {
|
||||
@@ -279,18 +309,12 @@ class TextPage extends Vue {
|
||||
|
||||
this.draw();
|
||||
|
||||
// шрифты хрен знает когда подгружаются, поэтому
|
||||
// шрифты хрен знает когда подгружаются в div, поэтому
|
||||
const parsed = this.parsed;
|
||||
if (!parsed.force) {
|
||||
let i = 0;
|
||||
await sleep(5000);
|
||||
if (this.parsed === parsed) {
|
||||
parsed.force = true;
|
||||
while (i < 10) {
|
||||
await sleep(1000);
|
||||
if (this.parsed != parsed)
|
||||
break;
|
||||
this.draw();
|
||||
i++;
|
||||
}
|
||||
this.draw();
|
||||
parsed.force = false;
|
||||
}
|
||||
}
|
||||
@@ -315,7 +339,6 @@ class TextPage extends Vue {
|
||||
|
||||
this.linesUp = null;
|
||||
this.linesDown = null;
|
||||
this.searching = false;
|
||||
|
||||
this.statusBarMessage = '';
|
||||
|
||||
@@ -367,7 +390,10 @@ class TextPage extends Vue {
|
||||
}
|
||||
|
||||
updateLayout() {
|
||||
if (this.toggleLayout) {
|
||||
if (this.inAnimation) {
|
||||
this.$refs.scrollBox1.style.visibility = 'visible';
|
||||
this.$refs.scrollBox2.style.visibility = 'visible';
|
||||
} else if (this.toggleLayout) {
|
||||
this.$refs.scrollBox1.style.visibility = 'visible';
|
||||
this.$refs.scrollBox2.style.visibility = 'hidden';
|
||||
} else {
|
||||
@@ -399,34 +425,50 @@ class TextPage extends Vue {
|
||||
return `${this.fontStyle} ${this.fontWeight} ${this.fontSize}px ${this.fontName}`;
|
||||
}
|
||||
|
||||
fontByStyle(style) {
|
||||
return `${style.italic ? 'italic' : this.fontStyle} ${style.bold ? 'bold' : this.fontWeight} ${this.fontSize}px ${this.fontName}`;
|
||||
onPage1TransitionEnd() {
|
||||
if (this.resolveTransition1Finish)
|
||||
this.resolveTransition1Finish();
|
||||
}
|
||||
|
||||
onScrollingTransitionEnd() {
|
||||
if (this.resolveTransitionFinish)
|
||||
this.resolveTransitionFinish();
|
||||
onPage2TransitionEnd() {
|
||||
if (this.resolveTransition2Finish)
|
||||
this.resolveTransition2Finish();
|
||||
}
|
||||
|
||||
startSearch(needle) {
|
||||
this.needle = '';
|
||||
this.drawHelper.needle = '';
|
||||
const words = needle.split(' ');
|
||||
for (const word of words) {
|
||||
if (word != '') {
|
||||
this.needle = word;
|
||||
this.drawHelper.needle = word;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
this.searching = true;
|
||||
this.drawHelper.searching = true;
|
||||
this.draw();
|
||||
}
|
||||
|
||||
stopSearch() {
|
||||
this.searching = false;
|
||||
this.drawHelper.searching = false;
|
||||
this.draw();
|
||||
}
|
||||
|
||||
generateWaitingFunc(waitingHandlerName, stopPropertyName) {
|
||||
const func = (timeout) => {
|
||||
return new Promise(async(resolve) => {
|
||||
this[waitingHandlerName] = resolve;
|
||||
let wait = (timeout + 201)/100;
|
||||
while (wait > 0 && !this[stopPropertyName]) {
|
||||
wait--;
|
||||
await sleep(100);
|
||||
}
|
||||
resolve();
|
||||
});
|
||||
};
|
||||
return func;
|
||||
}
|
||||
|
||||
async startTextScrolling() {
|
||||
if (this.doingScrolling || !this.book || !this.parsed.textLength || !this.linesDown || this.pageLineCount < 1 ||
|
||||
this.linesDown.length <= this.pageLineCount) {
|
||||
@@ -434,20 +476,13 @@ class TextPage extends Vue {
|
||||
return;
|
||||
}
|
||||
|
||||
//ждем анимацию
|
||||
while (this.inAnimation) await sleep(10);
|
||||
|
||||
this.stopScrolling = false;
|
||||
this.doingScrolling = true;
|
||||
|
||||
const transitionFinish = (timeout) => {
|
||||
return new Promise(async(resolve) => {
|
||||
this.resolveTransitionFinish = resolve;
|
||||
let wait = timeout/100;
|
||||
while (wait > 0 && !this.stopScrolling) {
|
||||
wait--;
|
||||
await sleep(100);
|
||||
}
|
||||
resolve();
|
||||
});
|
||||
};
|
||||
const transitionFinish = this.generateWaitingFunc('resolveTransition1Finish', 'stopScrolling');
|
||||
|
||||
if (!this.toggleLayout)
|
||||
this.page1 = this.page2;
|
||||
@@ -456,7 +491,9 @@ class TextPage extends Vue {
|
||||
await sleep(50);
|
||||
|
||||
this.cachedPos = -1;
|
||||
const page = this.$refs.scrollingPage;
|
||||
this.draw();
|
||||
|
||||
const page = this.$refs.scrollingPage1;
|
||||
let i = 0;
|
||||
while (!this.stopScrolling) {
|
||||
page.style.transition = `${this.scrollingDelay}ms ${this.scrollingType}`;
|
||||
@@ -468,21 +505,22 @@ class TextPage extends Vue {
|
||||
this.stopScrolling = true;
|
||||
}
|
||||
}
|
||||
await transitionFinish(this.scrollingDelay + 201);
|
||||
await transitionFinish(this.scrollingDelay);
|
||||
page.style.transition = '';
|
||||
page.style.transform = 'none';
|
||||
page.offsetHeight;
|
||||
i++;
|
||||
}
|
||||
this.resolveTransitionFinish = null;
|
||||
this.resolveTransition1Finish = null;
|
||||
this.doingScrolling = false;
|
||||
this.$emit('stop-scrolling');
|
||||
this.draw();
|
||||
}
|
||||
|
||||
async stopTextScrolling() {
|
||||
this.stopScrolling = true;
|
||||
|
||||
const page = this.$refs.scrollingPage;
|
||||
const page = this.$refs.scrollingPage1;
|
||||
page.style.transition = '';
|
||||
page.style.transform = 'none';
|
||||
page.offsetHeight;
|
||||
@@ -491,7 +529,10 @@ class TextPage extends Vue {
|
||||
}
|
||||
|
||||
draw() {
|
||||
//scrolling
|
||||
if (this.doingScrolling) {
|
||||
this.currentAnimation = '';
|
||||
|
||||
if (this.cachedPos == this.bookPos) {
|
||||
this.linesDown = this.linesCached.linesDown;
|
||||
this.linesUp = this.linesCached.linesUp;
|
||||
@@ -500,7 +541,7 @@ class TextPage extends Vue {
|
||||
const lines = this.getLines(this.bookPos);
|
||||
this.linesDown = lines.linesDown;
|
||||
this.linesUp = lines.linesUp;
|
||||
this.page1 = this.drawPage(lines.linesDown);
|
||||
this.page1 = this.drawHelper.drawPage(lines.linesDown, true);
|
||||
}
|
||||
|
||||
//caching next
|
||||
@@ -510,7 +551,7 @@ class TextPage extends Vue {
|
||||
if (this.linesDown && this.linesDown.length > this.pageLineCount && this.pageLineCount > 0) {
|
||||
this.cachedPos = this.linesDown[1].begin;
|
||||
this.linesCached = this.getLines(this.cachedPos);
|
||||
this.pageCached = this.drawPage(this.linesCached.linesDown);
|
||||
this.pageCached = this.drawHelper.drawPage(this.linesCached.linesDown, true);
|
||||
}
|
||||
this.cachedPageTimer = null;
|
||||
}, 20);
|
||||
@@ -519,6 +560,7 @@ class TextPage extends Vue {
|
||||
return;
|
||||
}
|
||||
|
||||
//check
|
||||
if (this.w < minLayoutWidth) {
|
||||
this.page1 = null;
|
||||
this.page2 = null;
|
||||
@@ -531,45 +573,93 @@ class TextPage extends Vue {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
if (this.pageChangeDirectionDown && this.pagePrepared && this.bookPos == this.bookPosPrepared) {
|
||||
//fast draw prepared
|
||||
if (!this.pageChangeAnimation && this.pageChangeDirectionDown && this.pagePrepared && this.bookPos == this.bookPosPrepared) {
|
||||
this.toggleLayout = !this.toggleLayout;
|
||||
this.linesDown = this.linesDownNext;
|
||||
this.linesUp = this.linesUpNext;
|
||||
this.doPageTransition();
|
||||
} else {
|
||||
} else {//normal debounced draw
|
||||
const lines = this.getLines(this.bookPos);
|
||||
this.linesDown = lines.linesDown;
|
||||
this.linesUp = lines.linesUp;
|
||||
|
||||
/*if (this.toggleLayout)
|
||||
this.page1 = this.drawPage(lines.linesDown);
|
||||
else
|
||||
this.page2 = this.drawPage(lines.linesDown);*/
|
||||
|
||||
this.debouncedUpdatePage(lines.linesDown);
|
||||
}
|
||||
|
||||
this.pagePrepared = false;
|
||||
this.debouncedPrepareNextPage();
|
||||
if (!this.pageChangeAnimation)
|
||||
this.debouncedPrepareNextPage();
|
||||
this.debouncedDrawStatusBar();
|
||||
|
||||
if (this.book && this.linesDown && this.linesDown.length < this.pageLineCount)
|
||||
if (this.book && this.linesDown && this.linesDown.length < this.pageLineCount) {
|
||||
this.doEnd();
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
doPageTransition() {
|
||||
if (this.currentTransition) {
|
||||
//this.currentTransition
|
||||
//this.pageChangeTransitionSpeed
|
||||
//this.pageChangeDirectionDown
|
||||
|
||||
//curr to next transition
|
||||
//пока заглушка
|
||||
}
|
||||
onPage1AnimationEnd() {
|
||||
if (this.resolveAnimation1Finish)
|
||||
this.resolveAnimation1Finish();
|
||||
}
|
||||
|
||||
this.currentTransition = '';
|
||||
this.pageChangeDirectionDown = false;//true только если PgDown
|
||||
onPage2AnimationEnd() {
|
||||
if (this.resolveAnimation2Finish)
|
||||
this.resolveAnimation2Finish();
|
||||
}
|
||||
|
||||
async doPageAnimation() {
|
||||
if (this.currentAnimation && !this.inAnimation) {
|
||||
this.inAnimation = true;
|
||||
|
||||
const animation1Finish = this.generateWaitingFunc('resolveAnimation1Finish', 'stopAnimation');
|
||||
const animation2Finish = this.generateWaitingFunc('resolveAnimation2Finish', 'stopAnimation');
|
||||
const transition1Finish = this.generateWaitingFunc('resolveTransition1Finish', 'stopAnimation');
|
||||
//const transition2Finish = this.generateWaitingFunc('resolveTransition2Finish', 'stopAnimation');
|
||||
|
||||
const duration = Math.round(3000*(1 - this.pageChangeAnimationSpeed/100));
|
||||
let page1 = this.$refs.scrollingPage1;
|
||||
let page2 = this.$refs.scrollingPage2;
|
||||
|
||||
switch (this.currentAnimation) {
|
||||
case 'thaw':
|
||||
await this.drawHelper.doPageAnimationThaw(page1, page2,
|
||||
duration, this.pageChangeDirectionDown, animation1Finish);
|
||||
break;
|
||||
case 'blink':
|
||||
await this.drawHelper.doPageAnimationBlink(page1, page2,
|
||||
duration, this.pageChangeDirectionDown, animation1Finish, animation2Finish);
|
||||
break;
|
||||
case 'rightShift':
|
||||
await this.drawHelper.doPageAnimationRightShift(page1, page2,
|
||||
duration, this.pageChangeDirectionDown, transition1Finish);
|
||||
break;
|
||||
case 'downShift':
|
||||
await this.drawHelper.doPageAnimationDownShift(page1, page2,
|
||||
duration, this.pageChangeDirectionDown, transition1Finish);
|
||||
break;
|
||||
}
|
||||
|
||||
this.resolveAnimation1Finish = null;
|
||||
this.resolveAnimation2Finish = null;
|
||||
this.resolveTransition1Finish = null;
|
||||
this.resolveTransition2Finish = null;
|
||||
|
||||
page1.style.animation = '';
|
||||
page2.style.animation = '';
|
||||
|
||||
page1.style.transition = '';
|
||||
page1.style.transform = 'none';
|
||||
page1.offsetHeight;
|
||||
|
||||
page2.style.transition = '';
|
||||
page2.style.transform = 'none';
|
||||
page2.offsetHeight;
|
||||
|
||||
this.currentAnimation = '';
|
||||
this.pageChangeDirectionDown = false;//true только если PgDown
|
||||
|
||||
this.inAnimation = false;
|
||||
this.stopAnimation = false;
|
||||
}
|
||||
}
|
||||
|
||||
getLines(bookPos) {
|
||||
@@ -582,110 +672,6 @@ class TextPage extends Vue {
|
||||
};
|
||||
}
|
||||
|
||||
drawPage(lines) {
|
||||
if (!this.lastBook || this.pageLineCount < 1 || !this.book || !lines || !this.parsed.textLength)
|
||||
return '';
|
||||
|
||||
const spaceWidth = this.measureText(' ', {});
|
||||
|
||||
let out = `<div class="layout" style="width: ${this.realWidth}px; height: ${this.realHeight}px;` +
|
||||
` color: ${this.textColor}">`;
|
||||
|
||||
let len = lines.length;
|
||||
len = (len > this.pageLineCount + 1 ? this.pageLineCount + 1 : len);
|
||||
|
||||
let y = this.fontSize*this.textShift;
|
||||
|
||||
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}
|
||||
text: String,
|
||||
}
|
||||
}*/
|
||||
|
||||
let indent = line.first ? this.p : 0;
|
||||
|
||||
let lineText = '';
|
||||
let center = false;
|
||||
let centerStyle = {};
|
||||
for (const part of line.parts) {
|
||||
lineText += part.text;
|
||||
center = center || part.style.center;
|
||||
if (part.style.center)
|
||||
centerStyle = part.style;
|
||||
}
|
||||
|
||||
let filled = false;
|
||||
// если выравнивание по ширине включено
|
||||
if (this.textAlignJustify && !line.last && !center) {
|
||||
const words = lineText.split(' ');
|
||||
|
||||
if (words.length > 1) {
|
||||
const spaceCount = words.length - 1;
|
||||
|
||||
const space = (this.w - line.width + spaceWidth*spaceCount)/spaceCount;
|
||||
|
||||
let x = indent;
|
||||
for (const part of line.parts) {
|
||||
const font = this.fontByStyle(part.style);
|
||||
let partWords = part.text.split(' ');
|
||||
|
||||
for (let j = 0; j < partWords.length; j++) {
|
||||
let f = font;
|
||||
let style = part.style;
|
||||
let word = partWords[j];
|
||||
if (i == 0 && this.searching && word.toLowerCase().indexOf(this.needle) >= 0) {
|
||||
style = Object.assign({}, part.style, {bold: true});
|
||||
f = this.fontByStyle(style);
|
||||
}
|
||||
out += this.drawHelper.fillText(word, x, y, f);
|
||||
x += this.measureText(word, style) + (j < partWords.length - 1 ? space : 0);
|
||||
}
|
||||
}
|
||||
filled = true;
|
||||
}
|
||||
}
|
||||
|
||||
// просто выводим текст
|
||||
if (!filled) {
|
||||
let x = indent;
|
||||
x = (center ? (this.w - this.measureText(lineText, centerStyle))/2 : x);
|
||||
for (const part of line.parts) {
|
||||
let font = this.fontByStyle(part.style);
|
||||
|
||||
if (i == 0 && this.searching) {//для поиска, разбивка по словам
|
||||
let partWords = part.text.split(' ');
|
||||
for (let j = 0; j < partWords.length; j++) {
|
||||
let f = font;
|
||||
let style = part.style;
|
||||
let word = partWords[j];
|
||||
if (word.toLowerCase().indexOf(this.needle) >= 0) {
|
||||
style = Object.assign({}, part.style, {bold: true});
|
||||
f = this.fontByStyle(style);
|
||||
}
|
||||
out += this.drawHelper.fillText(word, x, y, f);
|
||||
x += this.measureText(word, style) + (j < partWords.length - 1 ? spaceWidth : 0);
|
||||
}
|
||||
} else {
|
||||
out += this.drawHelper.fillText(part.text, x, y, font);
|
||||
x += this.measureText(part.text, part.style);
|
||||
}
|
||||
}
|
||||
}
|
||||
y += this.lineHeight;
|
||||
}
|
||||
|
||||
out += '</div>';
|
||||
return out;
|
||||
}
|
||||
|
||||
drawStatusBar(message) {
|
||||
if (this.w < minLayoutWidth) {
|
||||
this.statusBar = null;
|
||||
@@ -782,9 +768,9 @@ class TextPage extends Vue {
|
||||
this.linesUpNext = lines.linesUp;
|
||||
|
||||
if (this.toggleLayout)
|
||||
this.page2 = this.drawPage(lines.linesDown);//наоборот
|
||||
this.page2 = this.drawHelper.drawPage(lines.linesDown);//наоборот
|
||||
else
|
||||
this.page1 = this.drawPage(lines.linesDown);
|
||||
this.page1 = this.drawHelper.drawPage(lines.linesDown);
|
||||
|
||||
this.pagePrepared = true;
|
||||
}
|
||||
@@ -808,7 +794,7 @@ class TextPage extends Vue {
|
||||
if (this.keepLastToFirst)
|
||||
i--;
|
||||
if (i >= 0 && this.linesDown.length >= 2*i) {
|
||||
this.currentTransition = this.pageChangeTransition;
|
||||
this.currentAnimation = this.pageChangeAnimation;
|
||||
this.pageChangeDirectionDown = true;
|
||||
this.bookPos = this.linesDown[i].begin;
|
||||
} else
|
||||
@@ -823,7 +809,7 @@ class TextPage extends Vue {
|
||||
i--;
|
||||
i = (i > this.linesUp.length - 1 ? this.linesUp.length - 1 : i);
|
||||
if (i >= 0 && this.linesUp.length > i) {
|
||||
this.currentTransition = this.pageChangeTransition;
|
||||
this.currentAnimation = this.pageChangeAnimation;
|
||||
this.pageChangeDirectionDown = false;
|
||||
this.bookPos = this.linesUp[i].begin;
|
||||
}
|
||||
@@ -831,6 +817,8 @@ class TextPage extends Vue {
|
||||
}
|
||||
|
||||
doHome() {
|
||||
this.currentAnimation = this.pageChangeAnimation;
|
||||
this.pageChangeDirectionDown = false;
|
||||
this.bookPos = 0;
|
||||
}
|
||||
|
||||
@@ -842,6 +830,8 @@ class TextPage extends Vue {
|
||||
if (lines) {
|
||||
i = this.pageLineCount - 1;
|
||||
i = (i > lines.length - 1 ? lines.length - 1 : i);
|
||||
this.currentAnimation = this.pageChangeAnimation;
|
||||
this.pageChangeDirectionDown = true;
|
||||
this.bookPos = lines[i].begin;
|
||||
}
|
||||
}
|
||||
@@ -1162,4 +1152,13 @@ class TextPage extends Vue {
|
||||
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>
|
||||
|
||||
@@ -3,7 +3,7 @@ import sax from '../../../../server/core/BookConverter/sax';
|
||||
import {sleep} from '../../../share/utils';
|
||||
|
||||
export default class BookParser {
|
||||
constructor() {
|
||||
constructor(settings) {
|
||||
// defaults
|
||||
this.p = 30;// px, отступ параграфа
|
||||
this.w = 300;// px, ширина страницы
|
||||
@@ -13,6 +13,12 @@ export default class BookParser {
|
||||
this.measureText = (text, style) => {// eslint-disable-line no-unused-vars
|
||||
return text.length*20;
|
||||
};
|
||||
|
||||
//настройки
|
||||
if (settings) {
|
||||
this.cutEmptyParagraphs = settings.cutEmptyParagraphs;
|
||||
this.addEmptyParagraphs = settings.addEmptyParagraphs;
|
||||
}
|
||||
}
|
||||
|
||||
async parse(data, callback) {
|
||||
@@ -48,7 +54,14 @@ export default class BookParser {
|
||||
text: String //текст параграфа (или title или epigraph и т.д) с вложенными тегами
|
||||
}
|
||||
*/
|
||||
const newParagraph = (text, len) => {
|
||||
const newParagraph = (text, len, noCut) => {
|
||||
//схлопывание пустых параграфов
|
||||
if (!noCut && this.cutEmptyParagraphs && paraIndex >= 0 && len == 1 && text[0] == ' ') {
|
||||
let p = para[paraIndex];
|
||||
if (p.length == 1 && p.text[0] == ' ')
|
||||
return;
|
||||
}
|
||||
|
||||
paraIndex++;
|
||||
let p = {
|
||||
index: paraIndex,
|
||||
@@ -63,12 +76,23 @@ export default class BookParser {
|
||||
|
||||
const growParagraph = (text, len) => {
|
||||
if (paraIndex < 0) {
|
||||
newParagraph(text, len);
|
||||
newParagraph(' ', 1);
|
||||
growParagraph(text, len);
|
||||
return;
|
||||
}
|
||||
|
||||
let p = para[paraIndex];
|
||||
if (p) {
|
||||
//добавление пустых параграфов
|
||||
if (this.addEmptyParagraphs && p.length == 1 && p.text[0] == ' ' && len > 0) {
|
||||
let i = this.addEmptyParagraphs;
|
||||
while (i > 0) {
|
||||
newParagraph(' ', 1, true);
|
||||
i--;
|
||||
}
|
||||
p = para[paraIndex];
|
||||
}
|
||||
|
||||
paraOffset -= p.length;
|
||||
if (p.length == 1 && p.text[0] == ' ' && len > 0) {
|
||||
p.length = 0;
|
||||
@@ -96,55 +120,63 @@ export default class BookParser {
|
||||
tag = elemName;
|
||||
path += '/' + elemName;
|
||||
|
||||
if ((tag == 'p' || tag == 'empty-line' || tag == 'v') && path.indexOf('/fictionbook/body/section') == 0) {
|
||||
newParagraph(' ', 1);
|
||||
}
|
||||
if (path.indexOf('/fictionbook/body') == 0) {
|
||||
if (tag == 'title') {
|
||||
newParagraph(' ', 1);
|
||||
bold = true;
|
||||
center = true;
|
||||
}
|
||||
|
||||
if (tag == 'emphasis' || tag == 'strong') {
|
||||
growParagraph(`<${tag}>`, 0);
|
||||
}
|
||||
if (tag == 'emphasis' || tag == 'strong') {
|
||||
growParagraph(`<${tag}>`, 0);
|
||||
}
|
||||
|
||||
if (tag == 'title') {
|
||||
newParagraph(' ', 1);
|
||||
bold = true;
|
||||
center = true;
|
||||
}
|
||||
if ((tag == 'p' || tag == 'empty-line' || tag == 'v')) {
|
||||
newParagraph(' ', 1);
|
||||
}
|
||||
|
||||
if (tag == 'subtitle') {
|
||||
newParagraph(' ', 1);
|
||||
bold = true;
|
||||
}
|
||||
if (tag == 'subtitle') {
|
||||
newParagraph(' ', 1);
|
||||
bold = true;
|
||||
}
|
||||
|
||||
if (tag == 'epigraph') {
|
||||
italic = true;
|
||||
}
|
||||
if (tag == 'epigraph') {
|
||||
italic = true;
|
||||
}
|
||||
|
||||
if (tag == 'stanza') {
|
||||
newParagraph(' ', 1);
|
||||
if (tag == 'poem') {
|
||||
newParagraph(' ', 1);
|
||||
}
|
||||
|
||||
if (tag == 'text-author') {
|
||||
newParagraph(' <s> <s> <s> ', 4);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const onEndNode = (elemName) => {// eslint-disable-line no-unused-vars
|
||||
if (tag == elemName) {
|
||||
if (tag == 'emphasis' || tag == 'strong') {
|
||||
growParagraph(`</${tag}>`, 0);
|
||||
}
|
||||
if (path.indexOf('/fictionbook/body') == 0) {
|
||||
if (tag == 'title') {
|
||||
bold = false;
|
||||
center = false;
|
||||
}
|
||||
|
||||
if (tag == 'title') {
|
||||
bold = false;
|
||||
center = false;
|
||||
}
|
||||
if (tag == 'emphasis' || tag == 'strong') {
|
||||
growParagraph(`</${tag}>`, 0);
|
||||
}
|
||||
|
||||
if (tag == 'subtitle') {
|
||||
bold = false;
|
||||
}
|
||||
if (tag == 'subtitle') {
|
||||
bold = false;
|
||||
}
|
||||
|
||||
if (tag == 'epigraph') {
|
||||
italic = false;
|
||||
}
|
||||
if (tag == 'epigraph') {
|
||||
italic = false;
|
||||
}
|
||||
|
||||
if (tag == 'stanza') {
|
||||
newParagraph(' ', 1);
|
||||
if (tag == 'stanza') {
|
||||
newParagraph(' ', 1);
|
||||
}
|
||||
}
|
||||
|
||||
path = path.substr(0, path.length - tag.length - 1);
|
||||
@@ -206,12 +238,12 @@ export default class BookParser {
|
||||
let tOpen = (center ? '<center>' : '');
|
||||
tOpen += (bold ? '<strong>' : '');
|
||||
tOpen += (italic ? '<emphasis>' : '');
|
||||
let tClose = (center ? '</center>' : '');
|
||||
let tClose = (italic ? '</emphasis>' : '');
|
||||
tClose += (bold ? '</strong>' : '');
|
||||
tClose += (italic ? '</emphasis>' : '');
|
||||
tClose += (center ? '</center>' : '');
|
||||
|
||||
if (path.indexOf('/fictionbook/body/title') == 0) {
|
||||
newParagraph(`${tOpen}${text}${tClose}`, text.length, true);
|
||||
growParagraph(`${tOpen}${text}${tClose}`, text.length);
|
||||
}
|
||||
|
||||
if (path.indexOf('/fictionbook/body/section') == 0) {
|
||||
|
||||
@@ -18,7 +18,8 @@ const bmRecentStore = localForage.createInstance({
|
||||
});
|
||||
|
||||
class BookManager {
|
||||
async init() {
|
||||
async init(settings) {
|
||||
this.settings = settings;
|
||||
this.books = {};
|
||||
this.recent = {};
|
||||
this.recentChanged = true;
|
||||
@@ -130,7 +131,7 @@ class BookManager {
|
||||
async parseBook(meta, data, callback) {
|
||||
if (!this.books)
|
||||
await this.init();
|
||||
const parsed = new BookParser();
|
||||
const parsed = new BookParser(this.settings);
|
||||
|
||||
const parsedMeta = await parsed.parse(data, callback);
|
||||
const result = Object.assign({}, meta, parsedMeta, {
|
||||
|
||||
@@ -3,6 +3,8 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<meta name="description" content="браузерная онлайн-читалка книг из интернета и библиотека">
|
||||
<meta name="keywords" content="библиотека,онлайн,читалка,книги,читать,браузер,интернет">
|
||||
<title></title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@@ -152,13 +152,18 @@ const settingDefaults = {
|
||||
scrollingDelay: 3000,// замедление, ms
|
||||
scrollingType: 'ease-in-out', //linear, ease, ease-in, ease-out, ease-in-out
|
||||
|
||||
pageChangeTransition: '',// '' - нет, downShift, rightShift, thaw - протаивание, blink - мерцание
|
||||
pageChangeTransitionSpeed: 50, //0-100%
|
||||
pageChangeAnimation: 'blink',// '' - нет, downShift, rightShift, thaw - протаивание, blink - мерцание
|
||||
pageChangeAnimationSpeed: 80, //0-100%
|
||||
|
||||
allowUrlParamBookPos: false,
|
||||
lazyParseEnabled: false,
|
||||
copyFullText: false,
|
||||
showClickMapPage: true,
|
||||
clickControl: true,
|
||||
cutEmptyParagraphs: false,
|
||||
addEmptyParagraphs: 0,
|
||||
blinkCachedLoad: true,
|
||||
|
||||
fontShifts: {},
|
||||
};
|
||||
|
||||
|
||||
56
package-lock.json
generated
56
package-lock.json
generated
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "Liberama",
|
||||
"version": "0.1.0",
|
||||
"version": "0.2.0",
|
||||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
@@ -4477,7 +4477,8 @@
|
||||
"ansi-regex": {
|
||||
"version": "2.1.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"aproba": {
|
||||
"version": "1.2.0",
|
||||
@@ -4498,12 +4499,14 @@
|
||||
"balanced-match": {
|
||||
"version": "1.0.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"balanced-match": "^1.0.0",
|
||||
"concat-map": "0.0.1"
|
||||
@@ -4518,17 +4521,20 @@
|
||||
"code-point-at": {
|
||||
"version": "1.1.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"concat-map": {
|
||||
"version": "0.0.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"console-control-strings": {
|
||||
"version": "1.1.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"core-util-is": {
|
||||
"version": "1.0.2",
|
||||
@@ -4645,7 +4651,8 @@
|
||||
"inherits": {
|
||||
"version": "2.0.3",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"ini": {
|
||||
"version": "1.3.5",
|
||||
@@ -4657,6 +4664,7 @@
|
||||
"version": "1.0.0",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"number-is-nan": "^1.0.0"
|
||||
}
|
||||
@@ -4671,6 +4679,7 @@
|
||||
"version": "3.0.4",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"brace-expansion": "^1.1.7"
|
||||
}
|
||||
@@ -4678,12 +4687,14 @@
|
||||
"minimist": {
|
||||
"version": "0.0.8",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"minipass": {
|
||||
"version": "2.2.4",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"safe-buffer": "^5.1.1",
|
||||
"yallist": "^3.0.0"
|
||||
@@ -4702,6 +4713,7 @@
|
||||
"version": "0.5.1",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"minimist": "0.0.8"
|
||||
}
|
||||
@@ -4782,7 +4794,8 @@
|
||||
"number-is-nan": {
|
||||
"version": "1.0.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"object-assign": {
|
||||
"version": "4.1.1",
|
||||
@@ -4794,6 +4807,7 @@
|
||||
"version": "1.4.0",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"wrappy": "1"
|
||||
}
|
||||
@@ -4879,7 +4893,8 @@
|
||||
"safe-buffer": {
|
||||
"version": "5.1.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"safer-buffer": {
|
||||
"version": "2.1.2",
|
||||
@@ -4915,6 +4930,7 @@
|
||||
"version": "1.0.2",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"code-point-at": "^1.0.0",
|
||||
"is-fullwidth-code-point": "^1.0.0",
|
||||
@@ -4934,6 +4950,7 @@
|
||||
"version": "3.0.1",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"ansi-regex": "^2.0.0"
|
||||
}
|
||||
@@ -4977,12 +4994,14 @@
|
||||
"wrappy": {
|
||||
"version": "1.0.2",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"yallist": {
|
||||
"version": "3.0.2",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -6501,9 +6520,9 @@
|
||||
}
|
||||
},
|
||||
"minimist": {
|
||||
"version": "0.0.8",
|
||||
"resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
|
||||
"integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
|
||||
"integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
|
||||
},
|
||||
"minipass": {
|
||||
"version": "2.3.5",
|
||||
@@ -6567,6 +6586,13 @@
|
||||
"integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
|
||||
"requires": {
|
||||
"minimist": "0.0.8"
|
||||
},
|
||||
"dependencies": {
|
||||
"minimist": {
|
||||
"version": "0.0.8",
|
||||
"resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
|
||||
"integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
|
||||
}
|
||||
}
|
||||
},
|
||||
"move-concurrently": {
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "Liberama",
|
||||
"version": "0.1.2",
|
||||
"version": "0.2.1",
|
||||
"engines": {
|
||||
"node": ">=10.0.0"
|
||||
},
|
||||
@@ -70,6 +70,7 @@
|
||||
"iconv-lite": "^0.4.24",
|
||||
"localforage": "^1.7.3",
|
||||
"lodash": "^4.17.11",
|
||||
"minimist": "^1.2.0",
|
||||
"multer": "^1.4.1",
|
||||
"path-browserify": "^1.0.0",
|
||||
"sql-template-strings": "^2.2.2",
|
||||
|
||||
@@ -17,6 +17,10 @@ module.exports = {
|
||||
dbFileName: 'db.sqlite',
|
||||
loggingEnabled: true,
|
||||
|
||||
maxUploadFileSize: 50*1024*1024,//50Мб
|
||||
maxTempPublicDirSize: 512*1024*1024,//512Мб
|
||||
maxUploadPublicDirSize: 200*1024*1024,//100Мб
|
||||
|
||||
servers: [
|
||||
{
|
||||
serverName: '1',
|
||||
@@ -24,12 +28,6 @@ module.exports = {
|
||||
ip: '0.0.0.0',
|
||||
port: '33080',
|
||||
},
|
||||
{
|
||||
serverName: '2',
|
||||
mode: 'omnireader',
|
||||
ip: '0.0.0.0',
|
||||
port: '33081',
|
||||
},
|
||||
],
|
||||
|
||||
};
|
||||
|
||||
36
server/config/configSaver.js
Normal file
36
server/config/configSaver.js
Normal file
@@ -0,0 +1,36 @@
|
||||
const fs = require('fs-extra');
|
||||
const _ = require('lodash');
|
||||
|
||||
const propsToSave = [
|
||||
'maxUploadFileSize',
|
||||
'maxTempPublicDirSize',
|
||||
'maxUploadPublicDirSize',
|
||||
|
||||
'servers',
|
||||
];
|
||||
|
||||
async function load(config, configFilename) {
|
||||
if (!configFilename) {
|
||||
configFilename = `${config.dataDir}/config.json`;
|
||||
|
||||
if (!await fs.pathExists(configFilename)) {
|
||||
save(config);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
const data = await fs.readFile(configFilename, 'utf8');
|
||||
Object.assign(config, JSON.parse(data));
|
||||
}
|
||||
|
||||
async function save(config) {
|
||||
const configFilename = `${config.dataDir}/config.json`;
|
||||
const dataToSave = _.pick(config, propsToSave);
|
||||
|
||||
await fs.writeFile(configFilename, JSON.stringify(dataToSave, null, 4));
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
load,
|
||||
save
|
||||
};
|
||||
@@ -19,12 +19,6 @@ module.exports = Object.assign({}, base, {
|
||||
ip: '0.0.0.0',
|
||||
port: '44080',
|
||||
},
|
||||
{
|
||||
serverName: '2',
|
||||
mode: 'omnireader',
|
||||
ip: '0.0.0.0',
|
||||
port: '44081',
|
||||
},
|
||||
],
|
||||
|
||||
}
|
||||
|
||||
@@ -22,14 +22,15 @@ class BookConverter {
|
||||
callback(100);
|
||||
|
||||
if (fileType && (fileType.ext == 'html' || fileType.ext == 'xml')) {
|
||||
if (data.toString().indexOf('<FictionBook') >= 0) {
|
||||
await fs.writeFile(outputFile, data);
|
||||
if (data.toString().indexOf('<FictionBook') >= 0) {
|
||||
await fs.writeFile(outputFile, this.checkEncoding(data));
|
||||
return;
|
||||
}
|
||||
|
||||
const parsedUrl = new URL(url);
|
||||
if (parsedUrl.hostname == 'samlib.ru' ||
|
||||
parsedUrl.hostname == 'budclub.ru') {
|
||||
parsedUrl.hostname == 'budclub.ru' ||
|
||||
parsedUrl.hostname == 'zhurnal.lib.ru') {
|
||||
await fs.writeFile(outputFile, this.convertSamlib(data));
|
||||
return;
|
||||
}
|
||||
@@ -69,6 +70,28 @@ class BookConverter {
|
||||
return iconv.decode(data, selected);
|
||||
}
|
||||
|
||||
checkEncoding(data) {
|
||||
let result = data;
|
||||
|
||||
const left = data.indexOf('<?xml version="1.0"');
|
||||
if (left >= 0) {
|
||||
const right = data.indexOf('?>', left);
|
||||
if (right >= 0) {
|
||||
const head = data.slice(left, right + 2).toString();
|
||||
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"'));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
convertHtml(data, isText) {
|
||||
let titleInfo = {};
|
||||
let desc = {_n: 'description', 'title-info': titleInfo};
|
||||
@@ -215,6 +238,8 @@ class BookConverter {
|
||||
let node = {_a: pars};
|
||||
|
||||
let inPara = false;
|
||||
let italic = false;
|
||||
let bold = false;
|
||||
|
||||
const openTag = (name) => {
|
||||
if (name == 'p')
|
||||
@@ -227,8 +252,11 @@ class BookConverter {
|
||||
const closeTag = (name) => {
|
||||
if (name == 'p')
|
||||
inPara = false;
|
||||
if (node._n == name && node._p) {
|
||||
if (node._p) {
|
||||
const exact = (node._n == name);
|
||||
node = node._p;
|
||||
if (!exact)
|
||||
closeTag(name);
|
||||
}
|
||||
};
|
||||
|
||||
@@ -261,9 +289,11 @@ class BookConverter {
|
||||
break;
|
||||
case 'i':
|
||||
openTag('emphasis');
|
||||
italic = true;
|
||||
break;
|
||||
case 'b':
|
||||
openTag('strong');
|
||||
bold = true;
|
||||
break;
|
||||
case 'div':
|
||||
if (tail.indexOf('align="center"') >= 0) {
|
||||
@@ -309,9 +339,11 @@ class BookConverter {
|
||||
break;
|
||||
case 'i':
|
||||
closeTag('emphasis');
|
||||
italic = false;
|
||||
break;
|
||||
case 'b':
|
||||
closeTag('strong');
|
||||
bold = false;
|
||||
break;
|
||||
case 'div':
|
||||
if (inSubtitle) {
|
||||
@@ -359,8 +391,13 @@ class BookConverter {
|
||||
return;
|
||||
}
|
||||
|
||||
let tOpen = (bold ? '<strong>' : '');
|
||||
tOpen += (italic ? '<emphasis>' : '');
|
||||
let tClose = (italic ? '</emphasis>' : '');
|
||||
tClose += (bold ? '</strong>' : '');
|
||||
|
||||
if (inText)
|
||||
growParagraph(text);
|
||||
growParagraph(`${tOpen}${text}${tClose}`);
|
||||
};
|
||||
|
||||
sax.parseSync(repSpaces(this.decode(data).toString()), {
|
||||
|
||||
@@ -62,7 +62,10 @@ function getEncoding(buf) {
|
||||
|
||||
sorted.sort((a, b) => b.c - a.c);
|
||||
|
||||
return sorted[0].codePage;
|
||||
if (sorted[0].c > 0)
|
||||
return sorted[0].codePage;
|
||||
else
|
||||
return 'ISO-8859-5';
|
||||
}
|
||||
|
||||
function checkIfText(buf) {
|
||||
|
||||
@@ -8,8 +8,6 @@ const FileDecompressor = require('./FileDecompressor');
|
||||
const BookConverter = require('./BookConverter');
|
||||
const utils = require('./utils');
|
||||
|
||||
const maxTempPublicDirSize = 512*1024*1024;//512Мб
|
||||
const maxUploadDirSize = 200*1024*1024;//100Мб
|
||||
let singleCleanExecute = false;
|
||||
|
||||
class ReaderWorker {
|
||||
@@ -27,8 +25,8 @@ class ReaderWorker {
|
||||
this.bookConverter = new BookConverter();
|
||||
|
||||
if (!singleCleanExecute) {
|
||||
this.periodicCleanDir(this.config.tempPublicDir, maxTempPublicDirSize, 60*60*1000);//1 раз в час
|
||||
this.periodicCleanDir(this.config.uploadDir, maxUploadDirSize, 60*60*1000);//1 раз в час
|
||||
this.periodicCleanDir(this.config.tempPublicDir, this.config.maxTempPublicDirSize, 60*60*1000);//1 раз в час
|
||||
this.periodicCleanDir(this.config.uploadDir, this.config.maxUploadPublicDirSize, 60*60*1000);//1 раз в час
|
||||
singleCleanExecute = true;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,9 +1,11 @@
|
||||
const config = require('./config');
|
||||
|
||||
const {initLogger, getLog} = require('./core/getLogger');
|
||||
initLogger(config);
|
||||
const log = getLog();
|
||||
|
||||
const configSaver = require('./config/configSaver');
|
||||
const argv = require('minimist')(process.argv.slice(2));
|
||||
|
||||
const fs = require('fs-extra');
|
||||
const path = require('path');
|
||||
const express = require('express');
|
||||
@@ -23,15 +25,17 @@ async function init() {
|
||||
await fs.remove(appDir);
|
||||
await fs.move(appNewDir, appDir);
|
||||
}
|
||||
|
||||
//загружаем конфиг из файла
|
||||
await configSaver.load(config, argv.config);
|
||||
}
|
||||
|
||||
async function main() {
|
||||
const connPool = new SqliteConnectionPool(20, config);
|
||||
|
||||
log('Initializing');
|
||||
await init();
|
||||
|
||||
log('Opening database');
|
||||
const connPool = new SqliteConnectionPool(20, config);
|
||||
await connPool.init();
|
||||
|
||||
//servers
|
||||
@@ -42,7 +46,7 @@ async function main() {
|
||||
|
||||
let devModule = undefined;
|
||||
if (serverConfig.branch == 'development') {
|
||||
const devFileName = './dev.js'; //ignored by pkg -50Mb executable size
|
||||
const devFileName = './dev.js'; //require ignored by pkg -50Mb executable size
|
||||
devModule = require(devFileName);
|
||||
devModule.webpackDevMiddleware(app);
|
||||
}
|
||||
@@ -80,4 +84,12 @@ async function main() {
|
||||
}
|
||||
}
|
||||
|
||||
main();
|
||||
|
||||
(async() => {
|
||||
try {
|
||||
await main();
|
||||
} catch (e) {
|
||||
console.error(e.message);
|
||||
process.exit(1);
|
||||
}
|
||||
})();
|
||||
@@ -2,8 +2,6 @@ const c = require('./controllers');
|
||||
const utils = require('./core/utils');
|
||||
const multer = require('multer');
|
||||
|
||||
const maxUploadSize = 50*1024*1024;
|
||||
|
||||
function initRoutes(app, connPool, config) {
|
||||
const misc = new c.MiscController(connPool, config);
|
||||
const reader = new c.ReaderController(connPool, config);
|
||||
@@ -22,7 +20,7 @@ function initRoutes(app, connPool, config) {
|
||||
cb(null, utils.randomHexString(30));
|
||||
}
|
||||
});
|
||||
const upload = multer({ storage, limits: {fileSize: maxUploadSize} });
|
||||
const upload = multer({ storage, limits: {fileSize: config.maxUploadFileSize} });
|
||||
|
||||
//routes
|
||||
const routes = [
|
||||
|
||||
Reference in New Issue
Block a user