A piano keyboard component
** YOU NEED SUPPORT FOR WEB COMPONENTS IN YOUR BROWSER BECAUSE WE'RE NOT SHIMMING ANYTHING IN **
Firefox: go to
dom.webcomponents.enabled and set it to true.
Chrome: maybe nothing to do?
Piano-Keyboard.css from the repo or do
npm install openmusic-piano-keyboard.
If not using any package manager
Piano-Keyboard.css before you use the component. It will be registered automatically as
openmusic-piano-keyboard so you can run
document.createElement('openmusic-piano-keyboard') or have
<openmusic-piano-keyboard> elements in your HTML source.
If using npm
You need to load the module and then register it--it is not automatically registered!
But you could even register it with other name. Up to you.
Remember to load the css file too or the component will be unstyled.
Attribute for selecting how many octaves to render. Can be 1 or 2.
Events are DOM events, additional data is in the
detail field of each event.
index containing the index of the pressed key (either by mouse or keyboard)
index containing the index of the released key (either by mouse or keyboard)
Have a look at the demo file in
index.html for a usage example.