Rename files

ts/state/smart/VoiceNotesPlaybackProvider.preload.tsx

@@ -0,0 +1,242 @@
+// Copyright 2021 Signal Messenger, LLC
+// SPDX-License-Identifier: AGPL-3.0-only
+
+import React, { memo, useEffect } from 'react';
+import { useSelector } from 'react-redux';
+import type { VoiceNotesPlaybackProps } from '../../components/VoiceNotesPlaybackContext.dom.js';
+import { VoiceNotesPlaybackProvider } from '../../components/VoiceNotesPlaybackContext.dom.js';
+import { selectAudioPlayerActive } from '../selectors/audioPlayer.preload.js';
+import {
+  AudioPlayerContent,
+  useAudioPlayerActions,
+} from '../ducks/audioPlayer.preload.js';
+import { globalMessageAudio } from '../../services/globalMessageAudio.std.js';
+import { strictAssert } from '../../util/assert.std.js';
+import { drop } from '../../util/drop.std.js';
+import { createLogger } from '../../logging/log.std.js';
+import { Sound, SoundType } from '../../util/Sound.std.js';
+import { getConversations } from '../selectors/conversations.dom.js';
+import { SeenStatus } from '../../MessageSeenStatus.std.js';
+import { markViewed } from '../ducks/conversations.preload.js';
+import * as Errors from '../../types/errors.std.js';
+import { usePrevious } from '../../hooks/usePrevious.std.js';
+
+const log = createLogger('VoiceNotesPlaybackProvider');
+
+const stateChangeConfirmDownSound = new Sound({
+  soundType: SoundType.VoiceNoteStart,
+});
+const stateChangeConfirmUpSound = new Sound({
+  soundType: SoundType.VoiceNoteEnd,
+});
+
+/**
+ * Synchronizes the audioPlayer redux state with globalMessageAudio
+ */
+export const SmartVoiceNotesPlaybackProvider = memo(
+  function SmartVoiceNotesPlaybackProvider(props: VoiceNotesPlaybackProps) {
+    const active = useSelector(selectAudioPlayerActive);
+    const conversations = useSelector(getConversations);
+
+    const previousStartPosition = usePrevious(undefined, active?.startPosition);
+
+    const content = active?.content;
+    let url: undefined | string;
+    let messageId: undefined | string;
+    let messageIdForLogging: undefined | string;
+    let playNextConsecutiveSound = false;
+    let playFinishConsecutiveSound = false;
+
+    if (content && AudioPlayerContent.isVoiceNote(content)) {
+      ({ url, id: messageId } = content.current);
+      messageIdForLogging = content.current.messageIdForLogging;
+      playNextConsecutiveSound = content.isConsecutive;
+      playFinishConsecutiveSound =
+        content.isConsecutive && content.queue.length === 0;
+    }
+    if (content && AudioPlayerContent.isDraft(content)) {
+      url = content.url;
+    }
+
+    const {
+      messageAudioEnded,
+      currentTimeUpdated,
+      durationChanged,
+      unloadMessageAudio,
+    } = useAudioPlayerActions();
+
+    useEffect(() => {
+      // if we don't have a new audio source
+      // just control playback
+      if (!content || !url || url === globalMessageAudio.url) {
+        if (!active?.playing && globalMessageAudio.playing) {
+          globalMessageAudio.pause();
+        }
+
+        if (active?.playing && !globalMessageAudio.playing) {
+          globalMessageAudio.play();
+        }
+
+        if (active && active.playbackRate !== globalMessageAudio.playbackRate) {
+          globalMessageAudio.playbackRate = active.playbackRate;
+        }
+
+        if (
+          active &&
+          active.startPosition !== undefined &&
+          active.startPosition !== previousStartPosition &&
+          globalMessageAudio.duration !== undefined
+        ) {
+          globalMessageAudio.currentTime =
+            active.startPosition * globalMessageAudio.duration;
+        }
+
+        if (!active?.playing && globalMessageAudio.playing) {
+          globalMessageAudio.pause();
+        }
+
+        if (active?.playing && !globalMessageAudio.playing) {
+          globalMessageAudio.play();
+        }
+
+        if (active && active.playbackRate !== globalMessageAudio.playbackRate) {
+          globalMessageAudio.playbackRate = active.playbackRate;
+        }
+
+        // if user requested a new position
+        if (
+          active &&
+          active.startPosition !== undefined &&
+          active.startPosition !== previousStartPosition &&
+          active.duration
+        ) {
+          globalMessageAudio.currentTime =
+            active.startPosition * active.duration;
+        }
+        return;
+      }
+
+      // if we have a new audio source
+      loadAudio({
+        url,
+        playbackRate: active.playbackRate,
+        messageId,
+        messageIdForLogging,
+        startPosition: active.startPosition,
+        playFinishConsecutiveSound,
+        durationChanged,
+        unloadMessageAudio,
+        currentTimeUpdated,
+        messageAudioEnded,
+      });
+
+      if (playNextConsecutiveSound) {
+        drop(
+          (async () => {
+            await stateChangeConfirmDownSound.play();
+            globalMessageAudio.play();
+          })()
+        );
+      } else {
+        globalMessageAudio.play();
+      }
+
+      if (AudioPlayerContent.isVoiceNote(content)) {
+        if (!content.current.isPlayed) {
+          const message = conversations.messagesLookup[content.current.id];
+          if (message && message.seenStatus !== SeenStatus.Unseen) {
+            markViewed(content.current.id);
+          }
+        } else {
+          log.info('SmartVoiceNotesPlaybackProvider: message already played', {
+            message: content.current.messageIdForLogging,
+          });
+        }
+      }
+    }, [
+      active,
+      content,
+      conversations.messagesLookup,
+      currentTimeUpdated,
+      durationChanged,
+      messageAudioEnded,
+      messageId,
+      messageIdForLogging,
+      playFinishConsecutiveSound,
+      playNextConsecutiveSound,
+      previousStartPosition,
+      unloadMessageAudio,
+      url,
+    ]);
+
+    return <VoiceNotesPlaybackProvider {...props} />;
+  }
+);
+
+function loadAudio({
+  url,
+  playbackRate,
+  messageId,
+  messageIdForLogging,
+  startPosition,
+  playFinishConsecutiveSound,
+  durationChanged,
+  currentTimeUpdated,
+  messageAudioEnded,
+  unloadMessageAudio,
+}: {
+  url: string;
+  playbackRate: number;
+  messageId: string | undefined;
+  messageIdForLogging: string | undefined;
+  startPosition: number;
+  playFinishConsecutiveSound: boolean;
+  durationChanged: (value: number | undefined) => void;
+  currentTimeUpdated: (value: number) => void;
+  messageAudioEnded: () => void;
+  unloadMessageAudio: () => void;
+}) {
+  globalMessageAudio.load({
+    url,
+    playbackRate,
+    onLoadedMetadata() {
+      strictAssert(
+        globalMessageAudio.duration !== undefined,
+        'Audio should have definite duration on `loadedmetadata` event'
+      );
+      log.info(
+        'SmartVoiceNotesPlaybackProvider: `loadedmetadata` event',
+        messageId
+      );
+      if (startPosition !== 0) {
+        globalMessageAudio.currentTime =
+          startPosition * globalMessageAudio.duration;
+      }
+      durationChanged(globalMessageAudio.duration);
+    },
+    onDurationChange() {
+      log.info(
+        'SmartVoiceNotesPlaybackProvider: `durationchange` event',
+        messageId
+      );
+      durationChanged(globalMessageAudio.duration);
+    },
+    onTimeUpdate() {
+      currentTimeUpdated(globalMessageAudio.currentTime);
+    },
+    onEnded() {
+      if (playFinishConsecutiveSound) {
+        drop(stateChangeConfirmUpSound.play());
+      }
+      messageAudioEnded();
+    },
+    onError(error) {
+      log.error(
+        'SmartVoiceNotesPlaybackProvider: playback error',
+        messageIdForLogging,
+        Errors.toLogFormat(error)
+      );
+      unloadMessageAudio();
+    },
+  });
+}