Merge pull request #432 from OpenWebGAL/dev

4.4.8
OpenWebGAL · Dec 31, 2023 · 5758bd3 · 5758bd3
2 parents e918110 + 42da796
commit 5758bd3
Show file tree

Hide file tree

Showing 37 changed files with 1,958 additions and 1,884 deletions.
diff --git a/package.json b/package.json
@@ -6,12 +6,14 @@
   "author": "Mahiru <[email protected]>",
   "scripts": {
     "build": "yarn parser:build && yarn webgal:build",
+    "build-ci": "yarn parser:build-ci && yarn webgal:build",
     "dev": "yarn parser:build && yarn webgal:dev",
     "webgal:dev": "cd packages/webgal && yarn dev",
     "webgal:build": "cd packages/webgal && yarn build",
     "parser:test": "cd packages/parser && yarn test",
     "parser:test-coverage": "cd packages/parser && yarn coverage",
-    "parser:build": "cd packages/parser && yarn build"
+    "parser:build": "cd packages/parser && yarn build",
+    "parser:build-ci": "cd packages/parser && yarn build-ci"
   },
   "license": "MPL-2.0",
   "workspaces": {

diff --git a/packages/parser/package.json b/packages/parser/package.json
@@ -1,11 +1,12 @@
 {
   "name": "webgal-parser",
-  "version": "4.4.7",
+  "version": "4.4.8",
   "description": "WebGAL script parser",
   "scripts": {
     "test": "vitest",
     "coverage": "vitest run --coverage",
     "build": "rimraf -rf ./build && rollup --config",
+    "build-ci": "rollup --config",
     "debug": "tsx test/debug.ts"
   },
   "types": "./build/types/index.d.ts",

diff --git a/packages/parser/src/scriptParser/argsParser.ts b/packages/parser/src/scriptParser/argsParser.ts
@@ -27,7 +27,7 @@ export function argsParser(argsRaw: string, assetSetter: (fileName: string, asse
       argValue = undefined;
     }
     // 判断是不是语音参数
-    if (argName.match(/.ogg|.mp3|.wav/)) {
+    if (argName.toLowerCase().match(/.ogg|.mp3|.wav/)) {
       returnArrayList.push({
         key: "vocal",
         value: assetSetter(e, fileType.vocal)

diff --git a/packages/webgal/package.json b/packages/webgal/package.json
@@ -1,7 +1,7 @@
 {
   "name": "webgal",
   "private": true,
-  "version": "4.4.7",
+  "version": "4.4.8",
   "scripts": {
     "dev": "vite --host --port 3000",
     "build": "cross-env NODE_ENV=production tsc && vite build --base=./",
@@ -30,7 +30,7 @@
     "uuid": "^9.0.0",
     "vite-plugin-package-version": "^1.0.2",
     "pixi-live2d-display": "^0.4.0",
-    "webgal-parser": "4.4.5-fix2"
+    "webgal-parser": "latest"
   },
   "devDependencies": {
     "@types/lodash": "^4.14.180",

diff --git a/packages/webgal/public/game/config.txt b/packages/webgal/public/game/config.txt
@@ -1,5 +1,5 @@
 Game_name:欢迎使用WebGAL！;
-Game_key:0f86dstRf;
+Game_key:0f87dstRg;
 Title_img:WebGAL_New_Enter_Image.png;
 Title_bgm:s_Title.mp3;
 Game_Logo:WebGalEnter.png;

diff --git a/packages/webgal/src/Core/controller/gamePlay/backToTitle.ts b/packages/webgal/src/Core/controller/gamePlay/backToTitle.ts
@@ -1,4 +1,5 @@
 import { webgalStore } from '@/store/store';
+import { setStage } from '@/store/stageReducer';
 import { setVisibility } from '@/store/GUIReducer';
 import { stopAllPerform } from '@/Core/controller/gamePlay/stopAllPerform';
 import { stopAuto } from '@/Core/controller/gamePlay/autoPlay';
@@ -10,11 +11,12 @@ export const backToTitle = () => {
   stopAllPerform();
   stopAuto();
   stopFast();
+  // 清除语音
+  dispatch(setStage({ key: 'playVocal', value: '' }));
   // 重新打开标题界面
   dispatch(setVisibility({ component: 'showTitle', visibility: true }));
   /**
    * 重设为标题背景
    */
-
   setEbg(webgalStore.getState().GUI.titleBg);
 };
diff --git a/packages/webgal/src/Core/controller/stage/pixi/PixiController.ts b/packages/webgal/src/Core/controller/stage/pixi/PixiController.ts
@@ -664,9 +664,12 @@ export default class PixiStage {
       const children = container.children;
       for (const model of children) {
         // @ts-ignore
-        if (model?.internalModel)
+        if (model?.internalModel) {
           // @ts-ignore
           model?.internalModel?.coreModel?.setParamFloat?.('PARAM_MOUTH_OPEN_Y', paramY);
+          // @ts-ignore
+          model?.internalModel?.coreModel?.setParameterValueById('ParamMouthOpenY', paramY);
+        }
       }
     }
   }

diff --git a/packages/webgal/src/Core/controller/stage/playBgm.ts b/packages/webgal/src/Core/controller/stage/playBgm.ts
@@ -17,6 +17,8 @@ import { logger } from '@/Core/util/logger';
 //   webgalStore.dispatch(setStage({key: 'bgm', value: ''}));
 // };
 
+let emptyBgmTimeout: ReturnType<typeof setTimeout>;
+
 /**
  * 播放bgm
  * @param url bgm路径
@@ -26,9 +28,15 @@ import { logger } from '@/Core/util/logger';
 export function playBgm(url: string, enter = 0, volume = 100): void {
   logger.info('playing bgm' + url);
   if (url === '') {
+    emptyBgmTimeout = setTimeout(() => {
+      // 淡入淡出效果结束后，将 bgm 置空
+      webgalStore.dispatch(setStage({ key: 'bgm', value: { src: '', enter: 0, volume: 100 } }));
+    }, enter);
     const lastSrc = webgalStore.getState().stage.bgm.src;
     webgalStore.dispatch(setStage({ key: 'bgm', value: { src: lastSrc, enter: -enter, volume: volume } }));
   } else {
+    // 不要清除bgm了！
+    clearTimeout(emptyBgmTimeout);
     webgalStore.dispatch(setStage({ key: 'bgm', value: { src: url, enter: enter, volume: volume } }));
   }
   const audioElement = document.getElementById('currentBgm') as HTMLAudioElement;

diff --git a/packages/webgal/src/Core/gameScripts/label/jmp.ts b/packages/webgal/src/Core/gameScripts/label/jmp.ts
@@ -8,7 +8,7 @@ export const jmp = (labelName: string) => {
   const currentLine = WebGAL.sceneManager.sceneData.currentSentenceId;
   let result = currentLine;
   WebGAL.sceneManager.sceneData.currentScene.sentenceList.forEach((sentence, index) => {
-    if (sentence.command === commandType.label && sentence.content === labelName && index >= currentLine) {
+    if (sentence.command === commandType.label && sentence.content === labelName && index !== currentLine) {
       result = index;
     }
   });

diff --git a/packages/webgal/src/Core/gameScripts/say.ts b/packages/webgal/src/Core/gameScripts/say.ts
@@ -6,7 +6,7 @@ import { setStage } from '@/store/stageReducer';
 import { useTextDelay } from '@/hooks/useTextOptions';
 import { getRandomPerformName, PerformController } from '@/Core/Modules/perform/performController';
 import { getSentenceArgByKey } from '@/Core/util/getSentenceArg';
-import { textSize } from '@/store/userDataInterface';
+import { textSize, voiceOption } from '@/store/userDataInterface';
 import { WebGAL } from '@/Core/WebGAL';
 
 /**
@@ -37,9 +37,14 @@ export const say = (sentence: ISentence): IPerform => {
 
   // 设置文本显示
   dispatch(setStage({ key: 'showText', value: dialogToShow }));
-  // 清除语音
   dispatch(setStage({ key: 'vocal', value: '' }));
-  WebGAL.gameplay.performController.unmountPerform('vocal-play', true);
+
+  // 清除语音
+  if (!(userDataState.optionData.voiceInterruption === voiceOption.no && vocal === null)) {
+    // 只有开关设置为不中断，并且没有语音的时候，才需要不中断
+    dispatch(setStage({ key: 'playVocal', value: '' }));
+    WebGAL.gameplay.performController.unmountPerform('vocal-play', true);
+  }
   // 设置key
   dispatch(setStage({ key: 'currentDialogKey', value: dialogKey }));
   // 计算延迟

diff --git a/packages/webgal/src/Core/gameScripts/setVar.ts b/packages/webgal/src/Core/gameScripts/setVar.ts
@@ -14,8 +14,10 @@ export const setVar = (sentence: ISentence): IPerform => {
   if (sentence.content.match(/=/)) {
     const key = sentence.content.split(/=/)[0];
     const valExp = sentence.content.split(/=/)[1];
-    // 如果包含加减乘除号，则运算
-    if (valExp.match(/[+\-*\/()]/)) {
+    if (valExp === 'random()') {
+      webgalStore.dispatch(setStageVar({ key, value: Math.random() }));
+    } else if (valExp.match(/[+\-*\/()]/)) {
+      // 如果包含加减乘除号，则运算
       // 先取出运算表达式中的变量
       const valExpArr = valExp.split(/([+\-*\/()])/g);
       // 将变量替换为变量的值，然后合成表达式字符串

diff --git a/packages/webgal/src/Core/gameScripts/vocal/index.ts b/packages/webgal/src/Core/gameScripts/vocal/index.ts
@@ -60,6 +60,7 @@ export const playVocal = (sentence: ISentence) => {
   }
 
   // 获得舞台状态
+  webgalStore.dispatch(setStage({ key: 'playVocal', value: url }));
   webgalStore.dispatch(setStage({ key: 'vocal', value: url }));
 
   let isOver = false;

diff --git a/packages/webgal/src/Core/util/syncWithEditor/syncWithOrigine.ts b/packages/webgal/src/Core/util/syncWithEditor/syncWithOrigine.ts
@@ -14,6 +14,11 @@ export const syncWithOrigine = (sceneName: string, sentenceId: number) => {
   const dispatch = webgalStore.dispatch;
   dispatch(setVisibility({ component: 'showTitle', visibility: false }));
   dispatch(setVisibility({ component: 'showMenuPanel', visibility: false }));
+  dispatch(setVisibility({ component: 'isShowLogo', visibility: false }));
+  const title = document.getElementById('Title_enter_page');
+  if (title) {
+    title.style.display = 'none';
+  }
   resetStage(true);
   // 重新获取初始场景
   const sceneUrl: string = assetSetter(sceneName, fileType.scene);

diff --git a/packages/webgal/src/Stage/AudioContainer/AudioContainer.tsx b/packages/webgal/src/Stage/AudioContainer/AudioContainer.tsx
@@ -124,7 +124,7 @@ export const AudioContainer = () => {
         loop={true}
         autoPlay={isEnterGame}
       />
-      <audio id="currentVocal" src={stageStore.vocal} />
+      <audio id="currentVocal" src={stageStore.playVocal} />
     </div>
   );
 };
diff --git a/packages/webgal/src/Stage/Stage.tsx b/packages/webgal/src/Stage/Stage.tsx
@@ -16,12 +16,34 @@ import { isIOS } from '@/Core/initializeScript';
 import { WebGAL } from '@/Core/WebGAL';
 // import OldStage from '@/Components/Stage/OldStage/OldStage';
 
+function inTextBox(event: React.MouseEvent) {
+  const tb = document.getElementById("textBoxMain")
+  if (!tb) {
+    return false
+  }
+  var bounds = tb.getBoundingClientRect();
+  return event.clientX > bounds.left &&
+    event.clientX < bounds.right &&
+    event.clientY > bounds.top &&
+    event.clientY < bounds.bottom
+}
+
 export const Stage: FC = () => {
   const stageState = useSelector((state: RootState) => state.stage);
   const GUIState = useSelector((state: RootState) => state.GUI);
   const dispatch = useDispatch();
 
   useHotkey();
+
+  const checkPosition = (event: React.MouseEvent) => {
+    if (!GUIState.controlsVisibility && inTextBox(event)) {
+      dispatch(setVisibility({ component: 'controlsVisibility', visibility: true }))
+    }
+    if (GUIState.controlsVisibility && !inTextBox(event)) {
+      dispatch(setVisibility({ component: 'controlsVisibility', visibility: false }))
+    }
+  }
+
   return (
     <div className={styles.MainStage_main}>
       <FullScreenPerform />
@@ -48,6 +70,9 @@ export const Stage: FC = () => {
         }}
         id="FullScreenClick"
         style={{ width: '100%', height: '100%', position: 'absolute', zIndex: '12', top: '0' }}
+        onMouseMove={
+          (e) => !GUIState.showControls && checkPosition(e)
+        }
       />
       <IntroContainer />
     </div>

diff --git a/packages/webgal/src/Stage/TextBox/TextBox.tsx b/packages/webgal/src/Stage/TextBox/TextBox.tsx
@@ -1,4 +1,4 @@
-import { FC, ReactNode, useEffect } from 'react';
+import { FC, ReactNode, useEffect, useState } from 'react';
 import { useSelector } from 'react-redux';
 import { RootState } from '@/store/store';
 import { useFontFamily } from '@/hooks/useFontFamily';
@@ -10,7 +10,9 @@ import { IWebGalTextBoxTheme } from '@/Stage/themeInterface';
 import { match } from '@/Core/util/match';
 import { textSize } from '@/store/userDataInterface';
 
-const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
+const userAgent = navigator.userAgent;
+const isFirefox = /firefox/i.test(userAgent);
+const isSafari = /^((?!chrome|android).)*safari/i.test(userAgent);
 
 function getTextboxByTheme(theme: IWebGalTextBoxTheme): FC<ITextboxProps> {
   switch (theme) {
@@ -24,6 +26,34 @@ function getTextboxByTheme(theme: IWebGalTextBoxTheme): FC<ITextboxProps> {
 }
 
 export const TextBox = () => {
+  const [isShowStroke, setIsShowStroke] = useState(true);
+
+  useEffect(() => {
+    const handleResize = () => {
+      const targetHeight = 1440;
+      const targetWidth = 2560;
+
+      const h = window.innerHeight; // 窗口高度
+      const w = window.innerWidth; // 窗口宽度
+      const zoomH = h / targetHeight; // 以窗口高度为基准的变换比
+      const zoomW = w / targetWidth; // 以窗口宽度为基准的变换比
+      const zoomH2 = w / targetHeight; // 竖屏时以窗口高度为基础的变换比
+      const zoomW2 = h / targetWidth; // 竖屏时以窗口宽度为基础的变换比
+      [zoomH, zoomW, zoomH2, zoomW2].forEach((e) => {
+        if (e <= 0.2) {
+          setIsShowStroke(false);
+        } else {
+          setIsShowStroke(true);
+        }
+      });
+    };
+    window.addEventListener('resize', handleResize);
+    handleResize();
+    return () => {
+      window.removeEventListener('resize', handleResize);
+    };
+  }, []);
+
   const stageState = useSelector((state: RootState) => state.stage);
   const userDataState = useSelector((state: RootState) => state.userData);
   useEffect(() => {});
@@ -60,11 +90,13 @@ export const TextBox = () => {
       fontSize={size}
       currentDialogKey={currentDialogKey}
       isSafari={isSafari}
+      isFirefox={isFirefox}
       miniAvatar={miniAvatar}
       textDuration={textDuration}
       font={font}
       textSizeState={textSizeState}
       lineLimit={lineLimit}
+      isUseStroke={isShowStroke}
     />
   );
 };

diff --git a/packages/webgal/src/Stage/TextBox/themes/imss/IMSSTextbox.tsx b/packages/webgal/src/Stage/TextBox/themes/imss/IMSSTextbox.tsx
@@ -11,11 +11,13 @@ export default function IMSSTextbox(props: ITextboxProps) {
     currentDialogKey,
     isText,
     isSafari,
+    isFirefox: boolean,
     fontSize,
     miniAvatar,
     showName,
     font,
     textDuration,
+    isUseStroke,
   } = props;
 
   useEffect(() => {
@@ -53,7 +55,7 @@ export default function IMSSTextbox(props: ITextboxProps) {
           <span className={styles.zhanwei}>
             {e}
             <span className={styles.outer}>{e}</span>
-            <span className={styles.inner}>{e}</span>
+            {isUseStroke && <span className={styles.inner}>{e}</span>}
           </span>
         </span>
       );
@@ -69,7 +71,7 @@ export default function IMSSTextbox(props: ITextboxProps) {
         <span className={styles.zhanwei}>
           {e}
           <span className={styles.outer}>{e}</span>
-          <span className={styles.inner}>{e}</span>
+          {isUseStroke && <span className={styles.inner}>{e}</span>}
         </span>
       </span>
     );
@@ -94,7 +96,7 @@ export default function IMSSTextbox(props: ITextboxProps) {
                     <span className={styles.zhanwei}>
                       {e}
                       <span className={styles.outerName}>{e}</span>
-                      <span className={styles.innerName}>{e}</span>
+                      {isUseStroke && <span className={styles.innerName}>{e}</span>}
                     </span>
                   </span>
                 );
@@ -105,7 +107,9 @@ export default function IMSSTextbox(props: ITextboxProps) {
             className={styles.text}
             style={{
               fontSize,
-              wordBreak: isSafari ? 'break-word' : undefined,
+              wordBreak: isSafari || props.isFirefox ? 'break-all' : undefined,
+              display: isSafari ? 'flex' : undefined,
+              flexWrap: isSafari ? 'wrap' : undefined,
               overflow: 'hidden',
               paddingLeft: '0.1em',
               WebkitLineClamp: props.lineLimit,

diff --git a/packages/webgal/src/Stage/TextBox/themes/imss/imss.module.scss b/packages/webgal/src/Stage/TextBox/themes/imss/imss.module.scss
@@ -18,7 +18,7 @@ $height: 330px;
   right: 25px;
   min-height: $height;
   max-height: $height;
-  background-image: linear-gradient(rgba(245, 247, 250, 0.8) 0%, rgba(189, 198, 222, 0.8) 100%);
+  background-image: linear-gradient(rgba(245, 247, 250, 0.95) 0%, rgba(189, 198, 222, 0.95) 100%);
   background-blend-mode: darken;
   //background: white;
   border-radius: calc($height / 2) 20px 20px calc($height / 2);
@@ -33,7 +33,7 @@ $height: 330px;
   align-items: flex-start;
   animation: showSoftly 0.7s ease-out forwards;
   letter-spacing: 0.2em;
-  backdrop-filter: blur(5px);
+  //backdrop-filter: blur(5px);
   transition: left 0.33s;
 }