starting frame offset

2 files changed, 25 insertions, 11 deletions

diff --git a/app/client/audio/wav2pix.js b/app/client/audio/wav2pix.js
index 5f48814..9bd7a15 100644
--- a/app/client/audio/wav2pix.js
+++ b/app/client/audio/wav2pix.js
@@ -53,7 +53,7 @@ export const loadPCM = (file) => {
   })
 }
 
-export const renderFrames = (file, { frame_step=FRAME_STEP, max=12 }) => dispatch => {
+export const renderFrames = (file, { frame_step=FRAME_STEP, frame_start=0, max=12 }) => dispatch => {
   return new Promise((resolve, reject) => {
     loadPCM(file).then((pcmProps) => {
       const { file, buffer, pcm, sr } = pcmProps
@@ -61,7 +61,7 @@ export const renderFrames = (file, { frame_step=FRAME_STEP, max=12 }) => dispatc
       let frames = []
       let count = 0
       let _len = pcm.length - FRAME_LENGTH
-      let offset = _len / 4
+      let offset = Math.round(_len * frame_start)
       for (;
             offset < _len && count < max;
             offset += frame_step, count += 1
@@ -74,7 +74,7 @@ export const renderFrames = (file, { frame_step=FRAME_STEP, max=12 }) => dispatc
   })
 }
 
-export const buildZip = (name, file, { frame_step=FRAME_STEP, max=10000 }) => dispatch => {
+export const buildZip = (name, file, { frame_step=FRAME_STEP, frame_start=0, max=10000 }) => dispatch => {
   return new Promise((resolve, reject) => {
     loadPCM(file).then(({ buffer, pcm, sr }) => {
       dispatch({ type: types.wav2pix.load })
@@ -85,13 +85,15 @@ export const buildZip = (name, file, { frame_step=FRAME_STEP, max=10000 }) => di
       let steps = (pcm.length - FRAME_LENGTH) / frame_step
       console.log(steps)
 
-      let offset = 0, count = 0, _len = pcm.length - FRAME_LENGTH
+      let count = 0
+      let _len = pcm.length - FRAME_LENGTH
+      let offset = Math.round(_len * frame_start)
       for (;
             offset < _len && count < max;
             offset += frame_step, count += 1
           ) {
         if ((count % 10) === 0) {
-          dispatch({ type: types.wav2pix.progress, progress: { i: count / steps * 6, n: 6 } })
+          dispatch({ type: types.wav2pix.progress, progress: { i: count / max * 6, n: 6 } })
         }
         render(pcm.slice(offset, offset+FRAME_LENGTH), sr, count, zip_folder)
       }
diff --git a/app/client/modules/pix2wav/views/spectrogram.upload.js b/app/client/modules/pix2wav/views/spectrogram.upload.js
index 609c5e8..8dbff21 100644
--- a/app/client/modules/pix2wav/views/spectrogram.upload.js
+++ b/app/client/modules/pix2wav/views/spectrogram.upload.js
@@ -25,6 +25,7 @@ class SpectrogramUpload extends Component {
       pcm: null,
       name: "",
       frames: [],
+      frame_start: 0,
       max: 3000,
       frame_step: wav2pixActions.FRAME_STEP,
     }
@@ -53,8 +54,8 @@ class SpectrogramUpload extends Component {
     console.log(file.size)
   }
   rebuildFrames(){
-    const { file, pcm, frame_step } = this.state
-    this.props.wav2pix.renderFrames(pcm || file, { frame_step })
+    const { file, pcm, frame_step, frame_start } = this.state
+    this.props.wav2pix.renderFrames(pcm || file, { frame_start, frame_step })
     .then(data => {
       console.log('got frames', data.frames.length)
       this.setState({
@@ -65,15 +66,15 @@ class SpectrogramUpload extends Component {
     })
   }
   buildZip(){
-    const { pcm, file, max, frame_step } = this.state
-    this.props.wav2pix.buildZip(this.state.name, pcm || file, { frame_step, max })
+    const { pcm, file, max, frame_step, frame_start } = this.state
+    this.props.wav2pix.buildZip(this.state.name, pcm || file, { frame_start, frame_step, max })
     .then(({ zip, filename, count }) => {
       this.props.datasetActions.uploadFile(
         this.props.module,
         this.props.folder,
         zip,
         filename,
-        { count, max, frame_step }
+        { count, max, frame_step, frame_size: wav2pixActions.FRAME_LENGTH / 44100 }
       )
     })
   }
@@ -124,11 +125,11 @@ class SpectrogramUpload extends Component {
           <Param title='Size'><span className={size[0]}>{size[1]}</span></Param>
           <Param title='Date'>{moment(file.lastModifiedDate).format("YYYY-MM-DD h:mm a")}</Param>
           <Param title='Duration'>{Math.floor(duration) + ' s.'}</Param>
+          <br />
           <Param title='Frames'>{total_frame_count}</Param>
           <Param title='Frame Size'>{frame_size}</Param>
           <Param title='Frame Step'>{frame_step}</Param>
           <Param title='FFT Size'>{wav2pixActions.spectrum.fft_size}</Param>
-
           <br />
           <Param title='Status'>{this.props.pix2wav.status}</Param>
           <br />
@@ -140,6 +141,17 @@ class SpectrogramUpload extends Component {
             value={this.state.name}
           />
           <Slider
+            name='Starting Frame'
+            min={0} max={1} type='float'
+            value={this.state.frame_start}
+            defaultValue={0}
+            onChange={frame_start => {
+              this.setState({ frame_start }, () => {
+                this.rebuildFrames()
+              })
+            }}
+          />
+          <Slider
             name='No. Frames'
             min={10} max={Math.min(total_frame_count, 1000)} type='int'
             value={this.state.max}