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

package/bin/browser/BrowserPreload.vue.mjs

@@ -1,139 +0,0 @@
-import { reactive, watchEffect, onBeforeUnmount, openBlock, createElementBlock, createCommentVNode } from 'vue';
-
-/* 
- + @file {@link file://./../../../../utils/JsViewVueWidget/JsvPreload/BrowserPreload.vue}
- */
-const _sfc_main = {
-  __name: "BrowserPreload",
-  props: {
-    preloadList: Array,
-    downloadList: Array,
-    onPreloadDone: Function,
-    // 预加载完成回调
-    onDownloadDone: Function,
-    // 预下载完成回调
-    onPreloading: Function
-  },
-  setup(__props) {
-    const props = __props;
-    const loadViewList = reactive({
-      preloadViewList: [],
-      downloadViewList: []
-    });
-    let preloadIsNullNum = 0;
-    let downloadIsNullNum = 0;
-    let preloadResultMap = {};
-    let downloadResultMap = {};
-    let downloadUrlList = [];
-    let unmountStatus = { unmount: false };
-    let preloadStateList = null;
-    let downloadStateList = null;
-    const getPreloadList = () => {
-      preloadStateList = new Array(props.preloadList.length).fill(false);
-      let preloadListData = props.preloadList;
-      for (let i = 0; i < preloadListData.length; i++) {
-        if (!preloadListData[i] || !preloadListData[i].url) {
-          preloadListData.splice(i, 1);
-          preloadIsNullNum++;
-          i--;
-        }
-      }
-      loadViewList.preloadViewList = preloadListData.map((item, index) => {
-        if (!item || !item.url) {
-          preloadStateList[index] = true;
-          return null;
-        }
-        const image = new Image();
-        const unmount_track = unmountStatus;
-        image.onload = () => {
-          if (unmount_track.unmount) {
-            return;
-          }
-          preloadResultMap[item.url] = {
-            width: image.width,
-            height: image.height
-          };
-          preloadStateList[index] = true;
-          let loadedNum = 0;
-          preloadStateList.map((item2) => {
-            loadedNum += item2 ? 1 : 0;
-          });
-          props.onPreloading?.(loadedNum / preloadStateList.length);
-          if (props.onPreloadDone && loadedNum + preloadIsNullNum == preloadStateList.length) {
-            props.onPreloadDone?.(preloadResultMap);
-          }
-        };
-        image.src = item.url;
-      });
-    };
-    const getDownloadList = () => {
-      downloadStateList = new Array(props.downloadList.length).fill(false);
-      downloadUrlList = new Array(downloadStateList.length);
-      let downloadListData = props.downloadList;
-      for (let i = 0; i < downloadListData.length; i++) {
-        if (!downloadListData[i] || !downloadListData[i].url) {
-          downloadListData.splice(i, 1);
-          downloadUrlList[i] = "invalid";
-          downloadIsNullNum++;
-          i--;
-        }
-      }
-      loadViewList.downloadViewList = downloadListData.map((item, index) => {
-        if (!item || !item.url) {
-          downloadStateList[index] = true;
-          downloadUrlList[index] = "invalid";
-          return null;
-        }
-        const image = new Image();
-        const unmount_track = unmountStatus;
-        image.onload = () => {
-          if (unmount_track.unmount) {
-            return;
-          }
-          downloadStateList[index] = true;
-          downloadUrlList[index] = item.url;
-          downloadResultMap[item.url] = {
-            width: image.width,
-            height: image.height
-          };
-          console.log(`pre download succeed ${item.url}`);
-          if (props.onDownloadDone) {
-            let downloadNum = 0;
-            downloadStateList.map((item2) => {
-              downloadNum += item2 ? 1 : 0;
-            });
-            if (downloadNum + downloadIsNullNum == downloadStateList.length) {
-              props.onDownloadDone?.(downloadUrlList, downloadResultMap);
-            }
-          }
-        };
-        image.src = item.url;
-      });
-    };
-    watchEffect(() => {
-      if (props.preloadList) {
-        console.log("JsvPreload: update preloadList");
-        preloadIsNullNum = 0;
-        preloadResultMap = {};
-        getPreloadList();
-      }
-    });
-    watchEffect(() => {
-      if (props.downloadList) {
-        console.log("JsvPreload: update downloadList");
-        downloadIsNullNum = 0;
-        downloadResultMap = {};
-        downloadUrlList = [];
-        getDownloadList();
-      }
-    });
-    onBeforeUnmount(() => {
-      unmountStatus.unmount = true;
-    });
-    return (_ctx, _cache) => {
-      return !__props.preloadList ? (openBlock(), createElementBlock("div", { key: 0 })) : createCommentVNode("", true);
-    };
-  }
-};
-
-export { _sfc_main as default };

