x-piano

Web Components for Web Audio API

Overview

<x-piano> is GUI parts library (Web Components) for Web Applications that use Web Audio API. <x-piano> has has the following features.

• Rich UI by Simple tag
• Play the One-Shot Audio
• Create Sound
• Simple Effectors (Envelope Generator, Transpose, Glide)

Demo

x-piano

Installation

$ npm install x-piano

Usage

Describe <x-piano> tag.

<x-piano></x-piano>

Moreover, <x-piano> tag can have some attributes.
For example,

<x-piano type="sawtooth" volume="0.4" attack="1" glide="1.5"></x-piano>

Refer to the following table for attribute details.

Attributes

| Attribute | Description | Value | |:-----------|:-----------------------------|:---------------------------------------------------------------------------| | loading | Apply style for loading | boolean attribute | | ui-only | Not use sound | boolean attribute | | type | Sound Source | 'piano' (default), 'sine', 'square', 'sawtooth', 'triangle' | | volume | Master Volume | 0.0 - 1.0 (1.0 by default) | | transpose | Transpose (One-Shot only) | Greater than or equal to 0.0 (0.0 by default) | | glide | Glide (Oscillator only) | Greater than or equal to 0.0 (0.0 by default) | | attack | Envelope Generator (Attack) | 0.0 - 1.0 (0.01 by default) | | decay | Envelope Generator (Decay) | 0.0 - 1.0 (0.3 by default) | | sustain | Envelope Generator (Sustain) | 0.0 - 1.0 (1.0 by default) | | release | Envelope Generator (Release) | 0.0 - 1.0 (1.0 by default) |

License

Copyright (c) 2014 - 2018 Tomohiro IKEDA (Korilakkuma)
Released under the MIT license