feat: 增加镜像功能

h5/src/components/vionPlayer/config.js

@@ -68,3 +68,13 @@ export function getRotateConfig() {
     click: this.rotate,
   }
 }
+
+export function getMirrorRotate() {
+  return {
+    name: 'mirrorRotate',
+    index: 2,
+    icon: 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3QgeD0iNC43NSIgeT0iNy43NSIgd2lkdGg9IjE0LjUiIGhlaWdodD0iOC41IiByeD0iMS4yNSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KPG1hc2sgaWQ9InBhdGgtMi1pbnNpZGUtMV8xMDBfNjYiIGZpbGw9IndoaXRlIj4KPHBhdGggZD0iTTIuMDM5NTEgOC4zNzI2M0MyLjE4NzU2IDcuMjAyMDQgMi43NDQ4MiA2LjEyMTUxIDMuNjEyNzMgNS4zMjIxN0M0LjQ4MDY0IDQuNTIyODMgNS42MDMyOCA0LjA1NjE4IDYuNzgyMDggNC4wMDQ3NUw2LjgzNjU2IDUuMjUzNTFDNS45NTI0NCA1LjI5MjA4IDUuMTEwNDUgNS42NDIwNyA0LjQ1OTUxIDYuMjQxNTlDMy44MDg1NyA2Ljg0MTEgMy4zOTA2MiA3LjY1MTUxIDMuMjc5NTggOC41Mjk0N0wyLjAzOTUxIDguMzcyNjNaIi8+CjwvbWFzaz4KPHBhdGggZD0iTTIuMDM5NTEgOC4zNzI2M0MyLjE4NzU2IDcuMjAyMDQgMi43NDQ4MiA2LjEyMTUxIDMuNjEyNzMgNS4zMjIxN0M0LjQ4MDY0IDQuNTIyODMgNS42MDMyOCA0LjA1NjE4IDYuNzgyMDggNC4wMDQ3NUw2LjgzNjU2IDUuMjUzNTFDNS45NTI0NCA1LjI5MjA4IDUuMTEwNDUgNS42NDIwNyA0LjQ1OTUxIDYuMjQxNTlDMy44MDg1NyA2Ljg0MTEgMy4zOTA2MiA3LjY1MTUxIDMuMjc5NTggOC41Mjk0N0wyLjAzOTUxIDguMzcyNjNaIiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjMiIG1hc2s9InVybCgjcGF0aC0yLWluc2lkZS0xXzEwMF82NikiLz4KPHBhdGggZD0iTTkgNC41TDYuNzUgNS43OTkwNFYzLjIwMDk2TDkgNC41WiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+Cg==',
+    iconTitle: '镜像',
+    click: this.mirrorRotate,
+  }
+}

h5/src/components/vionPlayer/index.vue

@@ -6,7 +6,7 @@
 import { merge } from 'lodash';
 // checkSupportMSEHevc checkSupportSIMD, checkSupportWCSHevc
 import { getWatermarkCanvasImg } from './utils';
-import { getPlayerConfig, getRotateConfig } from './config';
+import { getPlayerConfig, getRotateConfig, getMirrorRotate } from './config';
 
 export default {
   name: 'VionPlayer',
@@ -39,6 +39,7 @@ export default {
       _jessibuca: null,
       playOriginUrl: '',
       rotateNum: 0,
+      mirrorIndex: 0,
 
       player: {
         height: 0,
@@ -75,7 +76,7 @@ export default {
           record: !this.isXCXPage, // 录制
           scale: !this.isXCXPage, // 显示模式：拉伸、缩放、正常
         },
-        extendOperateBtns: [getRotateConfig.call(this)],
+        extendOperateBtns: [getRotateConfig.call(this), getMirrorRotate.call(this)],
       });
 
       console.log('init-options', options);
@@ -172,6 +173,13 @@ export default {
       }
       this._jessibuca.setRotate(targetRotate);
     },
+    mirrorRotate() {
+      // , 'vertical'
+      const typeList = ['', 'level'];
+      this.mirrorIndex++;
+      const targetType = typeList[this.mirrorIndex % 2];
+      this._jessibuca.setMirrorRotate(targetType);
+    },
     screenshot(filename = '', format = 'jpeg', quality = 0.2, type = 'base64') {
       return new Promise((resolve, reject) => {
         // 如果是播放状态