lobehub
diff --git a/‎src/features/DanceList/Item/index.tsx
Lines changed: 7 additions & 7 deletions b/‎src/features/DanceList/Item/index.tsx
Lines changed: 7 additions & 7 deletions
diff --git a/‎src/features/audioPlayer/audioPlayer.ts
Lines changed: 1 addition & 0 deletions b/‎src/features/audioPlayer/audioPlayer.ts
Lines changed: 1 addition & 0 deletions
diff --git a/‎src/libs/vrmViewer/model.ts
Lines changed: 2 additions & 7 deletions b/‎src/libs/vrmViewer/model.ts
Lines changed: 2 additions & 7 deletions
@@ -33,7 +33,7 @@ const DanceItem = (props: DanceItemProps) => {
     s.setCurrentPlayId,
   ]);
 
-  const [isPlaying, setIsPlaying] = useGlobalStore((s) => [s.isPlaying, s.setIsPlaying]);
+  const [isPlaying, setIsPlaying] = useState(false);
 
   const isCurrentPlay = currentPlayId ? currentPlayId === danceItem.danceId : false;
   const isSelected = currentIdentifier === danceItem.danceId;
@@ -45,7 +45,7 @@ const DanceItem = (props: DanceItemProps) => {
   const { downloading: danceDownloading, percent: dancePercent, fetchDanceUrl } = useLoadDance();
   const viewer = useGlobalStore((s) => s.viewer);
 
-  const handlePlayPause = () => {
+  const handlePlayPause = async () => {
     viewer.model?.disposeAll();
     if (isPlaying && isCurrentPlay) {
       setIsPlaying(false);
@@ -55,11 +55,11 @@ const DanceItem = (props: DanceItemProps) => {
       setIsPlaying(true);
       const audioPromise = fetchAudioUrl(danceItem.danceId, danceItem.audio);
       const dancePromise = fetchDanceUrl(danceItem.danceId, danceItem.src);
-      Promise.all([dancePromise, audioPromise]).then((res) => {
-        if (!res) return;
-        const [danceUrl, audioUrl] = res;
-        if (danceUrl && audioUrl) viewer.model?.dance(danceUrl, audioUrl);
-      });
+      const [danceUrl, audioUrl] = await Promise.all([dancePromise, audioPromise]);
+      if (danceUrl && audioUrl)
+        viewer.model?.dance(danceUrl, audioUrl, () => {
+          setIsPlaying(false);
+        });
     }
   };
 
 
@@ -8,6 +8,7 @@ export class AudioPlayer {
   }
 
   public async playFromArrayBuffer(buffer: ArrayBuffer, onEnded?: () => void) {
+    this.stopPlay();
     const audioBuffer = await this.audio.decodeAudioData(buffer);
 
     this.bufferSource = this.audio.createBufferSource();
 
@@ -31,15 +31,13 @@ export class Model {
   private _audioPlayer?: AudioPlayer;
   private _action: AnimationAction | undefined;
   private _clip: AnimationClip | undefined;
-  private _audio: string | undefined;
 
   constructor(lookAtTargetParent: THREE.Object3D) {
     this._lookAtTargetParent = lookAtTargetParent;
     this._lipSync = new LipSync(new AudioContext());
     this._audioPlayer = new AudioPlayer(new AudioContext());
     this._action = undefined;
     this._clip = undefined;
-    this._audio = undefined;
   }
 
   public async loadVRM(url: string): Promise<void> {
@@ -96,10 +94,7 @@ export class Model {
       this._action = undefined;
     }
 
-    if (this._audio) {
-      this._audioPlayer?.stopPlay();
-      this._audio = undefined;
-    }
+    this._audioPlayer?.stopPlay();
   }
 
   /**
@@ -164,9 +159,9 @@ export class Model {
       const action = mixer.clipAction(clip);
       action.setLoop(LoopOnce, 1).play(); // play animation
       this._audioPlayer?.playFromURL(audioUrl, () => {
+        this.disposeAll();
         onEnd?.();
       });
-      this._audio = audioUrl;
 
       this._action = action;
       this._clip = clip;
Original file line number	Diff line number	Diff line change
`@@ -8,6 +8,7 @@ export class AudioPlayer {`
`8`	`8`	`}`
`9`	`9`
`10`	`10`	`public async playFromArrayBuffer(buffer: ArrayBuffer, onEnded?: () => void) {`
	`11`	`+ this.stopPlay();`
`11`	`12`	`const audioBuffer = await this.audio.decodeAudioData(buffer);`
`12`	`13`
`13`	`14`	`this.bufferSource = this.audio.createBufferSource();`