@shijiu/jsview-vue 2.1.340-test.0 → 2.1.362-test.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shijiu/jsview-vue",
-  "version": "2.1.340-test.0",
+  "version": "2.1.362-test.0",
   "license": "MIT",
   "repository": "system/jsview-framework",
   "author": "mengxk",

package/tools/config/rollup.config.mjs

@@ -30,13 +30,13 @@ function getManualChunks(id) {
   if(path.relative(projectDir, id) == 'node_modules/.cache/_virtual/_plugin-vue_export-helper.mjs') { // 解决非显示字符问题
     return 'export-sfc';
   } else if(path.basename(id).startsWith('JsvCommon')) { // 解决Browser和Native同时引用问题。
-    return 'jsview-common';
+    return 'jsview-vue-common';
   }
 }
 
 function getChunkFileName(chunkInfo) {
-  if (chunkInfo.name == 'jsview-common') {
-    return 'jsview-common.mjs'
+  if (chunkInfo.name == 'jsview-vue-common') {
+    return 'jsview-vue-common.mjs'
   } else if (chunkInfo.name.startsWith('Browser')) {
     return 'browser/[name].mjs'
   } else if (chunkInfo.name == 'export-sfc') {

package/tools/jsview-vue-build.mjs

@@ -1,73 +1,20 @@
 #!/usr/bin/env node
 'use strict';
 
-import childProcess from 'node:child_process';
 import fs from 'node:fs';
 import path from 'path';
 import url from 'url';
-
-function checkNodeVersion(minMajorVersion = 16)
-{
-  const versions = process.version.replace('v', '').split('.');
-  const [majorVersion, minorVersion, patchVersion] = versions;
-
-  console.info(`Node version: v${majorVersion}.${minorVersion}.${patchVersion}`);
-  if (majorVersion < minMajorVersion) {
-    console.error('Error: Node version is too low! Please upgrade your Node.js first.');
-    process.exit(1)
-  }
-}
-
-function execCommand(cmdline)
-{
-  console.info('Run [' + cmdline + ']... ');
-  try {
-    const ret = childProcess.execSync(cmdline, { stdio: 'inherit' });
-    if (ret) {
-      return ret.toString();
-    }
-    return null;
-  } catch (err) {
-    console.error('Error: ', err);
-    process.exit(1);
-  }
-}
-
-function parseArguments()
-{
-  const options = {
-    withoutNpmInstall: false,
-  };
-
-  // arg0: node
-  // arg1: script.js
-  const arguList = process.argv.slice(2);
-  for (const argu of arguList) {
-    if (argu == '--without-npm-install' || argu == '-n') {
-      options.withoutNpmInstall = true;  
-    } else if (argu == '--help' || argu == '-h') {
-      console.log('Usages:')
-      console.log('')
-      console.log('  -n | --without-npm-install: Ignore to run npm install.')
-      console.log('')
-      console.log('  -h | --help:                Print help usages.')
-      console.log('')
-      process.exit(0)
-    } else {
-      console.error('Failed to parse argument: ' + argu)
-      process.exit(1)
-    }
-  }
-
-  return options
-}
-
-async function main()
+import {
+  checkNodeVersion,
+  execCommand,
+  getNpmRegistry,
+  parseArguments,
+} from '../../../@shijiu/jsview/tools/jsview-common.mjs';
+
+async function main(argv)
 {
   checkNodeVersion();
 
-  const options = parseArguments();
-
   const currJsFilePath = url.fileURLToPath(import.meta.url)
   const jsviewVueDir = path.resolve(currJsFilePath, '../../') // jsview-framework/@shijiu/jsview-vue
 
@@ -80,9 +27,9 @@ async function main()
     // vue + vite
     'vue@3.2.45',
     'vue-router@4.1.6',
-    '@vitejs/plugin-vue@5.0.3 ',
+    '@vitejs/plugin-vue@4.0.0',
     'typescript@4.9.3',
-    'vite@5.0.11',
+    'vite@4.0.0',
     'vue-tsc@1.0.11',
 
     // jsview-vue dep
@@ -95,12 +42,13 @@ async function main()
   let batchCommand = []
 
   fs.rmSync(`${jsviewVueDir}/bin`, { recursive: true, force: true });
-  if(options.withoutNpmInstall == false
+  if(!argv.withoutNpmInstall
   || fs.existsSync(`${jsviewVueDir}/node_modules`) == false) {
+    const registry = getNpmRegistry();
     fs.rmSync(`${jsviewVueDir}/node_modules`, { recursive: true, force: true });
     batchCommand = [
-      'npm install',
-      `npm install --no-save ${noSavePackages}`,
+      `npm install --registry=${registry}`,
+      `npm install --registry=${registry} --force --no-save ${noSavePackages}`,
       `node ${jsviewVueDir}/node_modules/@shijiu/jsview/tools/jsview-post-install.mjs --framework=vue`,
     ];
   }
@@ -114,7 +62,7 @@ async function main()
     execCommand(`cd ${jsviewVueDir} && ${command}`);
   }
 
-  if(options.withoutNpmInstall == false) {
+  if(!argv.withoutNpmInstall) {
     fs.rmSync(`${jsviewVueDir}/node_modules`, { recursive: true, force: true });
     fs.rmSync(`${jsviewVueDir}/package-lock.json`, { recursive: true, force: true });
   }
@@ -122,4 +70,10 @@ async function main()
   console.info('Done...');
 }
 
-main();
+const requiredUsages = {
+};
+const optionalUsages = {
+  '-n | --without-npm-install': 'Ignore to run npm install.',
+};
+const argv = parseArguments(requiredUsages, optionalUsages, false);
+main(argv);

package/utils/JsViewPlugin/JsvAudio/JsvAudio.vue

@@ -94,9 +94,11 @@ const props = defineProps({
   },
 });
 
-let key = "JsvAudio_" + window.JsView?.getJsContextId?.() + "_"  + getKeyToken();
+//同进程起不同版本的core时, pluginMananger是一个对象, 因此java端的JsvAudio是同一个map, 所以要加jsviewCoreInfo避免id重复导致bug
+const jsviewCoreInfo = window.JsView?.getJsContextId?.() + "_" + window.JsView.CodeRevision
+let key = "JsvAudio_" + jsviewCoreInfo + "_"  + getKeyToken();
 if (props.playerKey) {
-  key = props.playerKey + "_" + window.JsView?.getJsContextId?.();
+  key = props.playerKey + "_" + jsviewCoreInfo;
 }
 console.log("player key:" + key);
 const audio = sAudioManager.createAudio(key);

package/utils/JsViewPlugin/JsvAudio/version.js

@@ -7,9 +7,9 @@ let PluginInfo = {
     // downloadUrl:"http://192.168.0.63:8080/plugin/JsvAudio-164.zip", //插件下载地址
     packageName: "com.qcode.jsvaudio",
     name: "音频插件",
-    version: "1.0.26",  //插件需要的版本号
-    versionCodeMin: 26,
-    versionCodeMax: 26,
+    version: "1.0.27",  //插件需要的版本号
+    versionCodeMin: 27,
+    versionCodeMax: 27,
     bridgeName: "jsvAudioBridge", //插件bridge注册到jsview的名称
     className: "com.qcode.jsvaudio.JsvAudio",  //插件初始化类名称
     initMethod: "createInstance",   //插件初始化方法

package/utils/JsViewPlugin/JsvAudio/version.mjs

@@ -7,9 +7,9 @@ let PluginInfo = {
   // downloadUrl:"http://192.168.0.63:8080/plugin/JsvAudio-164.zip", //插件下载地址
   packageName: "com.qcode.jsvaudio",
   name: "音频插件",
-  version: "1.0.26",  //插件需要的版本号
-  versionCodeMin: 26,
-  versionCodeMax: 26,
+  version: "1.0.27",  //插件需要的版本号
+  versionCodeMin: 27,
+  versionCodeMax: 27,
   bridgeName: "jsvAudioBridge", //插件bridge注册到jsview的名称
   className: "com.qcode.jsvaudio.JsvAudio",  //插件初始化类名称
   initMethod: "createInstance",   //插件初始化方法

package/utils/JsViewVueTools/JsvTextureStore/CanvasTexture/CanvasTexture.ts

@@ -1,4 +1,4 @@
-import ForgeHandles from "../../../JsViewVueTools/ForgeHandles";
+import ForgeHandles from "../../../JsViewVueTools/ForgeHandles.js";
 import { TextureBase } from "../Texture"
 import * as Constants from "./CommandList"
 import { RectPath, CirclePath, CustomPath } from "./Path"

package/utils/JsViewVueWidget/JsvApic/JsvBrowserApicLib/PartLoopTool.js

@@ -82,7 +82,7 @@ export class PartLoopTool extends LoopToolBase {
     this.mTotalFrameNum = frameNum;
     this.mValid = this.updateLoop();
     if (!this.mValid) {
-      Log.e(TAG, "PartLoopTool init loop info error." + this.mLoopInfo.toString());
+      console.log("PartLoopTool init loop info error." + this.mLoopInfo.toString());
     } else {
       this.mNextFrameIndex = this.mCurLoopStartFrame;
     }

package/utils/JsViewVueWidget/JsvPreload/BrowserPreload.vue

@@ -7,20 +7,20 @@ const props = defineProps({
   onPreloadDone: Function, // 预加载完成回调
   onDownloadDone: Function, // 预下载完成回调
   onPreloading: Function,
-})
+});
 
 const loadViewList = reactive({
   preloadViewList: [],
-  downloadViewList: []
-})
+  downloadViewList: [],
+});
 // 记录传入的preload为null的数量，由于vue不支持在子组件修改props值，所有在删除值为null时，需要++，这样才能保证与传入数据的length相等从而触发回调
 let preloadIsNullNum = 0;
 let downloadIsNullNum = 0;
 
-let preloadResultMap = {}
-let downloadResultMap = {}
-let downloadUrlList = []
-let unmountStatus = { unmount: false }
+let preloadResultMap = {};
+let downloadResultMap = {};
+let downloadUrlList = [];
+let unmountStatus = { unmount: false };
 let preloadStateList = null;
 let downloadStateList = null;
 
@@ -57,13 +57,16 @@ const getPreloadList = () => {
         loadedNum += item ? 1 : 0;
       });
       props.onPreloading?.(loadedNum / preloadStateList.length);
-      if (props.onPreloadDone && loadedNum + preloadIsNullNum == 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);
@@ -104,31 +107,22 @@ const getDownloadList = () => {
           downloadNum += item ? 1 : 0;
         });
         if (downloadNum + downloadIsNullNum == downloadStateList.length) {
-          props.onDownloadDone?.(
-            downloadUrlList,
-            downloadResultMap
-          );
+          props.onDownloadDone?.(downloadUrlList, downloadResultMap);
         }
       }
     };
     image.src = item.url;
   });
