Merge pull request #38 from Live2D/develop

Update to Cubism 4 SDK for Web R3

CHANGELOG.md

@@ -5,6 +5,20 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 
 
+## [4-r.3] - 2021-06-10
+
+### Fixed
+
+* Fixed the model path. It was causing a 404 when an exact path was required.
+
+## [4-r.3-beta.1] - 2021-05-13
+
+### Added
+
+* Add the sample to manipulate the lip-sync from a waveform on the audio file(.wav).
+* Add sample voices to `Haru`.
+
+
 ## [4-r.2] - 2021-03-09
 
 ### Added
@@ -73,7 +87,8 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 
 * Fix issue with reloading model images in WebKit.
 
-
+[4-r.3]: https://github.com/Live2D/CubismWebSamples/compare/4-r.3-beta.1...4-r.3
+[4-r.3-beta.1]: https://github.com/Live2D/CubismWebSamples/compare/4-r.2...4-r.3-beta.1
 [4-r.2]: https://github.com/Live2D/CubismWebSamples/compare/4-r.1...4-r.2
 [4-r.1]: https://github.com/Live2D/CubismWebSamples/compare/4-beta.2...4-r.1
 [4-beta.2]: https://github.com/Live2D/CubismWebSamples/compare/4-beta.1...4-beta.2

Core/CHANGELOG.md

@@ -5,6 +5,19 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 
 
+## 2021-03-09
+
+### Added
+* Add funtcions for Viewer.
+
+  * `csmGetParameterKeyCounts`
+  * `csmGetParameterKeyValues`
+
+### Changed
+
+* Update Core version to `04.01.0000`.
+
+
 ## 2020-01-30
 
 ### Added

LICENSE.md

@@ -6,6 +6,7 @@ Cubism Web Samples is included in Live2D Cubism Components.
 
 Cubism Web Samples は Live2D Cubism Components に含まれます。
 
+Cubism Web Samples 包括在 Live2D Cubism Components 中。
 
 ## Cubism SDK Release License
 
