Chromatic Button Accordion web app that can be played using a computer keyboard

[okathira]

I have created a web application that allows you to play a chromatic button accordion using your computer keyboard.
https://okathira-dev.github.io/client-web-api-sandbox/button-accordion-with-keyboard/index.html
Note: Currently, the application's interface is available only in Japanese.
source

I suddenly realized that the chromatic button accordion is similar to a computer keyboard, so I created this application. I didn't see many that implemented the stradella bass and register switches, so I was personally pleased with the results.
Also, I have never played an actual accordion, so I am wondering especially about the way the stradella bass sounds. Please let me know if you have any other questions or opinions.
My test performance(YouTube)
I hope you enjoy it.

How to Play​

1. Click "音声を有効化" (Enable Audio) to initialize the audio.
2. Select either the right-hand or left-hand system using the toggle switch at the top of the screen.
3. Start playing using your computer keyboard.

the images are google translated

Features​

System Switch
- Toggle button group at the top of the screen ("左手（伴奏）" / "右手（メロディー）").
- Switch between the right-hand (C-system) and left-hand (Stradella bass 12x4) systems.

Volume Control
- Horizontal slider at the top of the main section ("音量").
- Adjust the overall volume for each system.

Pitch Controls
- Number input fields located below the volume control.
- Overall reed pitch adjustments in cents/Hz ("基準ピッチ").
- Individual reed pitch adjustments in cents ("相対ピッチ").

Reed Controls
- Toggle button groups located below the pitch controls.
- Right-hand: toggle L1, M1, M2, M3, and H1 reeds on/off ("各リードのオンオフ").
- Left-hand: toggle Soprano, Alto, Tenor and Bass reeds on/off for chord ("コードのリード") and bass note ("ベース音のリード").

Register Switches
- Draggable button group located below the reed controls ("レジスタースイッチ (F1-F12, ドラッグで並び替え可能)").
- F1-F12 reed combination presets with drag & drop support.

Keyboard Layout
- Above the keyboard, two control elements:
- A left-side toggle button group that switches the display labels between keyboard keys ("キーボード (QWERTY)") and musical notes ("音階 (C4, C#4, D4...)").
- A right-side select menu ("キーボードレイアウト") that lets you choose between English (US) and Japanese keyboard layouts.

 

[CC_PDX]

Very cool! I could see this as being handy for entry into midi programs for notation. The 100-200ms lagtime from the browser makes it a little hard for playing in real time, but it functions as described.