third_party/WebKit/ManualTests/webaudio/audiobuffersource-resampling-onended.html

   1 <!doctype html>
   2 <html>
   3   <head>
   4     <title>Test AudioBufferSource.onended</title>
   5     <style type="text/css">
   6       header {
   7         margin: 20px 0;
   8       }
   9       #results {
  10         white-space: pre;
  11         font-family: monospace;
  12       }
  13     </style>
  14   </head>
  15
  16   <body>
  17     <h1>Test AudioBufferSource.onended</h1>
  18
  19     <p>Tests that the onended event is called.  This test cannot be run in an offline context
  20     because the onended event is always called.
  21     </p>
  22
  23     <p>Press "Test" button to run the test.  You should hear two tones, each lasting 1/2 second.  If
  24     you do not, the test failed and onended was not correctly fired to generate the second tone.
  25     There should also be messages displayed for each tone played.
  26     </p>
  27
  28     <button onclick="runTest()">Test</button>
  29
  30     <header>Results</header>
  31     <div id="results"></div>
  32
  33     <script>
  34       // This is a slightly modified version of http://jsfiddle.net/ep4zm233/
  35
  36       var context = new AudioContext();
  37
  38       function runTest() {
  39         log("Starting test");
  40
  41         // Create two buffers at a sample rate of 8000. We're assuming 8000 is not the actual
  42         // context sampleRate so that resampling happens during the play back of the buffers.
  43         var bufferRate = 8000;
  44         var bufferSeconds = 0.5;
  45         var bufferFrames = bufferSeconds * bufferRate;
  46
  47         // The tone buffers at 400Hz and 600 Hz.
  48         var sin400 = context.createBuffer(1, bufferFrames, bufferRate);
  49         var sin600 = context.createBuffer(1, bufferFrames, bufferRate);
  50
  51         var d400 = sin400.getChannelData(0);
  52         var d600 = sin600.getChannelData(0);
  53
  54         var omega = 2*Math.PI/bufferRate;
  55
  56         for (var k = 0; k < bufferFrames; ++k) {
  57           d400[k] = Math.sin(omega * 400 * k);
  58           d600[k] = Math.sin(omega * 600 * k);
  59         }
  60
  61         var s1 = context.createBufferSource();
  62
  63         s1.onended = function () {
  64           // Create a new source using the 600Hz buffer and play it as soon as the onended event for
  65           // s1 has fired.
  66           var s2 = context.createBufferSource();
  67           s2.connect(context.destination);
  68           s2.buffer = sin600;
  69           s2.start();
  70           log("Tone 2");
  71         }
  72
  73         // Set up the 400 Hz buffer and play it.
  74         s1.buffer = sin400;
  75
  76         s1.connect(context.destination);
  77         s1.start();
  78         log("Tone 1");
  79       }
  80
  81       function clearResults() {
  82         var results = document.querySelector("#results");
  83         results.textContent = "";
  84       }
  85
  86       function log(message) {
  87         console.log(message);
  88         var results = document.querySelector("#results");
  89         results.textContent += message + "\n";
  90       }
  91     </script>
  92
  93
  94
  95
  96   </body>
  97 </html>