### Basic Scene Setup Commands

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Sets up the initial scene by playing background music, unlocking a new music track, displaying an intro message, changing the background, and unlocking a CG. These commands establish the starting state of a visual novel.

```WebGAL Script
bgm:s_Title.mp3;
unlockBgm:s_Title.mp3 -name=雲を追いかけて;
intro:你好|欢迎来到 WebGAL 的世界;
changeBg:bg.webp -next;
unlockCg:bg.webp -name=良夜; // 解锁CG并赋予名称
```

--------------------------------

### Display Intro Message and Change Background

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Displays an introductory message to the player and changes the background image. This is typically used at the start of a game or scene.

```WebGAL Script
intro:你好|欢迎来到 WebGAL 的世界;
changeBg:bg.webp -next;
```

--------------------------------

### Display Dialogue about Branching Choices

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Displays dialogue introducing the concept of branching choices in the game. This is used to guide the player towards different narrative paths.

```WebGAL Script
WebGAL:除此以外，分支选择的功能也必不可少。 -v7.wav;
WebGAL:你可以通过以下两个分支了解 WebGAL 的更多故事。 -v8.wav;
```

--------------------------------

### Initialize Pixi.js

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Initializes the Pixi.js rendering engine. This command is a prerequisite for using Pixi.js specific effects.

```WebGAL Script
pixiInit;
```

```WebGAL Script
pixiInit;
```

--------------------------------

### Initialize Background Music

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Sets the background music for the current scene. This command loads and plays a specified music file.

```WebGAL Script
bgm:s_Title.mp3;
```

--------------------------------

### Explain WebGAL Deployment and Display Dialogue

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Explains the benefit of deploying WebGAL on a server for easy player access and displays a dialogue message.

```webgal
由于这个特性，如果你将 WebGAL 部署到服务器或网页托管平台上，玩家只需要一串链接就可以开始游玩！ -v3.wav;
setAnimation:l2c -target=fig-left -next;
```

--------------------------------

### WebGAL Engine Introduction

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Displays an introductory message from the WebGAL engine and describes its web-based nature.

```WebGAL Script
WebGAL:欢迎使用 WebGAL！这是一款全新的网页端视觉小说引擎。 -v1.wav;
changeFigure:stand2.webp -right -next;
WebGAL 是使用 Web 技术开发的引擎，因此在网页端有良好的表现。 -v2.wav;
由于这个特性，如果你将 WebGAL 部署到服务器或网页托管平台上，玩家只需要一串链接就可以开始游玩！ -v3.wav
```

--------------------------------

### Present Branching Choices to Player

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Initializes Pixi.js and presents the player with two branching choices: 'WebGAL Development History' and 'WebGAL Trivia'. This command is crucial for interactive storytelling.

```WebGAL Script
pixiInit;
choose:WebGAL 发展历程:choose1|WebGAL 冷知识:choose2;
```

--------------------------------

### Display Introduction Text

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Displays an introductory message to the player. This is often used at the beginning of the game or a new section.

```WebGAL Script
intro:你好|欢迎来到 WebGAL 的世界
```

--------------------------------

### Display Intro Message

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Displays an introductory message to the player, potentially with multiple lines separated by '|'.

```webgal
intro:你好|欢迎来到 WebGAL 的世界;
```

--------------------------------

### Initialize Pixi.js Renderer

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Initializes the Pixi.js rendering engine. This command is typically used before performing graphical operations like effects.

```WebGAL Script
pixiInit;
```

--------------------------------

### Introduce Branching Choices

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Introduces the concept of branching choices in WebGAL and presents two options to the player.

```webgal
除此以外，分支选择的功能也必不可少。 -v7.wav;
你可以通过以下两个分支了解 WebGAL 的更多故事。 -v8.wav;
pixiInit;
choose:WebGAL 发展历程:choose1|WebGAL 冷知识:choose2;
```

--------------------------------

### Animation and Effect System

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Demonstrates setting character animations and mentions the engine's animation and effect systems for enhanced visual presentation.

```WebGAL Script
setAnimation:move-front-and-back -target=fig-left -next;
听起来是不是非常吸引人？ -v4.wav;
changeFigure:none -right -next;
setAnimation:l2c -target=fig-left -next;
WebGAL 引擎也具有动画系统和特效系统，使用 WebGAL 开发的游戏可以拥有很好的表现效果。 -v5.wav
```

--------------------------------

### Dialogue about UI and Presets

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Highlights the availability of a beautiful universal UI and rich preset functions/animations for novice game developers. This aims to lower the barrier to entry for creating games with WebGAL.

```WebGAL Script
我们为可能初次开发游戏的开发者提供了美观的通用 UI 和丰富的预设功能与动画。所以你可以没有顾虑地快速开始制作游戏。 -v21.wav;
```

