tangled
alpha
login
or
join now
slipnote.app
/
slipnote
3
fork
atom
Built for people who think better out loud.
3
fork
atom
overview
issues
pulls
pipelines
mic recorder: Show smoothed waveform on finish
isaaccorbrey.com
4 weeks ago
91308fac
88938c84
+20
-1
1 changed file
expand all
collapse all
unified
split
src
components
MicRecorder.svelte
+20
-1
src/components/MicRecorder.svelte
···
71
bars = Array.from({ length: effectiveBarCount }, () => 0.08);
72
}
73
0
0
0
0
0
0
0
0
0
0
0
0
0
0
0
0
0
0
0
74
function getRecorderOptions(): MediaRecorderOptions | undefined {
75
if (typeof MediaRecorder === "undefined" || !MediaRecorder.isTypeSupported) return undefined;
76
···
200
function stopRecording() {
201
if (!isRecording) return;
202
isRecording = false;
203
-
bars = bars.map(() => 0.08);
204
205
if (frameId) {
206
window.cancelAnimationFrame(frameId);
···
71
bars = Array.from({ length: effectiveBarCount }, () => 0.08);
72
}
73
74
+
function smoothBarsForStop(values: number[], passes = 2): number[] {
75
+
if (values.length < 3 || passes <= 0) return values;
76
+
77
+
let smoothed = [...values];
78
+
for (let pass = 0; pass < passes; pass += 1) {
79
+
const next = [...smoothed];
80
+
for (let i = 1; i < smoothed.length - 1; i += 1) {
81
+
const prev = smoothed[i - 1];
82
+
const current = smoothed[i];
83
+
const upcoming = smoothed[i + 1];
84
+
// Weighted moving average to mimic the visual easing while bars are in motion.
85
+
next[i] = Math.max(0.08, prev * 0.25 + current * 0.5 + upcoming * 0.25);
86
+
}
87
+
smoothed = next;
88
+
}
89
+
90
+
return smoothed;
91
+
}
92
+
93
function getRecorderOptions(): MediaRecorderOptions | undefined {
94
if (typeof MediaRecorder === "undefined" || !MediaRecorder.isTypeSupported) return undefined;
95
···
219
function stopRecording() {
220
if (!isRecording) return;
221
isRecording = false;
222
+
bars = smoothBarsForStop(bars);
223
224
if (frameId) {
225
window.cancelAnimationFrame(frameId);