JavaScripting

The definitive source of the best
JavaScript libraries, frameworks, and plugins.


  • ×

    XSound gives Web Developers Powerful Audio Features Easily !
    Filed under 

    • 🔾25%Overall
    • 154
    • 19 hours
    • 🕩15
    • 👥1

    XSound - Powerful Audio Features Easily ! -

    Node.js CI node-current License: MIT npm jsDelivr

    Overview

    XSound gives Web Developers Powerful Audio Features Easily !
    In concrete, XSound is useful to implement the following features.

    • Create Sound
    • Play the One-Shot Audio
    • Play the Audio
    • Play the Media
    • Streaming (by WebRTC)
    • MIDI (by Web MIDI API)
    • MML (Music Macro Language)
    • Effectors (Compressor / Wah / Equalizer / Tremolo / Phaser / Chorus / Delay / Reverb ... etc)
    • Visualization (Overview in Time Domain / Time Domain / Spectrum)
    • Multi-Track Recording (Create WAVE file)
    • Session (by WebSocket)
    • Audio Streaming
    • Visual Audio Sprite

    XSound don't depend on other libraries or frameworks (For example, jQuery, React).

    Supported Browsers

    Supported Browsers are Chrome, Edge, Firefox, Opera and Safari

    Getting Started

    In the case of using as full stack (For example, use oscillator) ...

    X('oscillator').setup([true, true, false, false]).ready().start([440, 880]);
    

    or, in the case of using as module base (For example, use chorus effector) ...

    // The instance of `AudioContext`
    const context = X.get();
    
    // Create the instance of `Chorus` that is defined by XSound
    // (The 2nd argument is buffer size for `ScriptProcessorNode`)
    const chorus = new X.Chorus(context, 0);
    
    const oscillator = context.createOscillator();
    
    // The instance that is defined by XSound has connectors for input and output
    oscillator.connect(chorus.INPUT);
    chorus.OUTPUT.connect(context.destination);
    
    // Set parameters for chorus
    chorus.param({
      time : 0.025,
      depth: 0.5,
      rate : 2.5,
      mix  : 0.5
    });
    
    // Activate
    chorus.activate();
    
    oscillator.start(0);
    

    XSound enable to using the following classes (Refer to API Documentation for details).

    type BufferSize = 0 | 256 | 512 | 1024 | 2048 | 4096 | 8192 | 16384;
    type Monoral    = 1;
    type Stereo     = 2;
    type RecordType = Monoral | Stereo;
    
    X.Analyser(context: AudioContext);
    X.Recorder(context: AudioContext, bufferSize: BufferSize, numberOfInputs: RecordType, numberOfOutputs: RecordType);
    X.Session(context: AudioContext);
    
    // Effectors
    X.Autopanner(context: AudioContext);
    X.Chorus(context: AudioContext);
    X.Compressor(context: AudioContext);
    X.Delay(context: AudioContext);
    X.Distortion(context: AudioContext);
    X.Equalizer(context: AudioContext);
    X.Filter(context: AudioContext);
    X.Flanger(context: AudioContext);
    X.Listener(context: AudioContext);
    X.Panner(context: AudioContext);
    X.Phaser(context: AudioContext);
    X.PitchShifter(context: AudioContext, size: BufferSize);
    X.Reverb(context: AudioContext);
    X.Ringmodulator(context: AudioContext);
    X.Stereo(context: AudioContext, size, size: BufferSize);
    X.Tremolo(context: AudioContext);
    X.Wah(context: AudioContext);
    

    Demo

    The application that uses XSound is in the following URLs.

    Now, I'm creating website for Web Audio API. Please refer to the following site for understanding API Documentation.

    Playground

    You can view overview on YouTube.

    Playground

    Installation

    $ npm install --save xsound
    

    Usage

    In the case of using CDN,

    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/xsound@latest/build/xsound.min.js"></script>
    

    In the case of using ESModules for SSR ... etc,

    import { XSound, X } from 'xsound';
    

    Setup

    Use Webpack Dev Server

    $ git clone git@github.com:Korilakkuma/XSound.git
    $ cd XSound
    $ npm install
    $ npm run dev
    $ open http://localhost:8080/playground/
    

    Use Docker

    $ git clone git@github.com:Korilakkuma/XSound.git
    $ cd XSound
    $ npm install
    $ npm run watch
    $ docker-compose up -d --build
    $ open http://localhost:8080/playground/
    

    API Documentation

    Migration to v3

    Case sensitive

    // Bad (v2 or earlier)
    X('audio').module('panner').param({ coneinnerangle: 240 });
    
    // Good (v3)
    X('audio').module('panner').param({ coneInnerAngle: 240 });
    

    Use plain object if parameters setter

    // Bad (v2 or earlier)
    X('oscillator').get(0).param('type', 'sawtooth');
    
    // Good (v3)
    X('oscillator').get(0).param({ type: 'sawtooth' });
    

    Validate parameters on the application side

    if ((type === 'sine') || (type === 'square') || (type === 'sawtooth') || (type === 'triangle')) {
      X('oscillator').get(0).param({ type });
    }
    

    Pickups

    License

    Released under the MIT license

    Show All