--------------------------------

### Initialize and Perform PixiJS Effect

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Initializes the PixiJS rendering engine and then performs a specific visual effect, such as snow. This is used for adding graphical effects to the game.

```WebGAL Script
pixiInit;
pixiPerform:snow;
```

```WebGAL Script
pixiInit;
```

--------------------------------

### Initialize Game Entry Animation

Source: https://github.com/openwebgal/webgal/blob/main/packages/webgal/index.html

Configures and manages the entry animation for the game's title screen, adapting behavior for iOS devices. It synchronizes the entry animation with the rendering process.

```javascript
(() => {
  const isIOS = window.__WEBGAL_DEVICE_INFO?.isIOS ?? false;
  const enterConfig = isIOS ? { skipAnimation: true, hideDelay: 0 } : { skipAnimation: false, hideDelay: 2000 };
  let enterPromiseResolve;
  const enterPromise = new Promise((res) => {
    enterPromiseResolve = res;
  });
  const renderPromise = new Promise((res) => {
    window.renderPromiseResolve = () => {
      res();
      delete window.renderPromiseResolve;
    };
  });

  Promise.all([enterPromise, renderPromise]).then(() => {
    const event = new MouseEvent('click', {
      view: window,
      bubbles: true,
      cancelable: true,
    });
    const target = document.querySelector('.title__enter-game-target');
    if (target) {
      target.dispatchEvent(event);
    }
  });

  const enter = () => {
    const titleEnter = document.querySelector('.html-body__title-enter');
    if (enterConfig.skipAnimation) {
      if (titleEnter) {
        titleEnter.style.pointerEvents = 'none';
        titleEnter.style.transition = 'none';
        titleEnter.style.opacity = '0';
        titleEnter.style.display = 'none';
      }
      enterPromiseResolve();
      return;
    }

    const initialBackground = document.querySelector('.title-enter__initial-background');
    if (initialBackground) {
      initialBackground.style.opacity = '0';
    }
    const container = document.querySelector('.title-enter__container');
    if (container) {
      container.style.opacity = '0';
    }
    const whiteBackground = document.querySelector('.title-enter__white-background');
    setTimeout(() => {
      if (whiteBackground) {
        whiteBackground.style.opacity = '1';
      }
    }, 50);

    setTimeout(() => {
      if (titleEnter) titleEnter.style.opacity = '0';
    }, 500);

    if (!isIOS && titleEnter) {
      titleEnter.style.pointerEvents = 'none';
      titleEnter.style.background = 'linear-gradient( #a1c4fd 0%, #c2e9fb 100%)';
    }

    setTimeout(() => {
      if (titleEnter) {
        titleEnter.style.display = 'none';
      }
    }, enterConfig.hideDelay);

    enterPromiseResolve();
  };

  const titleEnter = document.querySelector('.html-body__title-enter');
  if (titleEnter) {
    titleEnter.onclick = enter;
  }

  const linkToGithub = document.querySelector('.title-enter-container__link-to-github');
  const aTag = linkToGithub?.querySelector('a');
  if (aTag) {
    aTag.href = 'https://github.com/OpenWebGAL/WebGAL';
    aTag.onclick = (event) => event.stopPropagation();
  }
})();
```

--------------------------------

### Character and Animation Commands

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Changes the character's sprite and applies an animation. 'changeFigure' swaps the character's visual, while 'setAnimation' applies a specific animation effect. Use these for character introductions and actions.

```WebGAL Script
changeFigure:stand.webp -left -next;
setAnimation:enter-from-left -target=fig-left -next;
```

```WebGAL Script
changeFigure:stand2.webp -right -next;
```

```WebGAL Script
setAnimation:move-front-and-back -target=fig-left -next;
```

```WebGAL Script
changeFigure:none -right -next;
setAnimation:l2c -target=fig-left -next;
```

--------------------------------

### Initialize and Perform Snow Effect

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Initializes the Pixi.js rendering engine and then performs a snow effect. This is used to add visual flair to the scene.

```WebGAL Script
pixiInit;
pixiPerform:snow
```

--------------------------------

### Initialize and Perform Snow Effect

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Initializes the Pixi.js rendering context and performs a snow effect. This is used to add visual flair to scenes.

```WebGAL Script
pixiInit;
pixiPerform:snow;
```

--------------------------------

### Scheduling and Handling Resizes

Source: https://github.com/openwebgal/webgal/blob/main/packages/webgal/index.html

This JavaScript code sets up a debounced resize handler using `setTimeout` to avoid excessive calls during window resizing. It also includes logic to schedule an initial resize on load and on window resize events. A specific handler for the F11 key press is included to trigger a resize when entering/exiting fullscreen.