@@ -17,13 +18,17 @@ Cubism Web Samples は Live2D Cubism Components に含まれます。
 
 * [Cubism SDK リリースライセンス](https://www.live2d.com/ja/download/cubism-sdk/release-license/)
 
+如果您的企业在最近一个会计年度的销售额达到或超过1000万日元，您必须得到Cubism SDK的出版授权许可（出版许可协议）。
+
+* [Cubism SDK发行许可证](https://www.live2d.com/zh-CHS/download/cubism-sdk/release-license/)
 
 ## Live2D Open Software License
 
 Live2D Cubism Components is available under Live2D Open Software License.
 
 * [Live2D Open Software License](https://www.live2d.com/eula/live2d-open-software-license-agreement_en.html)
 * [Live2D Open Software 使用許諾契約書](https://www.live2d.com/eula/live2d-open-software-license-agreement_jp.html)
+* [Live2D Open Software 使用授权协议](https://www.live2d.com/eula/live2d-open-software-license-agreement_cn.html)
 
 
 ## Live2D Proprietary Software License
@@ -32,6 +37,7 @@ Live2D Cubism Core is available under Live2D Proprietary Software License.
 
 * [Live2D Proprietary Software License Agreement](https://www.live2d.com/eula/live2d-proprietary-software-license-agreement_en.html)
 * [Live2D Proprietary Software 使用許諾契約書](https://www.live2d.com/eula/live2d-proprietary-software-license-agreement_jp.html)
+* [Live2D Proprietary Software 使用授权协议](https://www.live2d.com/eula/live2d-proprietary-software-license-agreement_cn.html)
 
 
 ## Free Material License
@@ -40,6 +46,7 @@ Live2D models listed below are available under Free Material License.
 
 * [Free Material License Agreement](https://www.live2d.com/eula/live2d-free-material-license-agreement_en.html)
 * [無償提供マテリアルの使用許諾契約書](https://www.live2d.com/eula/live2d-free-material-license-agreement_jp.html)
+* [无偿提供素材使用授权协议](https://www.live2d.com/eula/live2d-free-material-license-agreement_cn.html)
 
 ```
 Samples/Resources/Haru

README.md

@@ -80,32 +80,29 @@ NOTE: デバック用の設定は、`.vscode/launch.json` に記述していま
 
 ### Node.js
 
-* 15.11.0
-* 14.16.0
-* 12.21.0
-* 10.24.0
+* 16.1.0
+* 14.17.0
+* 12.22.1
 
 
 ## 動作確認環境
 
 | プラットフォーム | ブラウザ | バージョン |
 | --- | --- | --- |
-| Android | Google Chrome | 88.0.4324.181 |
-| Android | Microsoft Edge | 46.01.4.5140 |
-| Android | Mozilla Firefox | 86.1.1 |
-| iOS / iPadOS | Google Chrome | 87.0.4280.77 |
-| iOS / iPadOS | Microsoft Edge | 46.1.10 |
-| iOS / iPadOS | Mozilla Firefox | 32.0 |
-| iOS / iPadOS | Safari | 604.1 |
-| Linux | Google Chrome | 89.0.4389.72 |
-| Linux | Mozilla Firefox | 86.0 |
-| macOS | Google Chrome | 88.0.4324.192 |
-| macOS | Microsoft Edge | 88.0.705.81 |
-| macOS | Mozilla Firefox | 86.0 |
-| macOS | Safari | 14.0.2 |
-| Windows | Google Chrome | 88.0.4324.190 |
-| Windows | Internet Explorer 11 | 20H2(19042.685) |
-| Windows | Microsoft Edge | 88.0.705.74 |
-| Windows | Mozilla Firefox | 86.0 |
+| Android | Google Chrome | 90.0.4430.210 |
+| Android | Microsoft Edge | 46.04.4.5157 |
+| Android | Mozilla Firefox | 88.1.4 |
+| iOS / iPadOS | Google Chrome | 90.0.4430.216 |
+| iOS / iPadOS | Microsoft Edge | 46.3.13 |
+| iOS / iPadOS | Mozilla Firefox | 33.1 |
+| iOS / iPadOS | Safari | 14.1 |
+| macOS | Google Chrome | 91.0.4472.77 |
+| macOS | Microsoft Edge | 90.0.818.66 |
+| macOS | Mozilla Firefox | 88.0.1 |
+| macOS | Safari | 14.1 |
+| Windows | Google Chrome | 91.0.4472.77 |
+| Windows | Internet Explorer 11 | 19041.928 |
+| Windows | Microsoft Edge | 90.0.818.66 |
+| Windows | Mozilla Firefox | 88.0.1 |
 
 Note: 動作確認時のサーバの起動は `./Samples/TypeScript/Demo/package.json` の `serve` スクリプトを使用して行っています。

Samples/Resources/Haru/Haru.model3.json

@@ -23,10 +23,14 @@
 			  {"File":"motions/haru_g_m15.motion3.json" ,"FadeInTime":0.5, "FadeOutTime":0.5}
 			],
 			"TapBody": [
-			  {"File":"motions/haru_g_m06.motion3.json" ,"FadeInTime":0.5, "FadeOutTime":0.5},
-			  {"File":"motions/haru_g_m09.motion3.json" ,"FadeInTime":0.5, "FadeOutTime":0.5},
-			  {"File":"motions/haru_g_m20.motion3.json" ,"FadeInTime":0.5, "FadeOutTime":0.5},
-			  {"File":"motions/haru_g_m26.motion3.json" ,"FadeInTime":0.5, "FadeOutTime":0.5}
+			  {"File":"motions/haru_g_m06.motion3.json" ,"FadeInTime":0.5, "FadeOutTime":0.5
+				,"Sound": "sounds/haru_normal_01.wav"},
+			  {"File":"motions/haru_g_m09.motion3.json" ,"FadeInTime":0.5, "FadeOutTime":0.5
+				,"Sound": "sounds/haru_normal_02.wav"},
+			  {"File":"motions/haru_g_m20.motion3.json" ,"FadeInTime":0.5, "FadeOutTime":0.5
+				,"Sound": "sounds/haru_normal_03.wav"},
+			  {"File":"motions/haru_g_m26.motion3.json" ,"FadeInTime":0.5, "FadeOutTime":0.5
+				,"Sound": "sounds/haru_normal_04.wav"}
 			]
 		},
 		"UserData": "Haru.userdata3.json"
@@ -52,4 +56,4 @@
 		{"Name":"Head", "Id":"HitArea"},
 		{"Name":"Body", "Id":"HitArea2"}
 	]
-}
+}

Samples/TypeScript/Demo/src/lappmodel.ts

@@ -38,6 +38,7 @@ import * as LAppDefine from './lappdefine';
 import { canvas, frameBuffer, gl, LAppDelegate } from './lappdelegate';
 import { LAppPal } from './lapppal';
 import { TextureInfo } from './lapptexturemanager';
+import { LAppWavFileHandler } from './lappwavfilehandler';
 
 enum LoadStep {
   LoadAssets,
@@ -78,7 +79,7 @@ export class LAppModel extends CubismUserModel {
   public loadAssets(dir: string, fileName: string): void {
     this._modelHomeDir = dir;
 
-    fetch(`${this._modelHomeDir}/${fileName}`)
+    fetch(`${this._modelHomeDir}${fileName}`)
       .then(response => response.arrayBuffer())
       .then(arrayBuffer => {
         const setting: ICubismModelSetting = new CubismModelSettingJson(
@@ -110,7 +111,7 @@ export class LAppModel extends CubismUserModel {
     if (this._modelSetting.getModelFileName() != '') {
       const modelFileName = this._modelSetting.getModelFileName();
 
-      fetch(`${this._modelHomeDir}/${modelFileName}`)
+      fetch(`${this._modelHomeDir}${modelFileName}`)
         .then(response => response.arrayBuffer())
         .then(arrayBuffer => {
           this.loadModel(arrayBuffer);
@@ -136,7 +137,7 @@ export class LAppModel extends CubismUserModel {
             i
           );
 
-          fetch(`${this._modelHomeDir}/${expressionFileName}`)
+          fetch(`${this._modelHomeDir}${expressionFileName}`)
             .then(response => response.arrayBuffer())
             .then(arrayBuffer => {
               const motion: ACubismMotion = this.loadExpression(
@@ -178,7 +179,7 @@ export class LAppModel extends CubismUserModel {
       if (this._modelSetting.getPhysicsFileName() != '') {
         const physicsFileName = this._modelSetting.getPhysicsFileName();
 
-        fetch(`${this._modelHomeDir}/${physicsFileName}`)
+        fetch(`${this._modelHomeDir}${physicsFileName}`)
           .then(response => response.arrayBuffer())
           .then(arrayBuffer => {
             this.loadPhysics(arrayBuffer, arrayBuffer.byteLength);
@@ -202,7 +203,7 @@ export class LAppModel extends CubismUserModel {
       if (this._modelSetting.getPoseFileName() != '') {
         const poseFileName = this._modelSetting.getPoseFileName();
 
-        fetch(`${this._modelHomeDir}/${poseFileName}`)
+        fetch(`${this._modelHomeDir}${poseFileName}`)
           .then(response => response.arrayBuffer())
           .then(arrayBuffer => {
             this.loadPose(arrayBuffer, arrayBuffer.byteLength);
@@ -273,7 +274,7 @@ export class LAppModel extends CubismUserModel {
       if (this._modelSetting.getUserDataFile() != '') {
         const userDataFile = this._modelSetting.getUserDataFile();
 
-        fetch(`${this._modelHomeDir}/${userDataFile}`)
+        fetch(`${this._modelHomeDir}${userDataFile}`)
           .then(response => response.arrayBuffer())
           .then(arrayBuffer => {
             this.loadUserData(arrayBuffer, arrayBuffer.byteLength);
@@ -507,7 +508,10 @@ export class LAppModel extends CubismUserModel {
 
     // リップシンクの設定
     if (this._lipsync) {
-      const value = 0; // リアルタイムでリップシンクを行う場合、システムから音量を取得して、0~1の範囲で値を入力します。
+      let value = 0.0; // リアルタイムでリップシンクを行う場合、システムから音量を取得して、0~1の範囲で値を入力します。
+
+      this._wavFileHandler.update(deltaTimeSeconds);
+      value = this._wavFileHandler.getRms();
 
       for (let i = 0; i < this._lipSyncIds.getSize(); ++i) {
         this._model.addParameterValueById(this._lipSyncIds.at(i), value, 0.8);
@@ -553,7 +557,7 @@ export class LAppModel extends CubismUserModel {
     let autoDelete = false;
 
     if (motion == null) {
-      fetch(`${this._modelHomeDir}/${motionFileName}`)
+      fetch(`${this._modelHomeDir}${motionFileName}`)
         .then(response => response.arrayBuffer())
         .then(arrayBuffer => {
           motion = this.loadMotion(
@@ -583,6 +587,14 @@ export class LAppModel extends CubismUserModel {
       motion.setFinishedMotionHandler(onFinishedMotionHandler);
     }
 
+    //voice
+    const voice = this._modelSetting.getMotionSoundFileName(group, no);
+    if (voice.localeCompare('') != 0) {
+      let path = voice;
+      path = this._modelHomeDir + path;
+      this._wavFileHandler.start(path);
+    }
+
     if (this._debugMode) {
       LAppPal.printMessage(`[APP]start motion: [${group}_${no}`);
     }
@@ -711,7 +723,7 @@ export class LAppModel extends CubismUserModel {
         );
       }
 
-      fetch(`${this._modelHomeDir}/${motionFileName}`)
+      fetch(`${this._modelHomeDir}${motionFileName}`)
         .then(response => response.arrayBuffer())
         .then(arrayBuffer => {
           const tmpMotion: CubismMotion = this.loadMotion(
@@ -843,6 +855,7 @@ export class LAppModel extends CubismUserModel {
     this._textureCount = 0;
     this._motionCount = 0;
     this._allMotionCount = 0;
+    this._wavFileHandler = new LAppWavFileHandler();
   }
 
   _modelSetting: ICubismModelSetting; // モデルセッティング情報
@@ -870,4 +883,5 @@ export class LAppModel extends CubismUserModel {
   _textureCount: number; // テクスチャカウント
   _motionCount: number; // モーションデータカウント
   _allMotionCount: number; // モーション総数
+  _wavFileHandler: LAppWavFileHandler; //wavファイルハンドラ
 }