Добавил настройки для изображений, добаил автоматический ресайз

client/components/Reader/SettingsPage/SettingsPage.vue

@@ -194,6 +194,26 @@
                                 <el-input-number v-model="addEmptyParagraphs" :min="0" :max="2"></el-input-number>
                             </el-form-item>
                             
+                            <el-form-item label="Изображения">
+                                <el-col :span="11">
+                                    <el-checkbox v-model="showImages">Показывать</el-checkbox>
+                                </el-col>
+
+                                <el-col :span="1">
+                                    &nbsp;
+                                </el-col>
+                                <el-col :span="11">
+                                    <el-tooltip :open-delay="500" effect="light" placement="top">
+                                        <template slot="content">
+                                            Определяет высоту изображения количеством строк.<br>
+                                            В случае превышения высоты, изображение будет<br>
+                                            уменьшено с сохранением пропорций так, чтобы<br>
+                                            помещаться в указанное количество строк.
+                                        </template>
+                                        <el-input-number v-model="imageHeightLines" :min="1" :max="100"></el-input-number>
+                                    </el-tooltip>
+                                </el-col>
+                            </el-form-item>
                         </el-form>
 
                         <el-form :model="form" size="mini" label-width="120px" @submit.native.prevent>

client/components/Reader/TextPage/DrawHelper.js

@@ -98,10 +98,20 @@ export default class DrawHelper {
                 if (img && img.id && !img.inline && !imageDrawn.has(img.paraIndex)) {
                     if (img.local) {
                         const bin = this.parsed.binary[img.id];
-                        const left = (this.w - bin.w)/2;
+
-                        const s = (img.lineCount*this.lineHeight - bin.h)/2;
+                        let imgH = img.lineCount*this.lineHeight;
-                        const top = s + (i - img.imageLine)*this.lineHeight;
+                        imgH = (imgH <= bin.h ? imgH : bin.h);
-                        lineText += `<img src="data:${bin.type};base64,${bin.data}" style="position: absolute; left: ${left}px; top: ${top}px"/>`;
+                        let imgW = bin.w;
+
+                        let resize = '';                        
+                        if (bin.h > imgH) {
+                            resize = `height: ${imgH}px`;
+                            imgW = imgW*imgH/bin.h;
+                        }
+
+                        const left = (this.w - imgW)/2;
+                        const top = ((img.lineCount*this.lineHeight - imgH)/2) + (i - img.imageLine)*this.lineHeight;
+                        lineText += `<img src="data:${bin.type};base64,${bin.data}" style="position: absolute; left: ${left}px; top: ${top}px; ${resize}"/>`;
                     } else {
                         //
                     }

client/components/Reader/TextPage/TextPage.vue

@@ -217,8 +217,8 @@ class TextPage extends Vue {
             this.parsed.maxWordLength = t.length - 1;
             this.parsed.measureText = this.drawHelper.measureText.bind(this.drawHelper);
             this.parsed.lineHeight = this.lineHeight;
-            this.parsed.showImages = true;
+            this.parsed.showImages = this.showImages;
-            this.parsed.imageHeightLines = 100;
+            this.parsed.imageHeightLines = this.imageHeightLines;
         }
 
         //statusBar

client/components/Reader/share/BookParser.js

@@ -532,7 +532,7 @@ export default class BookParser {
             last: Boolean,
             parts: array of {
                 style: {bold: Boolean, italic: Boolean, center: Boolean},
-                image: {local: Boolean, inline: Boolean, id: String, imageLine: Number, lineCount: Number, resize: Boolean, paraIndex: Number},
+                image: {local: Boolean, inline: Boolean, id: String, imageLine: Number, lineCount: Number, paraIndex: Number},
                 text: String,
             }
         }*/
@@ -553,6 +553,7 @@ export default class BookParser {
 
             //изображения
             if (part.image.id && !part.image.inline) {
+                parsed.visible = this.showImages;
                 const bin = this.binary[part.image.id];
 
                 let lineCount = this.imageHeightLines;
@@ -569,7 +570,6 @@ export default class BookParser {
                         id: part.image.id,
                         imageLine: i,
                         lineCount,
-                        resize: (c > lineCount),
                         paraIndex
                     }});
                     lines.push(line);
@@ -580,7 +580,7 @@ export default class BookParser {
                 line.first = (j == 0);
                 line.last = true;
                 line.parts.push({style, text: ' ',
-                    image: {local: part.image.local, inline: false, id: part.image.id, imageLine: i, lineCount, resize: (c > lineCount), paraIndex}});
+                    image: {local: part.image.local, inline: false, id: part.image.id, imageLine: i, lineCount, paraIndex}});
                 continue;
             }
 

client/store/modules/reader.js

@@ -163,6 +163,8 @@ const settingDefaults = {
         cutEmptyParagraphs: false,
         addEmptyParagraphs: 0,
         blinkCachedLoad: true,
+        showImages: true,
+        imageHeightLines: 100,
 
         fontShifts: {},
 };