```javascript
let iosResizeTimer = null;
const scheduleResize = () => {
  if (layoutConfig.resizeDelay > 0) {
    if (iosResizeTimer) {
      window.clearTimeout(iosResizeTimer);
    }
    iosResizeTimer = window.setTimeout(() => {
      resize();
      iosResizeTimer = null;
    }, layoutConfig.resizeDelay);
    return;
  }
  resize();
};
if (isIOS) {
  const styleTag = document.createElement('style');
  styleTag.textContent = 	`* { font-synthesis: none !important; }	`;
  if (layoutConfig.hideEffectBackground) {
    styleTag.textContent += 	` #ebg, #ebgOverlay { display: none !important; } 	`;
  }
  document.head.appendChild(styleTag);
}
ensureViewportMeta().content = layoutConfig.viewport;
scheduleResize();
window.onload = scheduleResize;
window.onresize = scheduleResize;
// 监听键盘 F11 键按下事件，全屏时触发页面调整
document.onkeydown = (e) => {
  if (e && e.key === 'F11') {
    setTimeout(() => {
      scheduleResize();
    }, 100);
  }
};
```

--------------------------------

### Concluding Remarks and Call to Action

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Provides concluding remarks about WebGAL's features and encourages developers to share their work.

```webgal
当然，这不算什么，因为大多数成熟的引擎都有这些功能。但是在 Web 端，这却是很少见的。 -v20.wav;
我们为可能初次开发游戏的开发者提供了美观的通用 UI 和丰富的预设功能与动画。所以你可以没有顾虑地快速开始制作游戏。 -v21.wav;
WebGAL 项目组期待你的作品能够在 WebGAL 上呈现！只需要一个链接就可以让万千用户立刻开始享受你的作品。 -v22.wav;
感谢你关注 WebGAL 项目！ -v23.wav;
end;
```

--------------------------------

### Character and Animation Commands

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Changes the character displayed on the left to a standing pose, then sets an 'enter-from-left' animation for that character. This sequence is used to introduce characters with a specific visual effect.

```WebGAL Script
changeFigure:stand.webp -left -next;
setAnimation:enter-from-left -target=fig-left -next;
```

--------------------------------

### Set Background Music

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Sets the background music for the current scene. The music file should be placed in the appropriate asset directory.

```WebGAL Script
bgm:s_Title.mp3
```

--------------------------------

### Displaying Dialogue and Engine Information

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Displays dialogue from the WebGAL engine and provides information about its features and benefits for web-based visual novels.

```WebGAL
WebGAL:欢迎使用 WebGAL！这是一款全新的网页端视觉小说引擎。 -v1.wav
```

```WebGAL
WebGAL 是使用 Web 技术开发的引擎，因此在网页端有良好的表现。 -v2.wav
```

```WebGAL
由于这个特性，如果你将 WebGAL 部署到服务器或网页托管平台上，玩家只需要一串链接就可以开始游玩！ -v3.wav
```

```WebGAL
听起来是不是非常吸引人？ -v4.wav
```

```WebGAL
WebGAL 引擎也具有动画系统和特效系统，使用 WebGAL 开发的游戏可以拥有很好的表现效果。 -v5.wav
```

--------------------------------

### Developer-Focused Features

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Discusses the uncommon nature of advanced features like shortcuts and rewind in web-based engines and highlights the provision of a universal UI and preset functions for developers.

```WebGAL Script
当然，这不算什么，因为大多数成熟的引擎都有这些功能。但是在 Web 端，这却是很少见的。 -v20.wav;
我们为可能初次开发游戏的开发者提供了美观的通用 UI 和丰富的预设功能与动画。所以你可以没有顾虑地快速开始制作游戏。 -v21.wav;
WebGAL 项目组期待你的作品能够在 WebGAL 上呈现！只需要一个链接就可以让万千用户立刻开始享受你的作品。 -v22.wav;
感谢你关注 WebGAL 项目！ -v23.wav;
end
```

--------------------------------

### Call to Action for Developers

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Encourages developers to showcase their work on WebGAL, emphasizing the ease of sharing and accessibility for players worldwide through a single link.

```WebGAL Script
WebGAL 项目组期待你的作品能够在 WebGAL 上呈现！只需要一个链接就可以让万千用户立刻开始享受你的作品。 -v22.wav;
```

--------------------------------

### Branch 1: WebGAL Development History

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

This section details the development history of WebGAL, covering its initial features, growth, and the addition of an editor. It concludes by jumping to the 'end' label.

```WebGAL Script
label:choose1;
WebGAL 的开发初衷是能够让更多人可以更方便地制作属于自己的视觉小说。 -v9.wav;
在一开始，WebGAL 只具备很少的功能，仅仅能支持立绘和背景的显示、语音播放和分支选择。 -v10.wav;
在经历一年的发展后，现在已经是支持了很多优秀的表现效果的引擎了！ -v11.wav;
除此以外，WebGAL 编辑器的加入也使得制作和导出一个游戏更加方便快捷。 -v12.wav;
jumpLabel:end;
```

--------------------------------

### Load IIFE Plugins

Source: https://github.com/openwebgal/webgal/blob/main/packages/webgal/index.html

Attempts to load IIFE (Immediately Invoked Function Expression) style plugins, such as Live2D SDK components. It logs success or warnings for each plugin.

```javascript
const loadIifePlugin = async (pluginPath) => {
  try {
    const info = await loadScript(pluginPath);
    console.log(info);
    return true;
  } catch (error) {
    console.warn(error);
    return false;
  }
};

