Pause media on voice recording start

Hide audio bar when on last audio's end

src/components/appMediaPlaybackController.ts

@@ -529,7 +529,10 @@ class AppMediaPlaybackController {
 
     //console.log('on media end');
 
-    this.next();
+    if(!this.next()) {
+      this.stop();
+      rootScope.dispatchEvent('media_stop');
+    }
   };
 
   public toggle(play?: boolean) {
@@ -658,10 +661,12 @@ class AppMediaPlaybackController {
         },
         onJump: (item, older) => {
           this.playItem(item);
+        },
+        onEmptied: () => {
+          rootScope.dispatchEvent('media_stop');
+          this.stop();
         }
       });
-
-      this.listLoader.onEmptied = this.stop;
     } else {
       this.listLoader.reset();
     }
@@ -691,13 +696,14 @@ class AppMediaPlaybackController {
     }
   }
 
-  public setSingleMedia(media: HTMLMediaElement, message: Message.message) {
+  public setSingleMedia(media?: HTMLMediaElement, message?: Message.message) {
     const playingMedia = this.playingMedia;
 
     const wasPlaying = this.pause();
 
     this.willBePlayed(undefined);
-    this.setMedia(media, message);
+    if(media) this.setMedia(media, message);
+    else this.playingMedia = undefined;
     this.toggleSwitchers(false);
 
     return () => {
@@ -711,7 +717,7 @@ class AppMediaPlaybackController {
         }
       }
 
-      if(this.playingMedia === media) {
+      if(media && this.playingMedia === media) {
         this.stop();
       }
 

src/components/chat/audio.ts

@@ -115,5 +115,9 @@ export default class ChatAudio extends PinnedContainer {
     this.topbar.listenerSetter.add(rootScope)('media_pause', () => {
       this.toggleEl.classList.remove('flip-icon');
     });
+
+    this.topbar.listenerSetter.add(rootScope)('media_stop', () => {
+      this.toggle(true);
+    });
   }
 }

src/components/chat/input.ts

@@ -80,6 +80,7 @@ import fixSafariStickyInputFocusing, { IS_STICKY_INPUT_BUGGED } from '../../help
 import { copy } from '../../helpers/object';
 import PopupPeer from '../popups/peer';
 import MEDIA_MIME_TYPES_SUPPORTED from '../../environment/mediaMimeTypesSupport';
+import appMediaPlaybackController from '../appMediaPlaybackController';
 
 const RECORD_MIN_TIME = 500;
 const POSTING_MEDIA_NOT_ALLOWED = 'Posting media content isn\'t allowed in this group.';
@@ -176,6 +177,8 @@ export default class ChatInput {
   private fakePinnedControlBtn: HTMLElement;
 
   private previousQuery: string;
+  
+  private releaseMediaPlayback: () => void;
 
   constructor(private chat: Chat, 
     private appMessagesManager: AppMessagesManager, 
@@ -575,6 +578,11 @@ export default class ChatInput {
       };
   
       this.recorder.ondataavailable = (typedArray: Uint8Array) => {
+        if(this.releaseMediaPlayback) {
+          this.releaseMediaPlayback();
+          this.releaseMediaPlayback = undefined;
+        }
+
         if(this.recordingOverlayListener) {
           this.listenerSetter.remove(this.recordingOverlayListener);
           this.recordingOverlayListener = undefined;
@@ -1455,7 +1463,9 @@ export default class ChatInput {
 
       this.chatInput.classList.add('is-locked');
       blurActiveElement();
+
       this.recorder.start().then(() => {
+        this.releaseMediaPlayback = appMediaPlaybackController.setSingleMedia();
         this.recordCanceled = false;
         
         this.chatInput.classList.add('is-recording');

src/helpers/searchListLoader.ts

@@ -85,11 +85,11 @@ export default class SearchListLoader<Item extends {mid: number, peerId: number}
     forEachReverse(this.next, filter);
 
     if(this.current && shouldBeDeleted(this.current)) {
-      if(this.go(1)) {
+      /* if(this.go(1)) {
         this.previous.splice(this.previous.length - 1, 1);
       } else if(this.go(-1)) {
         this.next.splice(0, 1);
-      } else if(this.onEmptied) {
+      } else  */if(this.onEmptied) {
         this.onEmptied();
       }
     }

src/lib/rootScope.ts

@@ -78,6 +78,7 @@ export type BroadcastEvents = {
   'media_play': {doc: MyDocument, message: Message.message, media: HTMLMediaElement},
   'media_pause': void,
   'media_playback_params': {volume: number, muted: boolean, playbackRate: number},
+  'media_stop': void,
   
   'state_cleared': void,
   'state_synchronized': number | void,