@shijiu/jsview-vue 2.2.373 → 2.3.0

package/utils/JsViewVueWidget/JsvMaskClipDiv.vue

@@ -15,11 +15,6 @@
 -->
 <script>
 import { Forge, ForgeExtension } from "@shijiu/jsview/dom/jsv-forge-define";
-import ForgeHandles from "../JsViewVueTools/ForgeHandles";
-
-const renderDocument = window.JsvCode.Dom.RenderDocument
-  ? window.JsvCode.Dom.RenderDocument
-  : window.JsvCode.Dom.BrowserDocument;
 
 export default {
   props: {
@@ -59,7 +54,6 @@ export default {
       innerView: null,
       innerViewId: -1,
       styleDetail: null,
-      html: !window.JsView,
       cache: {
         viewSrc: null,
         maskSrc: null,
@@ -114,37 +108,6 @@ export default {
       this.cache.maskWidth = this.maskWidth;
       this.cache.maskHeight = this.maskHeight;
     },
-    _initForHtml() {
-      let _this = this;
-      this.$refs.innerViewDiv
-        ?.jsvGetProxyView(true)
-        .RegisterOnProxyReady(() => {
-          const canvas = renderDocument.createElement("canvas");
-          canvas.style.width = _this.style.width + "px";
-          canvas.style.height = _this.style.height + "px";
-          _this.$refs.innerViewDiv
-            ?.jsvGetProxyView(true)
-            .HtmlGetElement()
-            .appendChild(canvas);
-
-          const clip_image = new Image();
-          const bg_image = new Image();
-          clip_image.src = _this.maskSrc;
-          bg_image.src = _this.viewSrc;
-          let clip_ready = false;
-          let bg_ready = false;
-
-          clip_image.onload = () => {
-            clip_ready = true;
-            _this._drawClip(canvas, clip_image, clip_ready, bg_image, bg_ready);
-          };
-
-          bg_image.onload = () => {
-            bg_ready = true;
-            _this._drawClip(canvas, clip_image, clip_ready, bg_image, bg_ready);
-          };
-        });
-    },
     _updateInnerView() {
       if (this.innerView === null) {
         // 初始化View
@@ -186,19 +149,11 @@ export default {
     },
   },
   created() {
-    if (window.JsView) {
-      this._updateInnerView();
-    }
-  },
-  mounted() {
-    if (!window.JsView) {
-      this._initForHtml();
-    }
+    this._updateInnerView();
   },
+  mounted() {},
   updated() {
-    if (window.JsView) {
-      this._updateInnerView();
-    }
+    this._updateInnerView();
   },
   beforeUnmount() {
     // 清理View管理缓存
@@ -213,15 +168,6 @@ export default {
 
 <template>
   <div
-    v-if="html"
-    ref="innerViewDiv"
-    :style="{
-      top: style.top,
-      left: style.left,
-    }"
-  ></div>
-  <div
-    v-else
     :data-jsv-vw-innerview="innerViewId"
     :style="{
       top: style.top,

package/utils/JsViewVueWidget/JsvNativeSharedDiv.vue

@@ -7,7 +7,7 @@
  *     @param {Object} style  布局样式(必须)，必须包含的信息为{left, top, width, height}
  *     @param {function} getId 回调函数，用于接收ID信息，ID信息用于Native端对该view进行跟踪的标识
  *     @param {String} setId  给定命名ID，避免同进程不同context重名要和Context相关，
- *                            例如`${window.JsView?.getJsContextId()}_${you_name}`
+ *                            例如`${window.JsvCoreApi?.getJsContextId()}_${you_name}`
  *     @param {number} corner 圆角的尺寸，默认为0
  *     @param {number} oversize  为了去除黑边的调整选项，让native video的尺寸信息比扣洞大多少, 默认为0
  *     @param {boolean} frontLayer 视图是在JsView界面前方，不是需要扣洞的后方，默认为false
@@ -16,7 +16,6 @@
 
 <script setup>
 import { Forge } from "@shijiu/jsview/dom/jsv-forge-define";
-import ForgeHandles from "../JsViewVueTools/ForgeHandles";
 import { JsvTextureStoreApi } from "../JsViewVueTools/JsvTextureStore/JsvTextureStore";
 import { onUnmounted, shallowRef } from "vue";
 import JsvNinePatch from "./JsvNinePatch.vue";
@@ -49,77 +48,69 @@ let vInnerViewId = -1;
 let vNinePatchSet = null;
 let vBackgroudnColorValue = null;
 
-let isBrowserDebug = !window.JsView;
-
-if (window.JsView) {
-  // 创建JsView图层穿透的texture，抠洞处理
-
-  if (!rProps.frontLayer) {
-    // 有圆角
-    if (rProps.corner > 0) {
-      let presetGap = 1; // 外延距离，以保证圆角光滑
-      vNinePatchSet = {
-        imageSize: (rProps.corner + presetGap) * 2, // 半径 + 中心点1像素
-        textureName: null,
-      };
-
-      // 用 JsvTextureStoreApi 绘制半径对等的圆形
-      let sampleImageWidth = vNinePatchSet.imageSize;
-      let innerRadius2 = sampleImageWidth; // 内直径
-      let circleLineWidth = 1.5 * rProps.corner + presetGap - rProps.corner; // 线粗要把四角盖上
-      let canvasRef;
-
-      // 创建画布
-      canvasRef = JsvTextureStoreApi.canvasTexture(
-        sampleImageWidth,
-        sampleImageWidth
-      );
-
-      let circleRadius =
-        Math.floor(innerRadius2 / 2) +
-        Math.floor(circleLineWidth / 2) -
-        presetGap; // 圆环绘制路径是粗线的中心线，所以要减去一半的线宽
-      let customPath = canvasRef.circlePath(
-        Math.floor(sampleImageWidth / 2),
-        Math.floor(sampleImageWidth / 2),
-        circleRadius
-      ); // 创建圆环绘制路径，圆形在画布的中心点位置
-      canvasRef.drawColor("rgba(0,0,0,0)"); // 画布绘制透明底色
-      customPath.stroke(circleLineWidth, "#FF0000FF"); // 绘制alpha=1的边缘留色
-
-      // 获取填入url的内容
-      // 进行.9拉伸以适配目标尺寸
-      // 通过 alphaOverride 进行alpah叠加
-      vNinePatchSet.textureName = canvasRef.commit();
-    } else {
-      // 用背景色
-      vBackgroudnColorValue = "rgba(0,0,0,0)";
-    }
-  }
-
-  // 通过内置函数构造定制的NativeSharedView
-  vJsvMainView = new Forge.NativeSharedView();
-  vInnerViewId = Forge.sViewStore.add(new Forge.ViewInfo(vJsvMainView));
-  if (rProps.oversize != 0) {
-    vJsvMainView.SetOverSize(rProps.oversize);
+// 创建JsView图层穿透的texture，抠洞处理
+
+if (!rProps.frontLayer) {
+  // 有圆角
+  if (rProps.corner > 0) {
+    let presetGap = 1; // 外延距离，以保证圆角光滑
+    vNinePatchSet = {
+      imageSize: (rProps.corner + presetGap) * 2, // 半径 + 中心点1像素
+      textureName: null,
+    };
+
+    // 用 JsvTextureStoreApi 绘制半径对等的圆形
+    let sampleImageWidth = vNinePatchSet.imageSize;
+    let innerRadius2 = sampleImageWidth; // 内直径
+    let circleLineWidth = 1.5 * rProps.corner + presetGap - rProps.corner; // 线粗要把四角盖上
+    let canvasRef;
+
+    // 创建画布
+    canvasRef = JsvTextureStoreApi.canvasTexture(
+      sampleImageWidth,
+      sampleImageWidth
+    );
+
+    let circleRadius =
+      Math.floor(innerRadius2 / 2) +
+      Math.floor(circleLineWidth / 2) -
+      presetGap; // 圆环绘制路径是粗线的中心线，所以要减去一半的线宽
+    let customPath = canvasRef.circlePath(
+      Math.floor(sampleImageWidth / 2),
+      Math.floor(sampleImageWidth / 2),
+      circleRadius
+    ); // 创建圆环绘制路径，圆形在画布的中心点位置
+    canvasRef.drawColor("rgba(0,0,0,0)"); // 画布绘制透明底色
+    customPath.stroke(circleLineWidth, "#FF0000FF"); // 绘制alpha=1的边缘留色
+
+    // 获取填入url的内容
+    // 进行.9拉伸以适配目标尺寸
+    // 通过 alphaOverride 进行alpah叠加
+    vNinePatchSet.textureName = canvasRef.commit();
+  } else {
+    // 用背景色
+    vBackgroudnColorValue = "rgba(0,0,0,0)";
   }
+}
 
-  // 更新宽高
-  if (typeof vJsvMainView != "undefined" && vJsvMainView) {
-    if (rProps.setId) {
-      // 使用设置进来的track id，而非自动生成
-      vJsvMainView.SetTrackId(rProps.setId);
-    }
+// 通过内置函数构造定制的NativeSharedView
+vJsvMainView = new Forge.NativeSharedView();
+vInnerViewId = Forge.sViewStore.add(new Forge.ViewInfo(vJsvMainView));
+if (rProps.oversize != 0) {
+  vJsvMainView.SetOverSize(rProps.oversize);
+}
 
-    rProps.getId?.(vJsvMainView.GetTrackId());
+// 更新宽高
+if (typeof vJsvMainView != "undefined" && vJsvMainView) {
+  if (rProps.setId) {
+    // 使用设置进来的track id，而非自动生成
+    vJsvMainView.SetTrackId(rProps.setId);
   }
+
+  rProps.getId?.(vJsvMainView.GetTrackId());
 }
 
 onUnmounted(() => {
-  if (!window.JsView) {
-    return;
-  }
-
   // 清理View管理缓存
   if (vInnerViewId !== -1) {
     Forge.sViewStore.remove(vInnerViewId);
@@ -135,7 +126,6 @@ onUnmounted(() => {
 
 <template>
   <div
-    v-if="!isBrowserDebug"
     :style="{
       left: style.left,
       top: style.top,
@@ -173,8 +163,4 @@ onUnmounted(() => {
       <slot />
     </div>
   </div>
-
-  <div v-else :style="{ ...style }">
-    <slot />
-  </div>
 </template>

package/utils/JsViewVueWidget/JsvPosterDiv.vue

@@ -2,38 +2,44 @@
  * @file
  *
  * 【模块 export 内容】
- * JsvPosterDiv：Vue高阶组件，海报描画
+ * JsvPosterDiv：Vue高阶组件，海报描画, 其字内容为占位图
  *  props说明:
  *      style    {Object}   包含
  *                          left/top/width/height
  *                          border-radius
  *                          backgroundImage/backgroundColor 
  *                          的style设置
+ *      enableAA: {boolean} 启用非全局的抗锯齿处理，不过这个处理会使绘制的矩形比原尺寸每边少2~3像素点
 -->
 <script setup>
-
-import { reactive, watchEffect } from "vue";
+import { reactive, watchEffect, shallowRef } from "vue";
 
 const props = defineProps({
   style: Object,
+  enableAA: {
+    type: Boolean,
+    default: false,
+  },
 });
 
 let common_style = reactive({});
 let image_style = reactive({});
+let rEnableAA = shallowRef("0");
 
-watchEffect(()=>{
+watchEffect(() => {
   if (props.style) {
-    let {left, top, width, height, ...others} = props.style;
+    let { left, top, width, height, transformStyle, ...others } = props.style;
 
     common_style.left = left;
     common_style.top = top;
+    common_style.transformStyle = transformStyle;
 
     image_style.width = width;
     image_style.height = height;
-    Object.assign(image_style, others)
+    Object.assign(image_style, others);
   }
-})
-
+  rEnableAA.value = props.enableAA ? "1" : "0";
+});
 </script>
 
 <template>
@@ -43,6 +49,7 @@ watchEffect(()=>{
       data-jsv-vw-enable-fade="true"
       data-jsv-vw-mask-poster-on-top="true"
       :style="image_style"
+      :data-jsv-img-enable-aa="rEnableAA"
       v-bind="$attrs"
     />
   </div>

package/utils/JsViewVueWidget/JsvPosterImage.vue

@@ -10,10 +10,11 @@
  *      src {string}        图片的加载地址
  *      fadeIn: {boolean}   图片加载完成是否有淡入效果，默认为打开
  *      isPosterImage:      标识是否用于海报位，对于海报位的内容，可以有下载线程控制等策略来优化整体体验
+ *      enableAA: {boolean} 启用非全局的抗锯齿处理，不过这个处理会使绘制的矩形比原尺寸每边少2~3像素点
 -->
 
 <script setup>
-import { reactive, watchEffect, computed } from "vue";
+import { reactive, watchEffect, computed, shallowRef } from "vue";
 import { JsvPerformance } from "../JsViewVueTools/JsvPerformance.ts";
 
 const props = defineProps({
@@ -37,6 +38,10 @@ const props = defineProps({
     type: String,
     default: null,
   },
+  enableAA: {
+    type: Boolean,
+    default: false,
+  },
   style: Object,
 });
 
@@ -52,7 +57,7 @@ const isPosterImage = computed(() => {
 
 let common_style = reactive({});
 let image_style = reactive({});
-let show_background_holder = !!window.JsView; // PC浏览器模拟时, 不显示占位图，避免误导
+let rEnableAA = shallowRef("0");
 
 watchEffect(() => {
   if (props.style) {
@@ -62,6 +67,7 @@ watchEffect(() => {
       top,
       width,
       height,
+      transformStyle,
       backgroundImage,
       backgroundColor,
       ...others
@@ -70,17 +76,19 @@ watchEffect(() => {
     // 承接x,y偏移和动画设置, 规避默认淡出动画被影响
     common_style.left = left;
     common_style.top = top;
+    common_style.transformStyle = transformStyle;
 
     image_style.width = width;
     image_style.height = height;
     Object.assign(image_style, others);
   }
+  rEnableAA.value = props.enableAA ? "1" : "0";
 });
 </script>
 
 <template>
   <div :style="common_style">
-    <slot v-if="show_background_holder"></slot>
+    <slot />
     <img
       v-if="!!props.src"
       :data-jsv-vw-enable-fade="props.fadeIn"
@@ -88,6 +96,7 @@ watchEffect(() => {
       :data-jsv-img-scaledown-tex="scaleddown"
       :data-jsv-img-color-space="colorSpace"
       :data-jsv-img-poster-image="isPosterImage"
+      :data-jsv-img-enable-aa="rEnableAA"
       :style="image_style"
       :src="props.src"
       v-bind="$attrs"

package/utils/JsViewVueWidget/JsvPreload/JsvPreload.vue

@@ -71,8 +71,7 @@ export { buildPreloadInfo, buildDownloadInfo };
 import { Forge } from "@shijiu/jsview/dom/jsv-forge-define";
 import ForgeHandles from "../../JsViewVueTools/ForgeHandles";
 import { reactive, onBeforeUnmount, watchEffect } from "vue";
-
-const CONST_FORMAT_TOKEN = "_JsvP_";
+import { urlCheckSet } from "../../JsViewVueTools";
 
 const props = defineProps({
   preloadList: Object,
@@ -98,37 +97,29 @@ let preloadToken = 1;
 let downloadToken = 1;
 
 const _releasePreloadView = () => {
-  if (window.JsView) {
-    if (loadViewList.preloadViewList.length > 0) {
-      for (const view_info of loadViewList.preloadViewList) {
-        if (view_info) {
-          // 当预加载url为null时view_info为null
-          const id = view_info.viewId;
-          view_info.textureRef?.DisableBackgroundLoad();
-          view_info.textureRef?.UnregisterLoadImageCallback(
-            view_info.callToken
-          );
-          Forge.sViewStore.remove(id);
-        }
+  if (loadViewList.preloadViewList.length > 0) {
+    for (const view_info of loadViewList.preloadViewList) {
+      if (view_info) {
+        // 当预加载url为null时view_info为null
+        const id = view_info.viewId;
+        view_info.textureRef?.DisableBackgroundLoad();
+        view_info.textureRef?.UnregisterLoadImageCallback(view_info.callToken);
+        Forge.sViewStore.remove(id);
       }
     }
-    loadViewList.preloadViewList = [];
-    preloadStateList = [];
   }
+  loadViewList.preloadViewList = [];
+  preloadStateList = [];
 };
 const _releaseDownloadView = () => {
-  if (window.JsView) {
-    if (loadViewList.downloadViewList.length > 0) {
-      for (const view_info of loadViewList.downloadViewList) {
-        if (view_info) {
-          // 当预加载url为null时view_info为null
-          const id = view_info.viewId;
-          view_info.textureRef?.DisableBackgroundLoad();
-          view_info.textureRef?.UnregisterLoadImageCallback(
-            view_info.callToken
-          );
-          Forge.sViewStore.remove(id);
-        }
+  if (loadViewList.downloadViewList.length > 0) {
+    for (const view_info of loadViewList.downloadViewList) {
+      if (view_info) {
+        // 当预加载url为null时view_info为null
+        const id = view_info.viewId;
+        view_info.textureRef?.DisableBackgroundLoad();
+        view_info.textureRef?.UnregisterLoadImageCallback(view_info.callToken);
+        Forge.sViewStore.remove(id);
       }
     }
   }
@@ -176,14 +167,7 @@ const _getPreloadViewIdList = () => {
         "Error:format mismatch, data should comes from function buildPreloadInfo()"
       );
     }
-    const base_url = item.url;
-    let image_url = base_url;
-    if (base_url && base_url.indexOf("http") < 0) {
-      // 包含http和https两种请求
-      if (window.JsView.Dom.UrlRef) {
-        image_url = new window.JsView.Dom.UrlRef(base_url).href;
-      }
-    }
+    let image_url = urlCheckSet(item.url);
     let target_size = null;
     if (item.width !== 0 && item.height !== 0) {
       target_size = { width: item.width, height: item.height };
@@ -267,14 +251,7 @@ const _getDownloadViewIdList = () => {
       );
     }
     console.log(`OnDownload get${index} url=${item.url}`);
-    const base_url = item.url;
-    let image_url = base_url;
-    if (base_url && base_url.indexOf("http") < 0) {
-      // 包含http和https两种请求
-      if (window.JsView.Dom.UrlRef) {
-        image_url = new window.JsView.Dom.UrlRef(base_url).href;
-      }
-    }
+    let image_url = urlCheckSet(item.url);
     const texture = ForgeHandles.TextureManager.GetDownloadTexture(
       image_url,
       null,

package/utils/JsViewVueWidget/JsvPreload/index.js

@@ -6,17 +6,6 @@
  * @Description: file content
  */
 //! 考虑到.vue文件除了export default的component外，还有可能export其他对象,因此使用import * as
-import * as JsvPreload from "./JsvPreload.vue";
+export * from "./JsvPreload.vue";
+export { default } from "./JsvPreload.vue";
 
-let _JsvPreload;
-if (window.JsView) {
-  _JsvPreload = JsvPreload.default;
-} else {
-  const BrowserPreload = await import("./BrowserPreload.vue");
-  _JsvPreload = BrowserPreload.default;
-}
-
-let buildPreloadInfo = JsvPreload.buildPreloadInfo;
-let buildDownloadInfo = JsvPreload.buildDownloadInfo;
-export default _JsvPreload;
-export { buildPreloadInfo, buildDownloadInfo };

package/utils/JsViewVueWidget/JsvQrcode/JsvQrcode.vue

@@ -14,7 +14,7 @@
  *            imageSettings {Object}    设置中心logo图片，默认值为null，设置格式为：
  *                       {
  *                              src {string}        logo的url地址
- *                              height {int}     logo的宽度
+ *                              width {int}     logo的宽度
  *                              height {int}     logo的高度
  *                       }
  -->
@@ -22,6 +22,7 @@
 import { Forge } from "@shijiu/jsview/dom/jsv-forge-define";
 import ForgeHandles from "../../JsViewVueTools/ForgeHandles";
 import { TextureInstantType } from "../../JsViewVueTools/JsvTextureDefines.ts";
+import { urlCheckSet } from "../../JsViewVueTools/TypeCheckAndSet.ts";
 
 export default {
   props: {
@@ -96,7 +97,7 @@ export default {
       if (this.imageSettings && calculatedImageSettings) {
         let url = this.imageSettings.src;
         if (typeof url === "string") {
-          url = new window.JsView.Dom.UrlRef(this.imageSettings.src).href;
+          url = urlCheckSet(this.imageSettings.src);
         }
         const img_texture = texture_manager.GetImage(url);
         const img_view = new Forge.LayoutView(

package/utils/JsViewVueWidget/JsvSoundPool.js

@@ -40,6 +40,8 @@
  *              功能: 设置播放优先级
  */
 
+import { urlCheckSet } from "../JsViewVueTools";
+
 const supportSoundPool = !!window.SoundPool;
 class AudioController {
   constructor(soundPool, soundId, url) {
@@ -165,13 +167,7 @@ class JsvSoundPool {
       return;
     }
 
-    let realUrl;
-    if (window.JsView) {
-      // jsview上
-      realUrl = new window.JsView.Dom.UrlRef(url).href;
-    } else {
-      realUrl = url;
-    }
+    let realUrl = urlCheckSet(url);
     if (this._SoundIdMap[realUrl]) {
       this._SoundIdMap[realUrl].referCount++;
       const controller = new AudioController(this._SoundPool, this._SoundIdMap[realUrl].soundId);