package/bin/browser/BrowserQrcode.vue.mjs

@@ -1,176 +0,0 @@
-import { ref, onMounted, openBlock, createElementBlock, createElementVNode, normalizeStyle, unref } from 'vue';
-import QRCode from 'qr.js';
-
-/* 
- + @file {@link file://./../../../../utils/JsViewVueWidget/JsvQrcode/BrowserQrcode.vue}
- */
-const _sfc_main = {
-  __name: "BrowserQrcode",
-  props: {
-    value: String,
-    size: Number,
-    fgColor: {
-      type: String,
-      default: "#000000"
-    },
-    bgColor: {
-      type: String,
-      default: "#ffffff"
-    },
-    level: {
-      type: String,
-      // ，容错级别，分别是L(7%)、M(15%)、Q(25%)、H(30%),
-      default: "L"
-    },
-    imageSettings: Object
-  },
-  setup(__props) {
-    const props = __props;
-    const renderDocument = window.JsvCode.Dom.RenderDocument ? window.JsvCode.Dom.RenderDocument : window.JsvCode.Dom.BrowserDocument;
-    const convertStr = (str) => {
-      let out = "";
-      for (let i = 0; i < str.length; i++) {
-        let charcode = str.charCodeAt(i);
-        if (charcode < 128) {
-          out += String.fromCharCode(charcode);
-        } else if (charcode < 2048) {
-          out += String.fromCharCode(192 | charcode >> 6);
-          out += String.fromCharCode(128 | charcode & 63);
-        } else if (charcode < 55296 || charcode >= 57344) {
-          out += String.fromCharCode(224 | charcode >> 12);
-          out += String.fromCharCode(128 | charcode >> 6 & 63);
-          out += String.fromCharCode(128 | charcode & 63);
-        } else {
-          i++;
-          charcode = 65536 + ((charcode & 1023) << 10 | str.charCodeAt(i) & 1023);
-          out += String.fromCharCode(240 | charcode >> 18);
-          out += String.fromCharCode(128 | charcode >> 12 & 63);
-          out += String.fromCharCode(128 | charcode >> 6 & 63);
-          out += String.fromCharCode(128 | charcode & 63);
-        }
-      }
-      return out;
-    };
-    const generatePath = (modules, margin = 0) => {
-      const ops = [];
-      modules.forEach((row, y) => {
-        let start = null;
-        row.forEach((cell, x) => {
-          if (!cell && start !== null) {
-            ops.push(
-              `M${start + margin} ${y + margin}h${x - start}v1H${start + margin}z`
-            );
-            start = null;
-            return;
-          }
-          if (x === row.length - 1) {
-            if (!cell) {
-              return;
-            }
-            if (start === null) {
-              ops.push(`M${x + margin},${y + margin} h1v1H${x + margin}z`);
-            } else {
-              ops.push(
-                `M${start + margin},${y + margin} h${x + 1 - start}v1H${start + margin}z`
-              );
-            }
-            return;
-          }
-          if (cell && start === null) {
-            start = x;
-          }
-        });
-      });
-      return ops.join("");
-    };
-    const getImageSettings = (props2) => {
-      const imageSettings = props2.imageSettings;
-      const size = props2.size;
-      if (!imageSettings) {
-        return null;
-      }
-      const w = imageSettings.width;
-      const h = imageSettings.height;
-      const x = !imageSettings.x ? size / 2 - w / 2 : imageSettings.x;
-      const y = !imageSettings.y ? size / 2 - h / 2 : imageSettings.y;
-      return { x, y, h, w };
-    };
-    const renderQrcode = () => {
-      const qrcode = QRCode(convertStr(props.value), {
-        errorCorrectLevel: QRCode.ErrorCorrectLevel[props.level]
-      });
-      const cells = qrcode.modules;
-      if (cells === null) {
-        return null;
-      }
-      const margin = 2;
-      const numCells = cells.length + margin * 2;
-      const propsData = {
-        value: props.value,
-        size: props.size,
-        level: props.level,
-        bgColor: props.bgColor,
-        fgColor: props.fgColor,
-        imageSettings: props.imageSettings
-      };
-      const calculatedImageSettings = getImageSettings(propsData);
-      if (props.imageSettings) {
-        imageStyle = {
-          backgroundImage: `url(${props.imageSettings.src})`,
-          height: calculatedImageSettings.h,
-          width: calculatedImageSettings.w,
-          left: calculatedImageSettings.x + margin,
-          top: calculatedImageSettings.y + margin
-        };
-      } else {
-        imageStyle = {};
-      }
-      const fgPath = generatePath(cells, margin);
-      return { numCells, fgPath };
-    };
-    const svgRoot = ref(null);
-    let imageStyle = null;
-    const qrcodeRes = renderQrcode();
-    onMounted(() => {
-      svgRoot.value.jsvGetProxyView().RegisterOnProxyReady(() => {
-        const root = svgRoot.value.jsvGetProxyView().HtmlGetElement();
-        const doc = renderDocument;
-        const svg = doc.createElementNS("http://www.w3.org/2000/svg", "svg");
-        svg.setAttribute("type", "qrcode");
-        svg.setAttribute("shapeRendering", "crispEdges");
-        svg.setAttribute("height", props.size);
-        svg.setAttribute("width", props.size);
-        svg.setAttribute(
-          "viewBox",
-          "0 0 " + qrcodeRes.numCells + " " + qrcodeRes.numCells
-        );
-        const path1 = doc.createElementNS("http://www.w3.org/2000/svg", "path");
-        path1.setAttribute("fill", props.bgColor);
-        path1.setAttribute(
-          "d",
-          "M0,0 h" + qrcodeRes.numCells + "v" + qrcodeRes.numCells + "H0z"
-        );
-        const path2 = doc.createElementNS("http://www.w3.org/2000/svg", "path");
-        path2.setAttribute("fill", props.fgColor);
-        path2.setAttribute("d", qrcodeRes.fgPath);
-        svg.appendChild(path1);
-        svg.appendChild(path2);
-        root.appendChild(svg);
-      });
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", null, [
-        createElementVNode("div", {
-          ref_key: "svgRoot",
-          ref: svgRoot,
-          style: { width: 100, height: 100 }
-        }, null, 512),
-        createElementVNode("div", {
-          style: normalizeStyle(unref(imageStyle))
-        }, null, 4)
-      ]);
-    };
-  }
-};
-
-export { _sfc_main as default };

