Добавлен новый вариант анимации перелистывания - листание

client/components/Reader/SettingsPage/SettingsPage.vue

@@ -382,6 +382,7 @@
                                         <el-option label="Протаивание" value="thaw"></el-option>
                                         <el-option label="Мерцание" value="blink"></el-option>
                                         <el-option label="Вращение" value="rotate"></el-option>
+                                        <el-option v-show="wallpaper == ''" label="Листание" value="flip"></el-option>
                                     </el-select>
                                 </el-col>
                             </el-form-item>
@@ -540,6 +541,10 @@ export default @Component({
             const font = (newValue ? newValue : this.fontName);
             this.vertShift = this.fontShifts[font] || 0;
         },
+        wallpaper: function(newValue) {
+            if (newValue != '' && this.pageChangeAnimation == 'flip')
+                this.pageChangeAnimation = '';
+        },
     },
 })
 class SettingsPage extends Vue {

client/components/Reader/TextPage/DrawHelper.js

@@ -346,5 +346,29 @@ export default class DrawHelper {
         }
     }
 
+    async doPageAnimationFlip(page1, page2, duration, isDown, animation1Finish, animation2Finish, backgroundColor) {
+        page2.style.background = backgroundColor;
+
+        if (isDown) {
+            page2.style.transformOrigin = '10%';
+            await sleep(30);
+
+            page2.style.transformOrigin = '0%';
+            page2.style.transition = `${duration}ms ease-in-out`;
+            page2.style.transform = `rotateY(-120deg)`;
+            await animation2Finish(duration);
+        } else {
+            page2.style.transformOrigin = '90%';
+            await sleep(30);
+
+            page2.style.transformOrigin = '100%';
+            page2.style.transition = `${duration}ms ease-in-out`;
+            page2.style.transform = `rotateY(120deg)`;
+            await animation2Finish(duration);
+        }
+
+        page2.style.transformOrigin = 'center';
+        page2.style.background = '';
+    }
 
 }

client/components/Reader/TextPage/TextPage.vue

@@ -229,8 +229,8 @@ class TextPage extends Vue {
         let page1 = this.$refs.scrollBox1;
         let page2 = this.$refs.scrollBox2;
         
-        page1.style.perspective = '1200px';
-        page2.style.perspective = '1200px';
+        page1.style.perspective = '3072px';
+        page2.style.perspective = '3072px';
 
         page1.style.width = this.w + this.indentLR + 'px';
         page2.style.width = this.w + this.indentLR + 'px';
@@ -665,6 +665,10 @@ class TextPage extends Vue {
                     await this.drawHelper.doPageAnimationRotate(page1, page2, 
                         duration, this.pageChangeDirectionDown, transition1Finish, transition2Finish);
                     break;
+                case 'flip':
+                    await this.drawHelper.doPageAnimationFlip(page1, page2, 
+                        duration, this.pageChangeDirectionDown, transition1Finish, transition2Finish, this.backgroundColor);
+                    break;
             }
             
             this.resolveAnimation1Finish = null;

client/store/modules/reader.js

@@ -153,7 +153,7 @@ const settingDefaults = {
     indentLR: 15,// px, отступ всего текста слева и справа
     indentTB: 0,// px, отступ всего текста сверху и снизу
     wordWrap: true,//перенос по слогам
-    keepLastToFirst: true,// перенос последней строки в первую при листании
+    keepLastToFirst: false,// перенос последней строки в первую при листании
 
     showStatusBar: true,
     statusBarTop: false,// top, bottom
@@ -163,7 +163,7 @@ const settingDefaults = {
     scrollingDelay: 3000,// замедление, ms
     scrollingType: 'ease-in-out', //linear, ease, ease-in, ease-out, ease-in-out
 
-    pageChangeAnimation: 'blink',// '' - нет, downShift, rightShift, thaw - протаивание, blink - мерцание, rotate - вращение, flip - перелистывание
+    pageChangeAnimation: 'flip',// '' - нет, downShift, rightShift, thaw - протаивание, blink - мерцание, rotate - вращение, flip - листание
     pageChangeAnimationSpeed: 80, //0-100%
 
     allowUrlParamBookPos: false,