-}
+};
 
-if (props.preloadList) {
-  getPreloadList();
-}
-if (props.downloadList) {
-  getDownloadList();
-}
 watchEffect(() => {
   if (props.preloadList) {
     console.log("JsvPreload: update preloadList");
-    preloadIsNullNum = 0
+    preloadIsNullNum = 0;
     preloadResultMap = {};
     getPreloadList();
   }
-})
+});
 watchEffect(() => {
   if (props.downloadList) {
     console.log("JsvPreload: update downloadList");
@@ -137,16 +131,14 @@ watchEffect(() => {
     downloadUrlList = [];
     getDownloadList();
   }
-})
+});
 
 onBeforeUnmount(() => {
   unmountStatus.unmount = true;
-})
+});
 </script>
 
 <template>
   <!-- 保证该组件不描画任何东西，只是为了触发onload，让网页自行下载图片 -->
   <div v-if="!preloadList"></div>
 </template>
-
-

package/utils/JsViewVueWidget/JsvPreload/JsvPreload.vue

@@ -78,11 +78,11 @@ const props = defineProps({
   onPreloading: Function,
   onPreloadDone: Function,
   onDownloadDone: Function,
-})
+});
 const loadViewList = reactive({
   preloadViewList: [],
-  downloadViewList: []
-})
+  downloadViewList: [],
+});
 let preloadStateList = [];
 let downloadStateList = [];
 let downloadResultMap = {};
