Fix audio & video simultaneous play

src/components/appAudio.ts

@@ -8,6 +8,8 @@ class AppAudio {
   private container: HTMLElement;
   private audios: {[mid: string]: HTMLAudioElement} = {};
   private playingAudio: HTMLAudioElement;
+  
+  public willBePlayedAudio: HTMLAudioElement;
 
   private prevMid: number;
   private nextMid: number;
@@ -109,7 +111,7 @@ class AppAudio {
         this.addAudio(message.media.document, mid);
       });
       
-      console.log('loadSiblingsAudio', audio, type, mid, value, this.prevMid, this.nextMid);
+      //console.log('loadSiblingsAudio', audio, type, mid, value, this.prevMid, this.nextMid);
     });
   }
   
@@ -122,6 +124,15 @@ class AppAudio {
       this.playingAudio.pause();
     }
   }
+
+  public pause() {
+    if(!this.playingAudio || this.playingAudio.paused) return;
+    this.playingAudio.pause();
+  }
+
+  public willBePlayed(audio: HTMLAudioElement) {
+    this.willBePlayedAudio = audio;
+  }
 }
 
 const appAudio = new AppAudio();

src/components/audio.ts

@@ -393,6 +393,8 @@ export default class AudioElement extends HTMLElement {
         const r = () => {
           onLoad();
 
+          appAudio.willBePlayed(this.audio); // prepare for loading audio
+
           if(!preloader) {
             preloader = new ProgressivePreloader(null, false);
           }
@@ -405,7 +407,14 @@ export default class AudioElement extends HTMLElement {
             else this.addAudioListener('canplay', resolve);
           }).then(() => {
             downloadDiv.remove();
-            this.audio.play();
+
+            //setTimeout(() => {
+              // release loaded audio
+              if(appAudio.willBePlayedAudio == this.audio) {
+                this.audio.play();
+                appAudio.willBePlayedAudio = null;
+              }
+            //}, 10e3);
           });
         };
         

src/lib/appManagers/appDocsManager.ts

@@ -105,8 +105,6 @@ class AppDocsManager {
     if(!apiDoc.mime_type) {
       switch(apiDoc.type) {
         case 'gif':
-          apiDoc.mime_type = 'video/mp4';
-          break;
         case 'video':
         case 'round':
           apiDoc.mime_type = 'video/mp4';

src/lib/appManagers/appMediaViewer.ts

@@ -12,6 +12,7 @@ import AvatarElement from "../../components/avatar";
 import LazyLoadQueue from "../../components/lazyLoadQueue";
 import appForward from "../../components/appForward";
 import { isSafari, mediaSizes } from "../config";
+import appAudio from "../../components/appAudio";
 
 export class AppMediaViewer {
   public wholeDiv = document.querySelector('.media-viewer-whole') as HTMLDivElement;
@@ -795,6 +796,10 @@ export class AppMediaViewer {
               div.append(video);
             }
 
+            // fix for simultaneous play
+            appAudio.pause();
+            appAudio.willBePlayedAudio = null;
+
             const player = new VideoPlayer(video, true, media.supportsStreaming);
             return player;
             /* player.wrapper.parentElement.append(video);