-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
84 lines (81 loc) · 4.24 KB
/
index.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
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Get Guitar!</title>
<link rel="icon" href="favicon.ico" />
<link href="style/skeleton.css" rel="stylesheet" />
<link href="style/settings.css" rel="stylesheet" />
</head>
<body>
<canvas width="1000" height="495"></canvas>
<dialog>
<button form="settings">✖</button>
<h3>The Boiler Room Backstage</h3>
<form name="local" id="settings" method="dialog">
<fieldset><legend>About</legend>
<p>
Provided as-is. Please consider sending a <a href="https://portal.tipjar.tips/t3s/themusic" target="_blank">donation</a> in case this software proves useful to you.
Also, there's a © <a href="https://github.com/tschw/get-guitar/blob/gh-pages/LICENSE" target="_blank">copy left</a> of <a href="https://github.com/tschw/get-guitar" target="_blank">the source</a>.
</p>
</fieldset>
<fieldset>
<legend>Persistency</legend>
<p>
The settings here are stored locally on the device, more
precisely in your browser's local storage.
The app runs entirely on the client, so in order to move
settings to another device or share them with another user,
they can be exported to a file and then imported elsewhere.
</p>
<p>
<input form="imex" type="file" name="import" id="import" accept="text/json"></input>
<label for="import">Import</label>
<a class="button" name="export" href="#">Export</a>
<a class="button" name="reset" href="#">Reset</a>
</p>
<label class="block"><input form="imex" name="imexTunings" type="checkbox" checked="true"></input> String Instruments / Tunings</label>
<label class="block"><input form="imex" name="imexLocal" type="checkbox" checked="true"></input> Local User Preferences</label>
</fieldset>
<fieldset><legend>Strings View</legend>
<label class="block">Instruments & Tunings
<textarea form="tunings" name="tunings">
Guitar - EADGBE: E2 A2 D3 G3 B3 E4
Mandola | Violin - CGDAE: C3 G3 D4 A4 E5
Ukulele - GCEA: G4 C4 E4 A4</textarea>
</label>
<label class="block"><input name="mirrored" type="checkbox"></input> Mirrored, as of instruments for left-handed players</label>
</fieldset>
<fieldset>
<legend>Keyboard View</legend>
<label for="keysLowestWhite">The lowest visible white key is</label>
<select name="keysLowestWhiteNote" id="keysLowestWhite" value="C">
<option>C</option><option>D</option><option>E</option>
<option>F</option><option>G</option><option>A</option>
<option>B</option>
</select>
<input name="keysLowestWhiteOctave" value="2" min="0" max="7" type="number"></input>
<label class="block"><input name="keysScrollButtons" type="checkbox" checked="true"></input> Scroll Buttons are Visible</label>
<label class="block"><input name="keysNoteNamesWhite" type="checkbox" checked="true"></input> Show note names for white keys</label>
<label class="block"><input name="keysNoteNamesBlackSharp" type="checkbox" checked="false"></input> Show note names with ♯ for black keys</label>
<label class="block"><input name="keysNoteNamesBlackFlat" type="checkbox" checked="false"></input> Show note names with ♭ for black keys</label>
</fieldset>
<fieldset>
<legend>Tonality Legend</legend>
<label class="block"><input name="legendScrollButtons" type="checkbox" checked="true"></input> Scroll Buttons are Visible</label>
</fieldset>
<fieldset>
<legend>Feature Preferences</legend>
<label class="block"><input name="featureChromaticTranspose" type="checkbox" checked="true"></input> Chromatic Transpose, Flat/Sharp Buttons</label>
<label class="block"><input name="featureTransposeByFifth" type="checkbox" checked="true"></input> Transpose by Fifth, Circle of Fifths Rotate Buttons</label>
<label class="block"><input name="featureAudioAnalysis" type="checkbox"></input> Audio Perception and Analysis (experimental), Microphone Button</label>
</fieldset>
</form>
<form id="imex"></form>
<form id="tunings"></form>
</dialog>
<script src="js/App.js" type="module"></script>
</body>
</html>