package/bin/browser/BrowserSpray.vue.mjs

@@ -1,56 +0,0 @@
-import { Forge } from '@shijiu/jsview/dom/jsv-forge-define';
-import { openBlock, createElementBlock, normalizeStyle } from 'vue';
-import { _ as _export_sfc } from '../export-sfc.mjs';
-
-/* 
- + @file {@link file://./../../../../utils/JsViewVueWidget/JsvSpray/BrowserSpray.vue}
- */
-const _sfc_main = {
-  props: {
-    pointRes: {
-      type: String,
-      required: true
-    },
-    sprayStyle: {
-      type: Object,
-      required: true
-    }
-  },
-  data() {
-    return {
-      viewId: -1
-    };
-  },
-  computed: {
-    viewWidth() {
-      return this.sprayStyle.deltaWidth === 0 ? 1 : this.sprayStyle.deltaWidth * 2;
-    },
-    viewHeight() {
-      return this.sprayStyle.deltaHeight === 0 ? 1 : this.sprayStyle.deltaHeight * 2;
-    }
-  },
-  mounted() {
-    const viewSize = {
-      width: this.viewWidth,
-      height: this.viewHeight
-    };
-    this.viewId = Forge.sParticleManager.addParticle(
-      this.sprayStyle,
-      this.pointRes,
-      viewSize,
-      this.$refs.element.jsvGetProxyView()
-    );
-  },
-  beforeUnmount() {
-    Forge.sParticleManager.recycleView(this.viewId);
-  }
-};
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("div", {
-    ref: "element",
-    style: normalizeStyle({ width: $options.viewWidth, height: $options.viewHeight })
-  }, null, 4);
-}
-const BrowserSpray = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-
-export { BrowserSpray as default };

package/bin/browser/BrowserTextureAnim.vue.mjs

@@ -1,322 +0,0 @@
-import { openBlock, createElementBlock } from 'vue';
-import { _ as _export_sfc } from '../export-sfc.mjs';
-
-/* 
- + @file {@link file://./../../../../utils/JsViewVueWidget/JsvTextureAnim/BrowserTextureAnim.vue}
- */
-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;
-const _sfc_main = {
-  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 / 1e3}s ${this.easing} ${this.delay / 1e3}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;
-          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;
-      for (let i = cssRulesRef.length - 1; i >= 0; i--) {
-        if (cssRulesRef[i].name === animName) {
-          styleSheetRef.deleteRule(i);
-          break;
-        }
-      }
-    }
-  },
-  mounted() {
-    if (this.animation) {
-      this.insertKeyframe("@keyframes " + this.animName + " " + this.animation);
-    }
-    this.$refs.root.jsvGetProxyView().RegisterOnProxyReady(() => {
-      const root = this.$refs.root.jsvGetProxyView().HtmlGetElement();
-      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 = [];
-  }
-};
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("div", { ref: "root" }, null, 512);
-}
-const BrowserTextureAnim = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-
-export { BrowserTextureAnim as default };