fix: duration args not work on enter animation and exit animation when using changeBg and changeFigure

#701

Author: ADKcodeXD

packages/webgal/src/Core/gameScripts/changeBg/index.ts

@@ -42,10 +42,11 @@ export const changeBg = (sentence: ISentence): IPerform => {
 
   // 处理 transform 和 默认 transform
   const transformString = getSentenceArgByKey(sentence, 'transform');
-  let duration = getSentenceArgByKey(sentence, 'duration');
+  let durationFromArg = getSentenceArgByKey(sentence, 'duration');
   let ease = getSentenceArgByKey(sentence, 'ease')?.toString() ?? '';
-  if (!duration || typeof duration !== 'number') {
-    duration = 1000;
+  let duration = 1000;
+  if (typeof durationFromArg === 'number' && !isNaN(durationFromArg)) {
+    duration = durationFromArg;
   }
   let animationObj: AnimationFrame[];
   if (transformString) {
@@ -59,6 +60,11 @@ export const changeBg = (sentence: ISentence): IPerform => {
       WebGAL.animationManager.addAnimation(newAnimation);
       duration = getAnimateDuration(animationName);
       WebGAL.animationManager.nextEnterAnimationName.set('bg-main', animationName);
+
+      let exitAnimationObj = [...animationObj].reverse();
+      exitAnimationObj[0].alpha = 1;
+      const exitAnimationName = (Math.random() * 10).toString(16);
+      WebGAL.animationManager.nextExitAnimationName.set('bg-main-off', exitAnimationName);
     } catch (e) {
       // 解析都错误了，歇逼吧
       applyDefaultTransform();
@@ -78,6 +84,11 @@ export const changeBg = (sentence: ISentence): IPerform => {
     WebGAL.animationManager.addAnimation(newAnimation);
     duration = getAnimateDuration(animationName);
     WebGAL.animationManager.nextEnterAnimationName.set('bg-main', animationName);
+
+    let exitAnimationObj = [...animationObj].reverse();
+    exitAnimationObj[0].alpha = 1;
+    const exitAnimationName = (Math.random() * 10).toString(16);
+    WebGAL.animationManager.nextExitAnimationName.set('bg-main-off', exitAnimationName);
   }
 
   // 应用动画的优先级更高一点

packages/webgal/src/Core/gameScripts/changeFigure.ts

@@ -165,15 +165,18 @@ export function changeFigure(sentence: ISentence): IPerform {
     dispatch(stageActions.setFigureMetaData([deleteKey, 'zIndex', 0, true]));
     dispatch(stageActions.setFigureMetaData([deleteKey2, 'zIndex', 0, true]));
   }
+
   const setAnimationNames = (key: string, sentence: ISentence) => {
     // 处理 transform 和 默认 transform
     const transformString = getSentenceArgByKey(sentence, 'transform');
     const durationFromArg = getSentenceArgByKey(sentence, 'duration');
     const ease = getSentenceArgByKey(sentence, 'ease')?.toString() ?? '';
-    if (durationFromArg && typeof durationFromArg === 'number') {
+    let animationObj: AnimationFrame[];
+
+    if (typeof durationFromArg === 'number' && !isNaN(durationFromArg)) {
       duration = durationFromArg;
     }
-    let animationObj: AnimationFrame[];
+
     if (transformString) {
       console.log(transformString);
       try {
@@ -186,6 +189,11 @@ export function changeFigure(sentence: ISentence): IPerform {
         WebGAL.animationManager.addAnimation(newAnimation);
         duration = getAnimateDuration(animationName);
         WebGAL.animationManager.nextEnterAnimationName.set(key, animationName);
+
+        let exitAnimationObj = [...animationObj].reverse();
+        exitAnimationObj[0].alpha = 1;
+        const exitAnimationName = (Math.random() * 10).toString(16);
+        WebGAL.animationManager.nextExitAnimationName.set(key + '-off', exitAnimationName);
       } catch (e) {
         // 解析都错误了，歇逼吧
         applyDefaultTransform();
@@ -205,7 +213,13 @@ export function changeFigure(sentence: ISentence): IPerform {
       WebGAL.animationManager.addAnimation(newAnimation);
       duration = getAnimateDuration(animationName);
       WebGAL.animationManager.nextEnterAnimationName.set(key, animationName);
+
+      let exitAnimationObj = [...animationObj].reverse();
+      exitAnimationObj[0].alpha = 1;
+      const exitAnimationName = (Math.random() * 10).toString(16);
+      WebGAL.animationManager.nextExitAnimationName.set(key + '-off', exitAnimationName);
     }
+
     const enterAnim = getSentenceArgByKey(sentence, 'enter');
     const exitAnim = getSentenceArgByKey(sentence, 'exit');
     if (enterAnim) {
@@ -217,6 +231,7 @@ export function changeFigure(sentence: ISentence): IPerform {
       duration = getAnimateDuration(exitAnim.toString());
     }
   };
+
   if (isFreeFigure) {
     /**
      * 下面的代码是设置自由立绘的