@@ -113,7 +113,7 @@ const _releasePreloadView = () => {
     loadViewList.preloadViewList = [];
     preloadStateList = [];
   }
-}
+};
 const _releaseDownloadView = () => {
   if (window.JsView) {
     if (loadViewList.downloadViewList.length > 0) {
@@ -132,11 +132,11 @@ const _releaseDownloadView = () => {
   }
   loadViewList.downloadViewList = [];
   downloadStateList = [];
-}
+};
 const _releaseForgeView = () => {
   _releasePreloadView();
   _releaseDownloadView();
-}
+};
 
 const _checkPreload = () => {
   let loadedNum = 0;
@@ -152,7 +152,7 @@ const _checkPreload = () => {
   ) {
     props.onPreloadDone(preloadResultMap);
   }
-}
+};
 
 const _getPreloadViewIdList = () => {
   if (!props.preloadList) {
@@ -210,19 +210,16 @@ const _getPreloadViewIdList = () => {
       preloadStateList[index] = true; // 无法创建texture的图片先认为加载完成
       return;
     }
-    const callback_token = texture.RegisterLoadImageCallback(
-      null,
-      (params) => {
-        console.log(`preload succeed ${image_url}`, params);
-        preloadStateList[index] = true;
-        preloadResultMap[item.url] = {
-          width: params.width,
-          height: params.height,
-        };
-        console.log(`preload succeed ${item.url}, params:${params}`);
-        _checkPreload();
-      }
-    );
+    const callback_token = texture.RegisterLoadImageCallback(null, (params) => {
+      console.log(`preload succeed ${image_url}`, params);
+      preloadStateList[index] = true;
+      preloadResultMap[item.url] = {
+        width: params.width,
+        height: params.height,
+      };
+      console.log(`preload succeed ${item.url}, params:${params}`);
+      _checkPreload();
+    });
     texture.EnableBackgroundLoad();
     const texture_setting = new Forge.ExternalTextureSetting(texture);
     const preload_view = new Forge.PreloadView(texture_setting);
@@ -232,20 +229,20 @@ const _getPreloadViewIdList = () => {
       callToken: callback_token,
     };
   });
