@shijiu/jsview-vue 2.2.201 → 2.2.426-test.0

package/utils/JsViewVueWidget/JsvTextureAnim/BrowserTextureAnim.vue

@@ -1,359 +0,0 @@
-<!--
- * @Author: ChenChanghua
- * @Date: 2022-02-08 09:29:17
- * @LastEditTime: 2023-02-21 10:51:22
- * @Description: file content
--->
-<script>
-// Forge共享数据引用，在Browser处理中window引用，规避Browser触发vite循环引用bug
-const forgeTextureManager = window.JsvCode.ForgeHandles.TextureManager;
-const renderDocument = window.JsvCode.Dom.RenderDocument
-  ? window.JsvCode.Dom.RenderDocument
-  : window.JsvCode.Dom.BrowserDocument;
-
-const DECORATE_BORDER_RADIUS = "BroderRaidus";
-const DECORATE_NINEPATCH_ALPHA_MIX = "NinePatchAlphaMix";
-const TexAlignAnchor = {
-  LEFT_TOP: 1,
-  CENTER_TOP: 2,
-  RIGHT_TOP: 3,
-  LEFT_MIDDLE: 4,
-  CENTER: 5,
-  RIGHT_MIDDLE: 6,
-  LEFT_BOTTOM: 7,
-  CENTER_BOTTOM: 8,
-  RIGHT_BOTTOM: 9,
-};
-
-const getOffset = (type, viewW, viewH, texLeft, texTop) => {
-  let extraLeft, extraTop;
-  switch (type) {
-    case TexAlignAnchor.LEFT_TOP:
-      extraLeft = 0;
-      extraTop = 0;
-      break;
-    case TexAlignAnchor.CENTER_TOP:
-      extraLeft = viewW / 2;
-      extraTop = 0;
-      break;
-    case TexAlignAnchor.RIGHT_TOP:
-      extraLeft = viewW;
-      extraTop = 0;
-      break;
-    case TexAlignAnchor.LEFT_MIDDLE:
-      extraLeft = 0;
-      extraTop = viewH / 2;
-      break;
-    case TexAlignAnchor.RIGHT_MIDDLE:
-      extraLeft = viewW;
-      extraTop = viewH / 2;
-      break;
-    case TexAlignAnchor.LEFT_BOTTOM:
-      extraLeft = 0;
-      extraTop = viewH;
-      break;
-    case TexAlignAnchor.CENTER_BOTTOM:
-      extraLeft = viewW / 2;
-      extraTop = viewH;
-      break;
-    case TexAlignAnchor.RIGHT_BOTTOM:
-      extraLeft = viewW;
-      extraTop = viewH;
-      break;
-    case TexAlignAnchor.CENTER:
-    default:
-      extraLeft = viewW / 2;
-      extraTop = viewH / 2;
-      break;
-  }
-  return [texLeft + extraLeft, texTop + extraTop];
-};
-let TOKEN = 0;
-export default {
-  props: {
-    src: String,
-    top: Number,
-    left: Number,
-    width: Number,
-    height: Number,
-    borderRadius: [String, Number],
-    decorate: Object,
-    animation: String,
-    duration: Number,
-    transform: String,
-    transformOrigin: String,
-    repeat: {
-      type: Number,
-      default: 1,
-    },
-    delay: {
-      type: Number,
-      default: 0,
-    },
-    easing: {
-      type: String,
-      default: "linear",
-    },
-    onAnimationEnd: Function,
-    autoStart: {
-      type: Boolean,
-      default: false,
-    },
-    texCoord: {
-      type: Object,
-    },
-  },
-  setup(props) {
-    return {
-      animName: "browser-texture-anim-" + TOKEN++,
-      animDiv: null,
-      clipDiv: null,
-      imgDiv: null,
-      watcherHandlerList: [],
-    };
-  },
-  computed: {
-    animSet() {
-      return `${this.animName} ${this.duration / 1000}s ${this.easing} ${
-        this.delay / 1000
-      }s ${this.repeat === -1 ? "infinite" : this.repeat}`;
-    },
-    textureLayout() {
-      if (!isNaN(this.texCoord?.width) && !isNaN(this.texCoord?.height)) {
-        const texLeft = !isNaN(this.texCoord.left)
-          ? this.texCoord.left
-          : -this.texCoord.width / 2;
-        const texTop = !isNaN(this.texCoord.top)
-          ? this.texCoord.top
-          : -this.texCoord.height / 2;
-        const type = !isNaN(this.texCoord.alignAnchor)
-          ? this.texCoord.alignAnchor
-          : 5;
-        const offset = getOffset(
-          type,
-          this.width,
-          this.height,
-          texLeft,
-          texTop
-        );
-        const transition = this.decorate?.animTime
-          ? `left ${this.decorate.animTime}s, top ${this.decorate.animTime}s`
-          : "";
-        return {
-          position: "absolute",
-          left: offset[0] + "px",
-          top: offset[1] + "px",
-          transition,
-          width: this.texCoord.width + "px",
-          height: this.texCoord.height + "px",
-        };
-      } else {
-        return {
-          position: "absolute",
-          left: 0 + "px",
-          top: 0 + "px",
-          width: this.width + "px",
-          height: this.height + "px",
-        };
-      }
-    },
-    maskStyle() {
-      if (this.borderRadius) {
-        const radiusObj = this._readRadius(this.borderRadius);
-        return {
-          left: this.left + "px",
-          top: this.top + "px",
-          borderRadius: `${radiusObj.topLeft}px ${radiusObj.topRight}px ${radiusObj.bottomLeft}px ${radiusObj.bottomRight}px`,
-          width: this.width + "px",
-          height: this.height + "px",
-          overflow: "hidden",
-        };
-      } else if (this.decorate) {
-        if (this.decorate.type == DECORATE_NINEPATCH_ALPHA_MIX) {
-          const imageDspWidth =
-            this.decorate.imageDspWidth > 0
-              ? this.decorate.imageDspWidth
-              : this.decorate.imageWidth;
-          const slideWidth =
-            (this.decorate.imageWidth - this.decorate.centerWidth) / 2;
-          const outset = Math.ceil(
-            (this.decorate.borderOutset * imageDspWidth) /
-              this.decorate.imageWidth
-          );
-          console.log("get mask style");
-          const transitionTime = this.decorate.animTime;
-
-          let decorate_url = this.decorate.url;
-          // 加入对 jsvtexturestore 模式的支持
-          // 特别注意: chromiumn 102版本上，当jsvtexturestore对应内容首次加载时不能显示，此divstyle变化后才能显示
-          if (
-            this.decorate.url &&
-            this.decorate.url.startsWith("jsvtexturestore:")
-          ) {
-            let view_texture = forgeTextureManager.GetImage2(this.decorate.url);
-            decorate_url = `url(${view_texture.Source})`;
-          }
-
-          return {
-            left: this.left + "px",
-            top: this.top + "px",
-            width: this.width + "px",
-            height: this.height + "px",
-            transition: `left ${transitionTime}s, top ${transitionTime}s, width ${transitionTime}s, height ${transitionTime}s`,
-            webkitMaskBoxImageSource: decorate_url,
-            webkitMaskBoxImageSlice: slideWidth,
-            webkitMaskBoxImageWidth:
-              Math.ceil(
-                (slideWidth * imageDspWidth) / this.decorate.imageWidth
-              ) + "px",
-            webkitMaskBoxImageOutset: outset + "px",
-            position: "absolute",
-          };
-        } else if (this.decorate.type == DECORATE_BORDER_RADIUS) {
-          return {
-            left: this.left + "px",
-            top: this.top + "px",
-            borderRadius: `${this.decorate.topLeft}px ${this.decorate.topRight}px ${this.decorate.bottomRight}px ${this.decorate.bottomLeft}`,
-            width: this.width + "px",
-            height: this.height + "px",
-            overflow: "hidden",
-          };
-        }
-      } else {
-        return {
-          left: this.left + "px",
-          top: this.top + "px",
-          width: this.width + "px",
-          height: this.height + "px",
-          overflow: "hidden",
-        };
-      }
-    },
-  },
-  methods: {
-    _readRadius(setting) {
-      if (typeof setting == "number") {
-        return {
-          type: DECORATE_BORDER_RADIUS,
-          topLeft: setting,
-          topRight: setting,
-          bottomRight: setting,
-          bottomLeft: setting,
-        };
-      } else if (typeof setting == "string" && setting.length > 0) {
-        const pattern = /\d+/g;
-        let match = setting.match(pattern);
-        if (match.length > 0) {
-          let top_left = match[0];
-          let top_right = match.length > 1 ? match[1] : top_left;
-          return {
-            type: DECORATE_BORDER_RADIUS,
-            topLeft: top_left,
-            topRight: top_right,
-            bottomRight: match.length > 2 ? match[2] : top_left,
-            bottomLeft: match.length > 3 ? match[3] : top_right,
-          };
-        }
-      }
-      return null;
-    },
-    start() {
-      if (this.animDiv && this.animation) {
-        this.animDiv.style.animation = this.animSet;
-      }
-    },
-
-    insertKeyframe(animDefine) {
-      const index = renderDocument.styleSheets[0].cssRules.length;
-      renderDocument.styleSheets[0].insertRule(animDefine, index);
-    },
-    removeKeyframe(animName) {
-      const styleSheetRef = renderDocument.styleSheets[0];
-      const cssRulesRef = styleSheetRef.cssRules;
-      // 对CssRules进行删除操作，倒序轮询
-      for (let i = cssRulesRef.length - 1; i >= 0; i--) {
-        if (cssRulesRef[i].name === animName) {
-          styleSheetRef.deleteRule(i);
-          break;
-        }
-      }
-    },
-  },
-  mounted() {
-    if (this.animation) {
-      //此控件直接操作dom因此不走JsvDynamicKeyframes, 直接通过dom添加keyframes
-      this.insertKeyframe("@keyframes " + this.animName + " " + this.animation);
-    }
-
-    this.$refs.root.jsvGetProxyView().RegisterOnProxyReady(() => {
-      const root = this.$refs.root.jsvGetProxyView().HtmlGetElement();
-      //绕过 jsview 对document 的 hook
-      this.clipDiv = renderDocument.createElement("div");
-      Object.assign(this.clipDiv.style, this.maskStyle);
-
-      const textureLayout = this.textureLayout;
-      this.animDiv = renderDocument.createElement("div");
-      Object.assign(this.animDiv.style, textureLayout);
-      this.animDiv.onanimationend = () => {
-        this.animDiv.style.animation = null;
-        this.onAnimationEnd?.();
-      };
-
-      this.imgDiv = renderDocument.createElement("div");
-      this.imgDiv.style.width = textureLayout.width;
-      this.imgDiv.style.height = textureLayout.height;
-      this.imgDiv.style.backgroundImage = `url(${this.src})`;
-      this.imgDiv.style.transform = this.transform;
-      this.imgDiv.style.transformOrigin = this.transformOrigin;
-
-      this.animDiv.appendChild(this.imgDiv);
-      this.clipDiv.appendChild(this.animDiv);
-      root.appendChild(this.clipDiv);
-    });
-
-    this.watcherHandlerList.push(
-      this.$watch("left", (newValue) => {
-        this.clipDiv.style.left = newValue + "px";
-      })
-    );
-    this.watcherHandlerList.push(
-      this.$watch("top", (newValue) => {
-        this.clipDiv.style.top = newValue + "px";
-      })
-    );
-    this.watcherHandlerList.push(
-      this.$watch("width", (newValue) => {
-        this.clipDiv.style.width = newValue + "px";
-      })
-    );
-    this.watcherHandlerList.push(
-      this.$watch("height", (newValue) => {
-        this.clipDiv.style.height = newValue + "px";
-      })
-    );
-    this.watcherHandlerList.push(
-      this.$watch("textureLayout", (newValue) => {
-        Object.assign(this.animDiv.style, newValue);
-        this.imgDiv.style.width = newValue.width;
-        this.imgDiv.style.height = newValue.height;
-      })
-    );
-    if (this.autoStart) {
-      setTimeout(() => {
-        this.start();
-      }, 0);
-    }
-  },
-  beforeUnmount() {
-    this.removeKeyframe(this.animName);
-    for (let handler of this.watcherHandlerList) {
-      handler?.();
-    }
-    this.watcherHandlerList = [];
-  },
-};
-</script>
-
-<template>
-  <div ref="root"></div>
-</template>

