OSDN -- 开发和下载开源软件

Java script Key event Piano

格式
Plain text
提交日期
2014-06-26 15:23
Publication Period
Unlimited
  1.  <html>
  2.  <HEAD>
  3.  <title> Test 01 - Bluetooth Keybord Piano </title>
  4.  
  5.  <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=Shift_JIS">
  6.  <meta name="viewport" content="width=device-width" />  
  7.  <meta name="apple-mobile-web-app-capable" content="yes" />  
  8.  <script type="text/javascript">
  9.  
  10.  document.onkeydown = function(e) {
  11.          var shift, ctrl, iNote;
  12.          //alert('Start'); //Test *************************
  13.  
  14.          // Mozilla(Firefox, NN) and Opera
  15.          if (e != null) {
  16.                  //alert('Mozilla'); //Test *************************
  17.                  keycode = e.which;
  18.                  ctrl    = typeof e.modifiers == 'undefined' ? e.ctrlKey : e.modifiers & Event.CONTROL_MASK;
  19.                  shift   = typeof e.modifiers == 'undefined' ? e.shiftKey : e.modifiers & Event.SHIFT_MASK;
  20.                  // イベントの上位伝播を防止
  21.                  e.preventDefault();
  22.                  e.stopPropagation();
  23.  
  24.          // Internet Explorer
  25.          } else {
  26.                  //alert('IE'); //Test *************************
  27.                  keycode = event.keyCode;
  28.                  ctrl    = event.ctrlKey;
  29.                  shift   = event.shiftKey;
  30.                  // イベントの上位伝播を防止
  31.                  event.returnValue = false;
  32.                  event.cancelBubble = true;
  33.          }
  34.  
  35.          iNote = 99;
  36.  
  37.          // キーコードの文字を取得
  38.          keychar = String.fromCharCode(keycode).toUpperCase();
  39.  
  40.          // Key to Note -------------------------
  41.          if (keychar == "Z") {
  42.                  iNote = -11.99;
  43.          } else if (keychar == "S") {
  44.                  iNote = -11;
  45.          } else if (keychar == "X") {
  46.                  iNote = -10;
  47.          } else if (keychar == "D") {
  48.                  iNote = -9;
  49.          } else if (keychar == "C") {
  50.                  iNote = -8;
  51.          } else if (keychar == "V") {
  52.                  iNote = -7;
  53.          } else if (keychar == "G") {
  54.                  iNote = -6;
  55.          } else if (keychar == "B") {
  56.                  iNote = -5;
  57.          } else if (keychar == "H") {
  58.                  iNote = -4;
  59.          } else if (keychar == "N") {
  60.                  iNote = -3;
  61.          } else if (keychar == "J") {
  62.                  iNote = -2;
  63.          } else if (keychar == "M") {
  64.                  iNote = -1;
  65.          } else if (keychar == "," || keychar == "." || keychar == "Q") {
  66.                  iNote = 0;
  67.          } else if (keychar == "2") {
  68.                  iNote = 1;
  69.          } else if (keychar == "W") {
  70.                  iNote = 2;
  71.          } else if (keychar == "3") {
  72.                  iNote = 3;
  73.          } else if (keychar == "E") {
  74.                  iNote = 4;
  75.          } else if (keychar == "R") {
  76.                  iNote = 5;
  77.          } else if (keychar == "5") {
  78.                  iNote = 6;
  79.          } else if (keychar == "T") {
  80.                  iNote = 7;
  81.          } else if (keychar == "6") {
  82.                  iNote = 8;
  83.          } else if (keychar == "Y") {
  84.                  iNote = 9;
  85.          } else if (keychar == "7") {
  86.                  iNote = 10;
  87.          } else if (keychar == "U") {
  88.                  iNote = 11;
  89.          } else if (keychar == "I") {
  90.                  iNote = 12;
  91.          } else if (keychar == "9") {
  92.                  iNote = 13;
  93.          } else if (keychar == "O") {
  94.                  iNote = 14;
  95.          } else if (keychar == "0") {
  96.                  iNote = 15;
  97.          } else if (keychar == "P") {
  98.                  iNote = 16;
  99.          } else if (keychar == "@" || keychar == "[") {
  100.                  iNote = 17;
  101.          }
  102.          // Pitch -> Play
  103.          //alert('Play'); //Test *************************
  104.          if (iNote != 99) {
  105.                  fnRatePlus(2^(iNote/12));
  106.                  fnPlay();
  107.          }
  108.  }
  109.  
  110.  document.onkeyup = function(e) {
  111.          //alert('Stop'); //Test *************************
  112.          fnStop();
  113.  }
  114.  
  115.  function fnPlay(){
  116.          document.getElementById('audio').play();
  117.  }
  118.  
  119.  function fnRatePlus(pbRate){
  120.          document.getElementById('audio').playbackRate = pbRate;
  121.  }
  122.  
  123.  function fnStop(){
  124.          document.getElementById('audio').pause();
  125.          document.getElementById('audio').currentTime = 0;
  126.  }
  127.  
  128.  function fnPause(){
  129.          document.getElementById('audio').pause();
  130.  }
  131.  </script>
  132.  </HEAD>
  133.  
  134.  <body>
  135.          <audio id="audio" controls>
  136.                  <source src="ding.wav" type="audio/wav">
  137.          </audio>
  138.  
  139.          Press keys
  140.  </body>
  141.  </html>
下载 可打印视图

网址

Embed with JavaScript

Embed with iframe

原始文本