@shijiu/jsview-vue 2.2.35 → 2.2.128

package/utils/JsViewVueWidget/JsvApic/JsvApic/BrowserApic.vue

@@ -6,14 +6,14 @@
  * @Description: file content
 -->
 <script setup>
-import {
-  Viewer,
-  WebpData,
-  GifData
-} from "../JsvBrowserApicLib/BrowserApicLib";
+import { Viewer, WebpData, GifData } from "../JsvBrowserApicLib/BrowserApicLib";
 import { LoopType } from "../JsvCommonLoopToolBase";
 import { onMounted, shallowRef } from "vue";
 
+const renderDocument = window.JsvCode.Dom.RenderDocument
+  ? window.JsvCode.Dom.RenderDocument
+  : window.JsvCode.Dom.BrowserDocument;
+
 const loadImage = (url) => {
   return new Promise((resolve, reject) => {
     let xhr = new XMLHttpRequest();
@@ -89,7 +89,7 @@ onMounted(() => {
   let domLayoutView = canvasProxyRef.value.jsvGetProxyView();
   domLayoutView.RegisterOnProxyReady(() => {
     // 制作canvas
-    let canvas = window.originDocument.createElement("canvas");
+    let canvas = renderDocument.createElement("canvas");
     canvas.style.width = props.style.width + "px";
     canvas.style.height = props.style.height + "px";
     domLayoutView.HtmlGetElement().appendChild(canvas);

package/utils/JsViewVueWidget/JsvApic/JsvApic2/BrowserApic2.vue

@@ -6,15 +6,14 @@
  * @Description: file content
 -->
 <script setup>
-import {
-  Viewer,
-  WebpData,
-  GifData
-} from "../JsvBrowserApicLib/BrowserApicLib";
+import { Viewer, WebpData, GifData } from "../JsvBrowserApicLib/BrowserApicLib";
 import { LoopType } from "../JsvCommonLoopToolBase.js";
 import { onMounted, shallowRef } from "vue";
 
 let waitForPlayInfo = null;
+const renderDocument = window.JsvCode.Dom.RenderDocument
+  ? window.JsvCode.Dom.RenderDocument
+  : window.JsvCode.Dom.BrowserDocument;
 
 const loadImage = (url) => {
   return new Promise((resolve, reject) => {
@@ -71,7 +70,7 @@ onMounted(() => {
   let domLayoutView = canvasProxyRef.value.jsvGetProxyView();
   domLayoutView.RegisterOnProxyReady(() => {
     // 制作canvas
-    let canvas = window.originDocument.createElement("canvas");
+    let canvas = renderDocument.createElement("canvas");
     canvas.style.width = props.style.width + "px";
     canvas.style.height = props.style.height + "px";
     domLayoutView.HtmlGetElement().appendChild(canvas);

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

@@ -6,13 +6,17 @@
  * @Description: file content
  */
 
+const renderDocument = window.JsvCode.Dom.RenderDocument
+  ? window.JsvCode.Dom.RenderDocument
+  : window.JsvCode.Dom.BrowserDocument;
+
 class ApicDataBase {
   constructor(arrayBuffer) {
     this.LoopCount = 0;
     this.FrameCount = 0;
     this.Width = 0;
     this.Height = 0;
-    this._Canvas = window.originDocument.createElement("canvas");
+    this._Canvas = renderDocument.createElement("canvas");
     this._Context = this._Canvas.getContext("2d");
     this._DecodedData = null;
     this.decode(arrayBuffer);

package/utils/JsViewVueWidget/JsvFreeMoveActor/ActionRefObject.ts

@@ -1,6 +1,6 @@
 
 
 export default class ActionRefObject {
-    public token: number;
+    public token: number = 0;
     public used: boolean = false;
 }

package/utils/JsViewVueWidget/JsvFreeMoveActor/ActorControl.ts

@@ -18,6 +18,7 @@ class ActorControl {
   private _BindAnim: any;
   private _Callbacks: CallbackManager;
   private _SelfNexusRecv: NexusNode;
+  private _SizeMode: Boolean = false;
 
   private _SharedQuickConditionPackBuilder: ConditionPackBuilder;
   private _SharedQuickActionPackBuilder: ActionPackBuilder;
@@ -33,6 +34,14 @@ class ActorControl {
     this._StatePackBuilder = new StatePackBuilder();
   }
 
+  asSizeMode() {
+    if (this._BindAnim != null) {
+      console.error("error: asSizeMode should call before bindForgeView");
+    } else {
+      this._SizeMode = true;
+    }
+  }
+
   // debugGetAnimId() {
   //   return this._BindAnim?.AnimNativeId;
   // }
@@ -140,6 +149,16 @@ class ActorControl {
     return this._StatePackBuilder;
   }
 
+  getBindedAnim() {
+    this._EnsureAnim();
+    return this._BindAnim;
+  }
+
+  getBindedView() {
+    this._EnsureAnim();
+    return this._BindView;
+  }
+
   _OnEchoEvent(retJson: string) {
     // 遇到layout后仍然会因为新broadcast有动作时，一帧中可能会有多次回调
     let retJsonObject: any = JSON.parse(retJson);
@@ -158,7 +177,10 @@ class ActorControl {
 
   _EnsureAnim() {
     if (!this._BindAnim) {
-      this._BindAnim = new FreeMoveAnimClass(this._OnEchoEvent.bind(this), this._SelfNexusRecv.token);
+      this._BindAnim = new FreeMoveAnimClass(
+        this._OnEchoEvent.bind(this),
+        this._SelfNexusRecv.token,
+        this._SizeMode);
       this._BindView.StartAnimation(this._BindAnim);
     }
   }

package/utils/JsViewVueWidget/JsvFreeMoveActor/ActorState.ts

@@ -1,6 +1,6 @@
 export default class ActorState {
-    public xPos: number;
-    public yPos: number;
-    public xSpd: number;
-    public ySpd: number;
+    public xPos: number = 0;
+    public yPos: number = 0;
+    public xSpd: number = 0;
+    public ySpd: number = 0;
 }

package/utils/JsViewVueWidget/JsvFreeMoveActor/CallbackManager.ts

@@ -8,9 +8,9 @@
 import { StateCmdBuilder } from "./ForgeTypeDefine"
 
 class CallbackInfo {
-  public funcRef: Function; // 回调函数
-  public times: number; // 回调的次数
-  public once: boolean; // 是否单次回调就销毁
+  public funcRef!: Function; // 回调函数
+  public times: number = 0; // 回调的次数
+  public once: boolean = false; // 是否单次回调就销毁
 }
 
 class CallbackManager {
@@ -49,9 +49,9 @@ class CallbackManager {
     }
   }
 
-  public invokeCallback(id: string, actorState: Object, 
-    customDataStr: string | null | undefined, 
-    nexusCustomDataStr:string | null | undefined) {
+  public invokeCallback(id: string, actorState: Object,
+    customDataStr: string | null | undefined,
+    nexusCustomDataStr: string | null | undefined) {
     let callbackObj = this._CallbackMap.get(id);
     if (callbackObj) {
       if (callbackObj.once) {

package/utils/JsViewVueWidget/JsvFreeMoveActor/ForgeTypeDefine.ts

@@ -5,7 +5,7 @@
  * @Description: file content
  */
 
-import { Forge } from "@shijiu/jsview/dom/jsv-forge-define";
+import { Forge } from "@shijiu/jsview/dom/jsv-forge-define.mjs";
 
 // 此文件声明来自engine-js的api和类型声明
 

package/utils/JsViewVueWidget/JsvFreeMoveActor/FreeMoveActor.vue

@@ -7,16 +7,43 @@
 
 <!--
  * 【模块 export 内容】
- * JsvFreeMoveActor：单轴(X 或 Y)运动控制控件，可控制完成单方向的匀速运动和变速运动（抛物运动），
- *               若想进行X和Y轴同时的运动，可以通过运动分解后的两个JsvActorMove进行组合来实现
- *      props说明:
+ * JsvFreeMoveActor/JsvFreeMoveDiv：
+ *          帧动画控制组件，通过control
+ *              .action()  单一运动指令，新指令发生时会冲掉旧指令  
+ *              .condition()  条件设置，有时间维度，X/Y维度
+ *              .state()  状态调整指令
  *
+ *      props说明:
+ *          class: String, 等同于div的class设置(目前未实装，后续支持...)
+ *          style: Object, 等同于div的style设置
+ *                 特别注意: 在sizeMode模式下，非hidden，控制的是background/image的展示区域，
+ *                 overflow:hidden时，控制的是剪切区域，展示区域保持最初的width/height
+ *          sizeMode: Boolean, 从控制div左上角坐标的模式改为改为通过div矩形宽高
+ *                    (指令控制右下角坐标，实现对[0,0]->[右下角x,y]的矩形的宽高调整，另外，不支持负坐标)
+ *      expose说明:
+ *          control: Object 控制器句柄，具体参考 ActorControl
 -->
 <script setup>
 import ActControl from "./ActorControl.ts";
 import { shallowRef, onMounted } from "vue";
 
 const props = defineProps({
+  // div的style设置,
+  // 其中top, left会作用于父节点，其余内容作用于子节点
+  // width和height在size模式下为初始尺寸
+  // 例如backgroundColor/backgroundImage/overflowHidden
+  style: {
+    type: Object,
+    default: {},
+  },
+
+  // 动画转而控制width/height，而不是x,y
+  sizeMode: {
+    default: false,
+    type: Boolean,
+  },
+
+  // Deprecated
   // 设置给父节点，动画节点必须top/left为0, 以保证PC端模拟通过style直接获取当前位置信息的逻辑能通过
   top: {
     default: 0,
@@ -27,7 +54,9 @@ const props = defineProps({
     type: Number,
   },
 
-  // 设置给实际的动画节点
+  // Deprecated
+  // 设置给实际的动画节点, 在size模式下为初始尺寸
+  // 可能会被style.width, style.height替代
   width: {
     default: 0,
     type: Number,
@@ -40,9 +69,13 @@ const props = defineProps({
 
 let mainDivRef = shallowRef(null);
 let controller = new ActControl();
+if (props.sizeMode) {
+  // 启用size模式
+  controller.asSizeMode();
+}
 
 onMounted(() => {
-  controller.bindForgeView(mainDivRef.value.jsvGetProxyView());
+  controller.bindForgeView(mainDivRef.value.jsvGetProxyView(true));
 });
 
 defineExpose({
@@ -53,17 +86,18 @@ defineExpose({
 <template>
   <div
     :style="{
-      top: props.top,
-      left: props.left,
+      top: props.style.top ? props.style.top : props.top,
+      left: props.style.left ? props.style.left : props.left,
     }"
   >
     <div
       ref="mainDivRef"
       :style="{
-        top: 0,
-        left: 0,
         width: props.width,
         height: props.height,
+        ...props.style,
+        top: 0,
+        left: 0,
       }"
     >
       <slot></slot>

package/utils/JsViewVueWidget/JsvFreeMoveActor/SetAction.ts

@@ -479,6 +479,30 @@ class ActorPackBuilder {
     return CmdPackBuilder.InitActCmdPack(this._SpeedKeeps, this._AccKeeps, this._NexusRecv?.token, cmdList);
   }
 
+  /**
+   * ackMovementSync
+   * 只能放在 movementSync 的then中，用于将Sync同步信息按比例转化成
+   * (注意): 如果触发链条上有自己发出的信息，则将不再产生动作，规避循环触发
+   * 
+   * @param {int} left  运动识别区域的left, 可以为负
+   * @param {int} top  运动识别区域的top, 可以为负
+   * @param {int} right  运动识别区域的right, 可以为负，必须大于left
+   * @param {int} bottom  运动识别区域的bottom, 可以为负，必须大于bottom
+   * @param {int} xyEnable  x,y是否都触发, 0b01对应x, 0b10对应y, 可以或运算在一起
+   * @param {int} syncType 换算公式: 
+   *                        1: 正比公式:selfPercent = givenPercent  
+   *                        2: 反比公式:selfPercent = (1 - givenPercent)
+   */
+  ackMovementSync(left: number, top: number, right: number, bottom: number, xyEnable: number, syncType: number) {
+    if (!this._BasicPreProcess("ackMovementSync")) {
+      return;
+    }
+
+    let cmdList: Array<Object> = [];
+    cmdList.push(ActionCmdBuilder.AckMovementSync(left, top, right, bottom, xyEnable, syncType));
+    return CmdPackBuilder.InitActCmdPack(this._SpeedKeeps, this._AccKeeps, this._NexusRecv?.token, cmdList);
+  }
+
   _BuildAccelOnPole(
     builderThis: ActorPackBuilder,
     cmdList: Array<Object>,

package/utils/JsViewVueWidget/JsvFreeMoveActor/SetCondition.ts

@@ -88,7 +88,7 @@ class ConditionPackBuilder {
     return this._BuildPack(ConditionSetBuilder.WallPosition(direction, xPosition, yPosition, this._CommonInfo));
   }
 
-  boxPosition(left: UNumber, top: UNumber, right: UNumber, bottom: UNumber): object | null {
+  boxPosition(left: UNumber, top: UNumber, right: UNumber, bottom: UNumber): any {
     if (!this._CheckCommonInfo()) {
       return null;
     }
@@ -277,6 +277,11 @@ class ConditionPackBuilder {
     return this._BuildPack(ConditionSetBuilder.OnFlingDrop(this._CommonInfo, this._ContorlSlefNexus.token));
   }
 
+  /**
+   * touchCount
+   * 当touchDown时，Count会++，用于解决多次touchDown引发的时序问题
+   * 当native的count计数等于给定的参数设定的count时，触发condition
+   */
   touchCount(count: number) {
     if (!this._CheckCommonInfo()) {
       return null;
@@ -285,6 +290,50 @@ class ConditionPackBuilder {
     return this._BuildPack(ConditionSetBuilder.TouchCount(this._CommonInfo, count));
   }
 
+  /**
+   * onMovement
+   * 当FreeMove块移动时，移动了给定的距离值后触发条件, 给定的距离值由sensitivity定义
+   * 
+   * @param {float} xSensitivity x轴的敏感度设置，表示移动了多少像素时就触发条件, 最小值为1
+   * @param {float} ySensitivity y轴的敏感度设置，表示移动了多少像素时就触发条件, undefined时等于xSensitivity
+   * @param {int} xyEnables x,y两轴哪个生效, 0b1 为x, 0b10 为y, 默认为都enable
+   */
+  onMovement(xSensitivity: number,
+    ySensitivity: number | undefined = undefined,
+    xyEnables: number | undefined = undefined) {
+    if (!this._CheckCommonInfo()) {
+      return null;
+    }
+    this._CommonInfoValid = false;
+
+    if (!xSensitivity || xSensitivity < 1) {
+      xSensitivity = 1;
+    }
+
+    if (typeof ySensitivity == "undefined") {
+      ySensitivity = xSensitivity;
+      xyEnables = 0b11;
+    }
+
+    if (typeof xyEnables == "undefined") {
+      xyEnables = 0b11;
+    }
+
+    return this._BuildPack(ConditionSetBuilder.OnMovement(
+      this._CommonInfo,
+      xSensitivity, ySensitivity, xyEnables));
+  }
+
+  movementSync(nexusRef: NexusNode) {
+    if (!this._CheckCommonInfo()) {
+      return null;
+    }
+    this._CommonInfoValid = false;
+    return this._BuildPack(ConditionSetBuilder.MovementSyncNexus(this._CommonInfo,
+      nexusRef?.token ? nexusRef.token : 0,
+    ));
+  }
+
   _CheckCommonInfo(): boolean {
     if (!this._CommonInfoValid) {
       console.error("Error: must call from new conditoin()");

package/utils/JsViewVueWidget/JsvFreeMoveActor/SetState.ts

@@ -1,6 +1,7 @@
 
 import { StateCmdBuilder, CmdPackBuilder } from "./ForgeTypeDefine"
 import { NexusNode } from "./NexusNode";
+import ActorControl from "./ActorControl";
 
 class StatePackBuilder {
   constructor() {
@@ -99,6 +100,61 @@ class StatePackBuilder {
   fireNexusEvent(nexusRecv: NexusNode, detailEventType: number) {
     return CmdPackBuilder.InitStateCmdPack(StateCmdBuilder.FireNexusEvent(detailEventType, nexusRecv.token));
   }
+
+  /**
+   * setTouchAttractChild
+   * 
+   * 绑定一个子view中的FreeMoveDiv
+   * 当Touch触控到本div时，这个子div会立刻移动到手指按下的位置，并接受焦点
+   * 
+   * @param {ActorControl} otherFreeMoveControl 其他FreeMoveDiv的control对象
+   */
+  setTouchAttractChild(otherFreeMoveControl: ActorControl) {
+    if (otherFreeMoveControl) {
+      let animRef = otherFreeMoveControl.getBindedAnim();
+      return CmdPackBuilder.InitStateCmdPack(StateCmdBuilder.SetTouchAttractChild(animRef));
+    } else {
+      return CmdPackBuilder.InitStateCmdPack(StateCmdBuilder.SetTouchAttractChild(null));
+    }
+  }
+
+  /**
+   * startMovementSync
+   * 
+   * 发出进度同步信号(可以一个FreeMove绑定多个信号发生器，但目前场景估计只需要一个发生器即可)
+   * 计算当前freeMove的postion和运动识别区域的比值
+   * xPercent = (xPos - left) / (right - left)
+   * yPercent = (yPos - top) / (bottom - top)
+   * x和y可以为负数，也可能>100%
+   * 
+   * 当多次调用时，nexusRef相同时，则为更新运动识别区域，nexusRef不同时则为新建信号发起器
+   * 
+   * @param {NexusNode} nexusRef  绑定的nexus句柄，接受者用这个句柄来进行监听
+   * @param {int} left  运动识别区域的left, 可以为负
+   * @param {int} top  运动识别区域的top, 可以为负
+   * @param {int} right  运动识别区域的right, 可以为负，必须大于left
+   * @param {int} bottom  运动识别区域的bottom, 可以为负，必须大于bottom
+   * @param {int} xyEnable  x,y是否都触发, 0b01对应x, 0b10对应y, 可以或运算在一起
+   */
+  startMovementSync(nexusRef: NexusNode, left: number, top: number, right: number, bottom: number, xyEnable: number) {
+    return CmdPackBuilder.InitStateCmdPack(StateCmdBuilder.StartMovementSync(
+      nexusRef?.token ? nexusRef.token : 0,
+      left,
+      top,
+      right,
+      bottom,
+      xyEnable));
+  }
+
+  /*
+   * stopMovementSync
+   * 
+   * 停止由startMovementSync发起的的同步信号
+   * 目前阶段，为关闭所有的信号发起器
+   */
+  stopMovementSync() {
+    return CmdPackBuilder.InitStateCmdPack(StateCmdBuilder.StopMovementSync());
+  }
 }
 
 export default StatePackBuilder;

package/utils/JsViewVueWidget/JsvFreeMoveActor/index.js

@@ -3,6 +3,7 @@ import { ActEventDefine } from "./ForgeTypeDefine.ts"
 import { default as KeepFlags } from "./KeepFlags.ts"
 import JsvEnvBlocker from "./JsvEnvBlocker.vue"
 import { newNexus } from "./NexusNode"
+import { default as ActControlDebug } from "./ActorControl.ts"
 
 let FreeMoveDef = {
     ActEventDefine,
@@ -11,10 +12,12 @@ let FreeMoveDef = {
 
 let FreeMoveFunc = {
     newNexus,
+    ActControlDebug
 }
 
 export {
     JsvFreeMoveActor,
+    JsvFreeMoveActor as JsvFreeMoveDiv,
     JsvEnvBlocker,
     FreeMoveDef,
     FreeMoveFunc

package/utils/JsViewVueWidget/JsvMaskClipDiv.vue

@@ -14,6 +14,11 @@
 <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: {
     class: {
@@ -112,7 +117,7 @@ export default {
       this.$refs.innerViewDiv
         ?.jsvGetProxyView(true)
         .RegisterOnProxyReady(() => {
-          const canvas = window.originDocument.createElement("canvas");
+          const canvas = renderDocument.createElement("canvas");
           canvas.style.width = _this.style.width + "px";
           canvas.style.height = _this.style.height + "px";
           _this.$refs.innerViewDiv