package/bin/types/{JsViewPlugin → utils/JsViewPlugin}/JsvAudio/BrowserAudio/JsvSystemAudio.vue.d.ts

@@ -191,16 +191,16 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
 }>>, {
-    onError: Function;
     onLoad: Function;
+    onError: Function;
     onEnded: Function;
+    onLoadStart: Function;
+    onAudioFocusGain: Function;
+    onAudioFocusLoss: Function;
     src: string;
     autoplay: boolean;
     loop: boolean;
     muted: boolean;
-    onLoadStart: Function;
-    onAudioFocusGain: Function;
-    onAudioFocusLoss: Function;
     onRef: Function;
     onLoadedMetaData: Function;
     preDownload: boolean;

package/bin/types/{JsViewPlugin → utils/JsViewPlugin}/JsvAudio/JsvAudio.vue.d.ts

@@ -1,15 +1,15 @@
 declare const _default: import("vue").DefineComponent<{}, {
     $props: {
-        readonly onError?: Function | undefined;
         readonly onLoad?: Function | undefined;
+        readonly onError?: Function | undefined;
         readonly onEnded?: Function | undefined;
+        readonly onLoadStart?: Function | undefined;
+        readonly onAudioFocusGain?: Function | undefined;
+        readonly onAudioFocusLoss?: Function | undefined;
         readonly src?: string | undefined;
         readonly autoplay?: boolean | undefined;
         readonly loop?: boolean | undefined;
         readonly muted?: boolean | undefined;
-        readonly onLoadStart?: Function | undefined;
-        readonly onAudioFocusGain?: Function | undefined;
-        readonly onAudioFocusLoss?: Function | undefined;
         readonly onRef?: Function | undefined;
         readonly playerKey?: string | undefined;
         readonly onLoadedMetaData?: Function | undefined;

package/bin/types/{JsViewPlugin → utils/JsViewPlugin}/JsvLatex/BrowserJsvLatex.vue.d.ts

@@ -1,13 +1,13 @@
 declare const _default: import("vue").DefineComponent<{}, {
     $props: {
-        readonly height?: number | undefined;
-        readonly width?: number | undefined;
         readonly left?: number | undefined;
         readonly top?: number | undefined;
-        readonly color?: string | undefined;
-        readonly fontSize?: number | undefined;
+        readonly width?: number | undefined;
+        readonly height?: number | undefined;
         readonly latexStr?: string | undefined;
+        readonly fontSize?: number | undefined;
         readonly lineSpace?: number | undefined;
+        readonly color?: string | undefined;
     };
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
 export default _default;

package/bin/types/{JsViewPlugin → utils/JsViewPlugin}/JsvLatex/JsvLatex.vue.d.ts

@@ -4,14 +4,14 @@ declare const _default: import("vue").DefineComponent<{}, {
         height: number;
     };
     $props: {
-        readonly height?: number | undefined;
-        readonly width?: number | undefined;
         readonly left?: number | undefined;
         readonly top?: number | undefined;
-        readonly color?: string | undefined;
-        readonly fontSize?: number | undefined;
+        readonly width?: number | undefined;
+        readonly height?: number | undefined;
         readonly latexStr?: string | undefined;
+        readonly fontSize?: number | undefined;
         readonly lineSpace?: number | undefined;
+        readonly color?: string | undefined;
     };
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
 export default _default;

package/bin/types/{JsViewVueWidget → utils/JsViewVueWidget}/JsvApic/JsvApic/BrowserApic.vue.d.ts

@@ -7,8 +7,8 @@ declare const _default: import("vue").DefineComponent<{}, {
         readonly loopInfo?: unknown[] | undefined;
         readonly style?: Record<string, any> | undefined;
         readonly onLoad?: Function | undefined;
-        readonly src?: string | undefined;
         readonly onEnd?: Function | undefined;
+        readonly src?: string | undefined;
         readonly onStart?: Function | undefined;
     };
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;

package/bin/types/{JsViewVueWidget → utils/JsViewVueWidget}/JsvApic/JsvApic2/BrowserApic2.vue.d.ts

@@ -5,8 +5,8 @@ declare const _default: import("vue").DefineComponent<{}, {
     $props: {
         readonly style?: Record<string, any> | undefined;
         readonly onLoad?: Function | undefined;
-        readonly src?: string | undefined;
         readonly onEnd?: Function | undefined;
+        readonly src?: string | undefined;
         readonly onStart?: Function | undefined;
     };
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;