diff options
Diffstat (limited to 'animism-align/frontend/app/views/editor')
3 files changed, 8 insertions, 10 deletions
diff --git a/animism-align/frontend/app/views/editor/align/align.actions.js b/animism-align/frontend/app/views/editor/align/align.actions.js index a2f4881..3b6450b 100644 --- a/animism-align/frontend/app/views/editor/align/align.actions.js +++ b/animism-align/frontend/app/views/editor/align/align.actions.js @@ -150,7 +150,7 @@ export const spliceTime = start_ts => dispatch => { /* peaks */ export const loadPeaks = (episode) => dispatch => ( - api(dispatch, types.peaks, 'peaks', URLS.peaks) + api(dispatch, types.peaks, 'peaks', episode.settings.peaks.url) ) /* longform text */ diff --git a/animism-align/frontend/app/views/editor/sidebar/components/waveUpload.component.js b/animism-align/frontend/app/views/editor/sidebar/components/waveUpload.component.js index 3ca19f0..efd4bee 100644 --- a/animism-align/frontend/app/views/editor/sidebar/components/waveUpload.component.js +++ b/animism-align/frontend/app/views/editor/sidebar/components/waveUpload.component.js @@ -3,7 +3,7 @@ import { connect } from 'react-redux' import extractPeaks from 'webaudio-peaks' import actions from 'app/actions' -import { formatSize, timestampHMS } from 'app/utils' +import { formatSize, timestampHMS, commatize } from 'app/utils' import { Loader } from 'app/common' class WaveUpload extends Component { @@ -43,7 +43,7 @@ class WaveUpload extends Component { audioContext.decodeAudioData(arrayBuffer, (audioBuffer) => { // buffer, samplesPerPixel, isMono, startOffset, endOffset, bitResolution this.setState({ duration: audioBuffer.duration }) - var peaks = extractPeaks(audioBuffer, 441, true); + var peaks = extractPeaks(audioBuffer, audioBuffer.sampleRate / 5, true); console.log(peaks) const array = Array.from(peaks.data[0]) const peaksBlob = new Blob([ JSON.stringify(array) ], {type: "application/json"}); @@ -93,6 +93,8 @@ class WaveUpload extends Component { duration: null, size: null, }) + actions.align.loadPeaks(episode) + actions.audio.loadEpisodeAudio(episode) }) } @@ -143,11 +145,7 @@ class WaveUpload extends Component { <small>{episode.settings.audio.fn}</small> <small>{'Size: '}{formatSize(episode.settings.audio.size)}</small> <small>{'Duration: '}{timestampHMS(episode.settings.audio.duration)}</small> - </div> - )} - {peaks.length && ( - <div> - Peaks: {peaks.length} + <small>{'Peaks: '}{commatize(peaks.length)}</small> </div> )} <div className="uploadButton"> diff --git a/animism-align/frontend/app/views/editor/timeline/components/waveform.component.js b/animism-align/frontend/app/views/editor/timeline/components/waveform.component.js index 0161129..992f0d5 100644 --- a/animism-align/frontend/app/views/editor/timeline/components/waveform.component.js +++ b/animism-align/frontend/app/views/editor/timeline/components/waveform.component.js @@ -68,13 +68,13 @@ class Waveform extends Component { for (i = 0; i < pixelWidth; i++) { step = i * stepsPerPixel + stepMin peak = peaks[step] - y = (1 - peak) * waveformPeak + y = (1 - peak / 127) * waveformPeak ctx.lineTo(y, i) } for (i = pixelWidth - 1; i > 0; i--) { step = i * stepsPerPixel + stepMin peak = peaks[step] - y = (1 + peak) * waveformPeak + y = (1 + peak / 127) * waveformPeak ctx.lineTo(y, i) } ctx.lineTo(origin, 0) |
