JSFiddle - React, Tailwind, and code Playground

by st___h

HTML

<div>audio-stream-test - for mobile!</div>
<button>
Click to Start
</button>

JavaScript

"use strict";

function start() {
  try {
    var context = new(window.AudioContext || window.webkitAudioContext)();
    var gainNode = context.createGain();

    var audio = new Audio();
    audio.loop = true;
    audio.crossOrigin = "anonymous";

    audio.addEventListener('error', function(e) {
      log(e.toString());
    });
    var source = context.createMediaElementSource(audio);
    source.connect(gainNode);
    gainNode.connect(context.destination);

    audio.src = "https://st-h.github.io/test/latencies.mp3";
    audio.play();
    gainNode.gain.setValueAtTime(0.9, gainNode.context.currentTime);
    log('samplerate: ' + context.sampleRate);
  } catch (e) {
    log(e.toString());
  }

  function log() {
    var elem = document.createElement("div");
    elem.textContent = Array.prototype.join.call(arguments, ' ');
    document.body.appendChild(elem);
  }
}


var clickElem = document.querySelector("button");
clickElem.addEventListener('click', function() {
  clickElem.style.display = 'none';
  start();
});