forked from benc-uk/touchmidi-old
-
Notifications
You must be signed in to change notification settings - Fork 0
/
volca_keys.html
90 lines (82 loc) · 3.89 KB
/
volca_keys.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Touch MIDI: Volca Keys</title>
<link rel="stylesheet" href="css/touchmidi.css">
</head>
<body onload="init()">
<div class="main_column" style="width:100%">
<div class="row">
<div class="column">
<div class="button" label="Poly " midicc="1, 40, 1, 1" colour="#6644FF"></div>
<div class="button" label="Unison " midicc="1, 40, 30, 30" colour="#6644FF"></div>
<div class="button" label="Octave " midicc="1, 40, 50, 50" colour="#6644FF"></div>
<div class="button" label="Fifth " midicc="1, 40, 70, 70" colour="#6644FF"></div>
<div class="button" label="Unison Ring" midicc="1, 40, 99, 99" colour="#6644FF"></div>
<div class="button" label="Poly Ring " midicc="1, 40, 127, 127" colour="#6644FF"></div>
</div>
<div class="column">
<div class="encoder" label="Octave" midicc="1, 41" colour="#999999"></div>
<div class="encoder" label="Expres" midicc="1, 11" colour="#999999"></div>
</div>
<div class="column">
<div class="encoder" label="Delay\nTime" midicc="1, 52" colour="#FF002E"></div>
<div class="encoder" label="Delay\nFdbk" midicc="1, 53" colour="#FF002E"></div>
</div>
<div class="column">
<div class="encoder" label="Detune" midicc="1, 42"></div>
<div class="encoder" label="Porta" midicc="1, 5"></div>
<div class="encoder" label="Env\nPitch" midicc="1, 43"></div>
</div>
<div class="column">
<div class="encoder" label="Cutoff" midicc="1, 44"></div>
<div class="encoder" label="Peak" midicc="1, 127"></div>
<div class="encoder" label="Env\nFilter" midicc="1, 45"></div>
</div>
<div class="column">
<div class="encoder" label="LFO\nRate" midicc="1, 46"></div>
<div class="encoder" label="LFO\nPtch Mod" midicc="1, 47"></div>
<div class="encoder" label="LFO\nFilt Mod" midicc="1, 48"></div>
</div>
</div>
<div class="row"> <!-- second row -->
<div class="row"> <!-- ADSR -->
<div class="slider" label="Attack" midicc="1, 49" colour="#ff3300"></div>
<div class="slider" label="Sustain" midicc="1, 51" colour="#ff3300"></div>
<div class="slider" label="Decay" midicc="1, 50" colour="#ff3300"></div>
</div>
<!-- One octave keyboard -->
<div class="column">
<div class="row">
<div class="space"></div>
<div class="button" midinote="1, 49" colour="#0000FF" label="C♯"></div>
<div class="button" midinote="1, 51" colour="#0000FF" label="D♯"></div>
<div class="space"></div>
<div class="space"></div>
<div class="button" midinote="1, 54" colour="#0000FF" label="F♯"></div>
<div class="button" midinote="1, 56" colour="#0000FF" label="G♯"></div>
<div class="button" midinote="1, 58" colour="#0000FF" label="A♯"></div>
<div class="space"></div>
</div>
<div class="row">
<div class="button" midinote="1, 48" colour="#EEEEEE" label="C"></div>
<div class="button" midinote="1, 50" colour="#EEEEEE" label="D"></div>
<div class="button" midinote="1, 52" colour="#EEEEEE" label="E"></div>
<div class="button" midinote="1, 53" colour="#EEEEEE" label="F"></div>
<div class="button" midinote="1, 55" colour="#EEEEEE" label="G"></div>
<div class="button" midinote="1, 57" colour="#EEEEEE" label="A"></div>
<div class="button" midinote="1, 59" colour="#EEEEEE" label="B"></div>
</div>
</div>
</div>
</div>
<!-- **** Include JS libraries **** -->
<script src="lib/slider.js"></script>
<script src="lib/button.js"></script>
<script src="lib/encoder.js"></script>
<script src="lib/xypad.js"></script>
<script src="lib/midi.js"></script>
<script src="lib/touchmidi.js"></script>
</body>
</html>