const live2d2Promise = loadIifePlugin('lib/live2d.min.js');
const live2d4Promise = loadIifePlugin('lib/live2dcubismcore.min.js');
window.live2dPromise = Promise.all([live2d2Promise, live2d4Promise]);
```

--------------------------------

### Enable Continue Button Configuration

Source: https://github.com/openwebgal/webgal/blob/main/releasenote.md

Control the visibility of the 'Continue' button using the `Enable_Continue` configuration option. The button is disabled when no autosave is present and autosaves are cleared upon game completion.

```javascript
Added Enable_Continue configuration option
```

--------------------------------

### Set Animation for Character (Move Front and Back)

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Applies a 'move-front-and-back' animation to the character targeted as 'fig-left'. This command is used for character movement animations.

```WebGAL
setAnimation:move-front-and-back -target=fig-left -next;
```

--------------------------------

### Dialogue about Web端 Features

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Discusses the rarity of advanced features like shortcut keys and story rewind in Web-based visual novel engines. It highlights WebGAL's unique offering in this regard.

```WebGAL Script
当然，这不算什么，因为大多数成熟的引擎都有这些功能。但是在 Web 端，这却是很少见的。 -v20.wav;
```

--------------------------------

### Label and Jump Commands

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Defines labels for specific points in the script and allows jumping between them. 'label' marks a location, and 'jumpLabel' directs the flow of the narrative. Essential for structuring the story and implementing choices.

```WebGAL Script
label:choose1;
jumpLabel:end;
```

```WebGAL Script
label:choose2;
```

```WebGAL Script
label:end;
```

--------------------------------

### Showcase Animation System and Display Dialogue

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Highlights WebGAL's animation and effects system and displays a dialogue message.

```webgal
WebGAL 引擎也具有动画系统和特效系统，使用 WebGAL 开发的游戏可以拥有很好的表现效果。 -v5.wav;
pixiInit;
```

--------------------------------

### Branch 1: WebGAL Development History

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

This branch details the development history of WebGAL, highlighting its initial limitations and growth into a feature-rich engine.

```WebGAL
label:choose1;
WebGAL 的开发初衷是能够让更多人可以更方便地制作属于自己的视觉小说。 -v9.wav;
在一开始，WebGAL 只具备很少的功能，仅仅能支持立绘和背景的显示、语音播放和分支选择。 -v10.wav;
在经历一年的发展后，现在已经是支持了很多优秀的表现效果的引擎了！ -v11.wav;
除此以外，WebGAL 编辑器的加入也使得制作和导出一个游戏更加方便快捷。 -v12.wav;
jumpLabel:end
```

--------------------------------

### Branch 1: WebGAL Development History

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

This branch details the development history of WebGAL, focusing on its initial capabilities, growth, and the addition of the editor. It concludes by jumping to the 'end' label.

```WebGAL Script
label:choose1;
WebGAL:WebGAL 的开发初衷是能够让更多人可以更方便地制作属于自己的视觉小说。 -v9.wav;
WebGAL:在一开始，WebGAL 只具备很少的功能，仅仅能支持立绘和背景的显示、语音播放和分支选择。 -v10.wav;
WebGAL:在经历一年的发展后，现在已经是支持了很多优秀的表现效果的引擎了！ -v11.wav;
WebGAL:除此以外，WebGAL 编辑器的加入也使得制作和导出一个游戏更加方便快捷。 -v12.wav;
jumpLabel:end;
```

--------------------------------

### Branching Narrative Choice

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Presents the player with a choice that leads to different narrative paths. The 'choose' command defines the text displayed to the player and the labels to jump to based on their selection.

```WebGAL Script
choose:WebGAL 发展历程:choose1|WebGAL 冷知识:choose2;
```

--------------------------------

### Dialogue with Variable Interpolation

Source: https://github.com/openwebgal/webgal/blob/main/packages/webgal/public/game/scene/demo_var.txt

Displays dialogue using interpolated variables for speaker name and background. Demonstrates direct interpolation and escaped interpolation.

```webgal
{speaker}:Background now is {bg}.;
```

```webgal
{speaker}:\{{bg\}} is not use interpolation.;
```

--------------------------------

### Display Dialogue about WebGAL Features

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Displays dialogue explaining the features of the WebGAL engine, such as its animation and special effects systems. This is used for in-game tutorials or narrative exposition.

```WebGAL Script
WebGAL:WebGAL 引擎也具有动画系统和特效系统，使用 WebGAL 开发的游戏可以拥有很好的表现效果。 -v5.wav;
```

--------------------------------

### Display Dialogue with Sound Effect

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Displays dialogue from the WebGAL engine, accompanied by a sound effect file (e.g., -v1.wav). This is used for character speech or narration.

```WebGAL
WebGAL:欢迎使用 WebGAL！这是一款全新的网页端视觉小说引擎。 -v1.wav;
```

```WebGAL
WebGAL:欢迎使用 WebGAL！这是一款全新的网页端视觉小说引擎。 -v1.wav;
```

```WebGAL
WebGAL 是使用 Web 技术开发的引擎，因此在网页端有良好的表现。 -v2.wav;
```

```WebGAL
由于这个特性，如果你将 WebGAL 部署到服务器或网页托管平台上，玩家只需要一串链接就可以开始游玩！ -v3.wav;
```

```WebGAL
听起来是不是非常吸引人？ -v4.wav;
```

```WebGAL
WebGAL 引擎也具有动画系统和特效系统，使用 WebGAL 开发的游戏可以拥有很好的表现效果。 -v5.wav;
```

```WebGAL
比如，这个下起小雪的特效。 -v6.wav;
```

```WebGAL
除此以外，分支选择的功能也必不可少。 -v7.wav;
```

```WebGAL
你可以通过以下两个分支了解 WebGAL 的更多故事。 -v8.wav;
```

```WebGAL
WebGAL 的开发初衷是能够让更多人可以更方便地制作属于自己的视觉小说。 -v9.wav;
```

```WebGAL
在一开始，WebGAL 只具备很少的功能，仅仅能支持立绘和背景的显示、语音播放和分支选择。 -v10.wav;
```

```WebGAL
在经历一年的发展后，现在已经是支持了很多优秀的表现效果的引擎了！ -v11.wav;
```

```WebGAL
除此以外，WebGAL 编辑器的加入也使得制作和导出一个游戏更加方便快捷。 -v12.wav;
```

```WebGAL
这个演示游戏使用的素材是 AI 生成的。 -v13.wav;
```

```WebGAL
WebGAL 项目只用了一年不到就在 GitHub 获得了 1000 星标！ -v14.wav;
```

```WebGAL
WebGAL 的开发历程，是一个在开发中学习开发的过程。因此她经历了3次重构，并且每次几乎都是推倒重来式的。 -v15.wav;
```

```WebGAL
WebGAL 的脚本语言是为了简化制作难度而全新设计的！ -v16.wav;
```

```WebGAL
为了更接近桌面端视觉小说引擎的能力，我们支持很多快捷键以及可跳转的剧情回溯。 -v17.wav;
```

```WebGAL
按下菜单中的“回想”按钮或者向上滚动鼠标滚轮试试吧！ -v18.wav;
```

```WebGAL
快速存读挡、丰富的选项、自动播放以及快进等功能，也是应有尽有。 -v19.wav;
```

```WebGAL
当然，这不算什么，因为大多数成熟的引擎都有这些功能。但是在 Web 端，这却是很少见的。 -v20.wav;
```

```WebGAL
我们为可能初次开发游戏的开发者提供了美观的通用 UI 和丰富的预设功能与动画。所以你可以没有顾虑地快速开始制作游戏。 -v21.wav;
```

```WebGAL
WebGAL 项目组期待你的作品能够在 WebGAL 上呈现！只需要一个链接就可以让万千用户立刻开始享受你的作品。 -v22.wav;
```

```WebGAL
感谢你关注 WebGAL 项目！ -v23.wav;
```

--------------------------------

### Display Dialogue with Voice

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Displays dialogue text and plays an associated voice file. The format is 'CharacterName:DialogueText -VoiceFile.wav'.

```WebGAL Script
WebGAL:欢迎使用 WebGAL！这是一款全新的网页端视觉小说引擎。 -v1.wav;
```

--------------------------------

### Set Character Animation

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Applies a predefined animation to a character. '-target' specifies which character to animate, and '-next' proceeds to the next command.

```WebGAL Script
setAnimation:enter-from-left -target=fig-left -next
```

```WebGAL Script
setAnimation:move-front-and-back -target=fig-left -next
```

```WebGAL Script
setAnimation:l2c -target=fig-left -next
```

--------------------------------

### Set Background Variable

Source: https://github.com/openwebgal/webgal/blob/main/packages/webgal/public/game/scene/demo_var.txt

Sets a variable to a background image file name. This variable can later be used to change the background.

```webgal
setVar:bg=bg.webp;
```

--------------------------------

### Advanced Animation and Effects

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Applies a 'move-front-and-back' animation to the left character, followed by changing the character on the right to 'none' and then applying an 'l2c' animation to the left character. This demonstrates more complex character animations and transitions.

```WebGAL Script
setAnimation:move-front-and-back -target=fig-left -next;
changeFigure:none -right -next;
setAnimation:l2c -target=fig-left -next;
```

--------------------------------

### Dialogue with Function Variable Interpolation

Source: https://github.com/openwebgal/webgal/blob/main/packages/webgal/public/game/scene/demo_var.txt

Sets a variable 'func' and then uses it in dialogue to display a descriptive string. This showcases interpolation of string variables.

```webgal
setVar:func=variable interpolation;
{speaker}:Bg changed! Welcome to {speaker} {func}!;
```

--------------------------------

### Change Background

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Changes the current background image. The '-next' flag indicates that the script should proceed to the next command after this.

```WebGAL Script
changeBg:bg.webp -next;
```

--------------------------------

### Display Dialogue with Voice

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Displays dialogue text to the player, accompanied by a specific voice-over audio file.

```WebGAL Script
WebGAL:欢迎使用 WebGAL！这是一款全新的网页端视觉小说引擎。 -v1.wav;
```

```WebGAL Script
WebGAL 是使用 Web 技术开发的引擎，因此在网页端有良好的表现。 -v2.wav;
```

```WebGAL Script
由于这个特性，如果你将 WebGAL 部署到服务器或网页托管平台上，玩家只需要一串链接就可以开始游玩！ -v3.wav;
```

```WebGAL Script
setAnimation:move-front-and-back -target=fig-left -next;
听起来是不是非常吸引人？ -v4.wav;
```

```WebGAL Script
WebGAL 引擎也具有动画系统和特效系统，使用 WebGAL 开发的游戏可以拥有很好的表现效果。 -v5.wav;
```

```WebGAL Script
比如，这个下起小雪的特效。 -v6.wav;
```

```WebGAL Script
除此以外，分支选择的功能也必不可少。 -v7.wav;
```

```WebGAL Script
你可以通过以下两个分支了解 WebGAL 的更多故事。 -v8.wav;
```

```WebGAL Script
WebGAL 的开发初衷是能够让更多人可以更方便地制作属于自己的视觉小说。 -v9.wav;
```

```WebGAL Script
在一开始，WebGAL 只具备很少的功能，仅仅能支持立绘和背景的显示、语音播放和分支选择。 -v10.wav;
```

```WebGAL Script
在经历一年的发展后，现在已经是支持了很多优秀的表现效果的引擎了！ -v11.wav;
```

```WebGAL Script
除此以外，WebGAL 编辑器的加入也使得制作和导出一个游戏更加方便快捷。 -v12.wav;
```

```WebGAL Script
这个演示游戏使用的素材是 AI 生成的。 -v13.wav;
```

```WebGAL Script
WebGAL 项目只用了一年不到就在 GitHub 获得了 1000 星标！ -v14.wav;
```

```WebGAL Script
WebGAL 的开发历程，是一个在开发中学习开发的过程。因此她经历了3次重构，并且每次几乎都是推倒重来式的。 -v15.wav;
```

```WebGAL Script
WebGAL 的脚本语言是为了简化制作难度而全新设计的！ -v16.wav;
```

```WebGAL Script
为了更接近桌面端视觉小说引擎的能力，我们支持很多快捷键以及可跳转的剧情回溯。 -v17.wav;
```

```WebGAL Script
按下菜单中的“回想”按钮或者向上滚动鼠标滚轮试试吧！ -v18.wav;
```

```WebGAL Script
快速存读挡、丰富的选项、自动播放以及快进等功能，也是应有尽有。 -v19.wav;
```

```WebGAL Script
当然，这不算什么，因为大多数成熟的引擎都有这些功能。但是在 Web 端，这却是很少见的。 -v20.wav;
```

```WebGAL Script
我们为可能初次开发游戏的开发者提供了美观的通用 UI 和丰富的预设功能与动画。所以你可以没有顾虑地快速开始制作游戏。 -v21.wav;
```

```WebGAL Script
WebGAL 项目组期待你的作品能够在 WebGAL 上呈现！只需要一个链接就可以让万千用户立刻开始享受你的作品。 -v22.wav;
```

```WebGAL Script
感谢你关注 WebGAL 项目！ -v23.wav;
```

--------------------------------

### End of Branch and Scene Features

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Marks the end of a branch and describes advanced features like shortcut keys and story rewind. It also mentions quick save/load, auto-play, and fast-forward functionalities.

```WebGAL Script
label:end;
为了更接近桌面端视觉小说引擎的能力，我们支持很多快捷键以及可跳转的剧情回溯。 -v17.wav;
按下菜单中的“回想”按钮或者向上滚动鼠标滚轮试试吧！ -v18.wav;
快速存读挡、丰富的选项、自动播放以及快进等功能，也是应有尽有。 -v19.wav;
```

--------------------------------

### Set Character Animation

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Sets a specific animation for a character. The animation name and target character are provided as arguments. Use '-next' to proceed to the next command after the animation.

```WebGAL Script
setAnimation:enter-from-left -target=fig-left -next;
```

```WebGAL Script
setAnimation:move-front-and-back -target=fig-left -next;
```

--------------------------------

### Load External Scripts Dynamically

Source: https://github.com/openwebgal/webgal/blob/main/packages/webgal/index.html

Provides a utility function to dynamically load external JavaScript scripts into the document's head. It returns a Promise that resolves upon successful loading or rejects on failure.

```javascript
const loadScript = (url, type) => {
  return new Promise((resolve, reject) => {
    const script = document.createElement('script');
    script.src = url;
    if (type) script.type = type;
    script.onload = () => resolve(`Loaded: ${url}`);
    script.onerror = () => reject(new Error(`Failed to load: ${url}`));
    document.head.appendChild(script);
  });
};
```

--------------------------------

### Change Background

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Changes the background image of the current scene. The '-next' flag indicates that the script should proceed to the next command after this.

```WebGAL Script
changeBg:bg.webp -next
```

--------------------------------

### Character Animation and Transition

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Applies a specific animation to the character on the left, then transitions the character off-screen to the left. This is used for character exit animations.

```WebGAL Script
setAnimation:move-front-and-back -target=fig-left -next;
setAnimation:l2c -target=fig-left -next;
```

--------------------------------

### Set Animation and Display Dialogue

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Sets a character animation and displays dialogue from the WebGAL engine. This is used to create dynamic character actions and narrative.

```WebGAL Script
setAnimation:move-front-and-back -target=fig-left -next;
WebGAL:听起来是不是非常吸引人？ -v4.wav;
```

--------------------------------

### Character Display and Animation

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Changes the character displayed on the left side of the screen and sets an entry animation. This is used to introduce characters into the scene.

```WebGAL
changeFigure:stand.webp -left -next;
setAnimation:enter-from-left -target=fig-left -next
```

--------------------------------

### Define Branching Choices

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Presents the player with a choice that leads to different narrative paths. Each choice has a display text and a label to jump to.

```WebGAL Script
choose:WebGAL 发展历程:choose1|WebGAL 冷知识:choose2
```

--------------------------------

### Change Background

Source: https://github.com/openwebgal/webgal/blob/main/packages/webgal/public/game/scene/demo_var.txt

Changes the current background to the one specified by the 'bg' variable. The '-next' flag indicates a transition.

```webgal
changeBg:{bg} -next;
```

--------------------------------

### Set Background Music and Unlock BGM

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Sets the background music for the current scene and unlocks a new BGM with a specified name. This is used for audio control.

```WebGAL Script
bgm:s_Title.mp3;
unlockBgm:s_Title.mp3 -name=雲を追いかけて;
```

--------------------------------

### Set Character Animation and Display Dialogue

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Sets a character animation and displays a dialogue message. This sequence demonstrates character movement and speech.

```webgal
setAnimation:move-front-and-back -target=fig-left -next;
WebGAL:是使用 Web 技术开发的引擎，因此在网页端有良好的表现。 -v2.wav;
```

--------------------------------

### Conditional Background Change

Source: https://github.com/openwebgal/webgal/blob/main/packages/webgal/public/game/scene/demo_var.txt

Sets a variable 'bg' to 'WebGalEnter.webp' only if the variable 'a' is greater than 2. This allows for conditional updates.

```webgal
setVar:a=3;
setVar:bg=WebGalEnter.webp -when=a>2;
```

--------------------------------

### Displaying Dialogue and Narration

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Outputs dialogue or narration text to the player. The 'WebGAL:' prefix indicates a character speaking or narration provided by the engine. Associated .wav files suggest accompanying audio.

```WebGAL Script
WebGAL:欢迎使用 WebGAL！这是一款全新的网页端视觉小说引擎。 -v1.wav;
```

```WebGAL Script
WebGAL 是使用 Web 技术开发的引擎，因此在网页端有良好的表现。 -v2.wav;
```

```WebGAL Script
由于这个特性，如果你将 WebGAL 部署到服务器或网页托管平台上，玩家只需要一串链接就可以开始游玩！ -v3.wav;
```

```WebGAL Script
听起来是不是非常吸引人？ -v4.wav;
```

```WebGAL Script
WebGAL 引擎也具有动画系统和特效系统，使用 WebGAL 开发的游戏可以拥有很好的表现效果。 -v5.wav;
```

```WebGAL Script
比如，这个下起小雪的特效。 -v6.wav;
```

```WebGAL Script
除此以外，分支选择的功能也必不可少。 -v7.wav;
```

```WebGAL Script
你可以通过以下两个分支了解 WebGAL 的更多故事。 -v8.wav;
```

```WebGAL Script
WebGAL 的开发初衷是能够让更多人可以更方便地制作属于自己的视觉小说。 -v9.wav;
```

```WebGAL Script
在一开始，WebGAL 只具备很少的功能，仅仅能支持立绘和背景的显示、语音播放和分支选择。 -v10.wav;
```

```WebGAL Script
在经历一年的发展后，现在已经是支持了很多优秀的表现效果的引擎了！ -v11.wav;
```

```WebGAL Script
除此以外，WebGAL 编辑器的加入也使得制作和导出一个游戏更加方便快捷。 -v12.wav;
```

```WebGAL Script
这个演示游戏使用的素材是 AI 生成的。 -v13.wav;
```

```WebGAL Script
WebGAL 项目只用了一年不到就在 GitHub 获得了 1000 星标！ -v14.wav;
```

```WebGAL Script
WebGAL 的开发历程，是一个在开发中学习开发的过程。因此她经历了3次重构，并且每次几乎都是推倒重来式的。 -v15.wav;
```

```WebGAL Script
WebGAL 的脚本语言是为了简化制作难度而全新设计的！ -v16.wav;
```

```WebGAL Script
为了更接近桌面端视觉小说引擎的能力，我们支持很多快捷键以及可跳转的剧情回溯。 -v17.wav;
```

```WebGAL Script
按下菜单中的“回想”按钮或者向上滚动鼠标滚轮试试吧！ -v18.wav;
```

```WebGAL Script
快速存读挡、丰富的选项、自动播放以及快进等功能，也是应有尽有。 -v19.wav;
```

```WebGAL Script
当然，这不算什么，因为大多数成熟的引擎都有这些功能。但是在 Web 端，这却是很少见的。 -v20.wav;
```

```WebGAL Script
我们为可能初次开发游戏的开发者提供了美观的通用 UI 和丰富的预设功能与动画。所以你可以没有顾虑地快速开始制作游戏。 -v21.wav;
```

```WebGAL Script
WebGAL 项目组期待你的作品能够在 WebGAL 上呈现！只需要一个链接就可以让万千用户立刻开始享受你的作品。 -v22.wav;
```

```WebGAL Script
感谢你关注 WebGAL 项目！ -v23.wav;
```

--------------------------------

### Set Character Animation

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Applies a predefined animation to a character figure. The '-target' parameter specifies which figure to animate, and '-next' proceeds to the next command.

```WebGAL Script
setAnimation:enter-from-left -target=fig-left -next;
```

```WebGAL Script
setAnimation:move-front-and-back -target=fig-left -next;
```

```WebGAL Script
setAnimation:l2c -target=fig-left -next;
```

--------------------------------

### Set Character Animation

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Applies a predefined animation to a character. The '-next' flag ensures the script continues after the animation.

```WebGAL Script
setAnimation:enter-from-left -target=fig-left -next;
```

```WebGAL Script
setAnimation:l2c -target=fig-left -next;
```

--------------------------------

### Set Temporary Animation

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Applies a temporary animation to a character figure. This command is used to create dynamic character movements.

```WebGAL Script
setTempAnimation:[{"position": {"x": 500,"y": 0},"duration": 0},{"position": {"x": 400,"y": 0},"duration": 250},{"position": {"x": 600,"y": 0},"duration": 500},{"position": {"x": 500,"y": 0},"duration": 250}] -target=fig-left -next;
```

--------------------------------

### Perform Pixi.js Effect

Source: https://github.com/openwebgal/webgal/blob/main/packages/parser/test/test-resources/long-script.txt

Executes a specific visual effect using Pixi.js. The 'snow' parameter indicates a snowfall effect.

```WebGAL Script
pixiPerform:snow;
```