·您当前的位置:主页 > 技术教程 > AS2与AS3技术 >

[html5]html5音频API一个范例代码

时间:2017-09-25 10:34酷播
[html5]html5音频API一个范例代码

html5音频API一个范例

  1. window.onload = init
  2. var context; 
  3. var bufferLoader; 
  4.  
  5. function init() { 
  6.   // Fix up prefixing 
  7.   windowwindow.AudioContext = window.AudioContext || window.webkitAudioContext; 
  8.   context = new AudioContext(); 
  9.  
  10.   bufferLoader = new BufferLoader( 
  11.     context, 
  12.     [ 
  13.       '../sounds/hyper-reality/br-jam-loop.wav', 
  14.       '../sounds/hyper-reality/laughter.wav', 
  15.     ], 
  16.     finishedLoading 
  17.     ); 
  18.  
  19.   bufferLoader.load(); 
  20.  
  21. function finishedLoading(bufferList) { 
  22.   // Create two sources and play them both together. 
  23.   var source1 = context.createBufferSource(); 
  24.   var source2 = context.createBufferSource(); 
  25.   source1.buffer = bufferList[0]; 
  26.   source2.buffer = bufferList[1]; 
  27.  
  28.   source1.connect(context.destination); 
  29.   source2.connect(context.destination); 
  30.   source1.start(0); 
  31.   source2.start(0); 

 

  1. for (var bar = 0; bar < 2; bar++) { 
  2.   var time = startTime + bar * 8 * eighthNoteTime; 
  3.   // Play the bass (kick) drum on beats 1, 5 
  4.   playSound(kick, time); 
  5.   playSound(kick, time + 4 * eighthNoteTime); 
  6.  
  7.   // Play the snare drum on beats 3, 7 
  8.   playSound(snare, time + 2 * eighthNoteTime); 
  9.   playSound(snare, time + 6 * eighthNoteTime); 
  10.  
  11.   // Play the hi-hat every eighth note. 
  12.   for (var i = 0; i < 8; ++i) { 
  13.     playSound(hihat, time + i * eighthNoteTime); 
  14.   } 

 

  1. var RhythmSample = { 
  2. }; 
  3.  
  4. RhythmSample.play = function() { 
  5.   function playSound(buffer, time) { 
  6.     var source = context.createBufferSource(); 
  7.     source.buffer = buffer; 
  8.     source.connect(context.destination); 
  9.     if (!source.start) 
  10.       sourcesource.start = source.noteOn; 
  11.     source.start(time); 
  12.   } 
  13.  
  14.   var kick = BUFFERS.kick; 
  15.   var snare = BUFFERS.snare; 
  16.   var hihat = BUFFERS.hihat; 
  17.  
  18.   // We'll start playing the rhythm 100 milliseconds from "now" 
  19.   var startTime = context.currentTime + 0.100; 
  20.   var tempo = 80; // BPM (beats per minute) 
  21.   var eighthNoteTime = (60 / tempo) / 2; 
  22.  
  23.   // Play 2 bars of the following: 
  24.   for (var bar = 0; bar < 2; bar++) { 
  25.     var time = startTime + bar * 8 * eighthNoteTime; 
  26.     // Play the bass (kick) drum on beats 1, 5 
  27.     playSound(kick, time); 
  28.     playSound(kick, time + 4 * eighthNoteTime); 
  29.  
  30.     // Play the snare drum on beats 3, 7 
  31.     playSound(snare, time + 2 * eighthNoteTime); 
  32.     playSound(snare, time + 6 * eighthNoteTime); 
  33.  
  34.     // Play the hi-hat every eighthh note. 
  35.     for (var i = 0; i < 8; ++i) { 
  36.       playSound(hihat, time + i * eighthNoteTime); 
  37.     } 
  38.   } 
  39. }; 

 

微信付费直播
酷播云免费在线视频整体解决方案
参与开学季云视频优惠,拿GET2017教育科技大会VIP门票
进入开学季,保利威视推出云视频优惠,云视频套餐、流量超实惠大放“价”就是现在,还可以免费获取GET2017教育科技大会VIP门票哦!