feat: allow using `enterDuration` and `exitDurationOfPrev` for figure and bg enter/exit animation config #806

MakinoharaShoko · 2025-11-15T13:38:35Z

No description provided.

… bg enter/exit animation config

gemini-code-assist · 2025-11-15T13:38:56Z

Summary of Changes

Hello @MakinoharaShoko, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request significantly enhances the animation system by providing developers with granular control over the duration of enter and exit animations for backgrounds and figures. It achieves this by refactoring the animation configuration storage, moving it from a temporary manager to a centralized Redux store. This change not only offers more flexibility in customizing visual transitions but also establishes a more robust and manageable state for animation settings across the application.

Highlights

Enhanced Animation Control: Introduced new parameters, enterDuration and exitDuration (formerly exitDurationOfPrev for figures), allowing for explicit control over the duration of enter and exit animations for both backgrounds and figures.
Centralized Animation State Management: Refactored the storage of animation settings (names and durations) from transient Map objects within WebGAL.animationManager to a persistent animationSettings array within the Redux stage store. This improves state predictability and consistency.
Redux Store Integration: Added new interfaces (IStageAnimationSetting, IUpdateAnimationSettingPayload) and reducers (updateAnimationSettings, removeAnimationSettingsByTarget) to the Redux store to support the new centralized animation configuration.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	`/gemini review`	Performs a code review for the current pull request in its current state.
Pull Request Summary	`/gemini summary`	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	`/gemini help`	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

gemini-code-assist

Code Review

This pull request refactors the animation configuration to use the Redux store, which is a good move for state management. It also adds enterDuration and exitDuration to provide more control over animations. The implementation is mostly solid, but I've identified a few areas for improvement. There are some typos and redundant code that can be cleaned up. More importantly, there's a potential bug in how a duration of 0 is handled, which could prevent instantaneous animations from working as expected. My review includes suggestions to fix these issues.

gemini-code-assist · 2025-11-15T13:40:55Z

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

+  if (enterDuration) {
+    webgalStore.dispatch(
+      stageActions.updateAnimationSettings({ target: 'bg-main', key: 'enterDuration', value: enterDuration }),
+    );
+  }
+  if (exitDuration) {
+    webgalStore.dispatch(
+      stageActions.updateAnimationSettings({ target: 'bg-main', key: 'exitDuration', value: exitDuration }),
+    );
+  }


The conditional checks if (enterDuration) and if (exitDuration) are problematic. If a duration of 0 is passed, which is a valid value for an instant transition, the condition will evaluate to false, and the setting will not be updated in the store. You should check for null or undefined instead to correctly handle a duration of 0.

Suggested change

if (enterDuration) {

webgalStore.dispatch(

stageActions.updateAnimationSettings({ target: 'bg-main', key: 'enterDuration', value: enterDuration }),

);

}

if (exitDuration) {

webgalStore.dispatch(

stageActions.updateAnimationSettings({ target: 'bg-main', key: 'exitDuration', value: exitDuration }),

);

}

if (getNumberArgByKey(sentence, 'enterDuration') != null) {

webgalStore.dispatch(

stageActions.updateAnimationSettings({ target: 'bg-main', key: 'enterDuration', value: enterDuration }),

);

}

if (exitDuration != null) {

webgalStore.dispatch(

stageActions.updateAnimationSettings({ target: 'bg-main', key: 'exitDuration', value: exitDuration }),

);

}

gemini-code-assist · 2025-11-15T13:40:55Z

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

+    if (enterDuration) {
+      webgalStore.dispatch(
+        stageActions.updateAnimationSettings({ target: key, key: 'enterDuration', value: enterDuration }),
+      );
+    }
+    if (exitDuration) {
+      webgalStore.dispatch(
+        stageActions.updateAnimationSettings({ target: key, key: 'exitDuration', value: exitDuration }),
+      );
+    }


The conditional checks if (enterDuration) and if (exitDuration) will fail if a duration of 0 is provided. A duration of 0 is a valid value for an instantaneous animation, but if (0) evaluates to false. To fix this bug, you should explicitly check against null and undefined.

