diff --git a/client/components/Reader/Reader.vue b/client/components/Reader/Reader.vue index 570dd1a5..cbfae9ee 100644 --- a/client/components/Reader/Reader.vue +++ b/client/components/Reader/Reader.vue @@ -131,6 +131,9 @@ import ContentsPage from './ContentsPage/ContentsPage.vue'; import ReaderDialogs from './ReaderDialogs/ReaderDialogs.vue'; import bookManager from './share/bookManager'; +import wallpaperStorage from './share/wallpaperStorage'; +import dynamicCss from '../../share/dynamicCss'; + import rstore from '../../store/modules/reader'; import readerApi from '../../api/reader'; import miscApi from '../../api/misc'; @@ -327,6 +330,7 @@ class Reader extends Vue { this.pdfAsText = settings.pdfAsText; this.pdfQuality = settings.pdfQuality; this.dualPageMode = settings.dualPageMode; + this.userWallpapers = settings.userWallpapers; this.readerActionByKeyCode = utils.userHotKeysObjectSwap(settings.userHotKeys); this.$root.readerActionByKeyEvent = (event) => { @@ -334,6 +338,30 @@ class Reader extends Vue { } this.updateHeaderMinWidth(); + + this.loadWallpapers();//no await + } + + //wallpaper css + async loadWallpapers() { + const wallpaperDataLength = await wallpaperStorage.getLength(); + if (wallpaperDataLength !== this.wallpaperDataLength) {//оптимизация + this.wallpaperDataLength = wallpaperDataLength; + + let newCss = ''; + for (const wp of this.userWallpapers) { + const data = await wallpaperStorage.getData(wp.cssClass); + + if (!data) { + //здесь будем восстанавливать данные с сервера + } + + if (data) { + newCss += `.${wp.cssClass} {background: url(${data}) center; background-size: 100% 100%;}`; + } + } + dynamicCss.replace('wallpapers', newCss); + } } async checkNewVersionAvailable() { diff --git a/client/components/Reader/SettingsPage/include/ViewTab/Color.inc b/client/components/Reader/SettingsPage/include/ViewTab/Color.inc index 92a2cb02..ad5d22dc 100644 --- a/client/components/Reader/SettingsPage/include/ViewTab/Color.inc +++ b/client/components/Reader/SettingsPage/include/ViewTab/Color.inc @@ -78,7 +78,7 @@ Добавить файл обоев - + Удалить выбранные обои diff --git a/client/components/Reader/TextPage/DrawHelper.js b/client/components/Reader/TextPage/DrawHelper.js index f99aa4e3..2bcf2583 100644 --- a/client/components/Reader/TextPage/DrawHelper.js +++ b/client/components/Reader/TextPage/DrawHelper.js @@ -2,11 +2,11 @@ import {sleep} from '../../../share/utils'; export default class DrawHelper { fontBySize(size) { - return `${size}px ${this.fontName}`; + return `${size}px '${this.fontName}'`; } fontByStyle(style) { - return `${style.italic ? 'italic' : this.fontStyle} ${style.bold ? 'bold' : this.fontWeight} ${this.fontSize}px ${this.fontName}`; + 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 diff --git a/client/components/Reader/TextPage/TextPage.vue b/client/components/Reader/TextPage/TextPage.vue index 0d7e6156..ed7ea7e4 100644 --- a/client/components/Reader/TextPage/TextPage.vue +++ b/client/components/Reader/TextPage/TextPage.vue @@ -43,10 +43,8 @@ import _ from 'lodash'; import './TextPage.css'; import * as utils from '../../../share/utils'; -import dynamicCss from '../../../share/dynamicCss'; import bookManager from '../share/bookManager'; -import wallpaperStorage from '../share/wallpaperStorage'; import DrawHelper from './DrawHelper'; import rstore from '../../../store/modules/reader'; import {clickMap} from '../share/clickMap'; @@ -162,7 +160,7 @@ class TextPage extends Vue { const wideLetter = 'Щ'; //preloaded fonts - this.fontList = [`12px ${this.fontName}`]; + this.fontList = [`12px '${this.fontName}'`]; //widths this.realWidth = this.$refs.main.clientWidth; @@ -252,28 +250,6 @@ class TextPage extends Vue { //statusBar this.statusBarClickable = this.drawHelper.statusBarClickable(this.statusBarTop, this.statusBarHeight); - //wallpaper css, асинхронно - (async() => { - const wallpaperDataLength = await wallpaperStorage.getLength(); - if (wallpaperDataLength !== this.wallpaperDataLength) {//оптимизация - this.wallpaperDataLength = wallpaperDataLength; - - let newCss = ''; - for (const wp of this.userWallpapers) { - const data = await wallpaperStorage.getData(wp.cssClass); - - if (!data) { - //здесь будем восстанавливать данные с сервера - } - - if (data) { - newCss += `.${wp.cssClass} {background: url(${data}) center; background-size: 100% 100%;}`; - } - } - dynamicCss.replace('wallpapers', newCss); - } - })(); - //parsed if (this.parsed) { let wideLine = wideLetter; @@ -524,7 +500,7 @@ class TextPage extends Vue { } get font() { - return `${this.fontStyle} ${this.fontWeight} ${this.fontSize}px ${this.fontName}`; + return `${this.fontStyle} ${this.fontWeight} ${this.fontSize}px '${this.fontName}'`; } onPage1TransitionEnd() {