tools/composer/index.html

   1 <!DOCTYPE html>
   2 <html lang="en">
   3   <head>
   4     <title>Yuu Composer</title>
   5     <meta charset="utf-8" />
   6     <script type="text/javascript" src="../../src/yuu/pre.js"></script>
   7     <script type="text/javascript" src="../../src/yuu/yf.js"></script>
   8     <script type="text/javascript" src="../../src/yuu/yT.js"></script>
   9     <script type="text/javascript" src="../../src/yuu/core.js"></script>
  10     <script type="text/javascript" src="../../src/yuu/input.js"></script>
  11     <script type="text/javascript" src="../../src/yuu/audio.js"></script>
  12     <script type="text/javascript" src="composer.js"></script>
  13   </head>
  14
  15   <body style="margin: 5% auto; max-width: 800px">
  16     <div id="jam"
  17          style="float: right; width: 30%; text-align: center; line-height: 5em"
  18          tabindex=1>
  19       click and type ` to 0 to jam
  20     </div>
  21     <div style="width: 65%">
  22       <textarea id="score"
  23                 style="min-height: 4em; width: 100%"
  24                 >0 1 2 3 4 5 6 7 6 5 4 3 2 1 0</textarea>
  25       <br>
  26       <button id="play" style="width: 100%">Play</button>
  27     </div>
  28     <div style="margin-top: 2em">
  29       <span style="display: inline-block; width: 24%">Instrument:<br><select id="instrument"></select></span>
  30       <span style="display: inline-block; width: 24%">Tonic:<br><input id="tonic" value="C4"></span>
  31       <span style="display: inline-block; width: 24%">Scale:<br><select id="scale"></select></span>
  32       <span style="display: inline-block; width: 24%">Tempo (BPM):<br><input id="tempo" value="120"></span>
  33     </div>
  34   </body>
  35 </html>