synthing

a waveform sequencing synth on the web
Log | Files | Refs | Submodules

index.js (1346B)


      1 import { Component } from 'preact';
      2 import Polyphonic from '../Polyphonic';
      3 import AudioKeys from '../../AudioKeys/dist/audiokeys.js';
      4 import consts from '../consts.js';
      5 import DSP from 'dsp.js';
      6 const FFT = new DSP.FFT(consts.BUF_SIZE);
      7 
      8 const ac = new AudioContext();
      9 const P = new Polyphonic(ac);
     10 
     11 export default class Synth extends Component {
     12     startAudio() {
     13         var keyboard = new AudioKeys({polyphony: 3});
     14         keyboard.down((note) => {
     15             P.addVoice(note, this.props.adsr);
     16         });
     17         keyboard.up((note) => {
     18             P.removeVoice(note);
     19         });
     20     }
     21     componentWillMount() {
     22         this.startAudio();
     23     }
     24     componentWillUpdate() {
     25         return false;
     26     }
     27     componentWillReceiveProps(newProps) {
     28         updateAudio(newProps.waveform);
     29         if (newProps.volume !== this.props.volume) {
     30             P.setVolume(newProps.volume);
     31         }
     32     }
     33     render() {
     34         return null;
     35    }
     36 }
     37 
     38 const taperOff = (length, val, i) => {
     39     return val * (1 - Math.pow(i / length, 0.5));
     40 }
     41 
     42 function updateAudio(waveform) {
     43     FFT.forward(waveform);
     44     const periodicWave = ac.createPeriodicWave(
     45         new Float32Array(FFT.real.map(taperOff.bind(null, FFT.real.length))),
     46         new Float32Array(FFT.imag.map(taperOff.bind(null, FFT.imag.length)))
     47     );
     48     P.changeWave(periodicWave);
     49 }