diff --git a/ts/components/conversation/MessageAudio.tsx b/ts/components/conversation/MessageAudio.tsx index 7da1ed4221..d5301e5cff 100644 --- a/ts/components/conversation/MessageAudio.tsx +++ b/ts/components/conversation/MessageAudio.tsx @@ -60,11 +60,13 @@ enum State { // Constants const CSS_BASE = 'module-message__audio-attachment'; -const PEAK_COUNT = 47; +const BAR_COUNT = 47; const BAR_NOT_DOWNLOADED_HEIGHT = 2; const BAR_MIN_HEIGHT = 4; const BAR_MAX_HEIGHT = 20; +const REWIND_BAR_COUNT = 2; + // Increments for keyboard audio seek (in seconds) const SMALL_INCREMENT = 1; const BIG_INCREMENT = 5; @@ -114,8 +116,8 @@ async function loadAudio(options: LoadAudioOptions): Promise { const data = await audioContext.decodeAudioData(raw); // Compute RMS peaks - const peaks = new Array(PEAK_COUNT).fill(0); - const norms = new Array(PEAK_COUNT).fill(0); + const peaks = new Array(BAR_COUNT).fill(0); + const norms = new Array(BAR_COUNT).fill(0); const samplesPerPeak = data.length / peaks.length; for ( @@ -233,7 +235,7 @@ export const MessageAudio: React.FC = (props: Props) => { const [duration, setDuration] = useState(1e-23); const [peaks, setPeaks] = useState>( - new Array(PEAK_COUNT).fill(0) + new Array(BAR_COUNT).fill(0) ); let state: State; @@ -413,7 +415,11 @@ export const MessageAudio: React.FC = (props: Props) => { } const boundingRect = waveformRef.current.getBoundingClientRect(); - const progress = (event.pageX - boundingRect.left) / boundingRect.width; + let progress = (event.pageX - boundingRect.left) / boundingRect.width; + + if (progress <= REWIND_BAR_COUNT / BAR_COUNT) { + progress = 0; + } if (isPlaying && !Number.isNaN(audio.duration)) { audio.currentTime = audio.duration * progress; diff --git a/ts/util/lint/exceptions.json b/ts/util/lint/exceptions.json index 5c0be42d46..064a4bb668 100644 --- a/ts/util/lint/exceptions.json +++ b/ts/util/lint/exceptions.json @@ -14667,7 +14667,7 @@ "rule": "React-useRef", "path": "ts/components/conversation/MessageAudio.js", "line": " const waveformRef = react_1.useRef(null);", - "lineNumber": 143, + "lineNumber": 144, "reasonCategory": "usageTrusted", "updated": "2021-03-09T01:19:04.057Z", "reasonDetail": "Used for obtanining the bounding box for the container"