-}
+};
 
 const _checkDownload = () => {
-  let loadedNum = 0
+  let loadedNum = 0;
   downloadStateList.forEach((state) => {
     loadedNum = state ? ++loadedNum : loadedNum;
   });
-  if (props.onDownloadDone && loadedNum === downloadStateList.length - downloadIsNullNum) {
-    props.onDownloadDone(
-      downloadStateList,
-      downloadResultMap
-    );
+  if (
+    props.onDownloadDone &&
+    loadedNum === downloadStateList.length - downloadIsNullNum
+  ) {
+    props.onDownloadDone(downloadStateList, downloadResultMap);
   }
-}
+};
 
 const _getDownloadViewIdList = () => {
   if (!props.downloadList) {
@@ -282,9 +279,7 @@ const _getDownloadViewIdList = () => {
       item.getImageSize
     );
     if (!texture) {
-      console.error(
-        "Error: Down view build texture failed for " + image_url
-      );
+      console.error("Error: Down view build texture failed for " + image_url);
       // 无法创建texture的图片先认为加载完成
       downloadStateList[index] = "invalid";
       return;
@@ -317,12 +312,9 @@ const _getDownloadViewIdList = () => {
       callToken: callback_token,
     };
   });
-}
-
+};
 
 _releaseForgeView();
-_getPreloadViewIdList();
-_getDownloadViewIdList();
 
 watchEffect(() => {
   if (props.preloadList) {
@@ -332,36 +324,42 @@ watchEffect(() => {
     _getPreloadViewIdList();
     preloadToken++;
   }
-})
+});
 watchEffect(() => {
   if (props.downloadList) {
     console.log("JsvPreload: update downloadList");
-    downloadIsNullNum = 0
+    downloadIsNullNum = 0;
     _releaseDownloadView();
     _getDownloadViewIdList();
     downloadToken++;
   }
-})
+});
 
 onBeforeUnmount(() => {
   _releaseForgeView();
-})
-
-
+});
 </script>
