m5p3nc3r/analogue_synth
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add a virtual keyboard to the visualiser

Browse Source
This commit is contained in:
Matt Spencer
2026-03-26 09:14:25 +00:00
parent c8ef3df460
commit d00ac70e1c
6 changed files with 459 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
www/index.html
View File

@@ -88,7 +88,18 @@
flex-shrink: 0;
height: var(--patchbay-h);
min-height: 80px;
max-height: calc(100vh - 120px);
max-height: calc(100vh - 220px);
border-top: 1px solid var(--border);
display: flex;
flex-direction: column;
overflow: hidden;
background: var(--panel);
}
/* Virtual keyboard — fixed height */
.panel--keyboard {
flex-shrink: 0;
height: 100px;
border-top: 1px solid var(--border);
display: flex;
flex-direction: column;
@@ -165,6 +176,11 @@
<div class="panel__label">Patch Bay</div>
<canvas id="patchbay-canvas"></canvas>
</section>
<section class="panel panel--keyboard">
<div class="panel__label">Keyboard &nbsp;<span id="kb-hint" style="color:#333;font-size:0.6rem;">Z–M · Q–U · S D G H J · 2 3 5 6 7</span></div>
<canvas id="keyboard-canvas"></canvas>
</section>
</main>
<footer>