rob
/
clipper
2
0
Fork 0
Code Issues 11 Pull Requests 1 Projects Releases Wiki Activity

Bug fix: load waveform peaks after fetching audio from Youtube
continuous-integration/drone/push Build is passing Details

This commit is contained in:
Rob Watson 2022-02-07 20:17:23 +01:00
parent 669afcf6d9
commit f2d7d1f5bb
2 changed files with 36 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
frontend/src/AppState.test.ts
View File

@ -19,31 +19,37 @@ const initialState: State = {
}; };
describe('stateReducer', () => { describe('stateReducer', () => {
describe('mediasetloaded', () => { describe('audiosourceloaded', () => {
describe.each([ describe.each([
{ {
audioFrames: 4410000, src: 'foo.opus',
wantViewportFrames: 220500, numFrames: 22050,
wantViewport: { start: 0, end: 1100 },
wantViewportCanvas: { x1: 0, x2: 100 },
}, },
{ {
audioFrames: 44100, src: 'foo.opus',
wantViewportFrames: 2200, numFrames: 44100000,
wantViewport: { start: 0, end: 2205000 },
wantViewportCanvas: { x1: 0, x2: 100 },
}, },
])( ])(
'mediaset with $audioFrames frames', '$numFrames frames',
({ audioFrames, wantViewportFrames }) => { ({ src, numFrames, wantViewport, wantViewportCanvas }) => {
it('generates the expected state', () => { it('generates the expected state', () => {
const mediaSet = MediaSet.fromPartial({ const mediaSet = MediaSet.fromPartial({
id: '123', id: '123',
audioFrames: audioFrames, audioFrames: 0,
}); });
const state = stateReducer( const state = stateReducer(
{ ...initialState }, { ...initialState, mediaSet },
{ type: 'mediasetloaded', mediaSet: mediaSet } { type: 'audiosourceloaded', src, numFrames }
); );
expect(state.mediaSet).toBe(mediaSet);
expect(state.viewport.start).toEqual(0); expect(state.mediaSet!.audioFrames).toEqual(numFrames);
expect(state.viewport.end).toEqual(wantViewportFrames); expect(state.audioSrc).toEqual(src);
expect(state.viewport).toEqual(wantViewport);
expect(state.viewportCanvas).toEqual(wantViewportCanvas);
}); });
} }
); );

32
frontend/src/AppState.tsx
View File

@ -159,16 +159,7 @@ function handleMediaSetLoaded(
state: State, state: State,
{ mediaSet }: MediaSetLoadedAction { mediaSet }: MediaSetLoadedAction
): State { ): State {
const numFrames = Math.min( return { ...state, mediaSet };
Math.round(mediaSet.audioFrames / CanvasWidth) *
initialViewportCanvasPixels,
mediaSet.audioFrames
);
return setViewport(
{ ...state, mediaSet },
{ type: 'setviewport', viewport: { start: 0, end: numFrames } }
);
} }
function handleOverviewPeaksLoaded( function handleOverviewPeaksLoaded(
@ -194,11 +185,22 @@ function handleAudioSourceLoaded(
return state; return state;
} }
return { const viewportEnd = Math.min(
...state, Math.round(numFrames / CanvasWidth) * initialViewportCanvasPixels,
audioSrc: src, numFrames
mediaSet: { ...mediaSet, audioFrames: numFrames }, );
};
return setViewport(
{
...state,
audioSrc: src,
mediaSet: {
...mediaSet,
audioFrames: numFrames,
},
},
{ type: 'setviewport', viewport: { start: 0, end: viewportEnd } }
);
} }
function handleVideoSourceLoaded( function handleVideoSourceLoaded(