muse/index.html at master · jaisonjustus/muse · GitHub

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
<!DOCTYPE html>
<html>
  <head>
    <link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="styles/panel.css" type="text/css"/>
  </head>
  <body>

    <div class="app__panel">
      <img src="images/logo.png" width="600" height="352"/>
    </div>

    <div class="app__panel color">
      <div class="app__panel-sub">
        <div class="panel__knob-wrapper">
          <h3 class="panel__knob-name">Bass</h3>
          <input id="bass" value="0" type="text" data-max="1000" class="panel__knob" data-width="150" data-fgColor="#16a085" data-skin="tron" data-thickness=".2" data-displayPrevious=true>
        </div>
        <div class="panel__knob-wrapper">
          <h3 class="panel__knob-name">Treble</h3>
          <input id="treble" type="text" value="20" data-max="1000" class="panel__knob" data-width="150" data-fgColor="#16a085" data-skin="tron" data-thickness=".2" data-displayPrevious=true>
        </div>
        <div class="panel__knob-wrapper">
          <h3 class="panel__knob-name">Gain</h3>
          <input id="gain" type="text" value="70" data-max="100" class="panel__knob" data-width="150" data-fgColor="#16a085" data-skin="tron" data-thickness=".2" data-displayPrevious=true>
        </div>
        <div class="panel__knob-wrapper">
          <h3 class="panel__knob-name">Distortion</h3>
          <input id="distortion" type="text" value="50" class="panel__knob" data-width="150" data-fgColor="#16a085" data-skin="tron" data-thickness=".2" data-displayPrevious=true>
        </div>

        <div class="panel__knob-wrapper">
          <h3 class="panel__knob-name">Delay</h3>
          <input id="delay" type="text" value="0" data-step="1" data-max="10" class="panel__knob" data-width="150" data-fgColor="#16a085" data-skin="tron" data-thickness=".2" data-displayPrevious=true>
        </div>
        <!-- <div class="panel__knob-wrapper">
          <h3 class="panel__knob-name">Reverb</h3>
          <input id="reverb" value="20" type="text" class="panel__knob" data-width="150" data-fgColor="#16a085" data-skin="tron" data-thickness=".2" data-displayPrevious=true>
        </div> -->
      </div>

    </div>

    <script type="text/javascript" src="components/jquery/jquery.js"></script>
    <script type="text/javascript" src="components/jquery-knob/js/jquery.knob.js"></script>
    <script type="text/javascript" src="components/jquery-kontrol/jquery.kontrol.js"></script>

    <script type="text/javascript" src="scripts/muse.js"></script>

    <script type="text/javascript">

      Muse.Guitar.init();
      navigator.webkitGetUserMedia({audio: true}, Muse.Guitar.streaming);

    </script>
  </body>
</html>