48 lines
1.7 KiB
HTML
48 lines
1.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Carnatic Piano</title>
|
|
<link rel="stylesheet" href="css/styles.css" />
|
|
</head>
|
|
<body>
|
|
<h1>Carnatic Piano</h1>
|
|
|
|
<div class="controls">
|
|
<label for="ragamSelect">Ragam:</label>
|
|
<select id="ragamSelect">
|
|
<option value="Bhairavi">Bhairavi</option>
|
|
<option value="Kalyani">Kalyani</option>
|
|
<option value="Mayamalavagowla" selected>Mayamalavagowla</option>
|
|
<option value="Mohanam">Mohanam</option>
|
|
<option value="Shankarabharanam">Shankarabharanam</option>
|
|
</select>
|
|
<label for="startingNote">Starting Sa:</label>
|
|
<select id="startingNote">
|
|
<option value="G#">G#</option>
|
|
<option value="A" selected>A</option>
|
|
<option value="A#">A#</option>
|
|
<option value="B">B</option>
|
|
<option value="C">C</option>
|
|
<option value="C#">C#</option>
|
|
</select>
|
|
<label for="svaraNames">Svara Names:</label>
|
|
<select id="svaraNames">
|
|
<option value="short">S, R, G, M, P, D, N</option>
|
|
<option value="full">Sa, Ri, Ga, Ma, Pa, Dha, Ni</option>
|
|
<option value="malayalam">സ, രി, ഗ, മ, പ, ധ, നി</option>
|
|
</select>
|
|
<label for="svaraStyle">Svara Display:</label>
|
|
<select id="svaraStyle">
|
|
<option value="plain" selected>Plain swaras</option>
|
|
<option value="variant">Numbered svara variants</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="piano" id="piano"></div>
|
|
|
|
<script src="js/script.js"></script>
|
|
</body>
|
|
</html>
|