diff --git a/src/containers/record-modal.jsx b/src/containers/record-modal.jsx index a7a9e8f83..548567762 100644 --- a/src/containers/record-modal.jsx +++ b/src/containers/record-modal.jsx @@ -4,6 +4,7 @@ import React from 'react'; import VM from 'scratch-vm'; import WavEncoder from 'wav-encoder'; import {connect} from 'react-redux'; +import {encodeAndAddSoundToVM} from '../lib/audio/audio-util.js'; import RecordModalComponent from '../components/record-modal/record-modal.jsx'; @@ -71,39 +72,12 @@ class RecordModal extends React.Component { const startIndex = Math.floor(this.state.trimStart * sampleCount); const endIndex = Math.floor(this.state.trimEnd * sampleCount); const clippedSamples = this.state.samples.slice(startIndex, endIndex); - WavEncoder.encode({ - sampleRate: this.state.sampleRate, - channelData: [clippedSamples] - }).then(wavBuffer => { - const vmSound = { - format: '', - dataFormat: 'wav', - rate: this.state.sampleRate, - sampleCount: clippedSamples.length - }; - // Create an asset from the encoded .wav and get resulting md5 - const storage = this.props.vm.runtime.storage; - vmSound.asset = storage.createAsset( - storage.AssetType.Sound, - storage.DataFormat.WAV, - new Uint8Array(wavBuffer), - null, - true // generate md5 - ); - vmSound.assetId = vmSound.asset.assetId; - - // update vmSound object with md5 property - vmSound.md5 = `${vmSound.assetId}.${vmSound.dataFormat}`; - // The VM will update the sound name to a fresh name - // if the following is already taken - vmSound.name = 'recording1'; - - this.props.vm.addSound(vmSound).then(() => { + encodeAndAddSoundToVM(this.props.vm, clippedSamples, this.state.sampleRate, 'recording1', + () => { this.props.onClose(); this.props.onNewSound(); }); - }); }); } handleCancel () { diff --git a/src/containers/sound-editor.jsx b/src/containers/sound-editor.jsx index de09b9572..b61c1e649 100644 --- a/src/containers/sound-editor.jsx +++ b/src/containers/sound-editor.jsx @@ -6,7 +6,7 @@ import VM from 'scratch-vm'; import {connect} from 'react-redux'; -import {computeChunkedRMS, SOUND_BYTE_LIMIT} from '../lib/audio/audio-util.js'; +import {computeChunkedRMS, encodeAndAddSoundToVM, SOUND_BYTE_LIMIT} from '../lib/audio/audio-util.js'; import AudioEffects from '../lib/audio/audio-effects.js'; import SoundEditorComponent from '../components/sound-editor/sound-editor.jsx'; import AudioBufferPlayer from '../lib/audio/audio-buffer-player.js'; @@ -299,37 +299,9 @@ class SoundEditor extends React.Component { }, callback); } handleCopyToNew () { - this.copy(this.copyToNew); - } - copyToNew () { - WavEncoder.encode({ - sampleRate: this.state.copyBuffer.sampleRate, - channelData: [this.state.copyBuffer.samples] - }).then(wavBuffer => { - const vmSound = { - format: '', - dataFormat: 'wav', - rate: this.state.copyBuffer.sampleRate, - sampleCount: this.state.copyBuffer.samples.length - }; - - // Create an asset from the encoded .wav and get resulting md5 - const storage = this.props.vm.runtime.storage; - vmSound.asset = storage.createAsset( - storage.AssetType.Sound, - storage.DataFormat.WAV, - new Uint8Array(wavBuffer), - null, - true // generate md5 - ); - vmSound.assetId = vmSound.asset.assetId; - - // update vmSound object with md5 property - vmSound.md5 = `${vmSound.assetId}.${vmSound.dataFormat}`; - // The VM will update the sound name to a fresh name - vmSound.name = this.props.name; - - this.props.vm.addSound(vmSound); + this.copy(() => { + encodeAndAddSoundToVM(this.props.vm, this.state.copyBuffer.samples, + this.state.copyBuffer.sampleRate, this.props.name) }); } resampleBufferToRate (buffer, newRate) { diff --git a/src/lib/audio/audio-util.js b/src/lib/audio/audio-util.js index 2b68fcbe8..a01c30de8 100644 --- a/src/lib/audio/audio-util.js +++ b/src/lib/audio/audio-util.js @@ -1,3 +1,5 @@ +import WavEncoder from 'wav-encoder'; + const SOUND_BYTE_LIMIT = 10 * 1000 * 1000; // 10mb const computeRMS = function (samples, scaling = 0.55) { @@ -23,8 +25,43 @@ const computeChunkedRMS = function (samples, chunkSize = 1024) { return chunkLevels; }; +const encodeAndAddSoundToVM = function (vm, samples, sampleRate, name, callback) { + WavEncoder.encode({ + sampleRate: sampleRate, + channelData: [samples] + }).then(wavBuffer => { + const vmSound = { + format: '', + dataFormat: 'wav', + rate: sampleRate, + sampleCount: samples.length + }; + + // Create an asset from the encoded .wav and get resulting md5 + const storage = vm.runtime.storage; + vmSound.asset = storage.createAsset( + storage.AssetType.Sound, + storage.DataFormat.WAV, + new Uint8Array(wavBuffer), + null, + true // generate md5 + ); + vmSound.assetId = vmSound.asset.assetId; + + // update vmSound object with md5 property + vmSound.md5 = `${vmSound.assetId}.${vmSound.dataFormat}`; + // The VM will update the sound name to a fresh name + vmSound.name = name; + + vm.addSound(vmSound).then(() => { + if (callback) callback(); + }); + }); +}; + export { computeRMS, computeChunkedRMS, + encodeAndAddSoundToVM, SOUND_BYTE_LIMIT };