synthing

commit 07e308b61ee86a9bc39e7f3c2617005597d39d66
parent ef0932c3bf4b3416f0ad9a319062524bea2e40b5
Author: Massimo Siboldi <mdsiboldi@gmail.com>
Date:   Sun, 11 Mar 2018 19:41:14 -0700

Moving some of beats and playing into redux. the separation is starting to get messy

Diffstat:
M
src/App/index.js
 | 
13
+++++--------
M
src/index.js
 | 
3
++-
M
src/store.js
 | 
6
+++++-

3 files changed, 12 insertions(+), 10 deletions(-)
diff --git a/src/App/index.js b/src/App/index.js
@@ -96,7 +96,6 @@ const Adsr = (props) => (
 class App extends Component {
     constructor() {
         super();
-        let initBeats = 4;
         this.state = {
             tones: [{
                 active: true,
@@ -104,9 +103,8 @@ class App extends Component {
                 mix: 0.7,
                 mute: false,
                 solo: false,
-                beats: boolArray.update(boolArray.create(initBeats), 0, true)
+                beats: boolArray.update(boolArray.create(4), 0, true)
             }],
-            numBeats: initBeats,
             editingToneIdx: 0,
             adsr: {
                 attack: 0.3,
@@ -194,7 +192,7 @@ class App extends Component {
     ) => {
         const tones = immObjArray.add(this.state.tones, at, {
             waveform,
-            beats: boolArray.create(this.state.numBeats),
+            beats: boolArray.create(this.props.numBeats),
             mix: 0.7,
             mute: false,
             solo: false
@@ -213,8 +211,8 @@ class App extends Component {
 
     setBeats = (newNumBeats) => {
         newNumBeats = Math.max(newNumBeats, 1);
+        this.props.setNumBeats(newNumBeats);
         this.setState({
-            numBeats: newNumBeats,
             tones: this.state.tones.map((val, idx) => {
                 let ret = Object.assign({}, val, {
                     beats: boolArray.setLength(val.beats, newNumBeats)
@@ -229,8 +227,7 @@ class App extends Component {
         this.props.setPlaying(true);
         const loop = () => {
             if (this.props.playing) {
-                console.log('playing');
-                this.props.setBeat((this.props.beat + 1) % this.state.numBeats);
+                this.props.setBeat((this.props.beat + 1) % this.props.numBeats);
                 window.setTimeout(loop, (1 / this.props.bpm) * 60000);
             }
         }
@@ -338,7 +335,7 @@ class App extends Component {
                         minVal="1"
                         maxVal={16}
                         step="1"
-                        val={this.state.numBeats}
+                        val={this.props.numBeats}
                         update={this.setBeats}
                     />
                     <Adsr adsr={this.state.adsr} update={this.updateAdsr} />
diff --git a/src/index.js b/src/index.js
@@ -10,7 +10,8 @@ const ConnectedApp = connect(state => state, {
     setVolume: (newVal) => ({type: 'SET_GLOBAL_VOLUME', value: newVal}),
     setBpm: (newVal) => ({type: 'SET_GLOBAL_BPM', value: newVal}),
     setBeat: (newVal) => ({type: 'SET_GLOBAL_BEAT', value: newVal}),
-    setPlaying: (newVal) => ({type: 'SET_GLOBAL_PLAYING', value: newVal})
+    setPlaying: (newVal) => ({type: 'SET_GLOBAL_PLAYING', value: newVal}),
+    setNumBeats: (newVal) => ({type: 'SET_GLOBAL_NUM_BEATS', value: newVal})
 })(App);
 
 const InformedApp = <Provider store={store}><ConnectedApp /></Provider>;
diff --git a/src/store.js b/src/store.js
@@ -4,7 +4,8 @@ const initialState = {
     volume: 0.7,
     bpm: 120,
     beat: 0,
-    playing: false
+    playing: false,
+    numBeats: 4
 };
 
 const reducer = (state, action) => {
@@ -22,6 +23,9 @@ const reducer = (state, action) => {
     case 'SET_GLOBAL_PLAYING':
         updates.playing = action.value;
         break;
+    case 'SET_GLOBAL_NUM_BEATS':
+        updates.numBeats = action.value;
+        break;
     }
     return Object.assign({}, state, updates);
 }