Suggested change

if (enterDuration) {

webgalStore.dispatch(

stageActions.updateAnimationSettings({ target: key, key: 'enterDuration', value: enterDuration }),

);

}

if (exitDuration) {

webgalStore.dispatch(

stageActions.updateAnimationSettings({ target: key, key: 'exitDuration', value: exitDuration }),

);

}

if (getNumberArgByKey(sentence, 'enterDuration') != null) {

webgalStore.dispatch(

stageActions.updateAnimationSettings({ target: key, key: 'enterDuration', value: enterDuration }),

);

}

if (exitDuration != null) {

webgalStore.dispatch(

stageActions.updateAnimationSettings({ target: key, key: 'exitDuration', value: exitDuration }),

);

}

gemini-code-assist · 2025-11-15T13:40:55Z

packages/webgal/src/Core/Modules/animationFunctions.ts

+    duration =
+      webgalStore.getState().stage.animationSettings.find((setting) => setting.target === target)?.enterDuration ??
+      duration;
    // 走默认动画
    let animation: IAnimationObject | null = generateUniversalSoftInAnimationObj(realTarget ?? target, duration);

    const transformState = webgalStore.getState().stage.effects;
    const targetEffect = transformState.find((effect) => effect.target === target);

-    const animarionName = WebGAL.animationManager.nextEnterAnimationName.get(target);
+    const animarionName = webgalStore
+      .getState()
+      .stage.animationSettings.find((setting) => setting.target === target)?.enterAnimationName;
    if (animarionName && !targetEffect) {


There's a typo in the variable name animarionName (should be animationName). Additionally, the code queries the animationSettings from the store twice. You can optimize this by performing the lookup once and reusing the result.

const animationSetting = webgalStore .getState() .stage.animationSettings.find((setting) => setting.target === target); duration = animationSetting?.enterDuration ?? duration; // 走默认动画 let animation: IAnimationObject | null = generateUniversalSoftInAnimationObj(realTarget ?? target, duration); const transformState = webgalStore.getState().stage.effects; const targetEffect = transformState.find((effect) => effect.target === target); const animationName = animationSetting?.enterAnimationName; if (animationName && !targetEffect) {

gemini-code-assist · 2025-11-15T13:40:55Z

packages/webgal/src/Core/Modules/animationFunctions.ts

+    duration =
+      webgalStore.getState().stage.animationSettings.find((setting) => setting.target + '-off' === target)
+        ?.exitDuration ?? duration;
    // 走默认动画
    let animation: IAnimationObject | null = generateUniversalSoftOffAnimationObj(realTarget ?? target, duration);
-    const animarionName = WebGAL.animationManager.nextExitAnimationName.get(target);
+    const animarionName = webgalStore
+      .getState()
+      .stage.animationSettings.find((setting) => setting.target + '-off' === target)?.exitAnimationName;
    if (animarionName) {


Similar to the 'enter' case, there's a typo in animarionName and a redundant lookup for animationSettings. You can optimize this by finding the setting once and reusing it.

const animationSetting = webgalStore .getState() .stage.animationSettings.find((setting) => setting.target + '-off' === target); duration = animationSetting?.exitDuration ?? duration; // 走默认动画 let animation: IAnimationObject | null = generateUniversalSoftOffAnimationObj(realTarget ?? target, duration); const animationName = animationSetting?.exitAnimationName; if (animationName) {

cloudflare-workers-and-pages · 2025-11-15T13:41:41Z

Deploying webgal-dev with Cloudflare Pages

Latest commit:	`9e72da2`
Status:	✅ Deploy successful!
Preview URL:	https://a9cf3044.webgal-dev.pages.dev
Branch Preview URL:	https://stage-obj-duration.webgal-dev.pages.dev

View logs

HardyNLee

~~测试案例全部通过, 没有什么问题~~
有一些问题, 待解决

HardyNLee · 2025-11-16T14:41:43Z

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

  let duration = getNumberArgByKey(sentence, 'duration') ?? 1000;
+  const enterDuration = getNumberArgByKey(sentence, 'enterDuration') ?? duration;
+  duration = enterDuration;
+  const exitDuration = getNumberArgByKey(sentence, 'exitDurationOfPrev');


其实既然退场动画叫 exit 而不是 exitOfPrev 的话, 那其实这里似乎也没有什么必要加后缀, 短一点也比较好打, 在文档里或者编辑器里说明一下就好了, changeFigure那边同理

HardyNLee

已解决 #701 , 并通过了所有测试案例

feat: allow using enterDuration and exitDurationOfPrev for figure and…

e903a7e

… bg enter/exit animation config

MakinoharaShoko requested a review from HardyNLee November 15, 2025 13:38

gemini-code-assist bot reviewed Nov 15, 2025

View reviewed changes

fix: key of exit duration of bg

dcd337d

HardyNLee reviewed Nov 16, 2025

View reviewed changes

Hardy--Lee and others added 3 commits November 19, 2025 14:55

fix: spelling issue

bb6a6cc

fix: enter exit duration could be zero

aab07f0

change arg key exitDurationOfPrev to exitDuration

9e72da2

MakinoharaShoko requested a review from HardyNLee November 19, 2025 15:12

MakinoharaShoko mentioned this pull request Nov 19, 2025

fix: changeFigure and changeBg duration #717

Closed

HardyNLee approved these changes Nov 19, 2025

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

feat: allow using `enterDuration` and `exitDurationOfPrev` for figure and bg enter/exit animation config #806

feat: allow using `enterDuration` and `exitDurationOfPrev` for figure and bg enter/exit animation config #806

Uh oh!

MakinoharaShoko commented Nov 15, 2025

Uh oh!

gemini-code-assist bot commented Nov 15, 2025

Uh oh!

gemini-code-assist bot left a comment

Uh oh!

gemini-code-assist bot Nov 15, 2025

Uh oh!

gemini-code-assist bot Nov 15, 2025

Uh oh!

gemini-code-assist bot Nov 15, 2025

Uh oh!

gemini-code-assist bot Nov 15, 2025

Uh oh!

cloudflare-workers-and-pages bot commented Nov 15, 2025 •

edited

Loading

Uh oh!

HardyNLee left a comment •

edited

Loading

Uh oh!

HardyNLee Nov 16, 2025

Uh oh!

HardyNLee left a comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Uh oh!

feat: allow using enterDuration and exitDurationOfPrev for figure and bg enter/exit animation config #806

Are you sure you want to change the base?

feat: allow using enterDuration and exitDurationOfPrev for figure and bg enter/exit animation config #806

Uh oh!

Conversation

MakinoharaShoko commented Nov 15, 2025

Uh oh!

gemini-code-assist bot commented Nov 15, 2025

Summary of Changes

Highlights

Footnotes

Uh oh!

gemini-code-assist bot left a comment

Choose a reason for hiding this comment

Code Review

Uh oh!

gemini-code-assist bot Nov 15, 2025

Choose a reason for hiding this comment

Uh oh!

gemini-code-assist bot Nov 15, 2025

Choose a reason for hiding this comment

Uh oh!

gemini-code-assist bot Nov 15, 2025

Choose a reason for hiding this comment

Uh oh!

gemini-code-assist bot Nov 15, 2025

Choose a reason for hiding this comment

Uh oh!

cloudflare-workers-and-pages bot commented Nov 15, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Deploying webgal-dev with Cloudflare Pages

Uh oh!

HardyNLee left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

HardyNLee Nov 16, 2025

Choose a reason for hiding this comment

Uh oh!

HardyNLee left a comment

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

feat: allow using `enterDuration` and `exitDurationOfPrev` for figure and bg enter/exit animation config #806

feat: allow using `enterDuration` and `exitDurationOfPrev` for figure and bg enter/exit animation config #806

cloudflare-workers-and-pages bot commented Nov 15, 2025 •

edited

Loading

HardyNLee left a comment •

edited

Loading