-  
+
 <template>
   <div>
     <div :key="'preload_' + preloadToken">
-      <div v-for="item in loadViewList.preloadViewList" :key="item.viewId" :id="item.viewId">
+      <div
+        v-for="item in loadViewList.preloadViewList"
+        :key="item.viewId"
+        :id="item.viewId"
+      >
         <div v-if="item.viewId" :data-jsv-vw-innerview="item.viewId"></div>
       </div>
     </div>
 
     <div :key="'download_' + downloadToken">
-      <div v-for="item in loadViewList.downloadViewList" :key="item.viewId" :id="item.viewId">
+      <div
+        v-for="item in loadViewList.downloadViewList"
+        :key="item.viewId"
+        :id="item.viewId"
+      >
         <div v-if="item.viewId" :data-jsv-vw-innerview="item.viewId"></div>
       </div>
     </div>
   </div>
-</template>
+</template>

package/utils/JsViewVueWidget/JsvSpriteAnim/JsvSpriteAnim.vue

@@ -322,7 +322,7 @@ const op = {
       indexArray = "all"; // 默认为全展示
     }
     if (!loopSet) {
-      loopSet = "";
+      loopSet = props.loop;
     }
     if (!duration) {
       duration = props.duration;

package/utils/JsViewVueWidget/JsvSwiper3D/JsvSwiper.vue

@@ -56,8 +56,8 @@
 </template>
 
 <script setup>
-import { reactive, shallowRef } from "vue";
-import { getKeyFramesGroup } from '../../JsViewVueTools/JsvDynamicKeyFrames.js'
+import { reactive, shallowRef,onBeforeUnmount } from "vue";
+import { getKeyFramesGroup } from "../../JsViewVueTools/JsvDynamicKeyFrames.js";
 
 const props = defineProps({
   dispNumber: { type: Number, require: true },
@@ -159,6 +159,9 @@ for (let i = midIndex - 1; i >= 0; i--) {
   let startPosX = leftArray[i + 1].left + leftArray[i + 1].width / 2;
   leftArray[i].left = startPosX - space.value - leftArray[i].width / 2;
 }
+//确定动画距离
+let aniDistance = leftArray[midIndex].left - leftArray[midIndex - 1].left;
+
 //右边 left
 for (let i = midIndex + 1; i < items.length; i++) {
   let startPosX = leftArray[i - 1].left + leftArray[i - 1].width / 2;
@@ -293,7 +296,7 @@ const onKeyDown = (ev) => {
 let styleShell = getKeyFramesGroup();
 let slideToLeftA = `@keyframes slideToLeftA {
             from {
-              transform: translate3d(${-150}, 0, 0);
+              transform: translate3d(${-aniDistance}, 0, 0);
             }
             to {
               transform: translate3d(0, 0, 0);
@@ -304,7 +307,7 @@ styleShell.insertRule(slideToLeftA);
 //左边动画B
 let slideToLeftB = `@keyframes slideToLeftB {
             from {
-              transform: translate3d(${-150}, 0, 0);
+              transform: translate3d(${-aniDistance}, 0, 0);
             }
             to {
               transform: translate3d(0, 0, 0);
@@ -316,7 +319,7 @@ styleShell.insertRule(slideToLeftB);
 //右边动画A
 let slideToRightA = `@keyframes slideToRightA {
             from {
-              transform: translate3d(${150}, 0, 0);
+              transform: translate3d(${aniDistance}, 0, 0);
             }
             to {
               transform: translate3d(0, 0, 0);
@@ -327,7 +330,7 @@ styleShell.insertRule(slideToRightA);
 //右边动画B
 let slideToRightB = `@keyframes slideToRightB {
             from {
-              transform: translate3d(${150}, 0, 0);
+              transform: translate3d(${aniDistance}, 0, 0);
             }
             to {
               transform: translate3d(0, 0, 0);
@@ -338,7 +341,9 @@ styleShell.insertRule(slideToRightB);
 //缩小动画A
 let lowerA = `@keyframes lowerA {
             from {
-              transform: scale3d(1.1, 1.1, 1);
+              transform: scale3d(${1 + props.sideScale},${
+  1 + props.sideScale
+}, 1);
             }
             to {
               transform: scale3d(1, 1, 1);
@@ -348,7 +353,9 @@ styleShell.insertRule(lowerA);
 //缩小动画B
 let lowerB = `@keyframes lowerB {
             from {
-              transform: scale3d(1.1, 1.1, 1);
+              transform: scale3d(${1 + props.sideScale},${
+  1 + props.sideScale
+}, 1);
             }
             to {
               transform: scale3d(1, 1, 1);
@@ -358,7 +365,9 @@ styleShell.insertRule(lowerB);
 //放大动画A
 let biggerA = `@keyframes biggerA {
             from {
-              transform: scale3d(${1 / 1.1},${1 / 1.1} , 1);
+              transform: scale3d(${1 / (1 + props.sideScale)},${
+  1 / (1 + props.sideScale)
+} , 1);
             }
             to {
               transform: scale3d(1, 1, 1);
@@ -368,7 +377,9 @@ styleShell.insertRule(biggerA);
 //放大动画B
 let biggerB = `@keyframes biggerB {
             from {
-              transform: scale3d(${1 / 1.1},${1 / 1.1} , 1);
+              transform: scale3d(${1 / (1 + props.sideScale)},${
+  1 / (1 + props.sideScale)
+} , 1);
             }
             to {
               transform: scale3d(1, 1, 1);
@@ -379,7 +390,7 @@ styleShell.insertRule(biggerB);
 //第0项左移动画A
 let slideToLeft0A = `@keyframes slideToLeft0A {
       from {
-              transform: translate3d(${150}, 0, 0);
+              transform: translate3d(${aniDistance}, 0, 0);
             }
             to {
               transform: translate3d(0, 0, 0);
@@ -389,7 +400,7 @@ styleShell.insertRule(slideToLeft0A);
 //第0项左移动画B
 let slideToLeft0B = `@keyframes slideToLeft0B {
       from {
-              transform: translate3d(${150}, 0, 0);
+              transform: translate3d(${aniDistance}, 0, 0);
             }
             to {
               transform: translate3d(0, 0, 0);
@@ -400,7 +411,7 @@ styleShell.insertRule(slideToLeft0B);
 //页面最后一项右移动画A
 let slideToRight0A = `@keyframes slideToRight0A {
       from {
-              transform: translate3d(${-150}, 0, 0);
+              transform: translate3d(${-aniDistance}, 0, 0);
             }
             to {
               transform: translate3d(0, 0, 0);
@@ -411,7 +422,7 @@ styleShell.insertRule(slideToRight0A);
 //页面最后一项右移动画B
 let slideToRight0B = `@keyframes slideToRight0B {
       from {
-              transform: translate3d(${-150}, 0, 0);
+              transform: translate3d(${-aniDistance}, 0, 0);
             }
             to {
               transform: translate3d(0, 0, 0);
@@ -447,6 +458,20 @@ const onActionObj = {
   onFocus: props.onFocus,
   onBlur: props.onBlur,
 };
+onBeforeUnmount(()=>{
+  styleShell.removeRule('slideToLeftA');
+  styleShell.removeRule('slideToLeftB');
+  styleShell.removeRule('slideToRightA')
+  styleShell.removeRule('slideToRightB')
+  styleShell.removeRule('slideToLeft0A')
+  styleShell.removeRule('slideToLeft0B')
+  styleShell.removeRule('slideToRight0A')
+  styleShell.removeRule('slideToRight0B')
+  styleShell.removeRule('lowerA')
+  styleShell.removeRule('lowerB')
+  styleShell.removeRule('biggerA')
+  styleShell.removeRule('biggerB')
+})
 </script>
 
 <style scoped></style>