Code Monkey home page Code Monkey logo

simple-js-synth's Introduction

Simple JS Synth

Simple JavaScript synthesizer using Web Audio.

Play with the demo.

Design

Design

There are three oscillators which output to a basic attack/decay/sustain envelope, followed by an optional lowpass filter.

Usage

There's only one function, SimpleJSSynth, and it creates an AudioNode and connects it to the destination with the given synth options:

// where <type> can be one of: 'sine' | 'square' | 'triangle' | 'sawtooth'
var node = SimpleJSSynth(
  audioContext.destination,  // the destination
  {
    // oscillator 1
    osc1type: <type>,        // type of wave
    osc1vol : 0 to 1,        // oscillator volume (linear)
    osc1tune: 0,             // relative tuning (semitones)

    // oscillator 2
    osc2type: <type>,        // type of wave
    osc2vol : 0 to 1,        // oscillator volume (linear)
    osc2tune: 0,             // relative tuning (semitones)

    // oscillator 3
    osc3type: <type>,        // type of wave
    osc3vol : 0 to 1,        // oscillator volume (linear)
    osc3tune: 0,             // relative tuning (semitones)

    // envelope
    attack  : 0 to inf,      // attack time (seconds)
    decay   : 0 to inf,      // decay time (seconds)
    sustain : 0 to 1         // sustain (fraction of max vol)
    susdecay: 0 to inf,      // decay during sustain (seconds)

    // filter
    cutoff  : 0,             // lowpass cutoff (relative semitones to root)
  }
);

The returned AudioNode object has a few extra methods for triggering the note:

// start playing the synth at frequency `freq` and volume `vol`
node.noteOn(freq, vol);

// while the synth is playing, bend the note +- `semitones`
node.bend(semitones);

// turn the note off
node.noteOff();

// see if the synth is silent and ready for a new note to play
node.isReady();

// stop all sound immediately
node.stop();

// destroy a synth permanently (disconnect and stop all sound)
node.destroy();

Example

Look at the source code of the demo. I've tried to keep it well commented.

simple-js-synth's People

Contributors

nirviaje avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.